/* === e4-a11y.css === */
/* ============================================================================
   e4-a11y.css — indicateur de focus clavier, repli global.
   Liée en DERNIER dans header.tpl : la feuille de base pose
   `a:focus{outline:0!important}` et aucune règle du thème ne couvrait les
   boutons d'achat (.pcard-atc, #add_to_cart, #submitAccount). Audit
   2026-09-04, constat A11Y-001 : outline, box-shadow, border, background et
   color strictement identiques avant/après focus clavier sur ces trois cibles.
   Ne PAS remplacer les indicateurs existants : les règles du thème qui posent
   `outline:none` fournissent toutes un box-shadow de remplacement et gagnent
   par spécificité — c'est voulu.
   ========================================================================== */

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{
  outline:3px solid rgba(123,191,63,.85);
  outline-offset:2px;
  border-radius:4px;
}

/* Cibles d'achat : le thème y pose `outline:0!important`, il faut la même arme. */
.pcard-atc:focus-visible,
#add_to_cart:focus-visible,
#add_to_cart button:focus-visible,
#submitAccount:focus-visible,
#opc_guestCheckout:focus-visible,
#SubmitLogin:focus-visible,
.gw-cta:focus-visible,
.btn-cart:focus-visible,
.gtx-barre__cta:focus-visible{
  outline:3px solid rgba(123,191,63,.9)!important;
  outline-offset:2px!important;
  box-shadow:0 0 0 5px rgba(123,191,63,.22)!important;
}

/* Sur fond vert (le CTA d'achat est lui-même vert), l'anneau vert disparaît :
   on le double d'un liseré encre pour garder 3:1 contre le bouton. */
.gw-cta:focus-visible,
#add_to_cart button:focus-visible,
.gtx-barre__cta:focus-visible{
  outline-color:#2B004F!important;
}


/* ============================================================================
   Correctifs d'audit transverses (04/09) — posés ici parce que c'est la seule
   feuille liée sur TOUTES les pages : e4-pages.css, où ils avaient d'abord été
   écrits, n'est chargée que sur cms, contact, 404, manufacturer et search. La
   première mesure l'a montré, les règles n'étaient jamais servies.
   ========================================================================== */

/* UX-DSK-017 — « Mot de passe oublié ? » sur /connexion était rendu en gris,
   sans soulignement ni bordure : visuellement identique à un texte d'aide,
   seul le curseur le signalait. C'est le chemin de secours de la page où l'on
   échoue le plus. */
body#authentication a.glc-forgot,
body#authentication .glc-forgot{
  color:#3f6f1c!important; /* --gw-green-700 (#5e9a2a) ne donne que 3,42:1 sur blanc */
  text-decoration:underline!important;
  text-underline-offset:2px;
}
body#authentication a.glc-forgot:hover{color:var(--gw-ink-700)!important}

/* UX-DSK-019 — le module instantpay affiche « Sur ce site Web, vous pouvez
   payer par Apple Pay ou Google Pay, mais il n'est pas possible de le faire
   dans ce navigateur » quand canMakePayment() est faux, donc sur Chrome
   desktop : la plupart des visiteurs. Annoncer un moyen de paiement pour dire
   dans la foulée qu'il est indisponible n'aide personne. Une déclaration
   !important de la feuille bat le style inline que le module pose en JS. */
#nosupported-browser{display:none!important}

/* QA-009 — bandeau de contexte sur la page adresse atteinte depuis la commande. */
.gw-adr-etape{
  display:flex;align-items:center;gap:14px;
  margin:0 0 18px;padding:14px 16px;border-radius:14px;
  background:linear-gradient(135deg,#2B004F,#3a0a63);color:#fff;
  box-shadow:0 6px 18px rgba(43,0,79,.18);
}
.gw-adr-etape__pas{
  flex:none;padding:5px 10px;border-radius:999px;
  background:rgba(255,255,255,.14);
  font-family:'Poppins',sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;white-space:nowrap;
}
.gw-adr-etape strong{display:block;font-family:'Poppins',sans-serif;font-size:15px;line-height:1.3}
.gw-adr-etape span:not(.gw-adr-etape__pas){display:block;margin-top:3px;font-size:13px;color:#e2d8f0}
@media(max-width:640px){.gw-adr-etape{flex-direction:column;align-items:flex-start;gap:8px}}

/* ============================================================================
   A11Y-013 (audit du 04/09) — hiérarchie des titres.
   Les huit intitulés du bandeau de réassurance (« Échange sous 14 jours »,
   « Livraison offerte dès 89 € en relais », …) étaient des <h4> alors que ce
   sont les libellés de huit pictogrammes. Le bandeau étant rendu sur presque
   toutes les pages, il créait à lui seul un saut h2 → h4 sur la home, les
   catégories et le tunnel. Migration 20260907c : ils deviennent des <p>.
   Cette règle reprend exactement l'apparence mesurée avant la bascule.
   ========================================================================== */
/* !important : le module pose `#parallax_block_center p` à 16 px / 600, ce qui
   reprenait le dessus sur ces libellés une fois qu'ils ont cessé d'être des
   titres — mesuré 16px/600 au lieu de 12px/700 avant ce renfort. */
#parallax_block_center .ib3-lab,
.img-box-3 .ib3-lab{
  margin:0!important;
  font-family:'Poppins',sans-serif!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.3!important;
  color:#2B004F!important;
}
/* Les intitulés de bloc de la home étaient en capitales tant qu'ils étaient des
   h4 : la règle d'origine porte text-transform, on la reprend pour les h3. */
.blk-head h3{text-transform:uppercase;letter-spacing:.1em}

/* ============================================================================
   PERF-011 (audit du 04/09) — CLS du panier sur mobile : CONSTAT MESURÉ,
   AUCUNE CORRECTION POSÉE, et c'est délibéré.
   Relevé aujourd'hui : 0,0516, contre 0,073 à 0,134 au moment de l'audit —
   les corrections déjà faites l'ont ramené sous le seuil de 0,1. Il reste un
   décalage unique vers 1,3 s : ASIDE.glc-summary descend de 337 à 407 px en
   perdant 70 px de hauteur, au moment où .cart_navigation_extra passe de 94 à
   136 px.
   Deux réservations ont été essayées puis retirées, faute d'effet mesuré :
   min-height sur #glc-delivery-promise, puis sur .cart_navigation_extra. La
   cause tient donc à un troisième élément, non isolé. À reprendre avec un
   profil de rendu, pas en tâtonnant sur des hauteurs.
   ========================================================================== */
}

/* UX-DSK-004 — message d'erreur de la page de connexion. */
body#authentication .glc-field__err{
  margin:6px 0 0;font-family:'Poppins',sans-serif;font-size:12.5px;line-height:1.35;color:#b3261e;
}
body#authentication .glc-field__wrap.form-error .glc-field__input{
  border-color:#b3261e!important;box-shadow:0 0 0 3px rgba(179,38,30,.12);
}

/* A11Y-014 (audit du 04/09) — dernière cible sous le seuil après la première
   passe : le « Lire la suite » de la description de catégorie hérite du vert
   de marque #5e9a2a, mesuré 3,42:1 sur blanc en 13,5 px gras, sous les 4,5:1
   exigés pour un texte de cette taille. Le vert foncé du thème donne 4,8:1
   sans changer la teinte perçue. Les autres cibles du constat (fil d'Ariane,
   mentions du formulaire de contact, h1 de la home, mot de passe oublié)
   mesurent désormais 5,1 à 6,0 et ne sont pas reprises ici. */
.v4-rm-more,
.v4-readmore .v4-rm-more,
.glc-seo .v4-rm-more{color:#4d7f22}
