/* =============================================================================
   tokens.css — la source UNIQUE de la palette, des polices et des rayons.

   Chargé avant admin.css et public.css par tous les points d'entrée (voir
   tests/styles.php, qui refuse une page qui l'oublierait). Ni admin.css ni
   public.css ne déclarent de couleur : ils consomment ces variables. C'est ce
   qui les empêche de diverger, comme elles le faisaient en recopiant chacune
   la même ligne de polices.

   Trois états de thème, et non deux :
     :root                                     le clair, toujours défini
     @media (prefers-color-scheme: dark)       le sombre suivi par défaut
     :root[data-theme="dark"]                  le sombre choisi explicitement

   Le second est restreint à :root:not([data-theme="light"]) pour qu'un choix
   explicite de clair l'emporte sur un système réglé en sombre.
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,600;12..96,700&family=Instrument+Sans:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

:root {
    /* Fonds, du plus bas au plus haut. */
    --paper: #f6f7f5;
    --sheet: #ffffff;
    --sunk: #eef0ed;
    /* Trois paliers NETS : --sheet > --raised > --sunk. Aligner --raised sur
       --sheet effacerait le relief de neuf surfaces, dont le survol des liens
       de la barre latérale, qui deviendrait invisible. */
    --raised: #f4f5f2;

    /* Texte, du plus appuyé au plus discret. */
    --ink: #10151c;
    --muted: #59636e;
    /* Assombri : #828d98 ne donnait que 3,15:1 sur --paper et 3,38:1 sur
       --sheet, sous le minimum de 4,5:1 — et c'est lui qui porte le texte le
       plus PETIT du site public (dates, durées, repères de saison). Celui-ci
       atteint 4,83 sur --paper, 5,19 sur --sheet, 4,53 sur --sunk et 4,74 sur
       --raised : les quatre surfaces passent. */
    --faint: #646e79;

    /* Filets : c'est eux qui portent la mise en page, pas les ombres. */
    --rule: #dcdfda;
    --rule-strong: #c3c8c1;

    /* Signal : l'action, le lien, la sélection. Une seule couleur pour tout ça. */
    --signal: #1a3fe0;
    --signal-ink: #ffffff;
    --signal-soft: #e8ecfd;
    --signal-line: #c3cef8;

    /* États. Le rouge ne décore jamais : direct, dépassement, erreur.
       Les trois teintes ont été passées au contraste sur la PIRE de leurs
       quatre surfaces (--paper, --sheet, --sunk, --raised), parce qu'elles
       portent du texte de badge et d'alerte, pas seulement des filets :
         --live  #d93b26 ne donnait que 3,98:1 → #c4331f, 4,77:1.
         --warn  #9a6410 ne donnait que 4,36:1 → #8d5c0e, 4,99:1.
         --good  #1b7a5a passe déjà (4,61:1) et reste tel quel.
       Les valeurs sombres ne sont pas touchées : elles sont claires sur fond
       sombre et passaient déjà. */
    --live: #c4331f;
    --live-soft: #fcecea;
    --live-line: #f3c4bd;
    --good: #1b7a5a;
    --good-soft: #e6f3ee;
    --good-line: #b7ddcd;
    --warn: #8d5c0e;
    --warn-soft: #faf0dd;
    --warn-line: #e8d3a6;

    /* Lavis de fond de page. Translucides par nature : ils se posent sur
       --paper et s'éteignent vers transparent. Un jeton opaque à leur place
       donnerait une tache, pas un lavis. */
    --signal-wash: rgba(26, 63, 224, 0.06);
    --good-wash: rgba(27, 122, 90, 0.04);

    /* Voiles : fond de boîte modale, ombre portée. */
    --scrim: rgba(16, 21, 28, 0.45);
    --shadow: 0 1px 2px rgba(16, 21, 28, 0.05), 0 8px 24px -12px rgba(16, 21, 28, 0.15);

    /* Typographie. Chaque famille garde une pile de repli réelle : sans elle,
       une coupure vers Google Fonts remplacerait le texte par du Times. */
    --f-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
    --f-body: "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
    --f-mono: "DM Mono", ui-monospace, "Cascadia Mono", monospace;

    --r: 3px;

    /* Fond du rail d'espaces (admin/includes/header.php) : un repère sombre
       stable, volontairement INVARIANT entre les trois thèmes (même valeur
       ici, dans le sombre automatique et dans le sombre explicite) — au
       contraire de --ink, qui est un jeton de TEXTE et bascule clair au
       thème sombre. Le rail n'a pas à suivre le thème : il reste le même
       repère visuel dans les deux. */
    --rail-bg: #10151c;
    /* Icônes du rail : même logique d'invariance que --rail-bg. --sheet, qui
       aurait semblé un choix naturel, est un jeton de SURFACE et bascule
       sombre au thème sombre (#141920) — quasi invisible sur --rail-bg, qui
       ne bouge pas avec lui. Il fallait donc son propre jeton clair fixe. */
    --rail-fg: #eef0f2;

    /* Rampe séquentielle pour l'anneau de répartition (includes/donut.php) :
       les parts y sont triées par grandeur, la couleur redouble donc un ordre
       plutôt que de distinguer des identités. Une seule teinte, du plus
       soutenu au plus pâle, plutôt qu'une palette catégorielle. Générée en
       OKLCH puis vérifiée : écart de clarté >= 0,06 entre paliers voisins,
       contraste >= 2,0 pour le palier le plus pâle sur --sheet et --paper. */
    --chart-1: #112eca;
    --chart-2: #254dd4;
    --chart-3: #3c67dd;
    --chart-4: #557ee6;
    --chart-5: #6f95ee;
    --chart-6: #8aaaf6;
    /* Gris franc, hors rampe : réservé à la part « Autres ». */
    --chart-7: #8d8f92;
}

@media (prefers-color-scheme: dark) {
    /* Restreint à :not([data-theme="light"]) pour qu'un choix explicite de
       clair l'emporte sur un système réglé en sombre. Sans cette restriction,
       la personne qui a coché « clair » dans l'administration verrait quand
       même du sombre. */
    :root:not([data-theme="light"]) {
        --paper: #0e1116;
        --sheet: #141920;
        --sunk: #1a2029;
        --raised: #1f262f;

        --ink: #edf0f2;
        --muted: #98a3ae;
        /* Éclairci pour la même raison qu'en clair : #78838f tombait à 3,95:1
           sur --raised, où s'affiche le lien d'abandon de la newsletter. */
        --faint: #8b96a2;

        --rule: #242b33;
        --rule-strong: #333c46;

        --signal: #7d97ff;
        --signal-ink: #0b0f18;
        --signal-soft: #1b2440;
        --signal-line: #2c3a63;

        --live: #ff6b52;
        --live-soft: #331a16;
        --live-line: #55291f;
        --good: #3fb98c;
        --good-soft: #12281f;
        --good-line: #1e4436;
        --warn: #d8a24a;
        --warn-soft: #2b2110;
        --warn-line: #4a3819;

        --signal-wash: rgba(125, 151, 255, 0.07);
        --good-wash: rgba(63, 185, 140, 0.05);

        --scrim: rgba(0, 0, 0, 0.62);
        --shadow: 0 1px 2px rgba(0, 0, 0, 0.32), 0 12px 32px -16px rgba(0, 0, 0, 0.6);

        --f-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
        --f-body: "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
        --f-mono: "DM Mono", ui-monospace, "Cascadia Mono", monospace;

        --r: 3px;

    /* Fond du rail d'espaces (admin/includes/header.php) : un repère sombre
       stable, volontairement INVARIANT entre les trois thèmes (même valeur
       ici, dans le sombre automatique et dans le sombre explicite) — au
       contraire de --ink, qui est un jeton de TEXTE et bascule clair au
       thème sombre. Le rail n'a pas à suivre le thème : il reste le même
       repère visuel dans les deux. */
    --rail-bg: #10151c;
    /* Icônes du rail : même logique d'invariance que --rail-bg. --sheet, qui
       aurait semblé un choix naturel, est un jeton de SURFACE et bascule
       sombre au thème sombre (#141920) — quasi invisible sur --rail-bg, qui
       ne bouge pas avec lui. Il fallait donc son propre jeton clair fixe. */
    --rail-fg: #eef0f2;

        --chart-1: #c3d1fe;
        --chart-2: #a9bbf7;
        --chart-3: #90a5ee;
        --chart-4: #788fe6;
        --chart-5: #6279dc;
        --chart-6: #4c61d3;
        --chart-7: #7e8083;
    }
}

/* Le sombre CHOISI, qui doit gagner même sur un système réglé en clair.
   L'administration pose toujours data-theme sur <html> (voir
   admin/includes/header.php et Auth::userTheme()) ; le site public, jamais. */
:root[data-theme="dark"] {
    --paper: #0e1116;
    --sheet: #141920;
    --sunk: #1a2029;
    --raised: #1f262f;

    --ink: #edf0f2;
    --muted: #98a3ae;
    /* Éclairci pour la même raison qu'en clair : #78838f tombait à 3,95:1 sur
       --raised, où s'affiche le lien d'abandon de la newsletter. */
    --faint: #8b96a2;

    --rule: #242b33;
    --rule-strong: #333c46;

    --signal: #7d97ff;
    --signal-ink: #0b0f18;
    --signal-soft: #1b2440;
    --signal-line: #2c3a63;

    --live: #ff6b52;
    --live-soft: #331a16;
    --live-line: #55291f;
    --good: #3fb98c;
    --good-soft: #12281f;
    --good-line: #1e4436;
    --warn: #d8a24a;
    --warn-soft: #2b2110;
    --warn-line: #4a3819;

    --signal-wash: rgba(125, 151, 255, 0.07);
    --good-wash: rgba(63, 185, 140, 0.05);

    --scrim: rgba(0, 0, 0, 0.62);
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.32), 0 12px 32px -16px rgba(0, 0, 0, 0.6);

    --f-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
    --f-body: "Instrument Sans", ui-sans-serif, system-ui, sans-serif;
    --f-mono: "DM Mono", ui-monospace, "Cascadia Mono", monospace;

    --r: 3px;

    /* Fond du rail d'espaces (admin/includes/header.php) : un repère sombre
       stable, volontairement INVARIANT entre les trois thèmes (même valeur
       ici, dans le sombre automatique et dans le sombre explicite) — au
       contraire de --ink, qui est un jeton de TEXTE et bascule clair au
       thème sombre. Le rail n'a pas à suivre le thème : il reste le même
       repère visuel dans les deux. */
    --rail-bg: #10151c;
    /* Icônes du rail : même logique d'invariance que --rail-bg. --sheet, qui
       aurait semblé un choix naturel, est un jeton de SURFACE et bascule
       sombre au thème sombre (#141920) — quasi invisible sur --rail-bg, qui
       ne bouge pas avec lui. Il fallait donc son propre jeton clair fixe. */
    --rail-fg: #eef0f2;

    --chart-1: #c3d1fe;
    --chart-2: #a9bbf7;
    --chart-3: #90a5ee;
    --chart-4: #788fe6;
    --chart-5: #6279dc;
    --chart-6: #4c61d3;
    --chart-7: #7e8083;
}