/* ============================================
   TOKENS DESIGN - Nos Recettes V3
   Palette orange + blanc, gris chauds
   ============================================ */

:root {
  /* === PRIMAIRE - Orange === */
  --orange-50:  #FFF7ED;
  --orange-100: #FFEDD5;
  --orange-200: #FED7AA;
  --orange-300: #FDBA74;
  --orange-400: #FB923C;
  --orange-500: #F97316;
  --orange-600: #EA580C;
  --orange-700: #C2410C;
  --orange-800: #9A3412;
  --orange-900: #7C2D12;

  /* === BLANC & GRIS CHAUDS === */
  --white:    #FFFFFF;
  --gray-50:  #FAFAF9;
  --gray-100: #F5F5F4;
  --gray-200: #E7E5E4;
  --gray-300: #D6D3D1;
  --gray-400: #A8A29E;
  --gray-500: #78716C;
  --gray-600: #57534E;
  --gray-700: #44403C;
  --gray-800: #292524;
  --gray-900: #1C1917;

  /* === SEMANTIQUES === */
  --success: #22C55E;
  --error:   #EF4444;
  --warning: #F59E0B;
  --info:    #3B82F6;

  /* === THEME CLAIR (defaut) === */
  --bg-page:        var(--gray-50);
  --bg-card:        var(--white);
  --bg-header:      var(--white);
  --text-primary:   var(--gray-900);
  --text-secondary: var(--gray-500);
  --border:         var(--gray-200);
  --accent:         var(--orange-500);
  --accent-hover:   var(--orange-600);
  --accent-light:   var(--orange-50);
  --accent-text:    var(--white);

  /* === TYPOGRAPHIE === */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;
  --text-4xl:  2.25rem;

  --leading-tight:   1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.75;

  --font-normal:   400;
  --font-medium:   500;
  --font-semibold: 600;
  --font-bold:     700;

  /* === ESPACEMENT (echelle 4px) === */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* === RAYONS === */
  --radius-sm:   0.375rem;
  --radius-md:   0.5rem;
  --radius-lg:   0.75rem;
  --radius-xl:   1rem;
  --radius-full: 9999px;

  /* === OMBRES === */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0,0,0,0.1);

  /* === TRANSITIONS === */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 350ms ease;

  /* === TOAST === */
  --toast-duration: 4000ms;
}

/* === THEME SOMBRE === */
[data-theme="dark"] {
  --bg-page:        #1A1A1A;
  --bg-card:        #2A2A2A;
  --bg-header:      #222222;
  --text-primary:   #F5F5F4;
  --text-secondary: #A8A29E;
  --border:         #3D3D3D;
  --accent:         var(--orange-400);
  --accent-hover:   var(--orange-300);
  --accent-light:   rgba(249, 115, 22, 0.15);
  --accent-text:    var(--gray-900);
}
