/*
 * Design tokens extraites de code_proto_figma/src/styles/theme.css
 * et code_proto_figma/default_shadcn_theme.css (source Figma Make / shadcn "New York").
 * Ne pas redéfinir de valeurs en dur ailleurs : toujours passer par ces variables.
 */

:root {
  /* Base */
  --font-size: 16px;

  /* Couleurs - light theme (valeurs Figma copiées telles quelles, hex ou oklch) */
  --color-background: #ffffff;
  --color-foreground: oklch(0.145 0 0);
  --color-card: #ffffff;
  --color-card-foreground: oklch(0.145 0 0);
  --color-popover: oklch(1 0 0);
  --color-popover-foreground: oklch(0.145 0 0);
  --color-primary: #030213;
  --color-primary-foreground: oklch(1 0 0);
  --color-secondary: oklch(0.95 0.0058 264.53);
  --color-secondary-foreground: #030213;
  --color-muted: #ececf0;
  --color-muted-foreground: #717182;
  --color-accent: #e9ebef;
  --color-accent-foreground: #030213;
  --color-destructive: #d4183d;
  --color-destructive-foreground: #ffffff;
  --color-border: rgba(0, 0, 0, 0.1);
  --color-input: transparent;
  --color-input-background: #f3f3f5;
  --color-switch-background: #cbced4;
  --color-ring: oklch(0.708 0 0);

  --color-chart-1: oklch(0.646 0.222 41.116);
  --color-chart-2: oklch(0.6 0.118 184.704);
  --color-chart-3: oklch(0.398 0.07 227.392);
  --color-chart-4: oklch(0.828 0.189 84.429);
  --color-chart-5: oklch(0.769 0.188 70.08);

  --color-sidebar: oklch(0.985 0 0);
  --color-sidebar-foreground: oklch(0.145 0 0);
  --color-sidebar-primary: #030213;
  --color-sidebar-primary-foreground: oklch(0.985 0 0);
  --color-sidebar-accent: oklch(0.97 0 0);
  --color-sidebar-accent-foreground: oklch(0.205 0 0);
  --color-sidebar-border: oklch(0.922 0 0);
  --color-sidebar-ring: oklch(0.708 0 0);

  /* Typographie */
  --font-weight-normal: 400;
  --font-weight-medium: 500;

  --text-xs: 0.75rem;    /* 12px */
  --text-xs--line-height: 1rem;
  --text-sm: 0.875rem;   /* 14px */
  --text-sm--line-height: 1.25rem;
  --text-base: 1rem;     /* 16px */
  --text-base--line-height: 1.5rem;
  --text-lg: 1.125rem;   /* 18px */
  --text-lg--line-height: 1.75rem;
  --text-xl: 1.25rem;    /* 20px */
  --text-xl--line-height: 1.75rem;
  --text-2xl: 1.5rem;    /* 24px */
  --text-2xl--line-height: 2rem;
  --text-3xl: 1.875rem;  /* 30px */
  --text-3xl--line-height: 2.25rem;
  --text-4xl: 2.25rem;   /* 36px */
  --text-4xl--line-height: 2.5rem;

  /* Rayons - dérivés de --radius comme dans le thème shadcn d'origine */
  --radius: 0.625rem;               /* 10px */
  --radius-sm: calc(var(--radius) - 4px); /* 6px */
  --radius-md: calc(var(--radius) - 2px); /* 8px */
  --radius-lg: var(--radius);             /* 10px */
  --radius-xl: calc(var(--radius) + 4px); /* 14px */
  --radius-full: 9999px;

  /* Espacements - échelle Tailwind (--spacing = 0.25rem), uniquement les paliers
     effectivement utilisés dans la maquette Figma */
  --space-0-5: 0.125rem; /* 2px */
  --space-1: 0.25rem;    /* 4px */
  --space-1-5: 0.375rem; /* 6px */
  --space-2: 0.5rem;     /* 8px */
  --space-2-5: 0.625rem; /* 10px */
  --space-3: 0.75rem;    /* 12px */
  --space-4: 1rem;       /* 16px */
  --space-5: 1.25rem;    /* 20px */
  --space-6: 1.5rem;     /* 24px */
  --space-8: 2rem;       /* 32px */
  --space-9: 2.25rem;    /* 36px */
  --space-10: 2.5rem;    /* 40px */
  --space-20: 5rem;      /* 80px */

  /* Ombres - échelle Tailwind par défaut, utilisée telle quelle par les composants shadcn */
  --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);

  /* Breakpoints - documentés ici pour rester la source unique de vérité,
     consommés en dur dans layout.css (les media queries CSS ne peuvent pas lire de var()) */
  --breakpoint-mobile: 375px;
  --breakpoint-tablet: 768px;
  --breakpoint-desktop: 1440px;
}

/* Thème sombre - repris tel quel de theme.css, activé via [data-theme="dark"] sur <html> */
[data-theme="dark"] {
  --color-background: oklch(0.145 0 0);
  --color-foreground: oklch(0.985 0 0);
  --color-card: oklch(0.145 0 0);
  --color-card-foreground: oklch(0.985 0 0);
  --color-popover: oklch(0.145 0 0);
  --color-popover-foreground: oklch(0.985 0 0);
  --color-primary: oklch(0.985 0 0);
  --color-primary-foreground: oklch(0.205 0 0);
  --color-secondary: oklch(0.269 0 0);
  --color-secondary-foreground: oklch(0.985 0 0);
  --color-muted: oklch(0.269 0 0);
  --color-muted-foreground: oklch(0.708 0 0);
  --color-accent: oklch(0.269 0 0);
  --color-accent-foreground: oklch(0.985 0 0);
  --color-destructive: oklch(0.396 0.141 25.723);
  --color-destructive-foreground: oklch(0.637 0.237 25.331);
  --color-border: oklch(0.269 0 0);
  --color-input: oklch(0.269 0 0);
  --color-ring: oklch(0.439 0 0);

  --color-chart-1: oklch(0.488 0.243 264.376);
  --color-chart-2: oklch(0.696 0.17 162.48);
  --color-chart-3: oklch(0.769 0.188 70.08);
  --color-chart-4: oklch(0.627 0.265 303.9);
  --color-chart-5: oklch(0.645 0.246 16.439);

  --color-sidebar: oklch(0.205 0 0);
  --color-sidebar-foreground: oklch(0.985 0 0);
  --color-sidebar-primary: oklch(0.488 0.243 264.376);
  --color-sidebar-primary-foreground: oklch(0.985 0 0);
  --color-sidebar-accent: oklch(0.269 0 0);
  --color-sidebar-accent-foreground: oklch(0.985 0 0);
  --color-sidebar-border: oklch(0.269 0 0);
  --color-sidebar-ring: oklch(0.439 0 0);
}