/* ============================================================
   RoboSelect360 — variables.css
   Palette centralisée — thème clair
   À charger EN PREMIER avant tous les autres CSS
   ============================================================ */

:root {

  /* ── Fonds ── */
  --bg:              #f9f8f6;   /* Fond page principal — crème Claude */
  --bg-surface:      #ffffff;   /* Cartes, modales, panneaux */
  --bg-surface2:     #f3f2ef;   /* Surface secondaire, hover */
  --bg-header:       #1a1a2e;   /* Header navigation */

  /* ── Couleurs d'accent ── */
  --indigo:          #4338ca;   /* CTA principal, liens actifs */
  --indigo-hover:    #3730a3;   /* Hover indigo */
  --indigo-light:    #ede9fe;   /* Fond badge indigo */
  --or:              #c8a96e;   /* CTA secondaire, logo Select */
  --or-hover:        #b8966a;   /* Hover or */
  --or-light:        #fdf6e3;   /* Fond badge or */

  /* ── Textes ── */
  --text:            #1a1a2e;   /* Texte principal — marine */
  --text-secondary:  #374151;   /* Texte courant */
  --text-muted:      #6b7280;   /* Texte discret */
  --text-hint:       #9ca3af;   /* Placeholder, labels */
  --text-on-dark:    #f8fafc;   /* Texte sur fond sombre */
  --text-on-indigo:  #ffffff;   /* Texte sur bouton indigo */

  /* ── Bordures ── */
  --border:          #e5e7eb;   /* Bordure standard */
  --border-strong:   #d1d5db;   /* Bordure accentuée */
  --border-indigo:   rgba(67,56,202,0.25); /* Bordure accent indigo */

  /* ── Statuts sémantiques ── */
  --success:         #15803d;
  --success-bg:      #f0fdf4;
  --warning:         #d97706;
  --warning-bg:      #fffbeb;
  --danger:          #dc2626;
  --danger-bg:       #fef2f2;
  --info:            #4338ca;
  --info-bg:         #ede9fe;

  /* ── Score de viabilité ── */
  --score-vert:      #15803d;
  --score-jaune:     #d97706;
  --score-rouge:     #dc2626;

  /* ── Typographie ── */
  --font-sans:       'Inter', 'Segoe UI', Roboto, Arial, sans-serif;
  --font-display:    'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
  --font-mono:       'Space Mono', monospace;

  /* ── Espacements ── */
  --radius-sm:       6px;
  --radius-md:       10px;
  --radius-lg:       14px;
  --radius-xl:       20px;

  /* ── Ombres légères ── */
  --shadow-sm:       0 1px 3px rgba(0,0,0,0.06);
  --shadow-md:       0 4px 12px rgba(0,0,0,0.08);

  /* ── Header ── */
  --header-height:   68px;
}
