/* 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 — dark par défaut (back-office interne) =====
     Charcoal légèrement violacé, en écho de l'indigo Shibui. */
  --color-bg: #17151d;
  --color-surface: #201d28;
  --color-surface-raised: #27232f;
  --color-border: #36313f;
  --color-bg-secondary: #1c1a23;   /* blocs code (timeline-data) */

  /* ===== Accent — Ochre CTA (éclairci pour ressortir sur fond sombre) ===== */
  --color-accent: #9a833c;
  --color-accent-hover: #b8a04a;
  --color-accent-active: #c4ae57;

  /* ===== Active/Selected States ===== */
  --color-active-bg: #2e2817;
  --color-active-text: #d6c069;

  /* ===== Focus Ring ===== */
  --color-focus-ring: rgba(208, 186, 106, 0.35);

  /* ===== Semantic — couleurs éclaircies, fonds « subtle » assombris ===== */
  --color-success: #93a65b;
  --color-success-subtle: #20271a;
  --color-warning: #d0ba6a;
  --color-warning-subtle: #2a2616;
  --color-error: #d4818f;
  --color-error-subtle: #2e1c20;
  --color-info: #9bb0c2;
  --color-info-subtle: #1b232a;
  --color-indigo: #b9aee0;          /* badge-indigo (texte) */
  --color-indigo-subtle: #221d2e;   /* badge-indigo (fond) */

  /* ===== Text ===== */
  --color-text-primary: #ece9f1;
  --color-text-secondary: #b3adbd;
  --color-text-disabled: #6c6678;
  --color-text-muted: #837d90;
  --color-text-inverse: #ffffff;

  /* ===== Sidebar (indigo, ajustée pour se détacher du fond) ===== */
  --sidebar-bg: #221d2e;
  --sidebar-text: #b8b2c4;
  --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 — plus profondes sur fond sombre ===== */
  --shadow-card: 0 1px 4px rgba(0, 0, 0, 0.4);
  --shadow-modal: 0 8px 28px rgba(0, 0, 0, 0.55);
  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 8px 28px rgba(0, 0, 0, 0.55);

  /* ===== 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;
  }
}