/* styles.css — аналитика на AG Grid */
/* Только var(--name) из theme.css — без hardcode цветов */

/* ================================================================
   КОЛОНКА «БАЛАНС» (balance-column-spec-2026-06-22)
   Классы: .balcell · .bar · .bar.sm · .seg-* · .bal-dot · .bal-lbl
   Поповер легенды «?»: .bal-qmark · .bal-pop
   Клик-панель per-МП: .bal-panel · .bal-panel-row · .bal-panel-btn
   Все цвета — var(--mp-*) из theme.css (I0) + статус-токены
   ================================================================ */

/* Ячейка-полоса (свёрнутая колонка) */
.balcell {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
}

/* Основная полоса */
.bar {
  width: 104px;
  height: 14px;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  background: var(--surface);
  border: 1px solid var(--border);
  flex: 0 0 auto;
}

/* Мини-полоса в раскрытой колонке */
.bar.sm {
  width: 80px;
}

/* Сегменты полосы — сплошной цвет (продаётся) */
.bar i {
  display: block;
  height: 100%;
}
.seg-ozon { background: var(--mp-ozon); }
.seg-wb   { background: var(--mp-wb); }
.seg-ym   { background: var(--mp-ym); }

/* Штриховка ЦВЕТОМ МП — карточка есть, 0 продаж (45°, opacity для различимости) */
.seg-zero-ozon {
  background: repeating-linear-gradient(
    45deg,
    var(--mp-ozon), var(--mp-ozon) 2px,
    transparent 2px, transparent 5px
  );
  opacity: 0.65;
}
.seg-zero-wb {
  background: repeating-linear-gradient(
    45deg,
    var(--mp-wb), var(--mp-wb) 2px,
    transparent 2px, transparent 5px
  );
  opacity: 0.65;
}
.seg-zero-ym {
  background: repeating-linear-gradient(
    45deg,
    var(--mp-ym), var(--mp-ym) 2px,
    transparent 2px, transparent 5px
  );
  opacity: 0.85;
}

/* Серая штриховка — карточки нет совсем */
.seg-none {
  background: repeating-linear-gradient(
    45deg,
    var(--text2), var(--text2) 2px,
    transparent 2px, transparent 5px
  );
  opacity: 0.45;
}

/* Метка-статус справа от полосы (свёрнутая ячейка) */
.bal-lbl {
  font-size: 12px;
  white-space: nowrap;
  color: var(--text2);
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

/* Dot-индикатор статуса (8px круг) */
.bal-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 auto;
}
.bal-dot.g { background: var(--success); }
.bal-dot.a { background: var(--warning); }
.bal-dot.r { background: var(--red); }
.bal-dot.b { background: var(--accent); }
.bal-dot.x { background: var(--text2); }

/* Цвет текста статуса */
.bal-status-g { color: var(--success); }
.bal-status-a { color: var(--warning); }
.bal-status-r { color: var(--red); }
.bal-status-b { color: var(--accent); }
.bal-status-x { color: var(--text2); }

/* «нет карт.» — маркер отсутствия карточки (серый, мелкий) */
.bal-nocard {
  font-size: 11px;
  color: var(--text2);
}

/* Таблично-выровненные числа в под-колонках «%» */
.bal-pct {
  font-variant-numeric: tabular-nums;
  text-align: right;
  display: block;
}

/* При ширине колонки < 170px — скрываем текст метки, оставляем полосу + dot
   Реализуется через класс .balcell-narrow (добавляется в cellClass при compact) */
.balcell-narrow .bal-lbl-text {
  display: none;
}

/* ── Шеврон-переключатель раскрытия группы «Баланс» ── */

/* Кнопка-шеврон в шапке группы: стиль нейтральный, как родной AG-Grid toggle */
.bal-chev {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border: none;
  border-radius: 3px;
  background: transparent;
  color: var(--text); /* как нативная AG-иконка группы (.ag-header-group-text цвет) */
  cursor: pointer;
  font-family: inherit;
  flex: 0 0 auto;
  padding: 0;
  transition: color 0.15s, background 0.12s;
}
.bal-chev:hover,
.bal-chev:focus {
  color: var(--text);
  background: var(--hover);
  outline: none;
}
.bal-chev:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

/* ── Поповер легенды «?» ── */

/* Кнопка «?» в шапке группы «Баланс» */
.bal-qmark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid var(--text2);
  color: var(--text2);
  font-size: 10px;
  font-weight: 700;
  margin-left: 6px;
  cursor: help;
  background: transparent;
  font-family: inherit;
  line-height: 1;
  flex: 0 0 auto;
  vertical-align: middle;
  transition: border-color 0.15s, color 0.15s;
}
.bal-qmark:hover,
.bal-qmark:focus {
  border-color: var(--accent);
  color: var(--accent);
  outline: none;
}

/* Поповер «Как читать «Баланс»» — singleton в body */
.bal-pop {
  position: fixed;
  z-index: 9999;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(20, 25, 40, 0.16);
  padding: 13px 15px;
  width: 330px;
  font-size: 12.5px;
  color: var(--text);
  display: none;
}
.bal-pop.open { display: block; }
.bal-pop h4 {
  margin: 0 0 9px;
  font-size: 12.5px;
  color: var(--text);
}
.bal-pop-chips {
  display: flex;
  gap: 12px;
  font-size: 12.5px;
  color: var(--text);
  margin-bottom: 8px;
}
.bal-pop-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.bal-pop-sw {
  width: 11px;
  height: 11px;
  border-radius: 3px;
  display: inline-block;
  flex: 0 0 auto;
}
.bal-pop-sw.oz { background: var(--mp-ozon); }
.bal-pop-sw.wb { background: var(--mp-wb); }
/* ЯМ: жёлтый может слиться на светлом bg — обводка */
.bal-pop-sw.ym { background: var(--mp-ym); border: 1px solid var(--border); }
.bal-pop-grp {
  font-size: 11px;
  color: var(--text2);
  margin: 9px 0 5px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.bal-pop-row {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
  color: var(--text);
  margin: 5px 0;
}
/* Мини-полоска в легенде (38×13px) */
.bal-lbar {
  width: 38px;
  height: 13px;
  border-radius: 3px;
  border: 1px solid var(--border);
  display: flex;
  overflow: hidden;
  flex: 0 0 auto;
}

/* ── Клик-панель per-МП ── */
.bal-panel {
  position: fixed;
  z-index: 9998;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(20, 25, 40, 0.14);
  padding: 14px 16px;
  width: 360px;
  font-size: 13px;
  color: var(--text);
  display: none;
}
.bal-panel.open { display: block; }
.bal-panel-title {
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 3px;
}
.bal-panel-sub {
  font-size: 11px;
  color: var(--text2);
  margin-bottom: 10px;
}
.bal-panel-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--border);
}
.bal-panel-row:last-of-type { border-bottom: none; }
.bal-panel-mp {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 600;
  min-width: 52px;
}
.bal-panel-mp-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 auto;
}
.bal-panel-nums {
  flex: 1;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  color: var(--text);
}
.bal-panel-nums .bal-panel-rev { font-weight: 600; }
.bal-panel-nums .bal-panel-share { color: var(--text2); font-size: 11px; }
.bal-panel-btn {
  font-size: 11px;
  font-family: inherit;
  color: var(--accent);
  background: transparent;
  border: 1px solid var(--accent);
  border-radius: 5px;
  padding: 3px 8px;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: background-color 0.12s, color 0.12s;
}
.bal-panel-btn:hover { background: var(--accent); color: var(--on-accent); }
.bal-panel-btn:disabled { opacity: 0.45; cursor: not-allowed; }
.bal-panel-verdict {
  font-size: 12px;
  color: var(--text2);
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.bal-panel-close {
  position: absolute;
  top: 8px;
  right: 10px;
  font-size: 16px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text2);
  font-family: inherit;
  line-height: 1;
  padding: 2px 4px;
}
.bal-panel-close:hover { color: var(--text); }

/* prefers-reduced-motion: отключить transition сегментов полосы */
@media (prefers-reduced-motion: reduce) {
  .seg-ozon, .seg-wb, .seg-ym,
  .seg-zero-ozon, .seg-zero-wb, .seg-zero-ym,
  .seg-none { transition: none; }
}

/* ================================================================
   Базовый layout
   ================================================================ */
html, body {
  height: 100%;
  margin: 0;
  font-family: var(--font, system-ui, sans-serif);
  background: var(--bg);
  color: var(--text);
}
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: hidden;
}

/* ================================================================
   Бизнес-панель
   ================================================================ */
/* .biz-panel / .biz-row / .biz-panel h1 / .header-vsep / .header-period —
   перенесены в src/assets/page-shell.css (Ф1 Page Shell, 2026-06-03) */
.stats { font-size: 12px; color: var(--text2); }

/* MP selector */
.mp-selector {
  display: flex;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.mp-btn {
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 600;
  background: transparent;
  color: var(--text2);
  border: none;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
  white-space: nowrap;
}
.mp-btn.active  { background: var(--accent); color: var(--on-accent); }
.mp-btn.disabled { opacity: 0.45; cursor: not-allowed; }

/* Period selector chips */
.ps-inline { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ps-chip {
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 500;
  background: var(--surface2);
  color: var(--text2);
  border: 1px solid var(--border);
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
}
.ps-chip:hover { border-color: var(--accent); color: var(--accent); }
.ps-chip.active { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.ps-month-chip  { padding: 4px 9px; font-size: 11px; }
.ps-divider     { color: var(--border); font-size: 16px; margin: 0 2px; user-select: none; }
.ps-date-input {
  padding: 4px 8px;
  font-size: 12px;
  font-family: inherit;
  background: var(--surface2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.ps-date-input:focus { border-color: var(--accent); outline: none; }
.ps-progress { font-size: 11px; color: var(--accent); font-weight: 500; }

/* .biz-btn — перенесена в src/assets/page-shell.css (Ф1 Page Shell, 2026-06-03) */

/* ================================================================
   N1 (2026-06-19): одна строка МП + период — РАСКАТАНА В ОБЩИЙ СЛОЙ.
   Класс .mp-period-row / .mp-period-right + его @media перенесены в
   src/assets/page-shell.css (грузят все AG-Grid-страницы), чтобы Возвраты/
   Реклама/Ценообразование получали единый ряд автоматически. Локальный дубль
   СНЯТ. Ряд теперь рендерит движок MA_TableShell при period.mpRow (opt-in).
   ================================================================ */

/* ================================================================
   Переключатель маркетплейсов (#mp-switcher-row) — Variant A draft.
   Позиция: внутри .biz-panel, после .shell-divider (слот afterDivider).
   ЗАМЕЧАНИЕ: финальное расположение и скин — развилка на дизайн-доске.
   id сохранён для совместимости с JS-якорями.
   ================================================================ */
/* .mp-switcher-row = устаревший класс. Теперь применяется .mp-period-row */

/* ================================================================
   CHANGE A: .shell-date-slot — РАСКАТАН в общий src/assets/page-shell.css
   (канон 2026-06-09, commit f4bb66a). Локальный дубль СНЯТ (follow-up
   2026-06-15): он тенил общий band-gap (одна строка периода 1366–1440px) —
   базовые значения слота идентичны общим, а отзывчивые @media-правила были
   только в page-shell.css → локальная плоская `.shell-date-slot{gap:6px}`
   загружалась позже и перебивала band-gap. Теперь применяется общий слой.
   ================================================================ */

/* ================================================================
   CHANGE B: .lens-above-tabs — обёртка тумблера линз между «Про
   раздел» и вкладками По SKU / По заказам / По склейкам.
   Фон совпадает с .biz-panel (--surface), отделён снизу бордером.
   ================================================================ */
.lens-above-tabs {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  padding: 6px 24px 8px;
  flex-shrink: 0;
}
/* Внутри .lens-above-tabs .lens-bar убираем внешние отступы
   (они были нужны только в .biz-panel — здесь своя ритмика) */
.lens-above-tabs .lens-bar {
  margin: 0;
}
/* ================================================================
   Info-block — коллапсируемый
   ================================================================ */
.info-block {
  margin: 8px 0 4px;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.info-block-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}
.info-block-title { font-size: 13px; font-weight: 600; }
.info-block-toggle {
  font-size: 11px;
  color: var(--text2);
  background: none;
  border: 1px solid var(--border);
  cursor: pointer;
  padding: 3px 10px;
  border-radius: 4px;
  font-family: inherit;
}
.info-block-toggle:hover { color: var(--accent); border-color: var(--accent); }
.info-block-body { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.info-block.collapsed .info-block-body { display: none; }
.info-block-desc { font-size: 12px; color: var(--text2); line-height: 1.5; max-width: 900px; }
/* Канон: 3px левая полоса убрана (AI-tell 2026-06-27); единый 1px border + иконка severity в разметке. */
.info-block-disclaimer {
  padding: 8px 12px;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
  color: var(--text2);
  line-height: 1.5;
}

/* ================================================================
   Mode tabs bar + кнопка «Ожидают» (A-1)
   ================================================================ */
/* Обёртка: таб-бар + кнопка «Ожидают» в одну строку */
.mode-tabs-row {
  display: flex;
  align-items: stretch;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.mode-tabs-bar {
  display: flex;
  align-items: center;
  padding: 0 0 0 24px;
  /* border-bottom убран — теперь на .mode-tabs-row */
  /* flex:1 убран (2026-06-01): иначе таб-бар растягивался на всю ширину и
     отбрасывал «Ожидают» к правому краю. Теперь бар = по содержимому,
     «Ожидают» встаёт вплотную к последнему табу (Склейки). */
  flex: 0 0 auto;
}
/* «Ожидают» вплотную к табам (после «Склейки») — выровнена по центру как таб */
.mode-tabs-pending {
  align-self: center;
  margin: 0 12px 0 10px;
  font-size: 12px;
  padding: 5px 10px;
}

/* FIX B: разделитель + подпись «Числа:» + сегментированный контрол на строке mode-tabs-row.
   margin-left:auto на разделителе прижимает блок «Числа: [Валовые|На ед.|Смешанный]»
   к правому краю строки. Токены: var(--border), var(--text2), var(--accent) — обе темы. */
.mode-tabs-seg-divider {
  border-left: 1px solid var(--border);
  align-self: stretch;
  margin: 0 10px 0 auto;
  flex-shrink: 0;
}
.mode-tabs-seg-label {
  font-size: 11px;
  color: var(--text2);
  white-space: nowrap;
  margin-right: 6px;
  align-self: center;
  flex-shrink: 0;
}
/* Отступ справа для контрола (не прижимать к краю строки) */
.mode-tabs-row .tb-seg-wrap {
  margin-right: 12px;
  align-self: center;
  flex-shrink: 0;
}
/* ENG-002 (2026-07-02): правило `.mode-tabs-row .bal-qmark` УДАЛЕНО — page-declared
   кнопка «?» (#btn-value-mode-help, класс .bal-qmark) в ряду режимов убрана (был дубль
   со справкой, которую движок MA_TableShell вставляет сам → .tb-seg-help). Базовый
   `.bal-qmark` (выше) СОХРАНЁН — он всё ещё нужен кнопке «?» у группы «Баланс» в шапке грида. */
.mode-tab {
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 500;
  font-family: inherit;
  background: transparent;
  color: var(--text2);
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
  margin-bottom: -1px;
}
.mode-tab:hover { color: var(--text); }
.mode-tab.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 700; }
.mode-hint {
  padding: 6px 24px;
  font-size: 12px;
  color: var(--text2);
  background: var(--surface2);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  font-style: italic;
}

/* ================================================================
   Toolbar
   ================================================================ */
.toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  /* padding — канон в общем слое: page-shell.css `#main-toolbar { padding }`
     (ENG-004 консолидация 2026-07-02). Здесь только flex/фон/рамка. */
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
  flex-shrink: 0;
}
.toolbar-separator { width: 1px; height: 24px; background: var(--border); margin: 0 4px; flex-shrink: 0; }
.tb-btn {
  padding: 5px 12px;
  font-size: 12px;
  font-family: inherit;
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 6px);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.tb-btn:hover { background: var(--surface2); }
.tb-btn.active { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.tb-btn-icon {
  width: 28px;
  height: 28px;
  padding: 0;
  font-size: 15px;
  line-height: 28px;
  text-align: center;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 4px);
  background: var(--surface);
  color: var(--text2);
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
}
.tb-btn-icon:hover  { background: var(--surface2); color: var(--text); }
.tb-btn-icon.active { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }

/* Кнопки групп (строки / колонки) — иконка + шеврон состояния (правка Александра 2026-06-01).
   Расширяем фикс-ширину .tb-btn-icon под иконку+шеврон. */
.tb-gbtn {
  width: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 0 7px;
}
.tb-gbtn svg { display: block; }
.tb-gbtn .tb-gchev { font-size: 9px; line-height: 1; opacity: .7; }
/* Группы строк бессмысленны без включённой «Группировки» — гасим кнопку */
.tb-gbtn.tb-disabled { opacity: .4; pointer-events: none; }

/* Право-якорная группа */
.te-toolbar-right-group { margin-left: auto; display: flex; align-items: center; gap: 6px; }

/* FIX 3: лёгкая текстовая кнопка (без рамки) — для «Сбросить фильтры» */
.tb-link-btn {
  border: none;
  background: none;
  padding: 2px 6px;
  font-size: 12px;
  font-family: inherit;
  color: var(--text2);
  cursor: pointer;
  white-space: nowrap;
  border-radius: var(--radius-sm, 4px);
  transition: color .15s;
}
.tb-link-btn:hover { color: var(--accent); background: none; }
/* Когда фильтры активны — подсвечиваем акцентным цветом, чтобы кнопка была заметна */
.tb-link-btn.active { color: var(--accent); font-weight: 600; }

/* Адаптивные подписи */
.tb-btn .tb-compact { display: none; }
.tb-btn .tb-full    { display: inline; }
@media (max-width: 1500px) {
  .tb-btn .tb-full    { display: none; }
  .tb-btn .tb-compact { display: inline; }
}

/* Поиск */
.tb-search-wrap { position: relative; flex: 1; min-width: 120px; max-width: 320px; }
.tb-search {
  padding: 5px 28px 5px 10px;
  font-size: 12px;
  font-family: inherit;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg);
  color: var(--text);
  width: 100%;
  box-sizing: border-box;
}
.tb-search::placeholder { color: var(--text2); }
.tb-search-clear {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--text2);
  cursor: pointer;
  font-size: 14px;
  padding: 0 4px;
  display: none;
  line-height: 1;
}
.tb-search-clear:hover { color: var(--text); }
.tb-search-wrap.has-value .tb-search-clear { display: block; }

/* ================================================================
   Status row — КАНОН вынесен в общий слой src/assets/page-shell.css
   (сертификация 2026-07-02, брат ENG-004). Пейдж-дубль снят: движок
   MA_TableShell строит .status-row, вид берётся из page-shell.css.
   ================================================================ */

/* ================================================================
   Грид-обёртка — flex:1 чтобы занять всё оставшееся пространство
   ================================================================ */
#ma-grid-wrap {
  flex: 1;
  /* №31 CLS-резерв: минимальная высота при первом рендере, до инициализации AG Grid.
     Предотвращает сдвиг layout при появлении таблицы (analytics CLS ~0.244 → цель <0.1).
     После инициализации flex:1 выталкивает grid до полной высоты — min-height не мешает. */
  min-height: 480px;
  display: flex;
  flex-direction: column;
  position: relative;
}
#ma-grid {
  flex: 1;
  min-height: 0;
  width: 100%;
}

/* ================================================================
   AG Grid тема под нашу palette + оформление ячеек/строк/итогов/фильтра/
   ozon-link/child-row — ЕДИНЫЙ ИСТОЧНИК в /assets/aggrid-grouping.css
   (эталон = /analytics/). Перенесено из page-CSS 2026-06-12 (унификация
   всех 5 AG-Grid таблиц). Здесь остаётся только page-specific (ничего).
   .ma-num-header — тоже в общем aggrid-grouping.css.
   ================================================================ */

/* ================================================================
   Summary bar — одна строка
   ================================================================ */
.summary-bar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 6px 24px;
  background: var(--surface);
  border-top: 1px solid var(--border);
  font-size: 12px;
  flex-shrink: 0;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow-x: auto;
  max-height: 38px;
}
.sb-item  { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.sb-label { font-size: 12px; color: var(--text2); }
.sb-val   { font-weight: 600; color: var(--text); }
.sb-divider { width: 1px; height: 20px; background: var(--border); flex-shrink: 0; }

/* ================================================================
   Drilldown modal (dblclick в SKU-режиме)
   ================================================================ */
.drilldown-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 2000;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.drilldown-overlay[style*="flex"] { display: flex !important; }
.drilldown-modal {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  width: 640px;            /* +80px под колонку «На единицу» (Александр 2026-06-01); центрирована, <42% от 1920 */
  max-width: 100%;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 16px 48px rgba(0,0,0,.3);
  overflow: hidden;
}
.drilldown-header { flex-shrink: 0; }
.drilldown-body { flex: 1; min-height: 0; overflow-y: auto; }
.drilldown-footer {
  flex-shrink: 0;
  padding: 12px 18px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
}
.dd-btn { padding: 6px 18px; font-size: 13px; font-family: inherit; border-radius: 6px; cursor: pointer; }
.dd-btn-close { background: var(--surface2); border: 1px solid var(--border); color: var(--text); }
.dd-btn-close:hover { border-color: var(--accent); color: var(--accent); }
.dd-row td, .dd-total-row td { border-bottom: 1px solid var(--border); }
.dd-total-row td { font-weight: 700; background: var(--surface2); }

/* ================================================================
   Карточка SKU: P&L «На единицу / Всего» + ⓘ-описания (Александр 2026-06-01)
   ================================================================ */
.dd-pnl-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.dd-pnl-table td { padding: 6px 18px; font-size: 13px; }
.dd-c-label { color: var(--text2); text-align: left; }
.dd-c-unit, .dd-c-total { text-align: right; font-weight: 600; white-space: nowrap; }
.dd-c-unit  { color: var(--text2); width: 120px; }   /* «на ед.» — вторично (приглушённо) */
.dd-c-total { color: var(--text); width: 140px; }     /* «всего» — доминанта */
.dd-head-row td { padding-top: 10px; padding-bottom: 4px; border-bottom: 1px solid var(--border); }
.dd-head-cap { font-size: 11px; font-weight: 600; color: var(--text2); }
/* Чип «бандл» — предупреждающая жёлтая заливка (токены theme.css) */
.dd-bundle-chip { display: inline-block; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 4px;
  background: var(--warning-bg); color: var(--warning); border: 1px solid var(--warning-border); }
.dd-subrow td { padding-top: 2px; padding-bottom: 2px; font-size: 12px; }
.dd-subrow .dd-c-label { padding-left: 30px; font-style: italic; opacity: .8; }
.dd-subrow .dd-c-unit, .dd-subrow .dd-c-total { font-weight: 500; opacity: .8; }
.dd-pos { color: var(--color-profit-pos); }
.dd-na  { color: var(--text2); font-style: italic; font-weight: 400; }
.dd-profit-row td { padding-top: 9px; padding-bottom: 9px; font-size: 14px; }
.dd-profit-row .dd-anchor { font-size: 17px; font-weight: 800; }
.dd-margin-label, .dd-profit-row .dd-c-label { color: var(--text); font-weight: 700; }
.dd-flag .dd-c-unit, .dd-flag .dd-c-total { color: var(--color-profit-neg); }
.dd-flag .dd-c-label::after { content: ' ⚠'; }
/* ⓘ-иконка: наведение = native title, клик = поповер */
.dd-info { display: inline-block; cursor: pointer; color: var(--text2); opacity: .6; font-size: 12px; margin-left: 3px; user-select: none; }
.dd-info:hover, .dd-info:focus { opacity: 1; color: var(--accent); outline: none; }
.dd-mismatch { color: var(--text2); opacity: .55; margin-left: 4px; cursor: help; font-size: 12px; }
/* Рекомендации (actionability) */
.dd-notes { margin: 8px 18px 2px; display: flex; flex-direction: column; gap: 5px; }
.dd-note { font-size: 12px; padding: 7px 11px; border-radius: 6px; line-height: 1.4; }
/* Плохая заметка — красная (ошибки/убытки): токены error-* из theme.css */
.dd-note-bad  { background: var(--error-bg); color: var(--error); border: 1px solid var(--error-bg); }
.dd-note-info { background: var(--surface2); color: var(--text); border: 1px solid var(--border); }
.dd-note .dd-note-cta { color: var(--accent); font-weight: 600; text-decoration: none; white-space: nowrap; }
.dd-note .dd-note-cta:hover { text-decoration: underline; }
/* Поповер описания — позиционируется JS-ом (fixed), выше модалки и тостов, ниже dev-панели */
.dd-info-pop {
  position: fixed; z-index: 10000; max-width: 280px; width: max-content;
  background: var(--surface); border: 1px solid var(--border); border-radius: 8px;
  box-shadow: 0 8px 28px rgba(0,0,0,.18); padding: 10px 13px;
}
.dd-info-pop-t { font-weight: 700; color: var(--text); margin-bottom: 4px; font-size: 12.5px; }
.dd-info-pop-d { color: var(--text2); font-size: 12px; line-height: 1.5; }

/* ================================================================
   Settings popup (.ag-settings-popup / .asp-*) — ЕДИНЫЙ ИСТОЧНИК
   в /assets/aggrid-grouping.css (перенесено 2026-06-12, эталон = analytics).
   ================================================================ */

/* ================================================================
   D-D: Стрелки скролла ◀▶ и минимапа — канон 2026-06-08.
   Правила подключены из /assets/aggrid-scroll-helpers.css (shared).
   Этот блок удалён во избежание дублирования; shared CSS подключён
   в <head> через <link rel="stylesheet" href="/assets/aggrid-scroll-helpers.css">.
   ================================================================ */
/* УДАЛЕНО — см. /assets/aggrid-scroll-helpers.css (единый источник правил скролла) */

/* ================================================================
   «Все МП» comparison-грид: контраст группа-артикул vs под-строки МП.
   SCOPE: только .allmp-mode (добавляется на #ma-grid-wrap в _enterAllMode,
   снимается в _exitAllMode). Все прочие таблицы НЕ затрагиваются.
   Синие индикаторы-полоски (cell borders / ag-cell-focus) НЕ трогаем —
   они на ag-cell, не на ag-row background.
   ================================================================ */

/* Светлая тема: группа-артикул — surface2 (видимый тинт); под-строки МП — surface (белый) */
.allmp-mode .ag-row.ag-row-group {
  background: var(--surface2) !important;
}
.allmp-mode .ag-row.child-row {
  background: var(--surface) !important;
}
/* Hover под-строк МП: чуть темнее surface, чтобы был отклик при наведении */
.allmp-mode .ag-row.child-row:hover {
  background: var(--surface2) !important;
}

/* Тёмная тема: группа-артикул должна быть заметно темнее под-строк.
   --surface  = #1a1d27 (тёмный фон карточек)
   --surface2 = #242836 (чуть светлее)
   Инвертируем: группа = surface2 (более насыщенный), дети = surface (более тёмный/чистый). */
[data-theme="dark"] .allmp-mode .ag-row.ag-row-group {
  background: var(--surface2) !important;
}
[data-theme="dark"] .allmp-mode .ag-row.child-row {
  background: var(--surface) !important;
}
[data-theme="dark"] .allmp-mode .ag-row.child-row:hover {
  background: var(--surface2) !important;
}

/* ENG-007 (серт-кампания 2026-07): страничный тост .ma-toast удалён —
   заменён единым каноном window.MA_Toast (src/assets/notice-toast.css/.js),
   см. ma-aggrid.js toast(). */

/* MACustomFilter (.macf-*) — стили вынесены в shared-компаньон
   src/assets/aggrid-custom-filter.css (Группа 2 №22, WAVE 4a).
   Подключается в index.html после aggrid-theme.css. */

/* ================================================================
   ADR-0031: Кнопка «Ожидают реализации» в toolbar
   ================================================================ */
.tb-btn-pending {
  border-color: var(--accent);
  color: var(--accent);
  font-weight: 600;
}
.tb-btn-pending:hover {
  background: var(--accent);
  color: var(--on-accent);
}

/* ================================================================
   ADR-0031: Панель «Ожидают реализации» — модальный overlay
   ================================================================ */
.pending-panel {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 9000;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 32px 16px;
  overflow-y: auto;
}
/* N5 (2026-06-19): расширенный модал + AG Grid вместо <table>.
   Ширина увеличена ~70% (860→min(90vw,1440px)) для полноценной таблицы. */
.pending-modal {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  width: min(90vw, 1440px);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 8px 40px rgba(0,0,0,0.25);
}
.pending-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.pending-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
}
.pending-close-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 16px;
  color: var(--text2);
  font-family: inherit;
  padding: 2px 6px;
  border-radius: 4px;
  line-height: 1;
}
.pending-close-btn:hover { background: var(--surface2); color: var(--text); }

/* N5: pending-body — flex-колонка чтобы .pending-grid-wrap растянулся */
.pending-body {
  display: flex;
  flex-direction: column;
  padding: 16px 20px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.pending-loading, .pending-error, .pending-empty {
  padding: 20px 0;
  font-size: 13px;
  color: var(--text2);
  text-align: center;
}
.pending-error { color: var(--error); }

/* Описание для селлера */
/* Канон: 3px левая полоса убрана (AI-tell 2026-06-27); единый 1px border. */
.pending-desc {
  font-size: 13px;
  color: var(--text);
  line-height: 1.55;
  background: var(--surface2);
  border-radius: 6px;
  padding: 10px 14px;
  border: 1px solid var(--border);
}

/* Метрики */
.pending-metrics {
  display: flex;
  gap: 16px;
  margin: 14px 0 10px;
  flex-wrap: wrap;
}
.pending-metric {
  display: flex;
  flex-direction: column;
  background: var(--surface2);
  border-radius: 6px;
  padding: 10px 18px;
  min-width: 140px;
  border: 1px solid var(--border);
}
.pending-metric-val {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  line-height: 1.2;
}
.pending-metric-label {
  font-size: 11px;
  color: var(--text2);
  margin-top: 2px;
}
.pending-caveat {
  font-size: 11px;
  color: var(--text2);
  margin-bottom: 12px;
  font-style: italic;
}
/* Строка разбивки по статусам (в пути / ожидают / доставлены) */
.pending-status-line {
  font-size: 12px;
  color: var(--text2);
  margin: 6px 0 4px;
  padding: 4px 8px;
  background: var(--surface2);
  border-radius: 4px;
}

/* Переключатель вида модалки «Ожидают»: По товарам / По заказам */
.pending-view-toggle {
  display: inline-flex;
  gap: 2px;
  margin-top: 12px;
  padding: 2px;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 6px;
}
.pending-view-btn {
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--text2);
  background: none;
  border: none;
  cursor: pointer;
  padding: 5px 14px;
  border-radius: 4px;
  line-height: 1.2;
  transition: background 0.12s, color 0.12s;
}
.pending-view-btn:hover { color: var(--text); }
.pending-view-btn.is-active {
  background: var(--surface);
  color: var(--accent);
  box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

/* N5 (2026-06-19): AG Grid-контейнер таблицы «Ожидают».
   БАГ-1-ФИК: flex:1 не работает когда у предка только max-height (не height) —
   AG Grid получает clientHeight=0 и не рисует строки. Решение: явная высота
   на .pending-grid-wrap вместо flex:1. Внутренний грид domLayout:normal
   требует non-zero контейнера в момент createGrid(). */
.pending-grid-wrap {
  margin-top: 12px;
  height: min(58vh, 560px);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
/* AG Grid domLayout:normal требует явной высоты контейнера */
.pending-grid-container {
  width: 100%;
  height: 100%;
}
/* Task 5: шрифт ячеек pending-грида = 12px (паритет движку; QA: было 13px vs 12px движка).
   Row-height сохранён 34px (фото 32px требует место). */
.pending-grid-container .ag-cell {
  font-size: 12px;
}
/* Ссылка на отправление в pending-гриде */
.pending-posting-link {
  color: var(--accent);
  text-decoration: none;
}

/* Устаревший стиль <table> — оставлен для data-adr-0002-exempt при откате */
.pending-table-wrap {
  margin-top: 12px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.pending-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.pending-table thead th {
  background: var(--surface2);
  padding: 7px 12px;
  text-align: left;
  font-weight: 600;
  color: var(--text2);
  font-size: 11px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.pending-table tbody tr:hover { background: var(--surface2); }
.pending-table tbody td {
  padding: 6px 12px;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  white-space: nowrap;
}
.pending-table tbody tr:last-child td { border-bottom: none; }

/* ================================================================
   ADR-0031: Чипы качества данных («По SKU» — реклама + покрытие + orphan)
   ================================================================ */
.sku-dq-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 4px 0 2px;
}
.dq-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
  cursor: default;
  border: 1px solid transparent;
  line-height: 1.4;
}
/* DQ-бейджи — семантические токены theme.css (success/warning/error) */
.dq-ok {
  background: var(--success-bg);
  color: var(--success);
  border-color: var(--success-bg);
}
.dq-warn {
  background: var(--warning-bg);
  color: var(--warning);
  border-color: var(--warning-border);
}
.dq-error {
  background: var(--error-bg);
  color: var(--error);
  border-color: var(--error-bg);
}

/* ================================================================
   ADR-0031 §10: Orphan-группа «Без продаж за период»
   Строки в таблице с особым стилем (выделение + кнопка expand)
   ================================================================ */
/* Orphan-группа — предупреждающая жёлтая заливка (токены theme.css) */
.ag-row.orphan-group-row {
  background: var(--warning-bg) !important;
  border-bottom: 1px solid var(--warning-border) !important;
  cursor: pointer;
  font-weight: 600;
}
.ag-row.orphan-group-row:hover {
  background: var(--warning-border) !important;
}
/* Тёмная тема: orphan-группа использует тематический токен (достаточно контраста) */
[data-theme="dark"] .ag-row.orphan-group-row {
  background: var(--warning-bg) !important;
  border-bottom: 1px solid var(--warning-border) !important;
}
.ag-row.orphan-child-row {
  background: var(--surface2) !important;
  font-size: 11px;
  color: var(--text2);
}
.ag-row.orphan-child-row:hover {
  background: var(--warning-bg) !important;
}

/* ================================================================
   ADR-0031: Раздел методологии рекламы и хранения в info-block
   Коллапсируемые секции внутри общего info-block
   ================================================================ */
.meth-section {
  margin-top: 6px;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.meth-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: var(--surface2);
  cursor: pointer;
  user-select: none;
  font-size: 12px;
  font-weight: 600;
}
.meth-header:hover { background: var(--border); }
.meth-chevron { font-size: 10px; color: var(--text2); transition: transform .2s; }
.meth-section.open .meth-chevron { transform: rotate(180deg); }
.meth-body {
  display: none;
  padding: 10px 12px;
  font-size: 12px;
  color: var(--text2);
  line-height: 1.6;
  white-space: pre-wrap;
}
.meth-section.open .meth-body { display: block; }
.pending-num { font-family: monospace; font-size: 11px; }

/* ================================================================
   СТРОКА-СВОДКА (headline-summary) — §0 UI-зона задача 2.
   Всегда видна, ~36px. Резервируем min-height во избежание CLS.
   Прибыль + Маржа — bold-акцент; остальное — muted.
   ================================================================ */
.headline-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;       /* CLS: резервируем высоту до загрузки данных */
  padding: 4px 0;
  flex-wrap: wrap;
}
.hs-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
}
/* .hs-dot / .hs-item / .hs-muted / .hs-accent — перенесены в src/assets/page-shell.css (Ф1 Page Shell, 2026-06-03) */
/* Прибыль/убыток в шапке — семантические токены */
.hs-accent.pos { color: var(--color-profit-pos); }
.hs-accent.neg { color: var(--color-profit-neg); }
/* Индикатор покрытия закупкой в шапке — объясняет «маленькую» прибыль */
/* position:relative — якорь для абсолютного .cov-popover */
.hs-cov-wrap { display: inline-flex; align-items: center; gap: 4px; position: relative; }
.hs-cov {
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  padding: 1px 8px;
  border-radius: 10px;
  white-space: nowrap;
  /* cursor:pointer — кнопка открывает поповер */
  cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  line-height: inherit;
}
/* Покрытие закупкой — успех/предупреждение/ошибка через токены theme.css */
.hs-cov.ok   { background: var(--success-bg); color: var(--success); border-color: var(--success-bg); }
.hs-cov.warn { background: var(--warning-bg); color: var(--warning); border-color: var(--warning-border); }
.hs-cov.low  { background: var(--error-bg);   color: var(--error);   border-color: var(--error-bg); }
/* .hs-sep — перенесена в src/assets/page-shell.css (Ф1 Page Shell, 2026-06-03) */

/* Поповер покрытия закупкой — клик-triggered HTML (содержит пример бейджа).
   Аналог dq-popover; появляется слева, чтобы не выходить за правый край. */
.cov-popover {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 300px;
  max-width: 400px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.18);
  z-index: 500;
  padding: 10px 14px;
}
.cov-popover.open { display: block; }
.cov-popover-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--text2);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ================================================================
   DQ-ИНДИКАТОР (один чип «Данные ✓/!» + поповер)
   Заменяет 3 отдельных бейджа в infoblock.
   ================================================================ */
.dq-indicator-wrap {
  position: relative;
  flex-shrink: 0;
}
.dq-indicator-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  border: 1px solid var(--border);
  background: var(--surface2);
  color: var(--text2);
  transition: all .15s;
}
.dq-indicator-chip:hover { border-color: var(--accent); color: var(--accent); }
/* DQ-чип состояния — токены theme.css */
.dq-indicator-chip.dq-ok   { background: var(--success-bg); color: var(--success); border-color: var(--success-bg); }
.dq-indicator-chip.dq-warn { background: var(--warning-bg); color: var(--warning); border-color: var(--warning-border); }

/* Поповер — появляется при клике, не при hover (JS управляет .open) */
.dq-popover {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 280px;
  max-width: 360px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.18);
  z-index: 500;
  padding: 10px 14px;
}
.dq-popover.open { display: block; }
.dq-popover-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--text2);
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ================================================================
   ТУМБЛЕР ЛИНЗ (lens-bar) — §0 сегмент-контрол верхнего уровня.
   Резервируем min-height для CLS.
   ================================================================ */
.lens-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 34px;       /* CLS: резервируем высоту */
  margin: 6px 0 2px;
  flex-wrap: wrap;
}
/* Сегмент-контрол — две кнопки в одном блоке */
.lens-seg-ctrl {
  display: flex;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
}
.lens-btn {
  padding: 5px 14px;
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  background: transparent;
  color: var(--text2);
  border: none;
  border-right: 1px solid var(--border);
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.lens-btn:last-child { border-right: none; }
.lens-btn:hover { background: var(--surface2); color: var(--text); }
/* Активный сегмент — акцентный фон, текст поверх акцента (токен --on-accent = #fff) */
.lens-btn.active {
  background: var(--accent);
  color: var(--on-accent);
  cursor: default;
}
/* Подпись-разъяснение под активным сегментом */
.lens-caption {
  font-size: 12px;
  color: var(--text2);
  font-style: italic;
  line-height: 1.4;
}

/* UX-NM1/ANL-007: подсказка про незакрытый месяц (линза «Начисление денег»).
   Была мягкой однострочной подсказкой — находка владельца 07-03: терялась
   при быстром скане экрана. Усилена до полноценной warning-плашки ТОЙ ЖЕ
   анатомии, что danger .act-empty-banner выше по файлу (иконка + жирный
   заголовок + текст). Канон: 1px full-border (0 border-left:3px — AI-tell
   запрещён), SVG-иконка AlertTriangle (не эмодзи), токены --warning*. */
.open-month-hint {
  display: none; /* показывается через JS (.style.display = 'flex') */
  align-items: flex-start;
  gap: 12px;
  margin: 6px 0 0;
  padding: 14px 18px;
  background: var(--warning-bg);
  border: 1px solid var(--warning-border);
  border-radius: 8px;
}
.open-month-hint__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  margin-top: 2px;
  color: var(--warning);
}
.open-month-hint__body {
  flex: 1;
  min-width: 0;
}
.open-month-hint__title {
  font-size: 14px;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 3px;
}
.open-month-hint__text {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text2);
}

/* ================================================================
   АДАПТИВНЫЙ ПИКЕР: в cash-режиме дата-инпуты активны и выделены;
   в accrual-режиме они затушёваны (только месяц-чипы кликабельны).
   ================================================================ */
.ps-date-input.ps-date-disabled {
  opacity: 0.35;
  pointer-events: none;
  cursor: not-allowed;
}

/* ================================================================
   INFO-BLOCK: по умолчанию свёрнут (class .collapsed).
   Кнопка «Подробнее ▾» / «Свернуть ▲» управляет раскрытием.
   ================================================================ */
/* Минимальная высота свёрнутого блока зарезервирована через .info-block-header */
.info-block.collapsed .info-block-body { display: none; }

/* Скрытие элементов по линзе (cash):
   • «По склейкам» (.mode-tab) — таб режима;
   • «Ожидают» (.mode-tabs-pending) — кнопка панели ожидания (понятие только accrual).
   ФИКС 2026-06-01: раньше правило было только .mode-tab.lens-hidden, поэтому
   .mode-tabs-pending получала класс lens-hidden, но НЕ скрывалась (display оставался
   block) — «Ожидают» висела в линзе «Начисление денег». */
.mode-tab.lens-hidden,
.mode-tabs-pending.lens-hidden { display: none; }

/* ================================================================
   WB-баннер (.mp-wb-banner) + interim-панель (.mp-interim-panel)
   ВЫНЕСЕНЫ В ОБЩИЙ СЛОЙ → /assets/mp-support.css (KEYSTONE мульти-МП).
   Здесь больше не дублируются: Возвраты/Реклама/Цены/Дашборд получают
   тот же вид из общего файла. Стиль идентичен прежнему (.mp-wb-banner =
   тот же элемент, что #mp-wb-banner — JS ставит и id, и класс).

/* ================================================================
   РЕЖИМ «ГРАФИКИ» (charts-mode.js)
   Панель .ma-charts-panel заменяет #ma-grid-wrap когда активна.
   Все цвета — только через var(--name) из theme.css.
   ================================================================ */

/* Обёртка режима — скроллируемая рабочая область */
.ma-charts-panel {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px 32px;
  background: var(--bg);
}

/* Сетка карточек: 2 равных колонки на широких экранах */
.ma-charts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  max-width: 1600px;
}

/* Одиночная карточка графика */
.ma-chart-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 8px);
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0; /* предотвращаем переполнение в flex-дочернем */
}

/* Карточка на полную ширину (2 колонки) */
.ma-chart-card--full {
  grid-column: 1 / -1;
}

/* Заголовок карточки — строка с названием и переключателем метрики */
.ma-chart-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.ma-chart-card__title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}

/* Тело карточки — контейнер для SVG-графика */
.ma-chart-card__body {
  width: 100%;
  min-height: 120px;
}

/* Переключатель «Штуки / Выручка» внутри карточки */
.ma-chart-metric-toggle {
  display: flex;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
.ma-chart-metric-btn {
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 500;
  background: transparent;
  color: var(--text2);
  border: none;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.12s, color 0.12s;
}
.ma-chart-metric-btn + .ma-chart-metric-btn {
  border-left: 1px solid var(--border);
}
.ma-chart-metric-btn.active {
  background: var(--accent);
  color: var(--on-accent);
}
.ma-chart-metric-btn:hover:not(.active) {
  background: var(--surface2);
  color: var(--text);
}

/* Состояние загрузки */
.ma-charts-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 48px 24px;
  color: var(--text2);
  font-size: 13px;
}
.ma-charts-spinner {
  width: 24px;
  height: 24px;
  color: var(--accent);
  animation: ma-charts-spin 0.9s linear infinite;
}
@keyframes ma-charts-spin {
  to { transform: rotate(360deg); }
}

/* Состояние ошибки / пустых данных */
.ma-charts-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 48px 24px;
  text-align: center;
  color: var(--text2);
}
.ma-charts-error svg {
  color: var(--text3, var(--text2));
  opacity: 0.6;
}
.ma-charts-error__title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}
.ma-charts-error__detail {
  font-size: 11px;
  color: var(--text2);
  max-width: 320px;
}
.ma-charts-error__retry {
  margin-top: 4px;
  padding: 6px 18px;
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  background: var(--accent);
  color: var(--on-accent);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: opacity 0.12s;
}
.ma-charts-error__retry:hover { opacity: 0.85; }

/* Пустое состояние внутри отдельной карточки */
.ma-charts-empty-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  font-size: 12px;
  color: var(--text2);
  font-style: italic;
}

/* Примечание (notes) из ответа API */
.ma-charts-notes {
  grid-column: 1 / -1;
  font-size: 11px;
  color: var(--text2);
  padding: 6px 0;
  border-top: 1px solid var(--border);
}

/* Адаптив: на экранах ≤1200px — 1 колонка */
@media (max-width: 1200px) {
  .ma-charts-grid {
    grid-template-columns: 1fr;
  }
  .ma-chart-card--half,
  .ma-chart-card--full {
    grid-column: 1 / -1;
  }
}

/* ================================================================
   PRESET-ФИЛЬТР (deep-link из «Склада»: ?skus=…)
   Плашка-уведомление над гридом — видна только при активном фильтре.
   Канон: 1px border + accent-tinted bg (как «Единиц в листинге»).
   0 border-left:3px (AI-tell запрещён), 0 hardcoded цветов.
   ================================================================ */
.preset-filter-notice {
  display: none; /* показывается через JS (.style.display = 'flex') */
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  background: var(--accent-light, color-mix(in srgb, var(--accent) 10%, transparent));
  border: 1px solid var(--accent);
  border-radius: 6px;
  margin: 6px 0 4px;
  font-size: 13px;
  color: var(--text);
  line-height: 1.4;
}
/* Кнопка «Сбросить» preset-фильтра — стиль ссылки (синяя, как налоговый баннер) */
.preset-filter-clear {
  background: none;
  border: none;
  padding: 0;
  font-size: 13px;
  font-family: inherit;
  color: var(--accent);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  flex-shrink: 0;
}
.preset-filter-clear:hover,
.preset-filter-clear:focus-visible {
  color: var(--accent-hover, var(--accent));
  outline: none;
}

/* ================================================================
   ANL-004/ANL-007: явное объяснение легитимно-пустого акта реализации
   (незакрытый Ozon'ом месяц). Плашка над гридом — крупнее preset-фильтра
   (она объясняет ПОЧЕМУ грид пуст, должна быть замечена сразу при скане
   сверху-вниз — находка владельца 07-03: прежний info-синий тон терялся
   на фоне отрицательных сумм в шапке).
   Канон: danger-тон (--error/--error-bg — см. src/assets/column-settings.css
   .cs-modal__error, тот же прецедент), 1px full-border (0 border-left:3px —
   AI-tell запрещён), SVG-иконка AlertTriangle (не эмодзи), заголовок жирнее,
   действие — ссылка синим акцентом (канон-ссылка, цвет НЕ меняется).
   ================================================================ */
.act-empty-banner {
  display: none; /* показывается через JS (.style.display = 'flex') */
  align-items: flex-start;
  gap: 12px;
  padding: 14px 18px;
  background: var(--error-bg);
  border: 1px solid var(--error);
  border-radius: 8px;
  margin: 6px 0 4px;
}
.act-empty-banner__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  margin-top: 2px;
  color: var(--error);
}
.act-empty-banner__body {
  flex: 1;
  min-width: 0;
}
.act-empty-banner__title {
  font-size: 14px;
  font-weight: 800;
  color: var(--text);
  margin-bottom: 3px;
}
.act-empty-banner__text {
  font-size: 13px;
  line-height: 1.5;
  color: var(--text2);
}
/* Ссылка-действие — стиль идентичен .preset-filter-clear выше (синяя, подчёркнутая) */
.act-empty-banner__link {
  background: none;
  border: none;
  padding: 0;
  font-size: 13px;
  font-family: inherit;
  font-weight: 600;
  color: var(--accent);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}
.act-empty-banner__link:hover,
.act-empty-banner__link:focus-visible {
  color: var(--accent-hover, var(--accent));
  outline: none;
}
   ================================================================ */