/* Polices auto-hébergées (EPIC-99.2) : aucun appel à Google Fonts (RGPD). */
@import url('fonts.css');

:root {
  /* ===== Shibui Palette ===== */

  /* Primary — Brownish Red */
  --shibui-red: #7b2d3b;
  --shibui-red-light: #9e4a58;
  --shibui-red-lighter: #e4a3ae;
  --shibui-red-dark: #5c1f2b;
  --shibui-red-subtle: #f5e8eb;

  /* Primary — Muted Ochre */
  --shibui-ochre: #b8a04a;
  --shibui-ochre-light: #d0ba6a;
  --shibui-ochre-dark: #6b5d2b;
  --shibui-ochre-subtle: #f5f1e2;

  /* Primary — Olive Green */
  --shibui-green: #6b7a3a;
  --shibui-green-light: #8a9c54;
  --shibui-green-dark: #4e5a2a;
  --shibui-green-subtle: #edf1e4;

  /* Primary — Dusty Slate Blue */
  --shibui-blue: #7a8fa3;
  --shibui-blue-light: #9bb0c2;
  --shibui-blue-dark: #5a6e80;
  --shibui-blue-subtle: #eaf0f4;

  /* Primary — Deep Indigo */
  --shibui-indigo: #4a3f5c;
  --shibui-indigo-light: #6b5e80;
  --shibui-indigo-dark: #332b42;
  --shibui-indigo-subtle: #edeaf2;

  /* ===== Surface & Background ===== */
  --color-bg: #f8f6f2;
  --color-surface: #efece6;
  --color-surface-raised: #ffffff;
  --color-border: #ddd8ce;

  /* ===== Accent — Ochre CTA ===== */
  --color-accent: #7d6c30;
  --color-accent-hover: #b8a04a;
  --color-accent-active: #7d6c30;

  /* ===== Active/Selected States ===== */
  --color-active-bg: #f5f1e2;
  --color-active-text: #8f7c38;

  /* ===== Focus Ring ===== */
  --color-focus-ring: rgba(143, 124, 56, 0.2);

  /* ===== Semantic ===== */
  --color-success: #6b7a3a;
  --color-success-subtle: #edf1e4;
  --color-warning: #b8a04a;
  --color-warning-subtle: #f5f1e2;
  --color-error: #7b2d3b;
  --color-error-subtle: #f5e8eb;
  --color-info: #7a8fa3;
  --color-info-subtle: #eaf0f4;

  /* ===== Text ===== */
  --color-text-primary: #2c2832;
  --color-text-secondary: #5c5662;
  --color-text-disabled: #a8a2ae;
  --color-text-muted: #a8a2ae;
  --color-text-inverse: #ffffff;

  /* ===== Sidebar ===== */
  --sidebar-bg: #332b42;
  --sidebar-text: #c8c2d0;
  --sidebar-text-active: #ffffff;

  /* ===== Layout ===== */
  --sidebar-width: 210px;
  --topbar-height: 56px;
  --content-padding-y: 24px;
  --content-padding-x: 32px;

  /* ===== Spacing ===== */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 40px;
  --spacing-2xl: 64px;

  /* ===== Radii ===== */
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-card: 12px;
  --radius-modal: 16px;
  --radius-pill: 100px;
  --radius-full: 100px;

  /* ===== Shadows ===== */
  --shadow-card: 0 1px 4px rgba(49, 49, 44, 0.04);
  --shadow-modal: 0 2px 12px rgba(49, 49, 44, 0.08);
  --shadow-sm: 0 1px 4px rgba(49, 49, 44, 0.04);
  --shadow-md: 0 2px 12px rgba(49, 49, 44, 0.08);

  /* ===== Typography ===== */
  --font-app-title: 'DM Serif Display', serif;
  --font-page-title: 'Lora', serif;
  --font-subtitle: 'Fira Sans Condensed', sans-serif;
  --font-body: 'Ek Mukta', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-2xs: 0.6875rem;  /* 11px */
  --text-xs: 0.75rem;     /* 12px */
  --text-sm: 0.8125rem;   /* 13px */
  --text-caption: 0.875rem; /* 14px */
  --text-base: 0.9375rem; /* 15px */
  --text-md: 1rem;         /* 16px */
  --text-body-lg: 1.0625rem; /* 17px */
  --text-lg: 1.125rem;    /* 18px */
  --text-xl: 1.25rem;     /* 20px */
  --text-2xl: 2.25rem;    /* 36px */
  --text-3xl: 2rem;        /* 32px */
  --text-4xl: 2.25rem;    /* 36px */
  --text-5xl: 2.5rem;     /* 40px */

  --leading-tight: 1.1;
  --leading-snug: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.6;

  /* ===== Transitions ===== */
  --transition-fast: 100ms ease;
  --transition-normal: 150ms ease;
  --transition-slow: 250ms ease;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0s;
    --transition-normal: 0s;
    --transition-slow: 0s;
  }
}