/* ds-tokens.css — единый источник истины: примитивы → семантика.
   Тёмная тема = переопределение семантических токенов в одном месте
   (html[data-bs-theme="dark"]), а не оверрайды по каждому компоненту.
   Подключать ПОСЛЕ базовых CSS и ДО ds-layout / ds-theming / ds-new. */

:root {
  /* ---- Примитивы: акцент ---- */
  --tm-yellow:#FECC00; --tm-yellow-600:#e6b800; --tm-yellow-700:#c9a200;

  /* ---- Примитивы: нейтрали ---- */
  --white:#fff; --black:#000; /* фиксированные — не флипают (текст на цвете, оверлеи) */
  --n-0:#ffffff;  --n-25:#f9fafb; --n-50:#f4f5f7; --n-100:#eef0f3; --n-150:#e6e8ec;
  --n-200:#dde0ea;--n-300:#c7ccd6;--n-400:#9aa1ac;--n-500:#6b7280; --n-600:#4a5160;
  --n-700:#37415a;--n-800:#232830;--n-850:#1f242c;--n-900:#1c2027; --n-950:#15181d;
  --ink:#12161c;

  /* ---- Примитивы: статусы / бренды ---- */
  --p-blue:#3b82f6; --p-green:#1f9a4f; --p-red:#e0374a; --p-amber:#b08600;
  --p-tg:#229ed9;   --p-max:#7c3aed;

  /* ---- Семантика (светлая тема) ---- */
  --bg:var(--n-50); --surface:var(--n-0); --surface-2:var(--n-25);
  --surface-3:#f3f4f8; --surface-sunken:#eef0f4;
  --text:var(--ink); --text-muted:var(--n-500); --text-subtle:var(--n-400);
  --border:var(--n-150); --border-strong:var(--n-200);
  --accent:var(--tm-yellow); --accent-hover:var(--tm-yellow-600); --on-accent:#111;
  --accent-subtle:rgba(254,204,0,.12);
  --text-strong:var(--ink); --border-hover:#d0d4dc; --link:#3b82f6;

  /* статусные пары текст/фон (работают в обеих темах) */
  --c-info:var(--p-blue);    --c-info-bg:rgba(59,130,246,.12);
  --c-success:var(--p-green);--c-success-bg:rgba(31,154,79,.12);
  --c-warning:var(--p-amber);--c-warning-bg:rgba(176,134,0,.14);
  --c-danger:var(--p-red);   --c-danger-bg:rgba(224,55,74,.12);
  --c-danger-strong:#c0392b;
  --c-tg:var(--p-tg); --c-max:var(--p-max);

  --focus-ring:rgba(254,204,0,.35);

  /* ---- Радиусы ---- */
  --r-sm:6px; --r-md:8px; --r-lg:12px; --r-xl:16px; --r-pill:999px;

  /* ---- Тени ---- */
  --sh-sm:0 1px 3px rgba(16,22,28,.08);
  --sh-md:0 4px 14px rgba(16,22,28,.10);
  --sh-lg:0 12px 34px rgba(16,22,28,.14);
  --sh-xl:0 20px 60px rgba(16,22,28,.18);

  /* ---- Типографика ---- */
  --fs-xs:11px; --fs-sm:13px; --fs-md:14px; --fs-base:15px; --fs-lg:16px;
  --fs-xl:18px; --fs-2xl:20px; --fs-3xl:24px; --fs-4xl:30px;
  --fw-med:500; --fw-semi:600; --fw-bold:700; --fw-black:800;
  --lh-tight:1.2; --lh-normal:1.45;

  /* ---- Отступы ---- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px;

  /* ---- z-index ---- */
  --z-sticky:20; --z-dropdown:1000; --z-modal:1050; --z-toast:1080;
}

/* ================= Тёмная тема — только переопределение семантики ================= */
html[data-bs-theme="dark"] {
  --bg:var(--n-950); --surface:var(--n-900); --surface-2:var(--n-800);
  --surface-3:#262b34; --surface-sunken:#20242c;
  --text:#e8eaed; --text-muted:var(--n-400); --text-subtle:#7a828f;
  --border:#2c323c; --border-strong:#39414e;
  --on-accent:#111;

  --c-info:#5aa2ff;    --c-info-bg:rgba(59,130,246,.16);
  --c-success:#5fd08a; --c-success-bg:rgba(31,154,79,.20);
  --c-warning:#e5b93b; --c-warning-bg:rgba(176,134,0,.22);
  --c-danger:#f07a7a;  --c-danger-bg:rgba(224,55,74,.18);
  --c-tg:#3aa9e0; --c-max:#a06bff;
  --c-danger-strong:#f5a2a2;

  --accent-subtle:rgba(254,204,0,.14);
  --text-strong:#fff; --border-hover:#4a525f; --link:#8ab4f8;

  --focus-ring:rgba(254,204,0,.25);

  --sh-sm:0 1px 3px rgba(0,0,0,.4);
  --sh-md:0 4px 14px rgba(0,0,0,.45);
  --sh-lg:0 12px 34px rgba(0,0,0,.5);
  --sh-xl:0 20px 60px rgba(0,0,0,.55);
}
