/* ----------------------------------
 * Theme du projet (valeurs primitives)
 * ----------------------------------
 */

/* Breakpoints (si custom Media Queries) */
@custom-media --sm (width >= 48rem); /* 768px */
@custom-media --until-sm (width < 48rem); /* 768px */
@custom-media --lg (width >= 64rem); /* 1024px */

:root {
  /* Breakpoints (en dur) */
  --breakpoint-md: 48rem; /* 768px */
  --breakpoint-lg: 64rem; /* 1024px */

  /* Espacements */
  --spacing-0: 0;
  --spacing-1: 1px;
  --spacing-2: 0.125rem;
  --spacing-4: 0.25rem;
  --spacing-8: 0.5rem;
  --spacing-12: 0.75rem;
  --spacing-16: 1rem;
  --spacing-20: 1.25rem;
  --spacing-24: 1.5rem;
  --spacing-32: 2rem;
  --spacing-40: 2.5rem;
  --spacing-48: 3rem;
  --spacing-56: 3.5rem;
  --spacing-64: 4rem;
  --spacing-80: 5rem;
  --spacing-128: 8rem;
  --spacing-160: 10rem;
  --spacing-180: 11.25rem;
  --spacing-260: 16.25rem;

  /* Typographie */
  --font-base: system-ui, sans-serif;
  --font-poppins: poppins, sans-serif;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --font-weight-black: 900;
  --text-14: 0.875rem;
  --text-16: 1rem;
  --text-18: 1.125rem;
  --text-20: 1.25rem;
  --text-24: 1.5rem;
  --text-30: 1.875rem;
  --text-36: 2.25rem;
  --text-48: 3rem;
  --text-60: 3.75rem;
  --text-80: 5rem;
  --leading-20: 1.25rem;
  --leading-24: 1.5rem;
  --leading-28: 1.75rem;
  --leading-32: 2rem;
  --leading-36: 2.25rem;
  --leading-40: 2.5rem;
  --leading-48: 3rem;
  --leading-56: 3.5rem;
  --leading-80: 5rem;
  --leading-100: 6.25rem;

  /* Border radius */
  --radius-none: 0;
  --radius-md: 0.25rem;
  --radius-lg: 0.5rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;

  /* Divers */
  --transition-duration: 0.25s;
  --z-under-page-level: -1;
  --z-above-page-level: 1;
  --z-header-level: 1000;
  --z-above-header-level: 2000;
  --z-above-all-level: 3000;

  /* Couleurs (globales) */
  --color-gray-50: oklch(97% 0 0);
  --color-gray-100: oklch(92.2% 0 0);
  --color-gray-200: oklch(87% 0 0);
  --color-gray-300: oklch(70.8% 0 0);
  --color-gray-400: oklch(55.6% 0 0);
  --color-gray-500: oklch(43.9% 0 0);
  --color-gray-600: oklch(37.1% 0 0);
  --color-gray-700: oklch(26.9% 0 0);
  --color-gray-800: oklch(20.5% 0 0);
  --color-gray-900: oklch(14.5% 0 0);
  --color-white: oklch(100% 0 0);
  --color-black: oklch(0% 0 0);
  --color-red-100: oklch(97% 0.1 27.52);
  --color-red-300: oklch(70.54% 0.19 27.52);
  --color-red-500: oklch(50.54% 0.19 27.52);
  --color-red-700: oklch(35.54% 0.19 27.52);
  --color-red-900: oklch(20.54% 0.11 27.52);
  --color-green-100: oklch(97% 0.06 150.73);
  --color-green-300: oklch(71.66% 0.13 150.73);
  --color-green-500: oklch(51.66% 0.13 150.73);
  --color-green-700: oklch(36.66% 0.13 150.73);
  --color-green-900: oklch(21.66% 0.13 150.73);
  --color-orange-100: oklch(97% 0.08 49.95);
  --color-orange-300: oklch(83.15% 0.17 49.95);
  --color-orange-500: oklch(63.15% 0.17 49.95);
  --color-orange-700: oklch(48.15% 0.17 49.95);
  --color-orange-900: oklch(33.15% 0.11 49.95);
  --color-blue-100: oklch(97% 0.09 256.37);
  --color-blue-300: oklch(71.33% 0.18 256.37);
  --color-blue-500: oklch(51.33% 0.18 256.37);
  --color-blue-700: oklch(36.33% 0.18 256.37);
  --color-blue-900: oklch(21.33% 0.11 256.37);

  /* Couleurs (Theme) */

  /* Ici les palettes spécifiques au projet */
  --color-slate-50: oklch(100% 0.01 257.32);
  --color-slate-100: oklch(98% 0.01 257.32);
  --color-slate-200: oklch(94.5% 0.02 257.32);
  --color-slate-300: oklch(84.5% 0.04 257.32);
  --color-slate-400: oklch(74.5% 0.04 257.32);
  --color-slate-500: oklch(64.5% 0.04 257.32);
  --color-slate-600: oklch(54.5% 0.04 257.32);
  --color-slate-700: oklch(44.5% 0.04 257.32);
  --color-slate-800: oklch(37.1668% 0.0392 257.32);
  --color-slate-900: oklch(24.5% 0.02 257.32);
  --color-slate-fade: oklch(37.17% 0.02 257.32);
  --color-slate-bright: oklch(37.17% 0.05 257.32);
}
