/*
 * COLYSEE — jetons de la charte « service public ».
 *
 * Extraits de style.css parce que les pages publiques (accueil, FAQ,
 * mentions) ne chargent pas la feuille de l'application : elles ont
 * leur propre mise en page. Sans ce fichier, un var(--indigo-600) écrit
 * dans index.php ne résout rien et le bouton devient invisible — c'est
 * exactement ce qui est arrivé le 23 août 2026.
 *
 * Une seule source de vérité pour les couleurs, chargée des deux côtés.
 */

:root {
    /* ══════════════════════════════════════════════════════════════
       COLYSEE — charte « service public », 23 août 2026.

       Les couleurs sont celles du système de design de l'État : les
       agents de l'Éducation nationale les voient toute la journée sur
       education.gouv.fr et sur leurs outils académiques. Un portail qui
       gère des heures payées et des données d'élèves gagne à en emprunter
       la grammaire — la crédibilité est ici une fonction, pas un goût.

       Les noms de variables sont conservés tels quels (--indigo-600,
       --slate-500…) : plus de 400 déclarations les utilisent dans les
       pages. Renommer imposerait de tout reprendre pour zéro bénéfice.
       Ce sont désormais des rôles, pas des teintes.
       ══════════════════════════════════════════════════════════════ */

    /* Fond : le blanc de l'État, pas le crème d'avant */
    --fond-page:   #FFFFFF;
    --fond-clair:  #FFFFFF;
    --fond-ombre:  #F6F6F6;
    --carte:       #FFFFFF;
    --gris-fond:   #F6F6F6;

    /* Traits : gris neutres, la teinte crème disparaît */
    --trait:       #DDDDDD;
    --trait-clair: #EEEEEE;

    /* Accent : bleu France. --indigo-* désigne maintenant le bleu. */
    --indigo-50:  #F5F5FE;
    --indigo-100: #ECECFE;
    --indigo-500: #6A6AF4;   /* bleu clair, pour les fonds actifs */
    --indigo-600: #000091;   /* bleu France — l'accent du portail */
    --indigo-700: #00006A;   /* pressé */

    /* Rouge Marianne : réservé au filet tricolore et aux alertes fortes */
    --marianne:   #E1000F;

    /* Gris : échelle du DSFR, plus neutre que les slate de Tailwind */
    --slate-50:  #F6F6F6;
    --slate-100: #EEEEEE;
    --slate-200: #DDDDDD;
    --slate-300: #CECECE;
    --slate-400: #929292;
    --slate-500: #666666;
    --slate-600: #3A3A3A;
    --slate-700: #2A2A2A;
    --slate-800: #1E1E1E;
    --slate-900: #161616;

    /* États : les couleurs de statut du DSFR */
    --success:    #18753C;
    --success-bg: #B8FEC9;
    --success-fg: #18753C;
    --success-bd: #34CB6A;
    --danger:     #CE0500;
    --danger-bg:  #FFE9E9;
    --danger-fg:  #CE0500;
    --danger-bd:  #FFA4A4;
    --warning:    #B34000;
    --warning-bg: #FFE9E6;
    --warning-fg: #B34000;
    --warning-bd: #FFB0A2;
    --purple:     #6E445A;   /* « macaron » du DSFR, pour la direction */
    --purple-bg:  #FEE7FC;
    --purple-fg:  #6E445A;

    /* Angles droits : la signature de la charte.
       Une valeur nulle plutôt qu'une suppression des déclarations —
       les pages continuent d'écrire border-radius: var(--radius). */
    --radius-sm: 0;
    --radius:    0;
    --radius-lg: 0;

    /* Ombres : le DSFR n'en use pas. On garde des variables vides pour
       ne pas casser les déclarations existantes. */
    --shadow-sm: none;
    --shadow:    none;
    /*
     * L'ombre est réservée à ce qui flotte réellement au-dessus du reste :
     * une modale, un menu déroulant, un message éphémère. Une carte posée
     * dans le flux n'a pas à en porter — elle se délimite par son filet.
     *
     * La valeur précédente, 0 4px 12px à 12 %, donnait aux pages un relief
     * de tableau de bord logiciel. Le registre visé est celui d'un
     * document administratif : les plans se distinguent par le trait, pas
     * par la profondeur.
     */
    --shadow-lg: 0 2px 6px rgba(15, 23, 42, 0.07);

    /* ══════════════════════════════════════════════════════════════
       Deux rôles de contraste, ajoutés le 1er septembre 2026.

       L'audit a montré que le contour des commandes était posé à
       --slate-300 (#CECECE), soit 1,57:1 sur blanc. La règle WCAG 1.4.11
       demande 3:1 pour le contour d'un composant interactif : un bouton
       dont on ne distingue pas le bord n'est pas perçu comme un bouton.
       Les petits textes secondaires étaient à --slate-500 (#666), soit
       5,74:1 — conforme, mais pâle à 11 px.

       Ces deux jetons sont des RÔLES, pas des teintes, dans l'esprit de
       --trait et --fond-page ci-dessus. Si le contraste doit être repris
       un jour, il y a DEUX valeurs à changer, pas deux cents règles.

       Ne pas confondre --trait-commande avec --trait : le premier cerne
       ce qui se clique ou se saisit, le second sépare visuellement deux
       zones. Une bordure décorative n'a pas de seuil à respecter, et la
       noircir donnerait aux tableaux une allure de grille de tableur.
       ══════════════════════════════════════════════════════════════ */
    --trait-commande: #929292;   /* 3,11:1  — contour de ce qui se clique */
    --texte-second:   #3A3A3A;   /* 11,37:1 — petits textes secondaires  */
    --texte-faible:   #666666;   /* 5,74:1  — le plus clair admis pour du texte */

    /* --texte-faible est une LIMITE, pas une nuance parmi d'autres :
       rien de plus clair ne doit porter du texte. #929292 (3,11:1) et
       #CECECE (1,57:1) servaient d'encre à 44 endroits — pour des
       libellés de colonne, des états vides, des dates. Ils restent
       parfaits pour un trait ou une puce ; ils ne conviennent pas à un
       mot qu'on doit lire. */

    /* Anneau de focus : obligatoire, et il se voit */
    --ring: 0 0 0 2px #FFFFFF, 0 0 0 4px #0A76F6;
}