/* =============================================================================
   ORIZON Insight — COUCHE DE TOKENS (candidate, en évaluation)
   -----------------------------------------------------------------------------
   Architecture à 3 niveaux, inspirée du skill open-source « design-system »
   (Apache-2.0), adaptée à NOTRE stack (CSS custom properties, pas Tailwind) et
   à la marque AFG/ORIZON :

        PRIMITIVE  (valeurs brutes)   ->  --p-*
        SEMANTIC   (rôles)            ->  --c-*     (dérive du thème)
        COMPONENT  (par composant)    ->  --card-*, --feu-*, --input-*, --btn-*

   Objectif : UNE source unique de vérité pour les couleurs/thèmes. Change une
   primitive -> toute l'app se re-thème. Les deux thèmes dérivent de la MÊME
   couche sémantique (le sombre ne redéfinit que ce qui change).

   ⚠️  Ce fichier N'EST PAS ENCORE IMPORTÉ par l'app -> aucun effet tant qu'il
       n'est pas branché (base.html/login.html). Rollback = supprimer ce fichier.
   ============================================================================= */

/* ---------- 1. PRIMITIVES (valeurs brutes — jamais utilisées en composant) ---------- */
:root{
  --p-green-100:#c9e8d3; --p-green-300:#5cbd7e; --p-green-500:#00a800;
  --p-green-600:#00873d; --p-green-700:#046a38; --p-green-900:#0c3320;
  --p-red-100:#fbe0e0;   --p-red-500:#d80000;   --p-red-600:#b00000;
  --p-amber-100:#fdecd0; --p-amber-500:#e08a00; --p-amber-600:#c47400;
  --p-gold-500:#e0a800;

  --p-neutral-0:#ffffff; --p-neutral-50:#f5f7f3; --p-neutral-100:#eef1ec;
  --p-neutral-200:#e2e8dd; --p-neutral-300:#c3cede; --p-neutral-500:#7a877f;
  --p-neutral-700:#3a463c; --p-ink-900:#14201a;
  --p-navy-800:#161d17; --p-navy-850:#131a14; --p-navy-900:#0e130f;

  --p-radius-sm:8px; --p-radius-md:12px; --p-radius-lg:16px;
  --p-space-1:4px; --p-space-2:8px; --p-space-3:12px; --p-space-4:16px; --p-space-6:24px;
  --p-shadow-1:0 1px 2px rgba(20,40,20,.05), 0 6px 20px rgba(20,50,20,.06);
  --p-shadow-2:0 1px 2px rgba(0,0,0,.45),   0 8px 26px rgba(0,0,0,.45);
}

/* ---------- 2. SEMANTIC — thème CLAIR (défaut) ---------- */
:root,
:root[data-theme="light"]{
  --c-bg:var(--p-neutral-50);
  --c-surface:var(--p-neutral-0);
  --c-surface-2:var(--p-neutral-100);
  --c-text:var(--p-ink-900);
  --c-text-soft:var(--p-neutral-500);
  --c-border:var(--p-neutral-300);
  /* Accent = couleur de MARQUE injectée (white-label) ; REPLI = CHARTE L'Africaine des
     Assurances (§1.04) : vert Pantone 361 C #33B04A, jaune Pantone 394 C #EDE947. */
  --c-accent:rgb(var(--brand-rgb, 51,176,74));
  --c-accent-bright:rgb(var(--brand-rgb, 51,176,74));
  --c-gold:rgb(var(--gold-rgb, 237,233,71));
  --c-positive:#15a34a;               --c-positive-bg:rgba(21,163,74,.12);
  --c-warning:var(--p-amber-500);     --c-warning-fg:var(--p-amber-600); --c-warning-bg:rgba(224,138,0,.14);
  --c-critical:var(--p-red-500);      --c-critical-bg:rgba(216,0,0,.11);
  --c-shadow:var(--p-shadow-1);
  --c-focus:rgba(51,176,74,.22);
}

/* ---------- 2b. SEMANTIC — thème SOMBRE (on ne redéfinit QUE ce qui change) ---------- */
:root[data-theme="dark"]{
  --c-bg:var(--p-navy-900);
  --c-surface:var(--p-navy-800);
  --c-surface-2:var(--p-navy-850);
  --c-text:#eaf1e8;
  --c-text-soft:#9db09c;
  --c-border:#2b3a2c;
  /* Repli sombre = même vert de charte (lisible sur fond sombre). */
  --c-accent:rgb(var(--brand-rgb, 51,176,74));
  --c-accent-bright:rgb(var(--brand-rgb, 51,176,74));
  --c-positive:#3ad06a;               --c-positive-bg:rgba(34,197,94,.16);
  --c-warning:#ffab2e;                --c-warning-fg:#ffab2e; --c-warning-bg:rgba(240,158,20,.16);
  --c-critical:#ff5a5a;               --c-critical-bg:rgba(248,64,64,.15);
  --c-shadow:var(--p-shadow-2);
  --c-focus:rgba(51,176,74,.28);
}

/* ---------- 3. COMPONENT (référencent le sémantique -> s'adaptent seuls au thème) ---------- */
:root{
  /* Cartes / panneaux */
  --card-bg:var(--c-surface); --card-border:var(--c-border);
  --card-radius:var(--p-radius-lg); --card-shadow:var(--c-shadow);
  /* Champs de saisie */
  --input-bg:var(--c-surface); --input-border:var(--c-border);
  --input-focus:var(--c-accent); --input-focus-ring:var(--c-focus);
  /* Boutons */
  --btn-primary-bg:var(--c-accent); --btn-primary-fg:#ffffff;
  /* Feux tricolores (évaluation) */
  --feu-ok-bg:var(--c-positive-bg);  --feu-ok-fg:var(--c-positive);
  --feu-warn-bg:var(--c-warning-bg); --feu-warn-fg:var(--c-warning-fg);
  --feu-bad-bg:var(--c-critical-bg); --feu-bad-fg:var(--c-critical);
  --feu-neutral-bg:rgba(128,128,128,.14); --feu-neutral-fg:var(--c-text-soft);
  /* Sources de données (pastilles) */
  --src-auto:var(--c-positive); --src-import:var(--c-accent-bright); --src-saisie:var(--c-warning);
  /* Rail lumineux (comète des cartes) */
  --rail-accent:var(--c-accent-bright); --rail-gold:var(--c-gold);
}