/* P104 / P105 — variables de la charte d'interface Mon-Mandat : UN seul endroit pour les couleurs et mesures des
   écrans refaits. Source : docs/charte/charte-interface-mon-mandat.html (v1, déposée le 16/10/2026) ; les numéros
   renvoient à ses sections. Les gabarits Twig ne portent aucun code couleur : ils lisent ces variables.
   Jaune unique #FFCC00 avec texte bleu nuit #1C2A4B (jamais de texte blanc sur jaune) ; police Poppins partout. */
:root {
    /* 01 — couleurs primaires */
    --mm-bleu-nuit: #1C2A4B;
    --mm-jaune: #FFCC00;
    --mm-blanc: #FFFFFF;

    /* 01 — intentions (texte) et leurs fonds pâles (transparences de la même couleur) */
    --mm-danger: #C3352B;
    --mm-succes: #2E7D4F;
    --mm-avert: #B77708;
    --mm-info: #0B6E99;
    --mm-danger-fond: rgba(195, 53, 43, 0.10);
    --mm-succes-fond: rgba(46, 125, 79, 0.10);
    --mm-avert-fond: rgba(183, 119, 8, 0.12);
    --mm-info-fond: rgba(11, 110, 153, 0.08);

    /* 01 — neutres */
    --mm-texte: #1C2A4B;
    --mm-texte-secondaire: #5A6478;
    --mm-texte-attenue: #8A93A5;         /* texte atténué, placeholders, texte désactivé */
    --mm-bord: #E2E5EC;
    --mm-fond: #F6F7F9;                  /* fond de page derrière les cartes */

    /* 01 — accents ponctuels (badges et compteurs) ; le bleu vif sert aussi au lien « Mot de passe oublié ? »
       (spécifications, page de connexion validée le 15/10/2026) */
    --mm-rose: #E6007E;
    --mm-cyan: #009FE3;
    --mm-vert: #81A533;
    --mm-bleu-lien: var(--mm-cyan);

    /* 01 — états dérivés (aucune couleur nouvelle) */
    --mm-jaune-survol: color-mix(in srgb, #FFCC00 90%, #1C2A4B);
    --mm-jaune-presse: color-mix(in srgb, #FFCC00 75%, #1C2A4B);
    --mm-danger-survol: color-mix(in srgb, #C3352B 82%, #1C2A4B);
    --mm-survol-neutre: #F6F7F9;
    --mm-survol-nav: rgba(255, 255, 255, 0.14);
    --mm-focus: 2px solid #1C2A4B;       /* focus universel : contour 2px, décalage 2px ; jaune sur fond bleu nuit */
    --mm-focus-sur-sombre: 2px solid #FFCC00;

    /* 02 — typographie : une seule famille (400 corps, 500 libellés, 600 titres et boutons) */
    --mm-police: 'Poppins', sans-serif;

    /* 03, 04, 08, 11 — mesures : rayons, cotes des contrôles, ombres, échelle d'espacement */
    --mm-rayon-controle: 8px;            /* boutons, champs */
    --mm-rayon-carte: 12px;
    --mm-rayon-badge: 999px;
    --mm-hauteur-controle: 40px;         /* 44px sur mobile */
    --mm-hauteur-controle-mobile: 44px;
    --mm-ombre-carte: 0 1px 3px rgba(28, 42, 75, 0.10);
    --mm-ombre-carte-survol: 0 4px 16px rgba(28, 42, 75, 0.18);
    --mm-esp-4: 4px;
    --mm-esp-8: 8px;
    --mm-esp-12: 12px;
    --mm-esp-16: 16px;
    --mm-esp-24: 24px;
    --mm-esp-32: 32px;

    /* Maquette validée de la page de connexion (docs/projet/maquettes-validees/connexion-valide.html) : valeurs
       propres à cet écran, toutes des transparences de couleurs de la charte (bleu nuit, jaune, blanc, noir).
       Elles vivent ici pour qu'aucune feuille de page ne porte de couleur. */
    --mm-connexion-ombre-logo: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.35)) drop-shadow(0 18px 32px rgba(0, 0, 0, 0.30));
    --mm-connexion-filet-or: linear-gradient(90deg, rgba(255, 204, 0, 0.6), rgba(255, 204, 0, 0));
    --mm-connexion-ombre-carte: 0 1px 2px rgba(28, 42, 75, 0.06), 0 24px 48px -12px rgba(28, 42, 75, 0.18);
    --mm-connexion-ombre-bouton: 0 6px 18px rgba(255, 204, 0, 0.35);
    --mm-connexion-ombre-bouton-survol: 0 8px 22px rgba(255, 204, 0, 0.45);
    --mm-connexion-anneau-focus: 0 0 0 4px rgba(28, 42, 75, 0.07);
    --mm-connexion-texte-sur-sombre: rgba(255, 255, 255, 0.75);          /* liens légaux sur le volet bleu nuit */
    --mm-connexion-texte-sur-sombre-attenue: rgba(255, 255, 255, 0.5);   /* copyright */
}