/* site.css — ce que le site ajoute à la maquette validée (05/10), et rien
   d'autre : la fenêtre du capitaine, les messages, le champ piège, l'hébreu.
   Les valeurs de la maquette restent dans index.html, intactes. */

[hidden] { display: none !important; }

/* Le champ piège des robots : hors de l'écran, jamais visible. */
/* ⚠ Pas de « left: -9999px » : en hébreu la page défile vers la gauche, et le
   champ l'élargissait de 9 999 px (mesuré le 05/10). */
.piege { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); opacity: 0; pointer-events: none; }

/* Tant que le réglage du site n'est pas lu, l'encart garde sa place sans se
   montrer : retiré, il ne doit jamais apparaître une demi-seconde. */
html:not(.capitaine-lu) [data-capitaine] { visibility: hidden; }

/* Le message sous le champ de la fin de page (fond noir). */
.message-final { font-family: 'Rubik', 'Helvetica Neue', sans-serif; font-size: 14px; color: #fff; }
.message-final:empty { display: none; }
.message-ok { font-weight: 700; color: #2f6d3f; }
.message-final.message-ok { color: #2fa84f; }

/* La fenêtre : le voile de la maquette (fond d'encre à 55 %). */
.voile { position: fixed; inset: 0; z-index: 50; background: rgba(19,19,22,.55); display: flex;
         align-items: flex-start; justify-content: center; padding: 40px 16px; box-sizing: border-box;
         overflow-y: auto; font-family: 'Rubik', 'Helvetica Neue', sans-serif; }
.voile > [role="dialog"] { margin: auto 0; }
body.fenetre-ouverte { overflow: hidden; }

/* Une erreur du formulaire : à l'encre, en gras — le rouge est réservé au
   tampon « GONE » et à la pastille « Live » (fiche A5). */
.erreur-capitaine { margin: 0; font-family: 'Rubik', 'Helvetica Neue', sans-serif; font-size: 14px;
                    font-weight: 700; color: #131316; }
.erreur-capitaine::before { content: "⚠ "; }
[aria-invalid="true"] { box-shadow: 0 0 0 3px #2fa84f; }

/* La taille de ligue choisie prend le vert pâle de la maquette. */
label:has(> input[name="taille"]:checked) { background: #e6f2ea !important; }

/* La langue choisie est en noir, l'autre en clair. */
[data-langue] { cursor: pointer; }
[data-langue][aria-pressed="false"] { background: transparent !important; color: #131316 !important; }
[data-langue][aria-pressed="true"] { background: #131316 !important; color: #fff !important; }

/* ── L'hébreu ─────────────────────────────────────────────── */
/* Big Shoulders Display n'a pas d'hébreu : les titres passent sur Rubik,
   lettre par lettre, au lieu de tomber sur une police système. */
html[lang="he"] [style*="Big Shoulders"] { font-family: 'Big Shoulders Display', 'Rubik', sans-serif !important; }
html[lang="he"] h1, html[lang="he"] h2, html[lang="he"] h3 { letter-spacing: 0 !important; }

/* Les bandeaux défilent dans le même sens dans les deux langues : retournés,
   ils sortaient de la page (11 439 px de large mesurés en hébreu). */
div:has(> .defile) { direction: ltr; }

/* Ce que la maquette pose à gauche ou à droite se retourne avec la page. */
html[dir="rtl"] [data-ferme][aria-label] { right: auto !important; left: 14px; }
html[dir="rtl"] .chevre-du-telephone { left: auto !important; right: -200px; }
html[dir="rtl"] .pastille-langue { right: auto !important; left: -46px; }
html[dir="rtl"] .desk[style*="padding: 10px 0 0 60px"] { padding: 10px 60px 0 0 !important; }
html[dir="rtl"] .tampon { right: auto !important; left: 8px; }