/* =========================================
= SOUS-COMPOSANT — BOUTON D'ENVOI (.nl-contact--submit)
= Pleine largeur, et une flèche qui se déplie au survol.
= Markup : contact-submit.php · enqueue : inc-contact-submit.php
=
= Duplication ASSUMÉE depuis la 1.2.331 : l'effet de survol est la COPIE de
= .nl-cart--checkout (« Finaliser mon panier », header/header-cart.css) —
= l'icône pousse le libellé en ouvrant la gouttière, le fond s'inverse, le
= bouton se soulève d'un cheveu. La page Contact ne charge pas le CSS du
= panier : partager la règle imposerait une feuille commune.
= ⚠️ Répercuter ici toute évolution de .nl-cart--checkout, et inversement.
=
= L'habillage de base (fond, bordure, capitales) vient de .button /
= .button--primary dans assets/css/wc-base.css. Les sélecteurs ci-dessous
= doublent la classe (.nl-contact--submit.button--primary) pour passer DEVANT
= ces règles-là sans dépendre de l'ordre de chargement des feuilles — les deux
= fichiers sont à égalité de spécificité.
========================================= */
.nl-contact--submit.button--primary {
  /* inline-flex : .button le met en inline-block, où `gap` n'a aucun effet. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  transition:
    background .2s ease,
    color .2s ease,
    border-color .2s ease,
    transform .2s ease,
    gap .3s ease;
}

.nl-contact--submit.button--primary:hover,
.nl-contact--submit.button--primary:focus-visible {
  background: transparent;
  color: var(--primary);
  transform: translateY(-0.0625rem);
  gap: 0.625rem;
  /* Annule le .button--primary:hover { filter: brightness(1.08) } de wc-base :
     sur fond transparent il délaverait le texte et la bordure. */
  filter: none;
}

.nl-contact--submit.button--primary:focus-visible {
  outline: 0.125rem solid var(--primary-40);
  outline-offset: 0.1875rem;
}

/* Repliée : largeur nulle, invisible, légèrement en retrait. */
.nl-contact--submit-icon {
  width: 0;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateX(-0.25rem);
  transition: width .3s ease, max-width .3s ease, opacity .3s ease, transform .3s ease, color .2s ease;
}
.nl-contact--submit:hover .nl-contact--submit-icon,
.nl-contact--submit:focus-visible .nl-contact--submit-icon {
  width: 12px;
  max-width: 12px;
  opacity: 1;
  transform: translateX(0);
}

/* Désactivé pendant l'envoi (contact-form.js) : aucun effet de survol, le
   bouton ne doit pas avoir l'air cliquable. */
.nl-contact--submit.button--primary[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}
.nl-contact--submit.button--primary[disabled]:hover {
  background: var(--primary);
  color: var(--secondary);
  transform: none;
  gap: 0;
}
.nl-contact--submit[disabled]:hover .nl-contact--submit-icon {
  width: 0;
  max-width: 0;
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  .nl-contact--submit.button--primary,
  .nl-contact--submit-icon { transition: none; }
}