/* ============================================================
   SAFE — Palette de couleur officielle
   Design tokens (échelles complètes) + alias historiques
   ============================================================ */

:root {
  /* ----- Brand : Bleu médical ----- */
  --brand-50:  #eef5ff;
  --brand-100: #d9e7ff;
  --brand-200: #b5cfff;
  --brand-300: #82adff;
  --brand-400: #4d87ff;
  --brand-500: #006aff;   /* couleur principale historique */
  --brand-600: #0056d6;
  --brand-700: #0044ad;
  --brand-800: #03104a;   /* dark-primary historique */
  --brand-900: #020a30;

  /* ----- Accent : Cyan / Teal (IA, tech, vitalité) ----- */
  --accent-50:  #ecfeff;
  --accent-100: #cffafe;
  --accent-200: #a5f3fc;
  --accent-300: #67e8f9;
  --accent-400: #22d3ee;
  --accent-500: #06b6d4;
  --accent-600: #0891b2;
  --accent-700: #0e7490;

  /* ----- Sémantique : Succès (vert santé) ----- */
  --success-50:  #ecfdf5;
  --success-100: #d1fae5;
  --success-300: #6ee7b7;
  --success-500: #10b981;
  --success-600: #059669;
  --success-700: #047857;

  /* ----- Sémantique : Warning (ambre) ----- */
  --warning-50:  #fffbeb;
  --warning-100: #fef3c7;
  --warning-300: #fcd34d;
  --warning-500: #f59e0b;
  --warning-600: #d97706;
  --warning-700: #b45309;

  /* ----- Sémantique : Danger (rouge) ----- */
  --danger-50:  #fef2f2;
  --danger-100: #fee2e2;
  --danger-300: #fca5a5;
  --danger-500: #ef4444;
  --danger-600: #dc2626;
  --danger-700: #b91c1c;

  /* ----- Sémantique : Info (cyan-bleu) ----- */
  --info-50:  #eff6ff;
  --info-100: #dbeafe;
  --info-500: #3b82f6;
  --info-600: #2563eb;
  --info-700: #1d4ed8;

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

  /* ----- Surfaces & textes sémantiques ----- */
  --surface-page:    var(--neutral-50);
  --surface-default: var(--neutral-0);
  --surface-raised:  var(--neutral-0);
  --surface-sunken:  var(--neutral-100);
  --surface-overlay: rgba(15, 23, 42, 0.6);

  --text-strong:  var(--neutral-900);
  --text-default: var(--neutral-700);
  --text-muted:   var(--neutral-500);
  --text-soft:    var(--neutral-400);
  --text-on-brand: var(--neutral-0);
  --text-on-dark:  #eef5ff;

  --border-subtle: var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-brand:   var(--brand-500);

  /* ----- Gradients officiels ----- */
  --gradient-brand: linear-gradient(135deg, var(--brand-500) 0%, var(--brand-700) 100%);
  --gradient-accent: linear-gradient(135deg, var(--accent-500) 0%, var(--brand-600) 100%);
  --gradient-hero:
    radial-gradient(circle at 15% 20%, rgba(34, 211, 238, 0.18), transparent 35%),
    radial-gradient(circle at 85% 80%, rgba(0, 106, 255, 0.22), transparent 40%),
    linear-gradient(180deg, var(--brand-700) 0%, var(--brand-800) 100%);
  --gradient-soft: linear-gradient(180deg, var(--brand-50) 0%, var(--neutral-0) 100%);

  /* ============================================================
     Alias historiques — NE PAS supprimer, utilisés partout
     ============================================================ */
  --color-primary:      var(--brand-500);
  --color-second:       rgba(0, 72, 179, 0.712);
  --color-dark-primary: var(--brand-800);
  --color-bg:           #bfcde8;
  --color-bg-alt:       var(--brand-50);
  --color-btn-bg:       rgba(131, 162, 206, 0.3);
}