/* =====================================================================
   Дизайн-токены кабинета аналитики. Версия 1.0, 25.09.2026.
   Примитивы (шкалы) → семантика (роли). В компонентах используем только семантику.
   Варианты для брендбука: <html data-accent="iris|indigo|plum" data-font="onest|golos|inter" data-nav="dark|light">
   ===================================================================== */

/* ---------- шрифты: variable woff2, кириллица + латиница (цифры и tnum лежат в латинском файле) ---------- */
@font-face { font-family: "Onest V"; font-weight: 100 900; font-display: swap; src: url("../fonts/onest-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Onest V"; font-weight: 100 900; font-display: swap; src: url("../fonts/onest-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Golos V"; font-weight: 400 900; font-display: swap; src: url("../fonts/golos-text-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos V"; font-weight: 400 900; font-display: swap; src: url("../fonts/golos-text-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter V"; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-cyrillic-wght-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Inter V"; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+20BD, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

@layer tokens {
  :root {
    /* ---------- примитивы: акцент «Ирис» (по умолчанию) ---------- */
    --a-50: #f4f2ff; --a-100: #ebe7ff; --a-200: #d9d1ff; --a-300: #bcaefb; --a-400: #9a86f4;
    --a-500: #7a61ea; --a-600: #6246dc; --a-700: #5136bf; --a-800: #432e99; --a-900: #372875;

    /* нейтральная шкала: холодный серый с лёгким фиолетовым подтоном */
    --g-0: #ffffff; --g-25: #fafafc; --g-50: #f5f4f8; --g-100: #eeedf2; --g-150: #e8e6ee; --g-200: #e1dfe8;
    --g-300: #cfccd9; --g-400: #a9a5b7; --g-500: #7f7a90; --g-600: #5e596f; --g-700: #45404f; --g-800: #2c2833; --g-900: #1a1720;

    /* ночная шкала для тёмной навигации «Графит» */
    --n-900: #15121c; --n-850: #1b1824; --n-800: #221e2d; --n-700: #2d2939; --n-500: #6f6a80; --n-400: #8e89a0; --n-300: #b7b2c6; --n-100: #eceaf3;

    /* смысловые шкалы */
    --green-50: #e9f7ef; --green-100: #d3efdf; --green-300: #8fd3ad; --green-500: #2e9e6e; --green-700: #1a7a50;
    --red-50: #fdeeee; --red-100: #fad8d8; --red-300: #ef9b9b; --red-500: #d84d4d; --red-700: #b3302f;
    --amber-50: #fff6e3; --amber-100: #fdeac1; --amber-300: #f5c86b; --amber-500: #e5a019; --amber-700: #955d00;
    --mint-50: #e6f8f1; --mint-100: #c9efe0;

    /* площадки */
    --mp-wb: #cb11ab; --mp-ozon: #005bff;

    /* ---------- семантика ---------- */
    --bg-page: var(--g-25);
    --bg-surface: var(--g-0);
    --bg-sunken: var(--g-50);          /* шапка таблицы, поля, серые плашки */
    --bg-num: rgba(26, 23, 32, .025);   /* числовая зона ключевых колонок */
    --bg-hover: var(--g-50);
    --bg-selected: var(--a-50);
    --bg-overlay: rgba(21, 18, 28, .42);
    --bg-tooltip: #1f1b29;
    --bg-highlight: var(--mint-50);    /* колонка-рекомендация */

    --text-primary: var(--g-900);
    --text-secondary: var(--g-600);    /* контраст 6,6:1 на белом */
    --text-tertiary: var(--g-500);     /* 4,5:1 — минимум для текста */
    --text-disabled: var(--g-400);
    --text-on-accent: #fff;
    --text-link: var(--a-700);

    --border: var(--g-200);
    --border-strong: var(--g-300);
    --border-soft: var(--g-100);
    --divider: var(--g-100);

    --accent: var(--a-600);
    --accent-hover: var(--a-700);
    --accent-press: var(--a-800);
    --accent-soft: var(--a-50);
    --accent-soft-2: var(--a-100);
    --accent-line: var(--a-300);
    --focus-ring: 0 0 0 3px color-mix(in srgb, var(--a-500) 35%, transparent);

    --positive: var(--green-700);  --positive-bg: var(--green-50);  --positive-line: var(--green-300); --positive-solid: var(--green-500);
    --negative: var(--red-700);    --negative-bg: var(--red-50);    --negative-line: var(--red-300);   --negative-solid: var(--red-500);
    --warning: var(--amber-700);   --warning-bg: var(--amber-50);   --warning-line: var(--amber-300);  --warning-solid: var(--amber-500);
    --info: var(--a-700);          --info-bg: var(--a-50);          --info-line: var(--a-200);

    /* подсветка ячеек (правила владельца): 3 ступени в каждую сторону */
    --heat-good-1: #eef8f2; --heat-good-2: #d8f0e2; --heat-good-3: #b9e4cb;
    --heat-bad-1: #fdf1f1;  --heat-bad-2: #fadcdc;  --heat-bad-3: #f5c0c0;

    /* группы анализа */
    --abc-a: #2e9e6e; --abc-b: #e5a019; --abc-c: #d05a8a;
    --xyz-x: #22a39a; --xyz-y: #3b8fd9; --xyz-z: #a86bd6;

    /* палитра графиков: первая серия — акцент */
    --viz-1: var(--a-600); --viz-2: #22a39a; --viz-3: #e5a019; --viz-4: #e0674f;
    --viz-5: #c0569f; --viz-6: #3b8fd9; --viz-7: #8aa33a; --viz-8: #7f7a90;
    --viz-grid: var(--g-100); --viz-axis: var(--g-500);

    /* ---------- навигация (тёмная «Графит» по умолчанию) ---------- */
    --nav-bg: var(--n-900);
    --nav-bg-hover: var(--n-800);
    --nav-bg-active: rgba(154, 134, 244, .14);
    --nav-text: var(--n-300);
    --nav-text-active: #fff;
    --nav-icon: var(--n-400);
    --nav-icon-active: var(--a-300);
    --nav-group: var(--n-500);
    --nav-border: var(--n-800);
    --nav-scroll: rgba(255, 255, 255, .14); --nav-scroll-hover: rgba(255, 255, 255, .26);
    --scroll: var(--g-200); --scroll-hover: var(--g-300);

    /* ---------- типографика ---------- */
    --font-ui: "Onest V", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Consolas", monospace;
    --fs-11: 11px; --fs-12: 12px; --fs-13: 13px; --fs-14: 14px; --fs-16: 16px; --fs-20: 20px; --fs-24: 24px; --fs-30: 30px;
    --lh-tight: 1.2; --lh: 1.45;
    --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700;
    --tracking: .005em;

    /* ---------- отступы: шаг 4 ---------- */
    --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;

    /* ---------- формы ---------- */
    --r-xs: 4px; --r-sm: 6px; --r-md: 8px; --r-lg: 12px; --r-xl: 16px; --r-pill: 999px;
    --shadow-sm: 0 1px 2px rgba(26, 23, 32, .06);
    --shadow-md: 0 4px 14px rgba(26, 23, 32, .08), 0 1px 3px rgba(26, 23, 32, .05);
    --shadow-lg: 0 16px 40px rgba(26, 23, 32, .16), 0 2px 6px rgba(26, 23, 32, .06);
    --ctl-h: 36px; --ctl-h-sm: 30px; --ctl-h-lg: 44px;

    /* слои */
    --z-sticky: 10; --z-nav: 50; --z-dropdown: 100; --z-popover: 200; --z-drawer: 300; --z-modal: 400; --z-toast: 450; --z-tooltip: 500;

    /* таблицы: плотность */
    --dt-row: 40px; --dt-pad-x: 12px; --dt-fs: var(--fs-13); --dt-head: 40px;

    /* каркас */
    --side-w: 248px; --side-w-collapsed: 64px; --top-h: 56px; --page-pad: 28px;
    --dur: .16s; --ease: cubic-bezier(.2, .7, .3, 1);
  }

  /* ---------- варианты акцента для выбора в брендбуке ---------- */
  :root[data-accent="indigo"] {
    --a-50: #f0f3ff; --a-100: #e2e8ff; --a-200: #c8d2ff; --a-300: #a2b2fb; --a-400: #7b8ef3;
    --a-500: #5b6de8; --a-600: #4553d6; --a-700: #3842b3; --a-800: #2f378f; --a-900: #282f70;
  }
  :root[data-accent="plum"] {
    --a-50: #fbf2fb; --a-100: #f5e3f5; --a-200: #eac6ea; --a-300: #d99dd9; --a-400: #c271c5;
    --a-500: #a84fae; --a-600: #8e3a97; --a-700: #75307c; --a-800: #5e2863; --a-900: #4a2150;
  }
  :root[data-accent="lilac"] {  /* нынешняя «Сирень», для сравнения */
    --a-50: #f3f0fd; --a-100: #e9e4ff; --a-200: #d9d0fb; --a-300: #b9a9ff; --a-400: #9b85f0;
    --a-500: #7d64e6; --a-600: #6d4fe0; --a-700: #4b35c2; --a-800: #3e2c9e; --a-900: #33267d;
  }

  /* ---------- варианты шрифта ---------- */
  :root[data-font="golos"] { --font-ui: "Golos V", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
  :root[data-font="inter"] { --font-ui: "Inter V", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
  :root[data-font="system"] { --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }

  /* ---------- светлая навигация (как у Точки), для сравнения ---------- */
  :root[data-nav="light"] {
    --nav-bg: var(--g-0); --nav-bg-hover: var(--g-50); --nav-bg-active: var(--a-50);
    --nav-text: var(--g-700); --nav-text-active: var(--a-700); --nav-icon: var(--g-500); --nav-icon-active: var(--a-600);
    --nav-group: var(--g-500); --nav-border: var(--g-200);
    --nav-scroll: var(--g-200); --nav-scroll-hover: var(--g-300);
  }

  /* ---------- плотность ---------- */
  :root[data-density="compact"] { --dt-row: 32px; --dt-pad-x: 10px; --dt-fs: var(--fs-12); --dt-head: 34px; }
  :root[data-density="comfy"] { --dt-row: 48px; --dt-pad-x: 14px; --dt-head: 44px; }
}