/* theme.css — COLORS ONLY.
   Charte graphique « Ordre des Architectes du Centre » (voir CHARTE-GRAPHIQUE.md à la racine) :
   corail primaire, neutres sable/anthracite, lilas secondaire — plus les couleurs
   fonctionnelles (bleu info, ambre, rouge) que la charte ne définit pas.
   Tout le reste (structures d'app.css, helpers d'utils.css) référence ces variables : ce fichier
   est le seul endroit à toucher pour reteinter l'application.
   Les échelles gardent leurs anciens noms (--emerald-* pour le primaire, --slate-* pour les
   neutres) : elles sont référencées partout dans app.css, seules les valeurs changent. */

:root {
  /* Couleurs de la charte, sous leur nom d'origine (référence lisible). */
  --corail:       #E54D36;
  --noir-intense: #333333;
  --beige-sable:  #E8D9C5;
  --anthracite:   #222222;
  --lilas:        #B96EFF;

  /* Corail — primaire (échelle nommée --emerald-* pour compatibilité) */
  --emerald-50:  #FDEEEA;
  --emerald-200: #F7C6BB;
  --emerald-600: #E54D36;
  --emerald-700: #C43C28;

  /* Neutres sable → anthracite (échelle nommée --slate-* pour compatibilité) */
  --slate-10:  #FFFCFA;
  --slate-50:  #FAF7F3;
  --slate-100: #F3EDE4;
  --slate-200: #E4D8C8;
  --slate-300: #CDBEA9;
  --slate-400: #A2968A;
  --slate-500: #766B60;
  --slate-600: #574E46;
  --slate-700: #403A35;
  --slate-800: #333333;
  --slate-900: #222222;

  /* Lilas — secondaire (accents ponctuels : catégories, badges — jamais un bouton) */
  --lilac-50:  #F6ECFF;
  --lilac-500: #B96EFF;
  --lilac-600: #9A47E6;

  /* Bleu — info (fonctionnel, hors charte) */
  --blue-50:  #eff6ff;
  --blue-600: #2563eb;
  --blue-700: #1d4ed8;

  /* Ambre — accent (fonctionnel, hors charte) */
  --amber-50:  #fffbeb;
  --amber-600: #d97706;
  --amber-700: #b45309;

  /* Vert — succès (fonctionnel, hors charte) : le primaire étant devenu rouge-orangé,
     les états « validé / confirmé » gardent leur vert pour rester lisibles.
     `--green-600` est la valeur de marque ; `--green-700` en est la version foncée,
     utilisée dès que le vert porte du TEXTE sur fond clair (lisibilité). */
  --green-50:  #e8fbf3;
  --green-100: #c4f4e2;
  --green-600: #05c388;
  --green-700: #037a56;

  /* Rouge — danger ET sortie de caisse : un seul rouge dans l'app, pour que
     « Supprimer » et « Décaissement » parlent la même langue. Il reste bien
     séparé du corail primaire (plus vif, moins orangé). */
  --red-50:  #fdeae8;
  --red-400: #f28b81;
  --red-500: #f2402f;
  --red-600: #e91b0c;
  --red-700: #bd1509;

  --white: #fff;

  /* Rôles sémantiques (ce que l'interface demande réellement) */
  --bg:             var(--slate-10);
  --surface:        var(--white);
  --text:           var(--slate-800);
  --ink:            var(--slate-900);
  --muted:          var(--slate-500);
  --faint:          var(--slate-400);
  --line:           var(--slate-200);
  --line-soft:      var(--slate-100);
  --hover:          var(--slate-50);
  --primary:        var(--emerald-600);
  --primary-strong: var(--emerald-700);
  --primary-soft:   var(--emerald-50);
  --success:        var(--green-600);
  --success-strong: var(--green-700);
  --success-soft:   var(--green-50);
  --secondary:      var(--lilac-500);
  --secondary-soft: var(--lilac-50);

  /* Trésorerie — le SENS de l'écriture : vert ce qui entre, rouge ce qui sort.
     Le rouge est celui du danger (même geste visuel dans toute l'app) ; les
     variantes `-strong` servent aux survols et au texte sur fond clair. */
  --cash-in:         var(--success);
  --cash-in-strong:  var(--success-strong);
  --cash-out:        var(--red-600);
  --cash-out-strong: var(--red-700);

  /* Effets dépendant de la palette */
  --shadow-card:  0 1px 2px rgba(34, 34, 34, .06);
  --ring-primary: 0 0 0 3px rgba(229, 77, 54, .20);
}

/* Application de base (structure et typographie vivent dans app.css). */
body { background: var(--bg); color: var(--text); }

/* Écrans d'authentification — dégradé de facettes anthracite → corail → lilas de la charte.
   Tout se reteinte ici. */
:root {
  --auth-accent: #E54D36;
  --auth-accent-strong: #C43C28;
  --auth-grad-a: #222222;
  --auth-grad-b: #E54D36;
  --auth-grad-c: #B96EFF;
  --auth-glow-a: rgba(185, 110, 255, .55);
  --auth-glow-b: rgba(34, 34, 34, .95);
  --auth-glow-c: rgba(229, 77, 54, .70);
  --auth-shadow: rgba(229, 77, 54, .55);
}
