/* ==========================================================================
   Jetons de conception Sobria — source unique de vérité
   ==========================================================================
   Généré à la main, mais destiné à alimenter le CRM, les portails prospect et
   client, l'extension navigateur et les futures versions sous licence. Une
   seule définition : un changement de charte se fait ici, pas dans 167 classes.

   ── Ce que ce fichier corrige
   L'audit (docs/SOBRIA_EXPERIENCE_AUDIT.md) a mesuré quatre écarts sur quatre
   entre la palette du CRM et la charte de référence. Les valeurs ci-dessous
   sont celles de la CHARTE. Les anciennes variables restent définies plus bas,
   pointant vers les nouvelles : rien ne casse, tout converge.

   ── Ce que ce fichier NE décide PAS
   Le CRM est en thème sombre ; la charte décrit un thème clair. Basculer un
   outil utilisé quotidiennement par deux personnes n'est pas une décision
   technique (D-UI-1). Les deux thèmes sont donc définis, et **le sombre reste
   celui qui s'applique** tant que personne n'a tranché. Aucun pixel ne bouge
   aujourd'hui.
   ========================================================================== */

:root {
  /* ---------------------------------------------------------- marque */
  /* Les quatre couleurs de la charte, aux valeurs exactes. */
  --sobria-nuit:    #14213B;
  --sobria-cuivre:  #C3793A;
  --sobria-creme:   #F4F1E9;
  --sobria-ardoise: #373946;

  /* Teintes dérivées. Exprimées en couleurs opaques et non en opacités :
     une opacité empilée sur un fond variable donne un résultat imprévisible,
     et c'est ainsi qu'apparaissent les gris sales. */
  --nuit-4:   #1b2842;
  --nuit-6:   #1f2d49;
  --nuit-8:   #243350;
  --nuit-12:  #2d3d5d;
  --cuivre-4:  #c9855033;
  --cuivre-8:  #c9855066;
  --cuivre-12: #d0916099;
  --cuivre-15: #d59a6d;
  --ardoise-attenuee: #6b7285;
  --creme-claire: #faf8f3;
  --bordure-neutre: #2a3550;

  /* ------------------------------------------------------ fonctionnel */
  /* Sobres par construction : elles ne doivent jamais concurrencer la marque.
     Chacune est accompagnée d'un fond très atténué pour les bandeaux. */
  --succes:        #3f8f68;
  --succes-fond:   #16301f;
  --avertissement: #b8791f;
  --avertissement-fond: #33230a;
  --erreur:        #b8483a;
  --erreur-fond:   #33150f;
  --information:   #4a7fb5;
  --information-fond: #0f1e2e;

  /* ------------------------------------- statuts de donnée (métier) */
  /* Le CRM affiche en permanence des données de provenances inégales.
     Ces jetons rendent la distinction visible sans dépendre de la seule
     couleur : chaque statut a aussi un libellé, jamais une pastille seule. */
  --donnee-officielle:  #3f8f68;   /* source publique, correspondance exacte */
  --donnee-verifiee:    #4a7fb5;   /* confirmée par Sobria */
  --donnee-declaree:    #8a8f9c;   /* dite par le client, non vérifiée */
  --donnee-a-verifier:  #b8791f;
  --donnee-en-conflit:  #b8483a;
  --donnee-obsolete:    #6b7285;

  /* ---------------------------------------------------- typographie */
  --police-titre: "Lora", "PT Serif", Georgia, "Times New Roman", serif;
  --police-corps: "Inter", -apple-system, "Segoe UI", Arial, Helvetica, sans-serif;

  --taille-h1: 36px;
  --taille-h2: 28px;
  --taille-h3: 21px;
  --taille-corps: 16px;
  --taille-legende: 13px;
  /* Jamais en dessous de 16 px dans un champ : en dessous, les navigateurs
     mobiles zooment automatiquement à la saisie et l'écran se décale. */
  --taille-champ: 16px;

  --graisse-normale: 400;
  --graisse-moyenne: 500;
  --graisse-forte: 600;
  --graisse-titre: 700;

  --interligne-serre: 1.25;
  --interligne-corps: 1.55;

  /* -------------------------------------------------------- espaces */
  --espace-1: 4px;
  --espace-2: 8px;
  --espace-3: 12px;
  --espace-4: 16px;
  --espace-6: 24px;
  --espace-8: 32px;
  --espace-12: 48px;
  --espace-16: 64px;
  --espace-24: 96px;

  /* --------------------------------------------------------- rayons */
  --rayon-badge: 4px;
  --rayon-champ: 8px;
  --rayon-carte: 12px;
  --rayon-rond: 999px;

  /* -------------------------------------------------------- ombres */
  /* Deux niveaux au repos, deux au survol. Empiler des ombres fortes donne
     un effet de carton découpé, pas de profondeur. */
  --ombre-1: 0 1px 2px rgba(20, 33, 59, .06);
  --ombre-2: 0 2px 8px rgba(20, 33, 59, .08);
  --ombre-survol-1: 0 4px 12px rgba(20, 33, 59, .14);
  --ombre-survol-2: 0 8px 24px rgba(20, 33, 59, .16);

  /* ------------------------------------------------------ élévation */
  --z-contenu: 1;
  --z-entete: 10;
  --z-panneau: 50;
  --z-modale: 100;
  --z-notification: 200;
  --z-evitement: 300;   /* le lien d'évitement passe devant tout */

  /* ------------------------------------------------------ mouvement */
  --duree-instant: 100ms;
  --duree-courte: 150ms;
  --duree-moyenne: 200ms;
  --courbe: cubic-bezier(.2, 0, .2, 1);
  --deplacement-bouton: -1px;
  --deplacement-carte: -2px;

  /* ---------------------------------------------------------- focus */
  --focus-anneau: 3px;
  --focus-couleur: var(--sobria-cuivre);
  --focus-decalage: 2px;

  /* ------------------------------------------------------- largeurs */
  --largeur-texte: 68ch;      /* au-delà, l'œil perd la ligne */
  --largeur-contenu: 1280px;
  --largeur-formulaire: 560px;
  --largeur-panneau: 420px;

  /* --------------------------------------------------- points de bascule */
  --bascule-mobile: 640px;
  --bascule-tablette: 900px;
  --bascule-bureau: 1200px;

  /* ------------------------------------------------------- tactile */
  /* 44 px est le minimum au-delà duquel une cible devient difficile à
     atteindre au doigt. Ce n'est pas une préférence esthétique. */
  --cible-tactile: 44px;
  --hauteur-bouton: 44px;
  --hauteur-bouton-large: 52px;
  --hauteur-bouton-compact: 34px;

  /* ------------------------------------------------------- densités */
  --densite-confortable: 1;
  --densite-compacte: .85;

  /* ------------------------------------------------------ graphiques */
  /* Série principale bleu nuit, UNE seule série d'accent cuivre, axes
     ardoise. Aucune 3D, aucun dégradé. */
  --graphe-1: #2d4a7c;
  --graphe-2: #C3793A;
  --graphe-3: #4a7fb5;
  --graphe-4: #6b7285;
  --graphe-5: #3f8f68;
  --graphe-axe: #6b7285;
  --graphe-grille: #2a3550;
}

/* ==========================================================================
   Thèmes
   ==========================================================================
   Le thème sombre est celui du CRM aujourd'hui : il reste appliqué par défaut.
   Le thème clair suit la charte (55-60 % de surfaces claires). Il s'active en
   posant `data-theme="clair"` sur <html> — donc jamais par accident.
   ========================================================================== */

:root,
:root[data-theme="sombre"] {
  --fond-page:      var(--sobria-nuit);
  --fond-surface:   var(--nuit-4);
  --fond-surface-2: var(--nuit-6);
  --fond-survol:    var(--nuit-8);
  --texte:          var(--sobria-creme);
  --texte-attenue:  var(--ardoise-attenuee);
  --bordure:        var(--bordure-neutre);
  --lien:           var(--cuivre-15);
}

:root[data-theme="clair"] {
  --fond-page:      var(--sobria-creme);
  --fond-surface:   #ffffff;
  --fond-surface-2: var(--creme-claire);
  --fond-survol:    #efeade;
  --texte:          var(--sobria-nuit);
  --texte-attenue:  var(--sobria-ardoise);
  --bordure:        #ded7c8;
  --lien:           #a05f27;   /* cuivre assombri : contraste suffisant sur crème */
}

/* Le réglage système sert de préférence par défaut UNIQUEMENT si personne n'a
   choisi. Un choix explicite (data-theme) l'emporte toujours. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    /* Volontairement vide tant que D-UI-1 n'est pas tranchée : le CRM reste
       sombre pour tout le monde. Décommenter ce bloc bascule les postes qui
       demandent le thème clair au niveau du système. */
  }
}

/* ==========================================================================
   Compatibilité avec l'existant
   ==========================================================================
   `style.css` utilise --nuit, --cuivre, --creme, --ardoise depuis l'origine.
   Les redéfinir ici les fait converger vers la charte sans toucher aux 167
   classes qui les consomment. C'est le seul changement visible de ce lot, et
   il est de l'ordre de quelques points de teinte.
   ========================================================================== */

:root {
  --nuit: var(--sobria-nuit);
  --nuit-2: var(--nuit-6);
  --nuit-3: var(--nuit-12);
  --cuivre: var(--sobria-cuivre);
  --cuivre-clair: var(--cuivre-15);
  --creme: var(--sobria-creme);
  --ardoise: var(--ardoise-attenuee);
  --ok: var(--succes);
  --warn: var(--avertissement);
  --danger: var(--erreur);
  --radius: var(--rayon-champ);
  --font-body: var(--police-corps);
  --font-head: var(--police-titre);
}