/*
 * Equus Design System — tokens (couleurs, typographie, espacement, effets).
 * Adapté du design system fourni (Claude Design) pour l'application EVA.
 * Ce fichier ne définit que des variables CSS ; le reskin des composants
 * Bootstrap existants est dans equus-theme.css.
 */

:root {
  /* ---- Forest (couleur primaire) ---- */
  --color-forest-900: #16261d;
  --color-forest-800: #1f362a;
  --color-forest-700: #2f4a3d;
  --color-forest-600: #3c5c4c;
  --color-forest-500: #4f7361;
  --color-forest-400: #729686;
  --color-forest-200: #c3d4c9;
  --color-forest-100: #e0ebe3;
  --color-forest-50: #f1f5f1;

  /* ---- Terracotta (secondaire / actions commerciales) ---- */
  --color-terracotta-700: #8a3d22;
  --color-terracotta-600: #a34e2c;
  --color-terracotta-500: #c1653a;
  --color-terracotta-400: #d68259;
  --color-terracotta-200: #ecc4ac;
  --color-terracotta-100: #f6e4d8;

  /* ---- Gold (accent, usage parcimonieux) ---- */
  --color-gold-700: #916b1e;
  --color-gold-600: #b08a2e;
  --color-gold-500: #c9a227;
  --color-gold-200: #ecd9a0;
  --color-gold-100: #f3e9c9;

  /* ---- Neutres chauds (jamais de gris froid) ---- */
  --color-neutral-0: #ffffff;
  --color-neutral-25: #fbf9f5;
  --color-neutral-50: #f5f1e9;
  --color-neutral-100: #ede7da;
  --color-neutral-200: #ded4c0;
  --color-neutral-300: #c4b69c;
  --color-neutral-400: #9c8d74;
  --color-neutral-500: #776953;
  --color-neutral-600: #5b4f3f;
  --color-neutral-700: #443b2f;
  --color-neutral-800: #2e2822;
  --color-neutral-900: #201c17;

  /* ---- Sémantique (statuts) ---- */
  --color-success-600: #3f7d4e;
  --color-success-100: #e3f0e5;
  --color-warning-600: #b9852b;
  --color-warning-100: #fbf0d8;
  --color-danger-600: #b33f2e;
  --color-danger-100: #fbe4df;
  --color-info-600: #3d6b8c;
  --color-info-100: #e1edf3;

  /* ---- Alias sémantiques ---- */
  --surface-page: var(--color-neutral-25);
  --surface-card: var(--color-neutral-0);
  --surface-sunken: var(--color-neutral-50);
  --surface-inverse: var(--color-forest-800);
  --surface-overlay: rgba(32, 28, 23, 0.5);

  --text-body: var(--color-neutral-800);
  --text-heading: var(--color-neutral-900);
  --text-muted: var(--color-neutral-500);
  --text-faint: var(--color-neutral-400);
  --text-inverse: var(--color-neutral-0);
  --text-link: var(--color-forest-600);

  --border-subtle: var(--color-neutral-200);
  --border-strong: var(--color-neutral-300);
  --border-focus: var(--color-forest-500);

  --accent-primary: var(--color-forest-600);
  --accent-primary-hover: var(--color-forest-700);
  --accent-primary-active: var(--color-forest-800);
  --accent-secondary: var(--color-terracotta-600);
  --accent-secondary-hover: var(--color-terracotta-700);
  --accent-highlight: var(--color-gold-500);

  --status-success-fg: var(--color-success-600);
  --status-success-bg: var(--color-success-100);
  --status-warning-fg: var(--color-warning-600);
  --status-warning-bg: var(--color-warning-100);
  --status-danger-fg: var(--color-danger-600);
  --status-danger-bg: var(--color-danger-100);
  --status-info-fg: var(--color-info-600);
  --status-info-bg: var(--color-info-100);

  /* ---- Typographie ---- */
  --font-display: 'Newsreader', 'Iowan Old Style', serif;
  --font-ui: 'Manrope', -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-md: 18px;
  --text-lg: 20px;
  --text-xl: 24px;
  --text-2xl: 28px;
  --text-3xl: 34px;
  --text-4xl: 42px;
  --text-5xl: 52px;

  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.55;
  --leading-relaxed: 1.7;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;

  /* ---- Espacement (base 4px) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  --container-max: 1200px;
  --sidebar-width: 264px;
  --topbar-height: 64px;

  /* ---- Rayons, ombres, bordures, mouvement ---- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-pill: 999px;

  --shadow-xs: 0 1px 2px rgba(32, 28, 23, 0.06);
  --shadow-sm: 0 2px 6px rgba(32, 28, 23, 0.07);
  --shadow-md: 0 8px 24px rgba(32, 28, 23, 0.10);
  --shadow-lg: 0 16px 40px rgba(32, 28, 23, 0.14);

  --border-width: 1px;

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 120ms;
  --duration-normal: 200ms;
  --duration-slow: 320ms;
}