/* ============================================================================
   table-shell.css — CSS, которым ВЛАДЕЕТ движок MA_TableShell.
   Подключить: <link rel="stylesheet" href="/assets/table-shell.css">
   (после base.css/page-shell.css, до page styles).

   НАЗНАЧЕНИЕ (Пилот 2, 2026-06-10): структурно чинит «двойной лейбл» кнопок
   тулбара у любой adopt-страницы. Кнопки с адаптивной подписью имеют ДВА спана:
     <span class="tb-full">Колонки по умолч.</span><span class="tb-compact">Колонки</span>
   Без правила показываются ОБА → «Колонки по умолч. Колонки» (баг returns:
   страница не грузила table-layout.css и не имела локального правила).

   Это правило-источник для adopt-страниц MA_TableShell. analytics НЕ грузит
   этот файл (у него своё правило в local styles.css, брейкпоинт 1500px) —
   потому analytics не задет. advertising грузит table-layout.css (там то же
   правило). table-shell.css = единый источник для будущих adopt-страниц,
   у которых нет ни того, ни другого (returns).

   0 hardcoded цветов (правило чисто структурное, display-only). Только токены —
   если что-то добавляется, через var(--*) из theme.css.
   ============================================================================ */

/* === Адаптивные подписи кнопок тулбара (структурный фикс двойного лейбла) ===
   По умолчанию виден полный текст; на узком вьюпорте (<1400px) — компактный.
   Зеркало table-layout.css:223-230 (единый интент). */
.tb-btn .tb-compact { display: none; }
.tb-btn .tb-full    { display: inline; }
@media (max-width: 1399px) {
  .tb-btn .tb-full    { display: none; }
  .tb-btn .tb-compact { display: inline; }
}

/* ============================================================================
   A11y: видимое кольцо фокуса клавиатуры на контролах хрома (№33, 2026-06-11).
   :focus-visible → кольцо появляется ТОЛЬКО при клавиатурной навигации (Tab),
   не при клике мышью → не «портит» визуал для мыши, но даёт обязательный для
   WCAG 2.4.7 ориентир клавиатурному пользователю. Кольцо = единый токен
   --focus-ring (= --accent), контраст к --surface ≥3:1 в обеих темах.

   Покрывает хром, которым ВЛАДЕЕТ MA_TableShell: кнопка отзыва/период (.biz-btn),
   кнопки тулбара (.tb-btn / .tb-btn-icon / .tb-link-btn / .tb-gbtn), поле поиска и
   крестик. Все 5 AG-Grid-страниц грузят этот файл → получают кольцо единообразно.
   Чисто аддитивно: не меняет classNames/layout, только outline на :focus-visible.
   ============================================================================ */
.biz-btn:focus-visible,
.tb-btn:focus-visible,
.tb-btn-icon:focus-visible,
.tb-link-btn:focus-visible,
.tb-gbtn:focus-visible,
.tb-search-clear:focus-visible,
.tb-search:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
  /* НЕ трогаем border-radius — современный outline сам следует радиусу элемента,
     а перезапись радиуса дала бы скачок формы на фокусе (визуальный регресс). */
}
/* Здесь намеренно НЕТ голого :focus-правила — мышиный фокус не должен давать
   обводку. В целевых браузерах :focus-visible поддержан; отсутствие кольца в
   древних браузерах не ломает работу (graceful degradation). */

/* ПРИМ. (2026-06-15): CSS режима «во весь экран» (body.ma-fullscreen) и скрытия
   опц-кнопок (.ma-tb-opt-hidden) + секции Настроек (.ma-tbopt-*) ЖИВУТ в
   page-shell.css, а НЕ здесь — потому что table-shell.css грузит ТОЛЬКО returns,
   а page-shell.css грузят ВСЕ 5 AG-Grid-страниц. C3/C-settings нужны везде. */

/* ============================================================================
   Право-якорная группа тулбара (.te-toolbar-right-group) — Excel + Настройки +
   «во весь экран». Движок MA_TableShell (table-shell.js: rightGroupStart →
   <div class="te-toolbar-right-group">, fullscreen-кнопка доинжектится ВНУТРЬ
   группы перед rightGroupEnd) рендерит ЭТУ группу, но САМО правило-якорь жило
   только в page-local CSS (analytics/styles.css, pricing/styles.css) и legacy
   table-layout.css — НИ ОДИН из них returns не грузит. Итог на /returns/
   (инцидент 2026-06-22, диагностирован live PL): группа без правила падала в
   дефолт display:block; margin-left:0 → НЕ прижата к правому краю (зазор ~273px)
   + кнопка «во весь экран» не выравнивалась со строкой тулбара.

   Делаем право-якорение СВОЙСТВОМ ДВИЖКА: правило живёт в table-shell.css (его
   грузит returns + assembly-sort) → починили один раз, работает на всех adopt-
   страницах MA_TableShell, у которых нет ни table-layout.css, ни локального
   правила. Зеркало канона table-layout.css:588 (тот же интент, те же токены).
   analytics/pricing/my-expenses не грузят этот файл, но у них уже есть СВОЁ
   рабочее правило → регресса нет (правила идентичны, дублирование безвредно).
   margin-left:auto съедает свободное место строки и прижимает группу к правому
   краю независимо от числа предшествующих кнопок. 0 hardcoded — только токен. */
.te-toolbar-right-group {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-left: auto;
}

/* ============================================================================
   Строка «Числа:» (slots.tabsRow) — переключатель режима значений вынесен из
   тулбара на свою строку (решение Александра 2026-06-27, зеркало analytics:
   тулбар = действия, «Числа:» = как показываем). Эти классы жили ТОЛЬКО в
   analytics/styles.css (его returns НЕ грузит) → на returns строка рендерилась
   без стилей. Переносим в движковый CSS — тот же ход, что с .te-toolbar-right-
   group (инцидент 2026-06-22): returns/assembly-sort берут отсюда; analytics
   этот файл не грузит и имеет своё идентичное правило → регресса нет. Разметку
   строки даёт src/{page}/shell-config.js (SLOT_TABS_RET). margin-left:auto на
   разделителе прижимает блок «Числа: [Валовые|На ед.|Смешанный]» к правому краю.
   Только токены, 0 hardcoded цветов. ============================================ */
.mode-tabs-row {
  display: flex;
  align-items: stretch;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.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;
}
/* Кнопка «?» рядом с «Числа:» — круглый бейдж (как у группы «Баланс»). */
.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;
}
.mode-tabs-row .bal-qmark {
  align-self: center;
  margin-left: 0;
}
