/* Jetons de design KMJ Vault : palette indigo + émeraude, thèmes clair et sombre.
   Aucune autre feuille ne doit contenir de couleur en dur. */
:root {
  --font: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 18px;

  --bg: #f6f7fb;
  --surface: #fff;
  --surface-2: #f1f3f9;
  --surface-hover: #f5f6fd;
  --text: #0f1330;
  --muted: #5f6885;
  --border: #e3e6f2;
  --border-strong: #cdd3e6;

  --brand: #4f46e5;
  --brand-hover: #4338ca;
  --brand-ink: #fff;
  --brand-text: #4338ca;
  --brand-soft: #eef0ff;
  --ring: rgb(79 70 229 / 24%);

  --accent: #10b981;
  --accent-ink: #04261b;
  --accent-soft: #e6f9f1;
  --accent-text: #047857;

  --ok-bg: #dcf7ea;
  --ok-ink: #065f46;
  --ok-border: #a5e8c9;
  --warn-bg: #fff6dc;
  --warn-ink: #7a4a00;
  --warn-border: #f5da8b;
  --danger: #dc2626;
  --danger-solid: #dc2626;
  --danger-hover: #b91c1c;
  --danger-soft: #fee8e8;
  --danger-ink: #991b1b;
  --tag-bg: #efeaff;
  --tag-ink: #5b3fc4;
  --star-on: #f5b301;

  --sidebar-bg: #17153b;
  --sidebar-ink: #c4c7ec;
  --sidebar-strong: #fff;
  --sidebar-muted: #9296c4;
  --sidebar-hover: rgb(255 255 255 / 8%);
  --sidebar-active: rgb(16 185 129 / 16%);
  --sidebar-line: rgb(255 255 255 / 16%);

  --track: #e8ebf6;
  --switch-off: #c9cfe3;
  --star: #a0a7c2;
  --toast-bg: #17153b;
  --toast-ink: #fff;
  --overlay: rgb(12 14 44 / 55%);
  --shadow: 0 1px 2px rgb(23 21 90 / 6%), 0 6px 20px rgb(23 21 90 / 6%);
  --shadow-lg: 0 24px 64px rgb(12 14 44 / 35%);
  --grad: linear-gradient(135deg, var(--brand), var(--accent));

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #0a0d1c;
    --surface: #12162b;
    --surface-2: #181d38;
    --surface-hover: #1b2142;
    --text: #e8ebf8;
    --muted: #98a1c0;
    --border: #252c4e;
    --border-strong: #353f69;

    --brand: #6366f1;
    --brand-hover: #7578f5;
    --brand-text: #aab4ff;
    --brand-soft: #1e2352;
    --ring: rgb(129 140 248 / 38%);

    --accent: #34d399;
    --accent-soft: #10291f;
    --accent-text: #6ee7b7;

    --ok-bg: #0f3026;
    --ok-ink: #6ee7b7;
    --ok-border: #1c5b46;
    --warn-bg: #2d2410;
    --warn-ink: #fcd34d;
    --warn-border: #5c4915;
    --danger: #f87171;
    --danger-hover: #ef4444;
    --danger-soft: #3a1619;
    --danger-ink: #fca5a5;
    --tag-bg: #2a2358;
    --tag-ink: #c4b5fd;

    --sidebar-bg: #070a18;
    --track: #232a4a;
    --switch-off: #3b4569;
    --star: #5d6892;
    --toast-bg: #222952;
    --overlay: rgb(2 3 14 / 70%);
    --shadow: 0 1px 2px rgb(0 0 0 / 30%), 0 6px 20px rgb(0 0 0 / 25%);
    --shadow-lg: 0 24px 64px rgb(0 0 0 / 60%);

    color-scheme: dark;
  }
}

:root[data-theme='dark'] {
  --bg: #0a0d1c;
  --surface: #12162b;
  --surface-2: #181d38;
  --surface-hover: #1b2142;
  --text: #e8ebf8;
  --muted: #98a1c0;
  --border: #252c4e;
  --border-strong: #353f69;

  --brand: #6366f1;
  --brand-hover: #7578f5;
  --brand-text: #aab4ff;
  --brand-soft: #1e2352;
  --ring: rgb(129 140 248 / 38%);

  --accent: #34d399;
  --accent-soft: #10291f;
  --accent-text: #6ee7b7;

  --ok-bg: #0f3026;
  --ok-ink: #6ee7b7;
  --ok-border: #1c5b46;
  --warn-bg: #2d2410;
  --warn-ink: #fcd34d;
  --warn-border: #5c4915;
  --danger: #f87171;
  --danger-hover: #ef4444;
  --danger-soft: #3a1619;
  --danger-ink: #fca5a5;
  --tag-bg: #2a2358;
  --tag-ink: #c4b5fd;

  --sidebar-bg: #070a18;
  --track: #232a4a;
  --switch-off: #3b4569;
  --star: #5d6892;
  --toast-bg: #222952;
  --overlay: rgb(2 3 14 / 70%);
  --shadow: 0 1px 2px rgb(0 0 0 / 30%), 0 6px 20px rgb(0 0 0 / 25%);
  --shadow-lg: 0 24px 64px rgb(0 0 0 / 60%);

  color-scheme: dark;
}