/*
 * «Зачёт» — слой темы в стиле Инсайтера (волна 1, PRD 2026-09-30-zachet-restyle-wave1).
 * Подключается ПОСЛЕДНИМ (base.html, после style.css и страничных css из extra_head).
 * Только оформление: токены --zc-* переназначены на палитру Инсайтера по ролям,
 * поверх — общие компоненты. Раскладку, структуру и поведение страниц не трогает.
 * Источник: insighter_web/static/insighter-theme.css (токены Claude Design).
 * Откат: убрать <link> на этот файл из base.html.
 */

/* Manrope (OFL) — локально, static/fonts/, вариативный 400–800. Внешних запросов нет. */
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/static/fonts/manrope-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/static/fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("/static/fonts/manrope-latin.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+2122, U+2190-21FF, U+2212, U+2215, U+25C6, U+25B2, U+25CC, U+FEFF, U+FFFD;
}

/* Весь стиль — только для экрана: печать остаётся светлой (@media print в style.css, Д-56). */
@media screen {
/* --- Базовые токены Инсайтера (Claude Design, tokens.css) ------------------ */
:root {
  --bg:#17162b; --bg-deep:#121124; --inset:#191830;
  --surface:#1f1e36; --surface-2:#26253f; --surface-3:#2f2e4c;
  --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12);
  --text:#eeedf7; --text-2:#aeacc8; --text-3:#817f9e; --muted:#8b89a8;
  --mint:#3de89b; --mint-ink:#0c2a1c; --lime:#d4f25a; --yellow:#f6d64a; --pink:#e25ad6; --sky:#5bc5f2; --violet:#9d82e6;
  --pos:#3de89b; --neg:#ff6179; --warn:#f5b547; --info:#5bc5f2;
  --font:'Manrope',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --fw-m:600; --fw-b:700;
  --r-sm:6px; --r-md:10px; --r-lg:16px; --r-xl:20px;
  --shadow-card:inset 0 1px 0 rgba(255,255,255,.06),0 18px 36px -14px rgba(0,0,0,.6),0 2px 4px rgba(0,0,0,.25);
  --shadow-pop:inset 0 1px 0 rgba(255,255,255,.08),0 24px 48px -12px rgba(0,0,0,.7);
  --shadow-seg:inset 0 1px 0 rgba(255,255,255,.08),0 4px 12px -4px rgba(0,0,0,.5);
  --glow:radial-gradient(50% 100% at 50% 0%,rgba(196,178,255,.55),rgba(196,178,255,0) 70%);
  --ease:cubic-bezier(.2,.7,.2,1); --dur:.22s;
}

/* --- Переназначение --zc-* по ролям --------------------------------------
   Линии, строки таблиц и семантические подложки — НЕПРОЗРАЧНЫЕ композиты
   поверх --surface (#1f1e36): так они не «плывут» на разных слоях и дают
   предсказуемый контраст. Проверки контраста текста (WCAG, ≥4.5:1):
   --text-2 на --surface-3 ≈ 7.9; --zc-ink-faint #9896b5 на --surface-3 ≈ 4.56,
   на --surface ≈ 5.7; --neg на --zc-danger-bg ≈ 4.6; --warn на --zc-warning-bg ≈ 6.7;
   белый на --zc-danger-solid #c23a52 ≈ 5.2; --mint-ink на --mint ≈ 10. */
:root {
  color-scheme: dark;

  --zc-bg: var(--bg);
  --zc-surface: var(--surface);
  --zc-surface-2: var(--surface-2);
  --zc-surface-3: var(--surface-3);
  --zc-surface-sunken: var(--inset);      /* поля ввода — темнее карточки */
  /* Лестница слоёв: каждый следующий светлее предыдущего, шаг как у Зачёта. */
  --zc-elev-2: var(--surface-2);
  --zc-elev-3: var(--surface-3);
  --zc-elev-4: #36355a;
  --zc-elev-5: #3e3d64;
  --zc-fill-on-elev: #47466e;

  --zc-ink: var(--text);
  --zc-ink-muted: var(--text-2);
  --zc-ink-faint: #9896b5;
  --zc-ink-disabled: var(--text-3);
  --zc-ink-invert: var(--mint-ink);
  --zc-ink-faint-on-elev: var(--text-2);
  --zc-cardlink-ink: var(--text);
  --zc-alert-body-ink: var(--zc-ink);

  --zc-line: #3a394f;
  --zc-line-soft: #2f2e44;
  --zc-line-strong: #77759a;
  --zc-line-on-elev: #4c4b65;
  --zc-line-mid-on-elev: #595870;
  --zc-border: var(--zc-line);            /* используется с фолбэком в _fbs_transit.html */

  --zc-accent: var(--mint);
  --zc-accent-hover: #66eeb2;
  --zc-accent-active: #2fd088;
  --zc-accent-soft: #233642;
  --zc-accent-on-elev: var(--mint);
  --zc-accent-quiet: var(--text-2);
  --zc-focus: #c4b2ff;
  --zc-spark-ink: var(--sky);

  --zc-success: var(--pos);   --zc-success-bg: #233642; --zc-success-line: #2c7360;
  --zc-warning: var(--warn);  --zc-warning-bg: #3d3338; --zc-warning-line: #795d3d;
  --zc-danger: var(--neg);    --zc-danger-bg:  #3e273f; --zc-danger-line:  #843c54;
  --zc-neutral: var(--text-2);--zc-neutral-bg: #29283f; --zc-neutral-line: #4c4b5e;
  --zc-info: var(--info);     --zc-info-bg:    #26324d; --zc-info-line:    #386485;
  --zc-danger-solid: #c23a52;
  --zc-danger-solid-hover: #ad3349;
  --zc-danger-on: #ffffff;
  --zc-danger-on-elev: #ff8a9b;

  --zc-row-zebra: #242339;
  --zc-row-hover: #2a2941;
  --zc-row-selected: #223240;
  --zc-field-disabled-bg: var(--bg-deep);
  --zc-autofill-bg: var(--inset);
  --zc-btn-disabled-bg: var(--surface-2);
  --zc-btn-disabled-line: var(--zc-line);
  --zc-thumb-bg: var(--surface-2);

  --zc-shadow-color: rgba(0,0,0,.65);
  --zc-shadow-1: 0 0 0 1px rgba(255,255,255,.07), 0 18px 36px -14px rgba(0,0,0,.6), 0 2px 4px rgba(0,0,0,.25);
  --zc-shadow-2: 0 0 0 1px rgba(255,255,255,.08), 0 4px 12px rgba(0,0,0,.45), 0 12px 28px -8px rgba(0,0,0,.55);
  --zc-shadow-3: 0 0 0 1px rgba(255,255,255,.10), 0 8px 20px -4px rgba(0,0,0,.55), 0 24px 48px -12px rgba(0,0,0,.65);
  --zc-shadow-4: 0 0 0 1px rgba(255,255,255,.12), 0 12px 28px -6px rgba(0,0,0,.60), 0 32px 64px -12px rgba(0,0,0,.70);
  --zc-shadow-overlay: 0 0 0 1px rgba(255,255,255,.12), 0 12px 24px -6px rgba(0,0,0,.60), 0 32px 56px -12px rgba(0,0,0,.70);
  --zc-shadow-consultant-btn: var(--zc-shadow-3);
  --zc-hairline-top: inset 0 1px 0 rgba(255,255,255,.06);
  --zc-field-inset: inset 0 1px 2px rgba(0,0,0,.4);
  --zc-scrim: rgba(10,9,24,.88);
  --zc-scrim-sheet: rgba(10,9,24,.88);
  --zc-scroll-fade: rgba(0,0,0,.55);

  --zc-font-ui: var(--font);
  /* Цифры — тем же Manrope с tabular-nums (одинаковая ширина), как в Инсайтере. */
  --zc-font-mono: var(--font);
  --zc-radius: var(--r-md);
  --zc-radius-lg: var(--r-lg);
  --zc-radius-s: var(--r-sm);
}

/* --- Основа --------------------------------------------------------------- */
html { background: var(--zc-bg); }
body {
  background:
    radial-gradient(1100px 520px at 72% -12%, rgba(157, 130, 230, .09), transparent 70%),
    var(--zc-bg);
  background-attachment: fixed;
  color: var(--zc-ink);
  font-family: var(--font);
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--zc-accent); color: var(--zc-accent-contrast, var(--mint-ink)); }
::placeholder { color: var(--zc-ink-faint); opacity: 1; }
:focus-visible { outline: 2px solid var(--zc-focus); outline-offset: 3px; }
.zc-num, .zc-mono, .zc-badge, .zc-table td { font-variant-numeric: tabular-nums; }

.zc-pagehead__title, .zc-h1, .zc-h2, h1, h2 { letter-spacing: -.02em; }

/* --- Верхнее меню: сегменты на тёмной дорожке ---------------------------- */
.zc-topnav {
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .7);
  backdrop-filter: blur(14px);
}
.zc-topnav__brand { color: var(--text); font-weight: 750; letter-spacing: -.02em; }
.zc-topnav__link {
  position: relative;
  border: 1px solid transparent;
  border-radius: var(--r-md);
  color: var(--text-2);
  font-weight: var(--fw-m);
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.zc-topnav__link:hover { background: rgba(255, 255, 255, .045); color: var(--text); }
.zc-topnav__link.is-active {
  border-color: var(--line-2);
  background: var(--surface-3);
  color: var(--lime);
  box-shadow: var(--shadow-seg);
}
.zc-topnav__link.is-active::before,
.zc-tabs__tab.is-current::before,
.zc-chip.is-active::before {
  content: "";
  position: absolute;
  top: -1px; left: 16%; right: 16%;
  height: 12px;
  background: var(--glow);
  border-radius: inherit;
  pointer-events: none;
}
@media (min-width: 1200px) {
  .zc-topnav__links {
    flex: 0 1 auto;
    gap: 2px;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-deep);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .45);
  }
  .zc-topnav__links { align-self: center; }
  .zc-topnav__link {
    height: 38px; min-height: 38px;
    padding: 0 14px;
    border-top-width: 1px;          /* полоса-индикатор Зачёта заменена сегментом */
    font-size: 14px;
  }
}
.zc-topnav__me.is-active { color: var(--lime); border-top-color: var(--lime); }
.zc-topnav__me, .zc-topnav__user { color: var(--text-2); }
.zc-topnav__me:hover { color: var(--text); }
.zc-cabinet-badge { color: var(--text-2); }

/* --- Вкладки раздела: та же дорожка -------------------------------------- */
.zc-tabs {
  padding-top: 12px;
  background: transparent;
  border-bottom: 0;
  box-shadow: none;
}
.zc-tabs__inner {
  gap: 2px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background-color: var(--bg-deep);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .45);
}
.zc-tabs__tab {
  border-bottom: 0;
  border-radius: var(--r-md);
  color: var(--text-2);
  font-weight: var(--fw-m);
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.zc-tabs__tab:hover { background: rgba(255, 255, 255, .045); color: var(--text); }
.zc-tabs__tab.is-current {
  background: var(--surface-3);
  color: var(--lime);
  box-shadow: var(--shadow-seg);
}
.zc-tabs__num, .zc-chip__num { background: var(--surface-3); color: var(--text-2); }
.zc-tabs__tab.is-current .zc-tabs__num { background: rgba(212, 242, 90, .14); color: var(--lime); }
@media (min-width: 768px) {
  .zc-tabs__inner {
    width: fit-content;
    max-width: calc(100% - 2 * var(--zc-page-pad));
    margin-inline: var(--zc-page-pad);
  }
  .zc-tabs__tab { min-height: 38px; padding: 0 16px; font-size: 14px; }
}
@media (min-width: 1232px) {
  /* Внутренний контейнер Зачёта — 1200px по центру: дорожка встаёт по его левому краю. */
  .zc-tabs__inner { margin-inline: max(var(--zc-page-pad), calc((100% - 1200px) / 2 + var(--zc-page-pad))); }
}

/* --- Фильтры и срезы: сегменты ------------------------------------------- */
.zc-chip {
  position: relative;
  border-color: var(--line-2);
  border-radius: var(--r-md);
  background: var(--bg-deep);
  color: var(--text-2);
  font-weight: var(--fw-m);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .35);
}
.zc-chip:hover { border-color: var(--line-2); background: var(--surface-2); color: var(--text); text-decoration: none; }
.zc-chip.is-active {
  border-color: var(--line-2);
  background: var(--surface-3);
  color: var(--text);
  box-shadow: var(--shadow-seg);
}
.zc-chip.is-active .zc-chip__num { background: rgba(255, 255, 255, .1); color: var(--text); }
.zc-chip--danger { border-color: var(--zc-danger-line); color: var(--neg); }
.zc-chip--danger.is-active { background: var(--zc-danger-bg); color: var(--neg); }

/* Период на главной — те же сегменты (активный светлее, не мятный: мятный — действие). */
#zc-main .zc-dash__period-btn {
  border-color: var(--line-2);
  border-radius: var(--r-md);
  background: var(--bg-deep);
  color: var(--text-2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .35);
}
#zc-main .zc-dash__period-btn:hover { background: var(--surface-2); color: var(--text); }
#zc-main .zc-dash__period-btn.is-active {
  position: relative;
  border-color: var(--line-2);
  background: var(--surface-3);
  color: var(--lime);
  box-shadow: var(--shadow-seg);
}

/* --- Кнопки: главная мятная, вторичная, опасная --------------------------- */
.zc-btn {
  border-radius: var(--r-md);
  font-weight: var(--fw-m);
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.zc-btn:active { transform: translateY(1px); }
.zc-btn:not([class*="zc-btn--"]):not([disabled]):not([aria-disabled="true"]) {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 20px -10px rgba(61, 232, 155, .7);
}
.zc-btn--secondary,
.zc-btn--outline,
.zc-btn--muted {
  border: 1px solid var(--line-2);
  background: var(--surface-2);
  color: var(--text);
  box-shadow: var(--shadow-seg);
}
.zc-btn--secondary:hover,
.zc-btn--outline:hover,
.zc-btn--muted:hover { border-color: var(--line-2); background: var(--surface-3); color: var(--text); }
.zc-btn--ghost { border-color: var(--line-2); background: transparent; color: var(--text); }
.zc-btn--ghost:hover { background: rgba(255, 255, 255, .05); color: var(--text); }
.zc-btn--danger { border: 1px solid var(--zc-danger-line); background: var(--surface-2); color: var(--neg); }
.zc-btn--danger:hover { background: var(--zc-danger-bg); color: var(--neg); }
.zc-btn--text { box-shadow: none; }

/* --- Поля ввода: темнее карточки ----------------------------------------- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),
select,
textarea {
  border-color: var(--line-2);
  border-radius: var(--r-md);
  background-color: var(--inset);
  color: var(--text);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .4);
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):hover,
select:hover,
textarea:hover { border-color: rgba(255, 255, 255, .2); }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
select:focus,
textarea:focus {
  border-color: var(--mint);
  box-shadow: 0 0 0 3px rgba(61, 232, 155, .18);
}
input:disabled, select:disabled, textarea:disabled { background-color: var(--bg-deep); color: var(--text-3); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--mint); }

/* --- Карточки и плитки: рамка, блик сверху, мягкая тень ------------------- */
.zc-card,
.zc-tile,
.zc-table-card {
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: var(--r-lg);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .028), rgba(255, 255, 255, 0) 42%),
    var(--surface);
  box-shadow: var(--shadow-card);
}

/* --- Модалки, окна фильтров, подсказки ----------------------------------- */
.zc-modal { border-radius: var(--r-lg); box-shadow: var(--shadow-pop); }
.zc-modal__card { border-radius: var(--r-lg); }
.zc-modal::backdrop { background: var(--zc-scrim); }
.zc-hintmark__glyph {
  border: 1px solid var(--line-2);
  border-radius: 50%;
  background: rgba(255, 255, 255, .04);
  color: var(--text-2);
}
.zc-hintmark:hover .zc-hintmark__glyph,
.zc-hintmark:focus-visible .zc-hintmark__glyph { background: var(--surface-3); color: var(--text); }
.zc-hintwin {
  border: 1px solid var(--line-2);
  border-radius: 14px;
  box-shadow: var(--shadow-pop);
}

/* --- Бейджи статусов: форма штриха (сплошной/пунктир/двойной/точки) остаётся,
       чтобы статус читался без цвета. ----------------------------------------- */
.zc-badge { font-family: var(--font); font-weight: var(--fw-m); border-radius: 0 7px 7px 0; }

/* --- Таблицы -------------------------------------------------------------- */
.zc-table th {
  background: var(--surface-2);
  color: var(--text-2);
  font-weight: var(--fw-m);
}
.zc-table th, .zc-table td { border-color: var(--zc-line-soft); }
.zc-table a:not(.zc-btn):not(.zc-chip) { color: var(--text); text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .25); text-underline-offset: 3px; }
.zc-table a:not(.zc-btn):not(.zc-chip):hover { color: var(--mint); text-decoration-color: currentColor; }
.zc-table-wrap { scrollbar-color: var(--zc-line-strong) var(--bg-deep); scrollbar-width: thin; }

/* --- Пагинация ------------------------------------------------------------ */
.zc-pager__cur { background: var(--surface-3); color: var(--lime); border-color: var(--line-2); box-shadow: var(--shadow-seg); }

/* --- Нижняя панель телефона ---------------------------------------------- */
/* Фон панели НЕПРОЗРАЧНЫЙ (01.10.2026): на 1024 панель лежит поверх нижних строк
   реестра, и через 6% прозрачности + blur просвечивали колонки, проезжающие под
   приклеенной первой колонкой при прокрутке вбок (test_zachet_web_sticky §2). */
.zc-bottomnav {
  background: var(--bg-deep);
  border-top: 1px solid var(--line-2);
  box-shadow: 0 -10px 30px -18px rgba(0, 0, 0, .8);
}
.zc-bottomnav__item { color: var(--text-2); }
.zc-bottomnav__item.is-active { color: var(--lime); border-top-color: var(--lime); }
.zc-bottomnav__sheet {
  background: var(--surface-2);
  border: 1px solid var(--line-2);
  box-shadow: var(--shadow-pop);
}

/* --- Прочее: «—», скроллбары страницы ------------------------------------ */
.zc-dash { color: var(--muted); }
html { scrollbar-color: var(--surface-3) var(--bg); }

/* === Дизайн-шлюз волны 1 (design-critique + ui-ux-pro-max, 30.09.2026) ==== */

/* Иерархия как в эталоне Инсайтера: заголовки 700, ключевые числа 800. */
h1, .zc-h1, .zc-pagehead__title { font-weight: 700; }
h2, h3, .zc-h2, .zc-card__title, .zc-alert__title { font-weight: 700; }
.zc-dash__card-value, .zc-dash__home-value, .zc-tile__value, .zc-kpi__value {
  font-weight: 800;
  letter-spacing: -.02em;
}
th, .zc-table th { font-weight: 700; }

/* Блик активного сегмента — внутри сегмента, не над дорожкой. */
.zc-topnav__link.is-active::before,
.zc-tabs__tab.is-current::before,
.zc-chip.is-active::before {
  top: 0;
  height: 10px;
  border-radius: 0 0 50% 50%;
}
@media (min-width: 1200px) {
  /* Полоса-индикатор Зачёта (border-top 3px) на всех состояниях — 1px, чтобы
     активный пункт не был выше дорожки и не вылезал за неё. */
  .zc-topnav__link, .zc-topnav__link.is-active, .zc-topnav__link[aria-current] {
    border-top-width: 1px;
    margin-block: 0;
    transform: none;
  }
}

/* Текстовые кнопки — без капса, как в Инсайтере. */
.zc-btn--text { letter-spacing: 0; text-transform: none; }

/* Ссылки на цветных подложках алертов — цветом текста алерта, не мятным. */
.zc-alert a:not(.zc-btn):not(.zc-chip) {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 3px;
}
.zc-alert a:not(.zc-btn):not(.zc-chip):hover { color: var(--text); }

/* Размер страницы в пагинации — вторичный текст, мятный только у действия. */
.zc-pager__size, .zc-pager__btn { color: var(--text-2); }
.zc-pager__size:hover, .zc-pager__btn:hover { color: var(--text); }

/* «—» (нет значения): на цветных подложках --muted давал 3.6:1. */
.zc-dash { color: var(--text-2); }

/* Счётчик минусовых артикулов на складах: 10px → 12px. */
.zcw-negsku { font-size: 12px; }

/* Поле с ошибкой: красная рамка + кольцо, фокус не перебивает ошибку. */
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"],
.is-invalid input, .is-invalid select, .is-invalid textarea, .zc-field--error input, .zc-field--error select {
  border-color: var(--neg);
  box-shadow: 0 0 0 3px rgba(255, 97, 121, .18);
}

/* Палитра графика остатков по артикулам (warehouses_item.html) → ряды Инсайтера.
   Цвет задан inline в шаблоне, поэтому !important — только здесь. */
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+1),
.zcw-legend > li:nth-child(8n+1) .zcw-legend__swatch { stroke: var(--yellow) !important; background: var(--yellow) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+2),
.zcw-legend > li:nth-child(8n+2) .zcw-legend__swatch { stroke: var(--pink) !important; background: var(--pink) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+3),
.zcw-legend > li:nth-child(8n+3) .zcw-legend__swatch { stroke: var(--sky) !important; background: var(--sky) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+4),
.zcw-legend > li:nth-child(8n+4) .zcw-legend__swatch { stroke: var(--violet) !important; background: var(--violet) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+5),
.zcw-legend > li:nth-child(8n+5) .zcw-legend__swatch { stroke: var(--mint) !important; background: var(--mint) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+6),
.zcw-legend > li:nth-child(8n+6) .zcw-legend__swatch { stroke: var(--lime) !important; background: var(--lime) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+7),
.zcw-legend > li:nth-child(8n+7) .zcw-legend__swatch { stroke: var(--warn) !important; background: var(--warn) !important; }
.zcw-chart > polyline.zcw-chart__line:not([class*="--"]):nth-of-type(8n+8),
.zcw-legend > li:nth-child(8n+8) .zcw-legend__swatch { stroke: var(--text-2) !important; background: var(--text-2) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+1) { fill: var(--yellow) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+2) { fill: var(--pink) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+3) { fill: var(--sky) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+4) { fill: var(--violet) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+5) { fill: var(--mint) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+6) { fill: var(--lime) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+7) { fill: var(--warn) !important; }
.zcw-chart > circle.zcw-chart__dot:not([class*="--"]):nth-of-type(8n+8) { fill: var(--text-2) !important; }

/* Фокус/наведение/disabled полей: базовое правило выше с 7×:not() (специфичность 0,7,1)
   перебивало :focus/:hover/:disabled — рамка фокуса не появлялась, disabled не отличался. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"]):hover,
select:not(#zc-x):hover, textarea:not(#zc-x):hover { border-color: rgba(255, 255, 255, .22); }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"]):focus,
select:not(#zc-x):focus, textarea:not(#zc-x):focus {
  border-color: var(--mint);
  box-shadow: 0 0 0 3px rgba(61, 232, 155, .22);
  outline: none;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"]):disabled,
select:not(#zc-x):disabled, textarea:not(#zc-x):disabled {
  border-style: dashed;
  border-color: var(--zc-line);
  background-color: var(--bg-deep);
  color: var(--zc-ink-faint);
  box-shadow: none;
  cursor: not-allowed;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"])[aria-invalid="true"],
select:not(#zc-x)[aria-invalid="true"], textarea:not(#zc-x)[aria-invalid="true"] {
  border-color: var(--neg);
  box-shadow: 0 0 0 3px rgba(255, 97, 121, .18);
}

/* Ошибка на обёртке (.zc-field--error / .is-invalid) без aria-invalid: специфичность
   не ниже базового правила полей (7×:not) и правила :focus, стоит после них → рамка
   красная и в покое, и в фокусе. Для select/textarea — :not(#zc-x) (как выше). */
:is(.zc-field--error, .is-invalid) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"]),
:is(.zc-field--error, .is-invalid) select:not(#zc-x),
:is(.zc-field--error, .is-invalid) textarea:not(#zc-x) {
  border-color: var(--neg);
  box-shadow: 0 0 0 3px rgba(255, 97, 121, .18);
}
:is(.zc-field--error, .is-invalid) input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"]):focus,
:is(.zc-field--error, .is-invalid) select:not(#zc-x):focus,
:is(.zc-field--error, .is-invalid) textarea:not(#zc-x):focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="hidden"])[aria-invalid="true"]:focus,
select:not(#zc-x)[aria-invalid="true"]:focus,
textarea:not(#zc-x)[aria-invalid="true"]:focus {
  border-color: var(--neg);
  box-shadow: 0 0 0 3px rgba(255, 97, 121, .30);
}

/* WebKit/Safari: у select box-shadow на нативном контроле не везде рисуется, а outline:none
   убирал кольцо совсем — видимое кольцо фокуса клавиатуры/клика через outline. */
select:not(#zc-x):focus-visible { outline: 2px solid var(--mint); outline-offset: 2px; }
:is(.zc-field--error, .is-invalid) select:not(#zc-x):focus-visible,
select:not(#zc-x)[aria-invalid="true"]:focus-visible { outline-color: var(--neg); }

  /* ЗАКРЕПЛЁННАЯ ШАПКА ТАБЛИЦ (01.10.2026, PRD ux-wave234). `.zc-table-wrap`
     с `overflow-x: auto` становится контейнером sticky, и шапка уезжала
     вместе с таблицей. На L обёртка и карточка не режут переполнение —
     таблицы этих экранов влезают по ширине (замер 1293/1440: scrollWidth =
     clientWidth), длинные «Товар»/«Склад»/«Откуда»/«Куда» переносятся. */
  @media (min-width: 1200px) {
    .zc-table-card:has(> .zc-table-wrap > .rp-table),
    .zc-table-card:has(> .zc-table-wrap > .cx-groups),
    .whx-goods .zc-table-card { overflow: visible; }
    .zc-table-wrap:has(> .rp-table),
    .zc-table-wrap:has(> .cx-groups),
    .whx-goods .zc-table-wrap { overflow: visible; max-height: none; }
    /* Шапка сайта (`.zc-topnav`) не закреплена и уезжает вверх, поэтому
       шапка таблицы липнет к top: 0, а не под высоту шапки сайта — иначе
       над ней оставалась щель в 56px, сквозь которую видны строки. Крайние
       ячейки (закреплённые слева/справа, z-index 1) поднимаются над строками. */
    main .rp-table > thead th,
    main .cx-groups > thead th,
    main .zcd-list > thead th,
    .whx-goods .zc-table > thead th {
      position: sticky; top: 0; z-index: 3;
      background: var(--zc-surface-2);
    }
    main .zcd-list > thead > tr > th:is(:first-child, :last-child),
    main .rp-table > thead > tr > th:first-child { z-index: 4; }
    main .rp-table td:is([data-th="Товар"], [data-th="Склад"], [data-th="Где лежит"],
      [data-th="Откуда"], [data-th="Куда"]),
    main .cx-groups td:is([data-th="Товар"], [data-th="Склад"]) {
      white-space: normal; overflow-wrap: anywhere;
    }
  }

  /* Доводка вёрстки (30.09): поле поиска на телефоне — 16px, иначе iOS зумит. */
  @media (max-width: 1199px) {
    .zc-search .zc-search__input { font-size: 16px; }
  }
  /* Отчёты ≥1200px: подписи колонок в одну строку (шапка таблицы 93 -> ~45px),
     сжатие отдано текстовым колонкам, а не заголовкам. */
  @media (min-width: 1200px) {
    main .rp-table thead th { white-space: nowrap; overflow-wrap: normal; }
  }
}

/* === А1 · оболочка: меню по задачам, popover «+ Создать»/профиль, нижняя панель (30.09.2026) === */
.zc-navnum {
  display: inline-block; min-width: 18px; margin-left: 6px; padding: 0 6px;
  border-radius: 9px; background: var(--neg); color: var(--bg-deep);
  font-size: 12px; font-weight: 700; line-height: 18px; text-align: center;
}
.zc-topnav__profile { margin-left: auto; gap: 10px; }
.zc-topnav__create { anchor-name: --zc-create-btn; white-space: nowrap; }
button.zc-topnav__me {
  anchor-name: --zc-me-btn; background: none; border-left: 0; border-right: 0; border-bottom: 0;
  font: inherit; cursor: pointer; border-radius: var(--r-md);
}
.zc-pop {
  margin: 0; inset: auto; min-width: 232px; max-width: min(92vw, 320px);
  padding: 6px; border: 1px solid var(--line-2); border-radius: 14px;
  background: var(--surface-2); color: var(--text); box-shadow: var(--shadow-pop);
}
.zc-pop::backdrop { background: rgba(0, 0, 0, .45); }
.zc-pop--create, .zc-pop--profile { position: fixed; top: 70px; right: max(16px, calc((100vw - 1200px) / 2 + 16px)); }
@supports (position-anchor: --zc-x) {
  .zc-pop--create { position-anchor: --zc-create-btn; top: calc(anchor(bottom) + 8px); right: anchor(right); }
  .zc-pop--profile { position-anchor: --zc-me-btn; top: calc(anchor(bottom) + 8px); right: anchor(right); }
}
.zc-pop__head { margin: 0; padding: 8px 12px 4px; font-weight: 700; }
.zc-pop__sub { margin: 4px 0 0; padding: 4px 12px 0; color: var(--text-2); font-size: 12px; }
.zc-pop__link {
  display: flex; align-items: center; justify-content: space-between; min-height: 44px; width: 100%;
  padding: 0 12px; border: 0; border-radius: var(--r-md); background: none;
  color: var(--text); font: inherit; text-align: left; text-decoration: none; cursor: pointer;
}
.zc-pop__link:hover { background: rgba(255, 255, 255, .06); text-decoration: none; }
.zc-pop__link.is-current { color: var(--lime); }
.zc-pop__form { margin: 4px 0 0; padding-top: 4px; border-top: 1px solid var(--line); }
.zc-pop--sheet {
  position: fixed; left: 0; right: 0; top: auto; max-width: none; width: 100%;
  bottom: calc(var(--zc-bottomnav-h) + var(--zc-safe-bottom));
  max-height: 70vh; overflow: auto; border-radius: 16px 16px 0 0; padding: 8px 12px 12px;
}
.zc-bottomnav__item { background: none; border-left: 0; border-right: 0; border-bottom: 0; font: inherit; cursor: pointer; }
.zc-bottomnav__plus {
  width: 44px; height: 24px; flex: 0 0 24px; border-radius: 8px;
  background: var(--lime); color: var(--bg-deep); font-size: 20px; font-weight: 700; line-height: 22px;
}
.zc-topnav__create { gap: 6px; }
.zc-pop--create { min-width: 290px; }
.zc-bottomnav__item--plus .zc-bottomnav__label { color: var(--text-2); }
@media (min-width: 1200px) {
  .zc-topnav__link { padding: 0 11px; }
  .zc-topnav__inner { gap: 16px; }
  .zc-pop--sheet { display: none; }
}

/* Дизайн-волна 30.09: данные на десктопе не мельче 13 px. */
@media (min-width: 1200px) {
  .zc-chip__num, .zcd-flow__note, .zcw-partial, .dv-tasks span { font-size: 13px; }
  main .cx-metric dt, main .dv-req dt, main .zcd-flow__facts dt, main .zcd-flow__note,
  .zcpd-head .zcd-flow__steps .zcd-flow__note { font-size: 13px; }
  /* «Недопоставки» (грузит только style/reports/theme): длинный артикул,
     дата и «С кого спрашиваем» переносятся — таблица 1308 → в 1134 px,
     статус не уходит под приклеенную колонку действий. */
  main .zc-listing:has(td[data-th="С кого спрашиваем"]) .zc-table--scroll th { white-space: normal; }
  main .zc-listing:has(td[data-th="С кого спрашиваем"]) .zc-table--scroll td[data-th="Артикул"] { white-space: normal; overflow-wrap: anywhere; min-width: 14ch; }
  main .zc-listing:has(td[data-th="С кого спрашиваем"]) .zc-table--scroll td[data-th="Дата"],
  main .zc-listing:has(td[data-th="С кого спрашиваем"]) .zc-table--scroll td[data-th="С кого спрашиваем"] { white-space: normal; }
  main .zc-listing:has(td[data-th="С кого спрашиваем"]) .zc-table--scroll td[data-th="Дата"] { min-width: 10ch; }
  main .zc-table .rp-rowacts .zc-btn { white-space: nowrap; }
}

/* Дизайн-волна 2 (30.09): приёмка по закупке — у даты одна метка
   «✎ подставлено» (в подписи, .zcpd-date-prefill); общая «подставлено»
   справа от поля дублировала её и оставалась после «Подтвердить подставленное». */
main:has(#zcpd-post) .zcd-date-auto { display: none; }