/* ============================================================
   LCDI — NEUTRALISATION DU THÈME PARENT (Kadence)
   Préventive et d'office : elle est écrite AVANT le premier composant, pas
   après le premier bug. Elle ne reprend au parent que ce qu'il vole, et rien
   d'autre — le reste du rendu Kadence continue de servir les pages existantes
   pendant le build progressif.

   RÈGLES DE FABRICATION (elles sont la raison d'être de ce fichier) :
   - JAMAIS `!important`. On gagne par la spécificité, qui se lit et se dépasse ;
     un `!important` se traîne jusqu'en production et bloque le composant suivant.
   - Spécificité MONTÉE sur nos éléments interactifs : le parent style les
     `<button>` et ses états en (0,1,1). `html:root .lcdi-btn--cta:hover` pèse
     (0,3,1) : il passe devant sans arme lourde.
   - `html body` pèse (0,0,2) : le cran qu'il faut pour battre les styles que le
     parent pose sur `body` (et son style inline de fond), sans écraser un
     contexte local.
   - Tout ce qui est verrouillé ici l'est en TOKENS, jamais en valeur.

   Ordre de chargement : theme.json (presets) → tokens.css → CE FICHIER.
   ============================================================ */


/* ============================================================
   VOL n°1 — LES ÉTATS D'INTERACTION
   Kadence pose le survol/focus/actif de TOUS les liens du site sur trois
   variables à lui (`--global-palette-highlight*`, servies depuis le customizer,
   défauts palette1/palette2/palette9). Un composant qui ne les remappe pas se
   fait reprendre ses états sans que rien ne le signale.
   On ne combat pas ces règles : on leur donne nos rôles à consommer.
   Les trois variables sont REDÉCLARÉES dans chaque contexte remappé — sinon un
   `data-theme="nuit"` bascule `--link` et laisse le parent sur l'ancienne valeur.
   ============================================================ */
/* DIFFÉRÉ (gate socle, verdict Julien 05/08) : le remap global repeignait les
   liens des pages existantes AVANT leur reprise par le build, et DÉGRADAIT le
   contraste des zones sombres héritées (pied : 6,6:1 → 3,4:1 mesuré — l'ancien
   footer ne porte pas `data-theme="nuit"`, il recevait l'encre de contexte
   clair). Le remap reviendra page par page, avec les vrais contextes, au fil du
   build. Les blocs `[data-theme]` ci-dessous restent actifs : aucune page
   existante ne les porte, ils n'attendent que nos gabarits.
html:root {
  --global-palette-highlight:      var(--link);
  --global-palette-highlight-alt:  var(--link-hover);
  --global-palette-highlight-alt2: var(--link-inverse);
}
*/
/* BLOC 3 (06/08) — LE REMAP REVIENT, PAGE PAR PAGE, COMME ANNONCÉ.
   La règle du gate socle était : « jamais d'office sur les pages héritées ; le
   remap reviendra page par page, avec les vrais contextes, au fil du build ».
   Une page rendue par le gabarit « Page en sections » n'est plus héritée : elle
   est entièrement à nous, ses zones sombres portent leur `data-theme`, et rien
   n'y dépend plus du rendu Kadence. Elle prend donc le remap complet.
   La classe est posée par `inc/sections.php` sur le `<body>`. */
body.lcdi-page-sections {
  --global-palette-highlight:      var(--link);
  --global-palette-highlight-alt:  var(--link-hover);
  --global-palette-highlight-alt2: var(--link-inverse);
}

[data-theme="nuit"] {
  --global-palette-highlight:      var(--link);
  --global-palette-highlight-alt:  var(--link-hover);
  --global-palette-highlight-alt2: var(--link-inverse);
}
[data-theme="jour"] {
  --global-palette-highlight:      var(--link);
  --global-palette-highlight-alt:  var(--link-hover);
  --global-palette-highlight-alt2: var(--link-inverse);
}


/* ============================================================
   LE DOCUMENT — fond et encre
   (0,0,2) : le cran contre les styles que le parent pose sur `body`.
   Valeurs : celles du design system, qui sont aussi celles du site relevé
   (fond #f5f8f9 = `site_background` palette8 ; encre #444444 = `base_font.color`
   palette4). Ce n'est donc pas un changement de rendu, c'est un changement de
   PROPRIÉTAIRE : la couleur du document vient désormais des tokens.
   ============================================================ */
html body {
  background-color: var(--surface-page);
  color: var(--text-body);
  font-family: var(--font-body);
}


/* ============================================================
   VOL n°2 — LA TYPOGRAPHIE
   Kadence grave ses familles au niveau de la classe (`.entry-content h2`, …) :
   un `h2` d'un composant à nous, écrit en (0,0,1), perd. La règle du système est
   « tout composant grave sa police » ; ce socle la tient pour les six niveaux de
   titre, y compris h2/h3/h4 que le parent adresse nommément.
   `html:root body :is(h1,…,h6)` pèse (0,1,3) : au-dessus du (0,1,1) du parent.
   Seule la FAMILLE est reprise ici. Les tailles, graisses et interlignes
   restent au registre de composants (`_base.css` du design system) : les poser
   ici changerait le rendu des pages existantes, que le build n'a pas encore
   reprises.
   ============================================================ */
html:root body :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--font-display);
}


/* ============================================================
   NOS ÉLÉMENTS INTERACTIFS — la famille de boutons
   Le registre (`components/buttons.css`) possède ses états. Le parent, lui,
   style `<button>` et ses trois états en (0,1,1) : sur un bouton réel, il
   repasse devant le composant. Cette armure verrouille FOND ET COULEUR aux
   trois états, en tokens, à (0,3,1).
   Elle vise nos classes seulement : aucune page existante ne les porte, donc
   aucun effet sur le site tant que le build ne les a pas posées.
   ============================================================ */
html:root .lcdi-btn--cta,
html:root .lcdi-btn--cta:hover,
html:root .lcdi-btn--cta:focus,
html:root .lcdi-btn--cta:focus-visible,
html:root .lcdi-btn--cta:active {
  color: var(--cta-text);
  border-color: var(--cta-border);
}
html:root .lcdi-btn--cta,
html:root .lcdi-btn--cta:focus,
html:root .lcdi-btn--cta:focus-visible {
  background-color: var(--cta-bg);
}
html:root .lcdi-btn--cta:hover,
html:root .lcdi-btn--cta:active {
  background-color: var(--cta-bg-hover);
  border-color: var(--cta-border-hover);
}

html:root .lcdi-btn--ghost,
html:root .lcdi-btn--ghost:focus,
html:root .lcdi-btn--ghost:focus-visible {
  background-color: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);
  border-color: var(--btn-secondary-border);
}
html:root .lcdi-btn--ghost:hover,
html:root .lcdi-btn--ghost:active {
  background-color: var(--btn-secondary-bg-hover);
  color: var(--btn-secondary-text-hover);
  border-color: var(--btn-secondary-bg-hover);
}

/* Les boutons Kadence Blocks portent un `::before` (le calque de survol du
   parent). Si un de nos boutons hérite un jour de ces classes, ce calque se
   pose PAR-DESSUS notre fond et mange l'état. On le coupe sur nos éléments,
   et sur eux seuls. */
html:root .lcdi-btn::before,
html:root .lcdi-btn::after {
  content: none;
}


/* ============================================================
   VOL n°3 — LE CHAMP DE SAISIE AU REPOS  [AJOUT 19/08, retouche T8]

   TROUVÉ EN CORRIGEANT AUTRE CHOSE, ET C'EST LE PLUS INSTRUCTIF DE CE FICHIER.
   Les champs de la modale d'inscription étaient invisibles ; la cause nommée
   était un sélecteur de thème du registre, elle a été corrigée. La sonde est
   restée ROUGE : la bordure ne rendait plus du blanc de nuit, elle rendait
   `#cbd5e0` — 1,49:1 sur le panneau blanc. Le premier défaut en cachait un
   second, plus ancien et plus large.

   LE VOL, mesuré au navigateur (`CSS.getMatchedStylesForNode`, 19/08) :

     input[type=text], …, input[type=datetime-local]      (0,1,1)   PARENT
       color: var(--global-palette5)        → #888888
       border: 1px solid var(--global-gray-400)  → #cbd5e0
       background: var(--global-palette9)   → #ffffff
       border-radius: 3px ; padding: .4em .5em

     .lcdi-input                                          (0,1,0)   NOUS

   Le parent pèse un cran de plus. Le champ du registre n'a donc JAMAIS rendu
   au repos, sur AUCUNE page du site : ni sa bordure, ni son fond, ni son encre.
   Deux notes du registre s'en trouvaient démenties sans que rien ne le dise —
   « le texte de champ passe de #888888 (3,54:1) à --text-body » et « le filet
   a le droit de délimiter un contrôle » (3,54:1 promis, 1,49:1 rendu).

   POURQUOI PERSONNE NE L'AVAIT VU. Les maquettes ne chargent PAS le thème
   parent : elles montraient le rendu que le registre décrit, c'est-à-dire le
   bon. Le diff de conformité maquette ↔ site ne pouvait donc pas l'attraper, et
   la sonde de contraste ne mesure que du texte. Il a fallu qu'un défaut plus
   grave passe devant pour que celui-ci devienne visible.

   POURQUOI SEULEMENT LES TROIS COULEURS. Même périmètre que l'armure des
   boutons ci-dessus : ce fichier verrouille ce qui porte la VOIX et la
   LISIBILITÉ, jamais la géométrie. Le rayon de 3 px et la marge intérieure du
   parent restent donc en place et sont CONSIGNÉS AU RAPPORT — les corriger
   déplacerait la boîte de tous les champs du site, ce qui est une décision de
   gate, pas une réparation.

   POURQUOI `html body` ET PAS `html:root`, et c'est la ligne à ne pas se
   tromper : il faut battre le parent (0,1,1) SANS battre nos propres états.
     `html body .lcdi-input` .......... (0,1,2)  passe devant le parent
     `.lcdi-input:hover` / `:focus` / `:disabled` / `[aria-invalid]` ... (0,2,0)
   (0,2,0) l'emporte sur (0,1,2) : survol, focus, erreur et champ éteint gardent
   la main, exactement comme le registre les a écrits. Une armure en `html:root`
   (0,2,1) aurait gelé le champ dans son état de repos — le focus qui rendait ces
   champs visibles au clic aurait disparu avec le défaut.
   ============================================================ */
html body .lcdi-input,
html body .lcdi-form select,
html body .lcdi-form textarea {
  color: var(--text-body);
  background-color: var(--field-surface);
  border-color: var(--field-border);
}


/* ============================================================
   VOL n°3 bis — LA BOÎTE DU CHAMP  [AJOUT 19/08, retouche 3, verdict de gate]

   CE QUI CHANGE PAR RAPPORT AU BLOC CI-DESSUS. La retouche 2 s'est arrêtée aux
   trois couleurs et a CONSIGNÉ l'écart de géométrie plutôt que de le corriger :
   « déplacer la boîte de tous les champs du site est une décision de gate, pas
   une réparation ». Le gate du 19/08 a rendu son verdict — harmoniser à la
   maquette — et c'est ce que cette règle fait, à ce seul titre.

   LE PÉRIMÈTRE EST MESURÉ, PAS SUPPOSÉ (`_constats/t8r3-geometrie.mjs`, mesures
   AVANT sur `/adherer/` et dans la modale du pied). SEUL `<input>` est volé :

     élément     site AVANT                        maquette (= registre)
     input       rayon 3px · 7,2/9 · h. 48px       rayon 8px · 12/16 · h. 54,8px
     select      rayon 8px · 12/16 (40 à droite)   IDENTIQUE
     textarea    rayon 8px · 12/16 · h. 198,8px    IDENTIQUE

   Le parent ne rejoint le champ que par ses sélecteurs `input[type=…]` (0,1,1) —
   il n'a jamais touché `select` ni `textarea`, dont le registre rend déjà les
   valeurs de la maquette. On n'arme donc QUE `<input>` : blinder ce qui n'est
   pas volé fige sans rien réparer.

   POURQUOI `html body input.lcdi-input` ET PAS `html body .lcdi-input`, et
   c'est LA ligne à ne pas se tromper (le bloc de couleurs, lui, peut se
   permettre la forme large) :

     `html body input.lcdi-input` ............ (0,1,3)  passe devant le parent
     `.lcdi-form select` (padding-right du chevron) ... (0,1,1)
     `.lcdi-input:hover` / `:focus` / `[aria-invalid]` / `[type="file"]`
       / `.lcdi-field--unite .lcdi-input` ..... (0,2,0)

   `.lcdi-input` porte AUSSI les `select` et les `textarea` (`Formulaires\Rendu`
   pose la même classe sur les trois). Une armure large aurait donc écrasé, par
   la forme raccourcie `padding`, le `padding-right: calc(var(--space-4) + 1.5rem)`
   qui réserve la place du chevron dessiné — le texte du sélecteur serait passé
   SOUS la flèche. Le qualificatif `input` ferme cette porte, et le cran de
   spécificité qu'il ajoute (0,1,3) reste sous les états (0,2,0) : survol, focus,
   erreur, champ de fichier et champ à unité gardent la main, exactement comme
   avant.
   ============================================================ */
html body input.lcdi-input {
  border-radius: var(--radius-m);          /* 8 px : le rayon système, contre le 3 px du parent */
  padding: var(--space-3) var(--space-4);  /* 12 / 16 px, contre .4em/.5em (7,2 / 9 px) */
}
