/* ==========================================================================
   ESPACE CLIENT — 2. BASE
   ==========================================================================
   Réinitialisation et styles des éléments HTML nus.
   Équivalent client de la première partie de root.css.
   Dépend de : client/tokens.css
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

.c-body {
    margin: 0;
    background: var(--c-bg);
    color: var(--c-ink);
    font-family: var(--c-font);
    font-size: var(--c-font-size-base);
    line-height: var(--c-line-height);
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    min-height: 100dvh;
}

/* Titres : interligne 1.3 et graisse 600, comme la règle h1–h6 de root.css.
   Enveloppé dans :where() — spécificité ZÉRO — pour la MÊME raison que la
   réinitialisation des liens ci-dessous : sans cela `.c-body h1` (0,1,1)
   l'emporterait sur `.c-page-title` (0,1,0), et un titre de composant ne
   pourrait jamais choisir sa propre graisse. */
:where(.c-body h1, .c-body h2, .c-body h3) {
    margin: 0;
    line-height: 1.3;
    font-weight: 600;
    text-wrap: balance;
}
/* MÊME PIÈGE, ET IL A MORDU. `.c-body p` vaut (0,1,1) : il l'emportait sur
   TOUTE règle de composant à une seule classe — `.c-int-q__help`,
   `.c-int-q__warn`, `.c-int-q__stock`, `.c-cc-recap__next`… Ces règles
   déclaraient une marge, le navigateur la calculait à 0, et rien ne le
   signalait : la déclaration est valide, elle perd simplement en cascade.
   Deux remarques distinctes de l'écran de création (« il manque une marge
   basse sur l'aide », « le warn manque de marge haute ») avaient cette seule
   et même cause. En `:where()` la remise à zéro tombe à (0,1,0) : elle reste
   le défaut — le socle est chargé AVANT les feuilles de page — et le premier
   composant qui réclame une marge l'obtient. */
.c-body :where(p) { margin: 0; }
.c-body img { max-width: 100%; display: block; }

/* Réinitialisation des liens enveloppée dans :where() — spécificité ZÉRO.
   Sans cela, `.c-body a` (0,1,1) l'emporterait sur toute règle de composant
   à une seule classe comme `.c-navlink` ou `.c-btn--link` (0,1,0) : un lien
   stylé en bouton reprendrait la couleur du texte courant au lieu de la
   sienne. Piège classique, et invisible tant qu'on ne mesure pas. */
:where(.c-body a) { color: inherit; text-decoration: none; }

/* ---------- Contrôles de formulaire --------------------------------------
   Cette coquille ne charge ni Tabler ni root.css : sans cette remise à zéro,
   un <select>, un <input type="date"> ou un <input type="number"> sortent en
   police système à 13 px, au milieu d'une page en neulis-neue.

   En `:where()` — donc à spécificité ZÉRO — pour la même raison que la remise
   à zéro des liens juste au-dessus : `.c-body button` (0,1,1) l'emporterait
   sinon sur `.c-btn` (0,1,0), et chaque bouton stylé perdrait sa couleur. */
:where(.c-body input, .c-body select, .c-body textarea, .c-body button) {
    font: inherit;
    color: inherit;
}

/* Les marges natives des blocs de texte venaient jusqu'ici du reboot embarqué
   dans Tabler. Une <ol>, une <ul> ou une <dl> posée dans cette coquille les
   récupérerait du navigateur. */
:where(.c-body ul, .c-body ol, .c-body dl, .c-body dd,
       .c-body fieldset, .c-body legend, .c-body hr) {
    margin: 0;
    padding: 0;
}
:where(.c-body ul, .c-body ol) { list-style: none; }

/* ---------- LE MASQUAGE, UNE RÈGLE, DEUX CROCHETS ------------------------
   `.app-hidden` est définie dans root.css, que cette coquille ne charge pas.
   Sans elle, tout ce que les vues masquent deviendrait VISIBLE — panne
   parfaitement silencieuse.
   On ne la RENOMME pas : la chaîne exacte « app-hidden » est ajoutée et
   retirée par neuf scripts, dont six partagés avec l'administration. On lui
   donne un crochet, et `.c-hidden` reste disponible pour du markup neuf.
   C'est le patron de tout ce socle : une seule règle, deux sélecteurs, aucune
   divergence possible entre l'écran écrit en natif et celui qui est plaqué.

   `!important` : root.css le pose, et canvas.css documente déjà ici qu'une
   déclaration d'auteur bat le `[hidden] { display: none }` du navigateur. */
.c-hidden,
.c-body .app-hidden { display: none !important; }

.c-body :focus-visible {
    outline: 2px solid var(--c-accent);
    outline-offset: 2px;
    /* PAS de border-radius ici : la règle (0,2,0) écraserait celui des
       composants (0,1,0) et transformerait au clavier chaque pilule en
       rectangle. Le contour épouse la forme réelle de l'élément. */
}

/* Masque visuellement en restant lisible par les lecteurs d'écran.
   `.app-sr-only` est le nom des vues partagées (le « (requis) » d'un libellé,
   par exemple) : même recette, le socle client doit la porter aussi (23/09). */
.c-sr,
.c-body .app-sr-only {
    position: absolute; width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce) {
    .c-body *,
    .c-body *::before,
    .c-body *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}