/*
 * SIRH O2 — Design Tokens
 * Inspiré de Lucca Prisme (https://prisme.lucca.io)
 *
 * Palette retenue :
 * - Primaire : Indigo (#4338CA → #6366F1) — couleur principale de Lucca Prisme,
 *   sobre, professionnel, lisible sur fond blanc.
 * - Accentuation secondaire : Menthe (#0D9488) — contraste doux, utilisé pour
 *   les badges "succès" et les actions secondaires.
 * - Danger : Rouge (#DC2626) — alerte, suppression.
 * - Warning : Ambre (#D97706) — avertissement.
 * - Neutres : Gris slate froid, cohérents avec Prisme.
 * - Typo : Inter (Google Fonts) — police officielle Lucca Prisme.
 */

:root {
  /* ------------------------------------------------------------------ */
  /* COULEURS PRIMAIRES (Indigo — tons Lucca Prisme)                     */
  /* ------------------------------------------------------------------ */
  --color-primary-50:  #EEF2FF;
  --color-primary-100: #E0E7FF;
  --color-primary-200: #C7D2FE;
  --color-primary-300: #A5B4FC;
  --color-primary-400: #818CF8;
  --color-primary-500: #6366F1; /* couleur principale */
  --color-primary-600: #4F46E5; /* hover / actif */
  --color-primary-700: #4338CA;
  --color-primary-800: #3730A3;
  --color-primary-900: #312E81;

  /* ------------------------------------------------------------------ */
  /* COULEURS SÉMANTIQUES                                                */
  /* ------------------------------------------------------------------ */
  --color-success-50:  #F0FDFA;
  --color-success-100: #CCFBF1;
  --color-success-500: #0D9488; /* menthe — validation */
  --color-success-600: #0F766E;

  --color-warning-50:  #FFFBEB;
  --color-warning-100: #FEF3C7;
  --color-warning-500: #D97706; /* ambre — avertissement */
  --color-warning-600: #B45309;

  --color-danger-50:   #FEF2F2;
  --color-danger-100:  #FEE2E2;
  --color-danger-500:  #DC2626; /* rouge — erreur / suppression */
  --color-danger-600:  #B91C1C;

  --color-info-50:     #EFF6FF;
  --color-info-100:    #DBEAFE;
  --color-info-500:    #3B82F6; /* bleu info */
  --color-info-600:    #2563EB;

  /* ------------------------------------------------------------------ */
  /* NEUTRES (Gris Slate)                                                */
  /* ------------------------------------------------------------------ */
  --color-neutral-0:   #FFFFFF;
  --color-neutral-50:  #F8FAFC;
  --color-neutral-100: #F1F5F9;
  --color-neutral-200: #E2E8F0;
  --color-neutral-300: #CBD5E1;
  --color-neutral-400: #94A3B8;
  --color-neutral-500: #64748B;
  --color-neutral-600: #475569;
  --color-neutral-700: #334155;
  --color-neutral-800: #1E293B;
  --color-neutral-900: #0F172A;

  /* ------------------------------------------------------------------ */
  /* TYPOGRAPHIE                                                          */
  /* ------------------------------------------------------------------ */
  --font-family-base: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-family-mono: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

  --font-size-xs:   0.75rem;   /* 12px */
  --font-size-sm:   0.875rem;  /* 14px */
  --font-size-base: 1rem;      /* 16px */
  --font-size-lg:   1.125rem;  /* 18px */
  --font-size-xl:   1.25rem;   /* 20px */
  --font-size-2xl:  1.5rem;    /* 24px */
  --font-size-3xl:  1.875rem;  /* 30px */

  --font-weight-normal:   400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;

  --line-height-tight:  1.2;
  --line-height-snug:   1.375;
  --line-height-base:   1.5;
  --line-height-relaxed:1.625;

  --letter-spacing-tight: -0.01em;
  --letter-spacing-normal: 0;
  --letter-spacing-wide:   0.025em;
  --letter-spacing-wider:  0.05em;

  /* ------------------------------------------------------------------ */
  /* ESPACEMENT (échelle 4px base)                                       */
  /* ------------------------------------------------------------------ */
  --space-0:   0;
  --space-1:   0.25rem;   /* 4px */
  --space-2:   0.5rem;    /* 8px */
  --space-3:   0.75rem;   /* 12px */
  --space-4:   1rem;      /* 16px */
  --space-5:   1.25rem;   /* 20px */
  --space-6:   1.5rem;    /* 24px */
  --space-8:   2rem;      /* 32px */
  --space-10:  2.5rem;    /* 40px */
  --space-12:  3rem;      /* 48px */
  --space-16:  4rem;      /* 64px */

  /* ------------------------------------------------------------------ */
  /* BORDER RADIUS                                                        */
  /* ------------------------------------------------------------------ */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-full: 9999px;

  /* ------------------------------------------------------------------ */
  /* OMBRES                                                               */
  /* ------------------------------------------------------------------ */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.07), 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 4px 6px rgba(15, 23, 42, 0.07), 0 2px 4px rgba(15, 23, 42, 0.04);
  --shadow-lg: 0 10px 15px rgba(15, 23, 42, 0.08), 0 4px 6px rgba(15, 23, 42, 0.04);
  --shadow-xl: 0 20px 25px rgba(15, 23, 42, 0.1), 0 8px 10px rgba(15, 23, 42, 0.04);

  /* ------------------------------------------------------------------ */
  /* TRANSITIONS                                                          */
  /* ------------------------------------------------------------------ */
  --transition-fast:   100ms ease;
  --transition-base:   150ms ease;
  --transition-slow:   250ms ease;

  /* ------------------------------------------------------------------ */
  /* LAYOUT                                                               */
  /* ------------------------------------------------------------------ */
  --sidebar-width:       240px;
  --sidebar-collapsed:   56px;
  --header-height:       56px;
  --content-max-width:   1280px;
  --content-padding:     var(--space-6);

  /* ------------------------------------------------------------------ */
  /* Z-INDEX                                                              */
  /* ------------------------------------------------------------------ */
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-overlay:   300;
  --z-modal:     400;
  --z-toast:     500;
}
