/* a11y-public.css — correctifs d'accessibilité communs aux pages publiques (audit style/a11y d'octobre 2026).
   Chargée en DERNIER dans le <head> des pages publiques (jamais par /account). Ne touche pas au menu holo (.holo). */

/* Rouge du petit texte (< 24 px, < 18,66 px gras) : #F40700, même teinte que #E10600, 4,79:1 sur #060203 et 4,88:1 sur noir.
   #E10600 reste la couleur des surfaces, bordures, décor et grands titres. */
:root { --rouge-texte: #f40700; }
/* petits textes rouges injectés par des fichiers partagés avec /u/ (adult.js, pastilles.css, non modifiés) : surcharge ici,
   la feuille est aussi chargée sur /u/ (ce bloc ne vise que les pastilles hors #fe) */
body .dc-entry-adult,
body .adult-veil:hover,
body .adult-veil:focus-visible,
body .pastille-trace:not(#fe *) { color: var(--rouge-texte, #f40700); }
/* pastille « Trace » de /u/ (#fe, 9 px, #e10600 = 4,0:1) : même rouge de petit texte ; bordure et gabarit inchangés
   (pastilles.css et fiche-employe.* restent intacts) */
#fe .fe-top .pastilles .pastille-trace { color: var(--rouge-texte, #f40700); }

/* fil d'Ariane du menu holo (« ATRIUM · ITÉRATION », 10 px sous 900 px) : base .hl-crumb b en #e10600 = 4,0:1 ; #f40700 à
   spécificité de base, les règles .holo .hl-crumb b (rouge vif) de menu-holo.css gardent la priorité là où elles s'appliquent */
.hl-crumb b { color: var(--rouge-texte, #f40700); }

/* rubriques vides de /iteration (.it-rub, #6f6668 = 3,4:1) : gris atténué mais lisible (#8a8082, déjà le gris du site) */
.it-rub.is-empty:not([aria-selected="true"]) { color: #8a8082; }

/* petit texte gris sous 4,5:1 (audit QA d'octobre 2026, mesuré sur le fond réel avec getComputedStyle) :
   - indication « Rechercher… » de /registre (#6f6668 sur noir = 3,8:1) ;
   - point de séparation du fil d'Ariane du menu holo sur /iteration (#5d5456 = 2,9:1).
   Les deux passent au gris du site #8a8082 (5,5:1 sur noir, 5,4:1 sur #060203). */
.seek::placeholder { color: #8a8082; }
.holo-crumb-sep { color: #8a8082; }

/* ---------- Focus visible net (WCAG 2.4.7) : contour #ff2a33 2 px (5,6:1 sur noir) ---------- */
.profile-btn:not(.holo *):focus-visible,
.back:focus-visible,
.download:focus-visible,
.gate:focus-visible,
.oauth-btn:focus-visible,
.sc-chip:focus-visible,
.rail-item:focus-visible,
.mq-fs:focus-visible,
.adult-veil:focus-visible,
body > #lang button:focus-visible,
.head-tools #lang button:focus-visible,
.plate a:focus-visible {
  outline: 2px solid #ff2a33 !important;
  outline-offset: 2px !important;
}
/* champs et commandes dont le contour était supprimé (outline: none) : /, /registre, /assimilation, /login, /signup, fiche */
.head-registre:focus-visible,
.head-charter:focus-visible,
.find input:focus-visible,
.field input:focus-visible,
.eye:focus-visible,
.entry-step:focus-visible,
.creator-link:focus-visible {
  outline: 2px solid #ff2a33 !important;
  outline-offset: 2px !important;
}

/* éléments dans des conteneurs qui rognent (overflow hidden) : contour intérieur */
.cl-cam:focus-visible,
.mq-scroll:focus-visible,
.cell:focus-visible {
  outline: 2px solid #ff2a33 !important;
  outline-offset: -2px !important;
}

/* ---------- Cibles FR / EN (pages hors menu holo) : ≥ 24 px, 44 px sur mobile ---------- */
body > #lang button,
.head-tools #lang button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  min-height: 24px;
  padding: 0 2px;
}
body > #lang { gap: 0.15rem; align-items: center; }
/* le logo ne s'étend plus sous FR/EN (boîte limitée à son contenu) */
.shell > a.logo,
.shell > p.logo { justify-self: start; width: fit-content; max-width: 100%; }

/* /u/ (fiche, chargée avec cette feuille depuis l'audit P5) : FR / EN gardent leur taille d'origine, sinon l'en-tête grandit
   (+11 px à 1280, +31 px à 390) et la mise en page de la fiche bouge ; le reste de la feuille (focus, couleurs) s'applique. */
body:has(#fe) .head-tools #lang button { min-width: 0; min-height: 0; padding: 0; }

/* ---------- Lien RÈGLEMENT du bandeau bas : ≥ 24 px de haut sans bouger le bandeau ---------- */
.plate a {
  display: inline-block;
  padding: 6px 4px;
  margin: -6px -4px;
}

@media (max-width: 600px) {
  body > #lang { top: 0.2rem; right: 0.35rem; gap: 0; }
  body > #lang button,
  .head-tools #lang button { min-width: 44px; min-height: 44px; }
  .plate a { padding: 15px 8px; margin: -15px -8px; }
}

/* ---------- Bandeau bas sur mobile (≤ 600 px) : dans le flux sur les pages qui défilent ----------
   Le bandeau « SIÈGE MOROS · STATUT · RÈGLEMENT… » est fixé en bas de l'écran et passe sur 2 lignes sur mobile : il recouvrait
   le contenu pendant le défilement (/singularity, /mandataire, /signup, /u/). Sur ces pages seulement, il suit le contenu
   (position relative = dans le flux, sans décalage) ; /, /login et /registre (une seule vue sans défilement) et /iteration
   (déjà dans le flux) ne changent pas. Bureau inchangé (règle limitée aux écrans ≤ 600 px). */
@media (max-width: 600px) {
  body:has(#wall) .plate,
  body:has(footer.plate) .plate,
  body:has(form.card[action="/signup"]) .plate,
  body:has(#fe) .plate {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: auto;
    margin: 0;
    padding: 1.5rem 1.25rem 1.1rem;
  }
  /* /mandataire : la bande noire derrière le bandeau fixe n'a plus lieu d'être, et la réserve de 7,5 rem sous le contenu non plus */
  body:has(footer.plate) .plate::before { display: none; }
  body:has(footer.plate) .shell { padding-bottom: 0.5rem; }
}

/* ---------- Audit a11y d'octobre 2026 (PR landmarks / h1 / formulaires) ---------- */
/* texte réservé aux technologies d'assistance (h1 d'accueil, /singularity, /login, /signup) */
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* lien d'évitement (/login, /signup) : hors écran, visible au focus clavier */
.skip-link { position: fixed; top: 0.5rem; left: 0.5rem; z-index: 20; padding: 0.6rem 0.9rem; border: 1px solid #ff2a33; background: #000; color: #f7f1f1; font-family: "Share Tech Mono", ui-monospace, monospace; font-size: 0.78rem; letter-spacing: 0.1em; text-decoration: none; transform: translateY(-300%); }
.skip-link:focus, .skip-link:focus-visible { transform: none; outline: 2px solid #ff2a33; outline-offset: 2px; }
/* bouton de langue inactif : gris du site #8a8082 (5,3:1 sur le fond le plus clair de la vignette), jamais une teinte héritée plus pâle */
body > #lang button[aria-pressed="false"] { color: #8a8082; }
body > #lang button[aria-pressed="false"]:hover,
body > #lang button[aria-pressed="false"]:focus-visible { color: #ff2a33; }
/* /cgu : intertitres d'annexe en h2 (un seul h1 par page), rendu identique à l'ancien h1 */
.legal h2.annexe-titre { margin: 0; padding-top: 0; border-top: 0; color: #f7f1f1; font-family: "Big Shoulders Display", "Arial Narrow", sans-serif; font-size: clamp(2.4rem, 7vw, 4.2rem); font-weight: 700; line-height: 0.9; letter-spacing: 0.04em; }
/* titres bilingues réservés aux technologies d'assistance (/singularity, sans script en ligne) : une seule langue exposée */
html:not([lang="en"]) .t-en,
html[lang="en"] .t-fr { display: none; }

/* ---------- QA mobile 380 (24 octobre 2026) ---------- */
/* Bandeau bas : liens séparés d'au moins 8 px, cibles ≥ 28 px (44 px en mobile) sans marge négative (les zones de 36×45 px se chevauchaient,
   « RÈGLEMENT » / « CONFIDENTIALITÉ »), retour à la ligne permis ; les points « · » restent entre les liens. */
.plate {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  column-gap: 4px;
  row-gap: 8px;
}
.plate a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 2px;
  margin: 0;
}
@media (max-width: 600px) {
  /* zone tactile de 44 px de haut (texte inchangé, rembourrage seul) ; rangées séparées de 8 px, sans chevauchement */
  .plate a { min-height: 44px; padding: 0 4px; margin: 0; }
  /* contenu au-dessus du bandeau fixe (/, /login, /registre) : réserve égale à sa hauteur, mesurée par plate-reserve.js
     (classe posée seulement quand le bandeau est fixe : la réserve de la fiche, 76 px, reste intacte) */
  html.plate-reserve body { padding-bottom: var(--plate-h); }
  /* /signup : liens du mandat à 44 px de haut (texte inchangé) */
  p.mandat-links > a.mandat-link { min-height: 44px; }
}
/* /login, /signup : le logo ne passe plus sous FR / EN (boîte réduite au texte) et s'écarte du titre « ACCÈS AGENT » (≥ 12 px) */
.shell > nav > a.logo { width: fit-content; max-width: calc(100% - 6.5rem); }
.shell > nav:has(> a.logo) { padding-bottom: 12px; }
/* /u/ : FR / EN à 24 × 24 px au moins, sans agrandir l'en-tête (zone élargie compensée par une marge négative) */
body:has(#fe) .head-tools #lang button { min-width: 24px; min-height: 24px; padding: 0 4px; margin: -6px -4px; }
/* mobile : 44 × 44 px, l'en-tête grandit de 7 px au plus (marges verticales négatives), CHOISIR UN MANDAT reste dessous, les deux zones côte à côte sans chevauchement */
@media (max-width: 600px) {
  body:has(#fe) .head-tools #lang { gap: 0; }
  body:has(#fe) .head-tools #lang button { min-width: 44px; min-height: 44px; padding: 0; margin: -15.5px 0 -8px; }
}