/* couleurs.css — source unique des couleurs du projet.
   À charger AVANT tout autre CSS, dans templates/base.html ET templates/admin/base.html.

   Convention de nommage
     --<role>[-<variante>][-<intensite>]
     intensite : rien = référence, -doux = plus clair, -fort = plus foncé.
   Règles
     1. aucun littéral (#hex, rgb()) hors de ce fichier ;
     2. les composants n'emploient que la couche sémantique, jamais --gris-* ;
     3. une seule échelle de primitives, celle des neutres : c'est la seule
        famille réellement partagée entre plusieurs rôles. Ailleurs, la valeur
        est portée directement par le jeton d'intention — une primitive qui
        n'a qu'un consommateur ne mutualise rien et coûte un nom.
*/

:root {

/* ─── 1. Neutres ──────────────────────────────────────────────────────────
   La seule échelle. Jamais employée directement par un composant.         */

  --gris-0:   #ffffff;
  --gris-50:  #f8fafc;
  --gris-100: #f1f5f9;
  --gris-200: #e2e8f0;
  --gris-300: #cbd5e1;
  --gris-400: #94a3b8;
  --gris-500: #64748b;
  --gris-600: #475569;
  --gris-700: #334155;
  --gris-800: #1e293b;
  --gris-900: #0f172a;

/* ─── 2. Surfaces, texte, bordures ────────────────────────────────────────
   Deux niveaux de fond seulement. Les trois précédents — blanc, #f8fafc,
   #f1f5f9 — tenaient dans un écart ΔE de 4,4 : l'œil ne les séparait pas.
   --fond-contraste (ΔE 7,3) est le premier palier réellement visible.     */

  --carte:            var(--gris-0);
  --fond:             var(--gris-50);
  --fond-contraste:   var(--gris-200);
  --fond-sombre:      var(--gris-800);   /* barres d'outils des visionneuses */

  --texte:            var(--gris-800);
  --texte-doux:       var(--gris-500);
  --texte-tres-doux:  var(--gris-400);
  --texte-inverse:    var(--carte);      /* sur --fond-sombre ou --entete-fond */

  --bordure-doux:     var(--gris-200);
  --bordure:          var(--gris-300);
  --bordure-fort:     var(--gris-500);

/* ─── 3. Action et saisie ─────────────────────────────────────────────────
   --fond-focus passe de #eff6ff à #dbeafe : l'ancien était à ΔE 2,7 d'un
   gris neutre, le signal bleu ne se lisait pas.                           */

  --champs:           #2563eb;
  --champs-fort:      #1e40af;
  --fond-focus:       #dbeafe;
  --fond-focus-fort:  #bfdbfe;

/* ─── 4. États ────────────────────────────────────────────────────────────*/

  --erreur:            #dc2626;
  --erreur-fort:       #b91c1c;
  --fond-erreur:       #fca5a5;
  --fond-erreur-doux:  #fef2f2;

  --succes:            #009966;
  --succes-fort:       #1f6b41;
  --fond-succes:       #eaf6ef;
  --fond-succes-fort:  #ace6bf;
  --bordure-succes:    #c3e3d0;
  --survol-succes:     #dbeee3;

  --alerte:            #f0b429;
  --alerte-texte:      #7a4f01;
  --fond-alerte:       #fff8e1;
  --fond-alerte-fort:  #ffedb1;

  /* Une commission de secours n'est ni une alerte ni un état : c'est une catégorie.
     Elle partageait l'ambre avec « planning modifié », qui, lui, est bien un état — et
     les deux se croisent sur la même ligne, jeton contre liseré. D'où une teinte à part,
     prise au plus large creux de la roue, entre le bleu des champs et le rouge des
     erreurs : elle ne peut être confondue avec aucun des cinq signaux existants, ni
     avec le bleu que l'ancre pose par-dessus le temps de son repère. */
  --secours:           #a21caf;
  --secours-texte:     #701a75;
  --fond-secours:      #f5d0fe;

  --lien:              #d55b3e;   /* orange de marque */

/* ─── 5. Ombres, voiles, focus ────────────────────────────────────────────
   Trois élévations nommées par rôle : cinq niveaux numérotés pour huit
   usages invitaient à choisir un chiffre au hasard. Teinte = --gris-900,
   jamais du noir pur, qui vire au gris sale sur un fond bleuté. Les alphas
   restent littéraux : rgb() n'accepte pas un var() en bloc, et une
   indirection interne au bloc ne mutualiserait rien.                      */

  --ombre-posee:  0 1px 3px rgb(15 23 42 / .10);         /* cartes, champs au repos */
  --ombre-elevee: 0 1px 1px  0   rgb(15 23 42 / .3),   /* contact : arête nette      */
                  0 3px 8px  1px rgb(15 23 42 / .2),   /* halo proche : détache      */
                  0 10px 24px 4px rgb(15 23 42 / .1);  /* pénombre : donne la hauteur */



  --voile:      rgb(15 23 42 / .70);   /* overlays pleins */
  --voile-doux: rgb(15 23 42 / .25);   /* ::backdrop      */

  --focus:      rgb(37 99 235 / .20);  /* anneaux : l'épaisseur reste au point d'appel */
  --focus-fort: rgb(37 99 235 / .50);  /* outline et halo coloré au survol             */


/* ─── 6. Bandeau et menu ──────────────────────────────────────────────────*/

  --entete-fond:        #162a39;
  --entete-fond-2:      #224057;
  --entete-bordure:     #2f5677;
  --entete-texte:       var(--carte);
  --entete-texte-doux:  var(--gris-300);
  --entete-survol:      rgb(255 255 255 / .18);
  --entete-actif:       rgb(255 255 255 / .08);
  --menu-fond:          #132430;
  --menu-actif:         var(--succes);
  --menu-actif-2:       #006544;

  --rayon: 6px;

/* ─── 7. Admin Django ─────────────────────────────────────────────────────
   Noms IMPOSÉS par django/contrib/admin/static/admin/css/base.css : ne pas
   les renommer, ne pas les employer dans le CSS du projet. Ils ne servent
   qu'à reteinter l'admin, chargé par templates/admin/base.html — c'est
   pourquoi aucun script du projet ne les voit employés.                    */

  --primary:      #79aec8;
  --secondary:    #417690;
  --accent:       #f5dd5d;
  --body-bg:      var(--carte);
  --body-fg:      var(--texte);
  --body-quiet-color: var(--texte-doux);
  --button-fg:    var(--carte);
  --hairline-color: #e8e8e8;
  --border-color: #cccccc;
  --close-button-bg: #747474;
  --close-button-hover-bg: var(--texte);
  --font-family-monospace: ui-monospace, Menlo, Monaco, "Cascadia Mono",
      "Segoe UI Mono", "Roboto Mono", "Source Code Pro", "Fira Mono",
      "Courier New", monospace;

}
