/* ============================================================
   BDKazak — общие партиалы волны 2 аудита UI (26.09.2026).
   План: Plans/ui_wave2_2026-09-26/plan.md; причины и находки —
   отчёт аудита Plans/audit_ui_2026-09-25/report.md.

   Новые стили волны живут здесь, а не в site.css (его ведёт другое
   окно). Файл подключается из base.html после остальных проектных CSS,
   поэтому его модификаторы перекрывают модульные файлы без !important.
   Кегли — только токены var(--bdk-fs-*) (сторож
   apps/core/tests/test_ui_typography_guard.py), отступы кратны 4 px.

   Разделы:
   1. Реестр звонков: мобильные карточки и плеер записи (Ф1.1)
   ============================================================ */

/* ---- 1. Реестр звонков (crm/reports/calls_registry.html) ---------- */

/* Плеер записи в ячейке таблицы — прежний встроенный стиль шаблона
   (style="height: 32px; max-width: 100%;"), перенесён без изменений:
   партиал записи общий у таблицы и карточки. */
.bdk-call-rec {
  height: 32px;
  max-width: 100%;
}

/* Карточка звонка (< 768 px) — поверх .bdk-mobile-card* из mobile_ux.css.
   Вся карточка ведёт в карточку звонка: время растянуто на неё через
   ::after (как у карточки сделки, .bdk-dl-card-link), а ссылки клиента,
   номер телефона и плеер подняты над ним и нажимаются сами. */
.bdk-call-card {
  position: relative;
}
.bdk-call-card-link {
  flex-shrink: 0;
  white-space: nowrap;
  text-decoration: none;
}
.bdk-call-card-link::after {
  content: "";
  position: absolute;
  inset: 0;
}
.bdk-call-card a:not(.bdk-call-card-link),
.bdk-call-card audio {
  position: relative;
  z-index: 1;
}

/* Бейдж «Вх./Исх.» и исход — справа в верхней строке, в одну строку;
   длинный исход («Звонки на это направление запрещены») переносится,
   а время слева остаётся целым. */
.bdk-call-card-kind {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  min-width: 0;
  text-align: end;
}

.bdk-call-card-line {
  margin-top: 4px;
}

/* Запись — внизу карточки, под тонким разделителем. */
.bdk-call-card-rec {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--bdk-border);
}
/* Плеер в карточке — во всю ширину, высота 48 px: тач-цель не меньше
   44 px (HIG), а у Firefox плеер по умолчанию ниже 44 px. */
.bdk-call-rec--card {
  display: block;
  width: 100%;
  height: 48px;
}

/* ---- 2. Пустые состояния на общем партиале (Ф6) -------------------- */

/* Компактный модификатор _empty_state.html: без крупной круглой иконки,
   без карточных отступов/тени и с приглушённым некрупным заголовком —
   для пустых списков внутри мелких панелей (доска рабочего стола,
   crm/workbench/_board.html), где стандартная 64-пиксельная иконка и
   отступ 48px были бы непропорционально большими. Визуально повторяет
   прежний голый <p class="text-bdk-muted mb-0">, но через общий партиал. */
.bdk-empty-state--compact {
  padding: 0;
  margin: 0;
  background: none;
  box-shadow: none;
  border-radius: 0;
  text-align: left;
}
.bdk-empty-state--compact .bdk-empty-title {
  margin: 0;
  font-size: var(--bdk-fs);
  font-weight: 400;
  color: var(--bdk-text-muted);
}

/* Договоры (crm/contracts/registry.html): счётчики в шапке (Всего/по
   статусам) и заголовок панели «Эксклюзивы» — были встроенные кегли
   18px/15px, теперь ступени шкалы. */
.bdk-contract-count-num {
  font-size: var(--bdk-fs-title);
  font-weight: 500;
}
.bdk-panel-head-title {
  font-size: var(--bdk-fs-lg);
}

/* ---- 3. Баннер готовности (core/_readiness_banner.html) ------------ */

/* Встроенные font-size вынесены в классы; цвет/фон/border-radius —
   динамические (readiness.accent_color) или уже были var(...) с
   fallback, оставлены в style= как были — тег меняет только кегль. */
.bdk-readiness-icon {
  font-size: var(--bdk-fs-title);
}
.bdk-readiness-title {
  font-size: var(--bdk-fs-lg);
}
.bdk-readiness-message {
  font-size: var(--bdk-fs);
}
.bdk-readiness-reason {
  font-size: var(--bdk-fs-xs);
}
.bdk-readiness-checked-at {
  font-size: var(--bdk-fs-xs);
}
.bdk-readiness-cta {
  font-size: var(--bdk-fs);
}
.bdk-readiness-cta-icon {
  font-size: var(--bdk-fs-xs);
}

/* ---- 4. Комиссии (crm/finance/commission_list.html) ---------------- */

/* Карточка (< 768 px): суммы «база · комиссия · чистая» темнее обычного
   приглушённого текста .bdk-mobile-card-text — это ключевые деньги
   строки, не метаданные. Сами числа не переносятся посреди разряда —
   money_rub уже ставит неразрывные пробелы, здесь только цвет/вес. */
.bdk-comm-card-sums {
  color: var(--bdk-text, #111827);
  font-weight: 500;
}
.bdk-comm-card-action {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--bdk-border);
}
/* Кнопка действия — общий партиал _action_btn.html (36 px в таблице,
   аудит УИ 25.09.2026 требовал тач-цель ≥44 px в карточке). */
.bdk-mobile-card .bdk-fin-action-btn {
  min-height: 44px;
}

/* ---- 5. Рынок: брокеры (market/broker_list.html) ------------------- */

/* Бейдж «Скрыт» — был инлайновый font-size:11px и в таблице, и в новой
   карточке; вынесен в токен (--bdk-fs-xs = 12 px, ближайшая ступень
   шкалы) сразу в обеих раскладках. */
.bdk-broker-hidden-badge {
  background: rgba(60, 60, 67, 0.08);
  color: var(--ios-text-secondary, #3c3c43);
  font-size: var(--bdk-fs-xs);
}

/* ---- 6. ГАБ (properties/rental_business_list.html) ----------------- */

.bdk-rental-card-line {
  margin-top: 4px;
}

/* ---- 7. Пользователи АТС (crm/telephony/megafon_vats_users.html) --- */

/* Дефект аудита 26.09.2026: на 390 px документ раздувался до 759 px.
   .table-responsive сама по себе была верно сужена и корректно листала
   таблицу (1008 px) вбок — overflow-x:auto работал, — но её содержимое
   всё равно попадало в scrollWidth документа: вложенный скролл-контейнер
   внутри flex-каркаса (.bdk-shell) не останавливает подсчёт scrollWidth у
   <html> ни родительским overflow-x:hidden, ни min-width:0 (перепробовано
   и измерено изолированным повтором разметки на playwright — точное
   совпадение чисел 759/390). Останавливает только layout containment:
   contain:layout прямо запрещает содержимому влиять на размеры снаружи,
   сам скролл таблицы при этом не страдает (проверено scrollLeft). */
.bdk-vats-table-wrap {
  contain: layout;
}
.bdk-vats-card-actions {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--bdk-border);
}
/* Тот же select, что и в таблице: длинную подпись кандидата (ФИО + пометка
   «занят логином») не даём растянуть карточку — сжимается и обрезается. */
.bdk-vats-card-actions select {
  min-width: 0;
  max-width: 100%;
}

/* ---- 8. Кокпит руководителя (crm/reports/cockpit.html) ------------- */

/* KPI по менеджерам — карточка (< 768 px): выручка вынесена отдельной
   строкой справа, как в таблице (колонка «Выручка, ₽» text-end). */
.bdk-cockpit-kpi-card-line {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--bdk-border);
}

/* ---- 9. Единый переключатель отчётов (crm/reports/_switcher.html, К19) ---
   Ф2.2, 26.09.2026. До партиала переключатель в каждом из семи отчётов
   (funnel/manager/deal_sla/showings/speed_to_lead/discipline/deal_cycle)
   собирался вручную и ни разу не совпадал набором кнопок с соседними.
   Один и тот же .bdk-chip (site.css) на всю ленту; на телефоне — лента с
   горизонтальной прокруткой, тач-цель чипа ≥44 px (HIG). На ≥768 px чипы
   остаются обычного компактного размера — там переключатель не единственный
   ряд управления страницей, а мышью попасть в 32-пиксельную кнопку легко. */
.bdk-report-switcher {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 16px;
  padding-bottom: 4px;
}
.bdk-report-switcher .bdk-chip {
  flex: 0 0 auto;
}
@media (max-width: 767.98px) {
  .bdk-report-switcher .bdk-chip {
    min-height: 44px;
    padding: 0 16px;
  }
}

/* ---- 10. Отчёты CRM: мобильные карточки таблиц (К19, Ф2.2) ---------- */

/* Воронка и «По менеджерам»: строка «Итого» — отдельной карточкой с чуть
   более заметным фоном и жирным начертанием, как строка <tfoot> в таблице. */
.bdk-funnel-card--totals,
.bdk-mgr-card--totals {
  background: var(--bdk-bg, #f7f8fa);
  font-weight: 500;
}

/* «По менеджерам»: сотрудник без сделок за период — как table-warning
   у строки таблицы, но приглушённее (карточка и так плотная). */
.bdk-mgr-card--idle {
  background: rgba(255, 193, 7, 0.08);
  border-color: rgba(255, 193, 7, 0.4);
}
/* Выручка — акцентная строка карточки (деньги), не приглушённые метаданные,
   как «база · комиссия · чистая» у комиссий (раздел 4). */
.bdk-mgr-card-revenue {
  color: var(--bdk-text, #111827);
  font-weight: 500;
}

/* SLA сделок: чекбокс выбора в верхней строке карточки — тот же
   x-model.number="selected", что и в таблице (один x-data на панель, см.
   комментарий в шаблоне). Заголовок сделки растягивается между чекбоксом
   и суммой, чтобы сумма всегда была прижата к правому краю. */
.bdk-sla-card .bdk-mobile-card-title {
  flex: 1 1 auto;
  min-width: 0;
}
.bdk-sla-card-check {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  /* Общее правило .form-check-input (отрицательный margin-left под
     .form-check, site.css и Bootstrap) сдвигало галочку на рамку карточки;
     здесь галочка стоит по центру своей зоны касания (раздел 14). */
  margin: 0;
}

/* Дисциплина: кнопка drill-down «Сделки (N)» и раскрывашка проблемных
   сделок — под тонким разделителем, как запись в карточке звонка
   (раздел 1) и действие в карточке комиссии (раздел 4). Свой collapse
   (id="disc-deals-card-N") — id таблицы (id="disc-deals-N") не трогаем. */
.bdk-disc-card-drill {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--bdk-border);
}

/* ---- 11. Тач-цели на телефоне и резерв под «Помощь» (Ф5, К21/К22) -- */

/* К21: .bdk-chip (site.css:1081) не задаёт min-height — на телефоне чип с
   короткой подписью («Все», «×») получался ниже 44 px (тач-цель, HIG).
   Инлайновые style="min-height:44px;" в market/demand_list.html и
   market/listing_list.html теперь дублируют это правило — сняты в
   разметке. justify-content — на случай, если чип когда-нибудь окажется
   растянут на всю ширину (сейчас inline-flex шире контента не бывает). */
@media (max-width: 768px) {
  .bdk-chip {
    min-height: 44px;
    justify-content: center;
  }
}

/* К21: заголовок карточки объекта — растянутая ссылка на всю карточку
   (по образцу .bdk-dl-card-link в списке сделок, site.css:5296+).
   Разметка всех четырёх списков (apartment/building/complex/
   land_plot_list.html) идентична: .bdk-object-card (position: relative,
   site.css:1393) > .bdk-object-card-image[a] + .bdk-card-checkbox[label]
   + .bdk-object-card-body > h3.bdk-object-card-title > a — правило общее,
   шаблоны не меняем. Чекбокс выбора уже z-index: 3 (site.css:1499) —
   остаётся кликабельным без правок. Ссылка-фото в разметке идёт РАНЬШЕ
   заголовка и без явного z-index проиграла бы более позднему элементу с
   тем же auto-слоем (растянутая ссылка перекрыла бы её) — поднимаем. */
.bdk-object-card-image {
  z-index: 1;
}
.bdk-object-card-title a::after {
  content: "";
  position: absolute;
  inset: 0;
}

/* К21: кнопки строки риска (crm/_risk_actions.html — «Открыть», «Поставить
   задачу», «Напомнить») были с инлайновым style="min-height:36px;" — одно
   и то же значение на любой ширине. На телефоне тач-цель должна быть не
   меньше 44 px (HIG), на компьютере 36 px достаточно (мышь точнее пальца). */
.bdk-risk-action-btn {
  min-height: 36px;
}
@media (max-width: 768px) {
  .bdk-risk-action-btn {
    min-height: 44px;
  }
}

/* К21: реестр звонков, карточка на телефоне (crm/reports/_calls_client.html —
   партиал общий с ячейкой таблицы, правим только через класс-предок
   .bdk-call-card-line, заведённый в Ф1.1). Ссылка на клиента и номер
   tel: были строками текста ~15 px — ниже тач-цели. Z-index над
   растянутой ссылкой карточки уже даёт правило раздела 1
   (.bdk-call-card a:not(.bdk-call-card-link)) — здесь только высота и
   вертикальное центрирование текста внутри неё. */
@media (max-width: 768px) {
  .bdk-call-card-line a {
    display: flex;
    align-items: center;
    min-height: 44px;
  }
}

/* К22: нижний отступ .bdk-content (sidebar.css:415, фиксированные 96 px)
   не учитывает env(safe-area-inset-bottom) — тот же запас, что уже есть у
   самой кнопки «Помощь» (sidebar.css:347,457). На телефоне с нижней
   safe-area (домашняя полоса iPhone) кнопка выходит за пределы уже
   зарезервированных 96 px и закрывает последнюю строку/кнопку страницы
   («Напомнить» в рисках, последнюю карточку реестра звонков). На
   устройствах без safe-area ничего не меняется (env(...,0px) = 0) —
   отступ остаётся не меньше прежнего. Правило той же специфичности (два
   класса), что и в sidebar.css, но подключено позже — переопределяет. */
.bdk-has-sidebar .bdk-content {
  padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
}
/* На карточке сделки/лида уже есть свой запас перед прилипшей нижней
   панелью действий (.bdk-dc-bottombar-gap / .bdk-lc-bottombar-gap —
   76 px, site.css:5829,6177), а саму кнопку «Помощь» там же поднимает
   над панелью JS-коллизия (bdk_shell.js, --bdk-fab-shift). Второй отступ
   поверх первого был бы двойным — гасим его на этих двух страницах. */
@media (max-width: 767.98px) {
  .bdk-has-sidebar .bdk-content:has(.bdk-dc-bottombar),
  .bdk-has-sidebar .bdk-content:has(.bdk-lc-bottombar) {
    padding-bottom: 40px;
  }
}

/* ---- 12. Шапка страницы, «Сервис ▾», отказ в доступе (Ф2, К14/К16) --
   Общий партиал core/_page_header.html (тег {% page_header %},
   apps/core/templatetags/bdk_page_header.py). Классы .bdk-page-header*,
   .bdk-page-title h1 (24 px, на телефоне 20 px) и .bdk-page-subtitle —
   прежние, из site.css; здесь только новое. */

/* 12.1. Стрелка «назад» слева от заголовка: сетка «стрелка | h1», подпись —
   под заголовком (на телефоне — во всю ширину). Стрелка — кнопка-иконка
   44×44 (тач-цель HIG) с подсказкой, ведёт на конкретную страницу. */
.bdk-page-title--back {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 8px;
  align-items: center;
}
.bdk-page-title--back > .bdk-page-subtitle {
  grid-column: 2;
}
@media (max-width: 768px) {
  .bdk-page-title--back > .bdk-page-subtitle {
    grid-column: 1 / -1;
  }
}
.bdk-page-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--bdk-radius);
  color: var(--bdk-text-muted);
  font-size: var(--bdk-fs-title);
  text-decoration: none;
}
.bdk-page-back:hover {
  color: var(--bdk-text);
  background: var(--bdk-bg);
}
.bdk-page-back:focus-visible {
  outline: none;
  color: var(--bdk-text);
  box-shadow: 0 0 0 3px var(--bdk-primary-bg);
}

/* Длинная подпись (у заявок — абзац с объяснением) не тянется во всю
   ширину экрана: строка длиннее ~70 знаков читается плохо. Только в
   шапках, собранных общим партиалом (метка data-page-header). */
[data-page-header] .bdk-page-subtitle {
  max-width: 72ch;
}

/* Счётчик рядом с заголовком («Входящие без карточки» — новых N). */
.bdk-page-title-badge {
  margin-left: 4px;
  background: var(--ios-accent);
  color: #fff;
  font-size: var(--bdk-fs-xs);
  vertical-align: middle;
}

/* 12.2. Меню шапки — «⋯» (действия сверх трёх на виду, решение владельца
   №1) и «Сервис ▾» (crm/_service_menu.html, решение №4): пункт — тач-цель
   44 px, кегль основного текста. */
.bdk-page-menu {
  padding: 4px;
  border: 1px solid var(--bdk-border);
  border-radius: var(--bdk-radius);
  box-shadow: var(--bdk-shadow-lg);
}
.bdk-page-menu .dropdown-item,
.bdk-page-more-menu .btn {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: var(--bdk-control-h);
  padding: 8px 12px;
  border-radius: var(--bdk-radius);
  font-size: var(--bdk-fs);
  white-space: normal;
}
/* Кнопка, ушедшая в «⋯», выглядит пунктом меню: без рамки и заливки.
   Главные действия (.btn-primary) в «⋯» не попадают — их ставят первыми. */
.bdk-page-more-menu .btn {
  justify-content: flex-start;
  border: 0;
  background: transparent;
  color: var(--bdk-text);
  font-weight: 400;
  text-align: start;
  box-shadow: none;
}
.bdk-page-more-menu .btn:hover,
.bdk-page-more-menu .btn:focus-visible {
  background: var(--bdk-bg);
}
.bdk-page-more-menu form {
  margin: 0;
}

/* 12.3. Центрированная шапка — отказ в доступе (403.html): заголовок под
   крупной иконкой, по центру колонки, как тексты и кнопки восстановления. */
.bdk-page-header--center {
  margin-bottom: 8px;
  text-align: center;
}
.bdk-page-header--center .bdk-page-header-row {
  justify-content: center;
  margin-bottom: 8px;
}

/* 12.4. «Оживить базу» (crm/reactivate/reactivate.html, _row.html,
   _enroll_modal.html) — бывший блок <style> шаблона. Кегли на шкале:
   15 → --bdk-fs, 13 → --bdk-fs-sm, 12 → --bdk-fs-xs, иконка пустого
   списка 34 → --bdk-fs-display; отступы — кратные 4 px. Заголовок
   страницы (.rz-head/.rz-title/.rz-sub) ушёл в общую шапку. */
.rz-list {
  padding: 0;
}
.rz-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--ios-separator, rgba(60, 60, 67, 0.12));
}
.rz-row:last-child {
  border-bottom: 0;
}
.rz-main {
  flex: 1 1 auto;
  min-width: 0;
}
.rz-name {
  display: block;
  overflow: hidden;
  font-size: var(--bdk-fs);
  font-weight: 500;
  color: var(--ios-text-primary, #1c1c1e);
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rz-name:hover {
  color: var(--ios-accent, #00599c);
}
.rz-meta {
  margin-top: 4px;
  font-size: var(--bdk-fs-sm);
  color: #8e8e93;
}
.rz-badge {
  flex: 0 0 auto;
  padding: 4px 12px;
  border-radius: var(--bdk-radius, 12px);
  font-size: var(--bdk-fs-sm);
  font-weight: 500;
  white-space: nowrap;
}
.rz-badge.warm {
  background: #f2f2f7;
  color: #6c6c70;
}
.rz-badge.cool {
  background: #fff4e5;
  color: #b25e00;
}
.rz-badge.cold {
  background: #ffe9e9;
  color: #b3261e;
}
.rz-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
}
.rz-act {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: var(--bdk-radius, 12px);
  background: var(--bdk-primary-tint, #e8eff6);
  color: var(--ios-accent, #00599c);
  text-decoration: none;
}
.rz-act:hover {
  filter: brightness(0.96);
}
.rz-act[disabled] {
  opacity: 0.5;
}
/* Флеш-результат действия: живёт до следующей перезагрузки строки. */
.rz-flash {
  display: inline-block;
  margin-top: 8px;
  padding: 4px 12px;
  border-radius: var(--bdk-radius, 12px);
  font-size: var(--bdk-fs-xs);
  font-weight: 500;
}
.rz-flash.ok {
  background: #e6f7ec;
  color: #1a7f3c;
}
.rz-flash.muted {
  background: #f2f2f7;
  color: #6c6c70;
}
/* Выбор сценария в модалке: строки-радио с тач-целью 44 px. */
.rz-plan-list {
  display: flex;
  flex-direction: column;
}
.rz-plan {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-height: 44px;
  padding: 12px 4px;
  border-bottom: 1px solid var(--ios-separator, rgba(60, 60, 67, 0.12));
  cursor: pointer;
}
.rz-plan:last-child {
  border-bottom: 0;
}
.rz-plan input {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-top: 4px;
}
.rz-plan-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.rz-plan-name {
  font-size: var(--bdk-fs);
  font-weight: 500;
  color: var(--ios-text-primary, #1c1c1e);
}
.rz-plan-meta {
  font-size: var(--bdk-fs-sm);
  color: #8e8e93;
}
.rz-empty {
  padding: 48px 16px;
  text-align: center;
}
.rz-empty-icon {
  font-size: var(--bdk-fs-display);
  color: #34c759;
}
.rz-empty-text {
  margin-top: 8px;
  font-size: var(--bdk-fs);
  color: #6c6c70;
}
.rz-pager {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
}
.rz-pager .rz-page-info {
  font-size: var(--bdk-fs-sm);
  color: #8e8e93;
}
@media (max-width: 575.98px) {
  /* На узком экране действия уезжают под имя, чтобы не резать текст. */
  .rz-row {
    flex-wrap: wrap;
  }
  .rz-main {
    flex-basis: 100%;
  }
}

/* 12.5. «Подбор объектов» (crm/matches/matches.html, _match_to_selection.html)
   — бывший блок <style> шаблона. Кегли на шкале: 15 → --bdk-fs,
   13 → --bdk-fs-sm, 11–12 → --bdk-fs-xs; отступы — кратные 4 px. Заголовок
   (.se-matches-header/-title/-count) ушёл в общую шапку, неиспользуемые
   .se-empty* сняты (пустое состояние — _empty_state.html). */
.se-matches-filter {
  font-size: var(--bdk-fs);
}
.se-matches-filter-reset {
  font-size: var(--bdk-fs-xs);
}
/* Группа сделки */
.se-match-group {
  margin-bottom: 12px;
  padding: 16px;
  border: 1px solid rgba(60, 60, 67, 0.08);
  border-radius: 14px;
  background: var(--bdk-surface, #fff);
  box-shadow: var(--bdk-shadow, 0 1px 2px rgba(0, 0, 0, 0.06));
}
.se-mg-deal-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.se-mg-deal-title {
  flex: 1;
  min-width: 0;
  font-size: var(--bdk-fs);
  font-weight: 500;
  color: var(--ios-text-primary, #1c1c1e);
  text-decoration: none;
}
.se-mg-deal-title:hover {
  color: var(--ios-accent, #007aff);
}
.se-mg-stage-badge {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: var(--bdk-fs-xs);
  font-weight: 500;
  color: #fff;
}
/* Карточка объекта-подбора */
.se-match-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(60, 60, 67, 0.08);
}
.se-match-card:last-child {
  border-bottom: 0;
}
.se-match-score-ring {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(0, 122, 255, 0.08);
  font-size: var(--bdk-fs-sm);
  font-weight: 500;
  color: var(--ios-accent, #007aff);
}
.se-match-score-ring.high {
  background: rgba(52, 199, 89, 0.12);
  color: #34c759;
}
.se-match-score-ring.medium {
  background: rgba(255, 149, 0, 0.1);
  color: #9a5b00;
}
.se-match-info {
  flex: 1;
  min-width: 0;
}
.se-match-name {
  display: block;
  overflow: hidden;
  font-size: var(--bdk-fs);
  font-weight: 500;
  color: var(--ios-text-primary, #1c1c1e);
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.se-match-name:hover {
  color: var(--ios-accent, #007aff);
}
.se-match-type {
  margin-top: 4px;
  font-size: var(--bdk-fs-xs);
  color: #8e8e93;
}
.se-match-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.se-reason-chip {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: var(--bdk-fs-xs);
  font-weight: 500;
}
.se-reason-match {
  background: rgba(52, 199, 89, 0.12);
  color: #34c759;
}
.se-reason-fail {
  background: rgba(255, 59, 48, 0.08);
  color: #ff3b30;
}
.se-match-explain {
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: var(--bdk-radius, 12px);
  background: #f2f2f7;
  font-size: var(--bdk-fs-xs);
  line-height: 1.4;
  color: var(--ios-text-primary, #1c1c1e);
}
.se-match-explain div + div {
  margin-top: 4px;
}
.se-match-actions {
  display: flex;
  flex-shrink: 0;
  gap: 8px;
}
.se-btn-dismiss {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 44px;
  min-height: 44px;
  padding: 8px 12px;
  border: none;
  border-radius: var(--bdk-radius, 12px);
  background: rgba(255, 59, 48, 0.08);
  font-size: var(--bdk-fs-sm);
  color: #ff3b30;
  cursor: pointer;
}
.se-btn-dismiss:hover {
  background: rgba(255, 59, 48, 0.16);
}
.se-btn-to-selection {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 44px;
  min-height: 44px;
  padding: 8px 12px;
  border: none;
  border-radius: var(--bdk-radius, 12px);
  background: #f2f2f7;
  font-size: var(--bdk-fs-sm);
  font-weight: 500;
  color: var(--bdk-primary);
  white-space: nowrap;
  cursor: pointer;
}
.se-btn-to-selection:hover {
  background: #e5e5ea;
}
.se-btn-in-selection {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: var(--bdk-radius, 12px);
  background: rgba(52, 199, 89, 0.12);
  font-size: var(--bdk-fs-sm);
  font-weight: 500;
  color: #34c759;
  text-decoration: none;
  white-space: nowrap;
}
.se-btn-in-selection:hover {
  background: rgba(52, 199, 89, 0.2);
  color: #248a3d;
}

/* 12.6. Страницы настроек: «Обязательность полей»
   (core/required_fields_settings.html — бывший блок <style>: 0,875rem →
   --bdk-fs, 0,8rem → --bdk-fs-sm; отступы — кратные 4 px) и кнопка
   «Сохранить» пяти страниц настроек (была встроенная 1rem). */
.rf-page {
  max-width: 960px;
  margin: 0 auto;
  padding-bottom: 96px;
}
.rf-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
/* inline-flex — чтобы min-height на телефоне (ниже) действовал на ссылку. */
.rf-tab {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border: 1px solid var(--ios-separator, rgba(60, 60, 67, 0.12));
  border-radius: 999px;
  background: var(--ios-bg-sheet, #fff);
  font-size: var(--bdk-fs);
  color: var(--ios-text-secondary, #6e6e73);
  text-decoration: none;
  white-space: nowrap;
}
.rf-tab.active {
  border-color: var(--bdk-primary, #00599c);
  background: var(--bdk-primary, #00599c);
  color: #fff;
}
/* К21: вкладки — тач-цель 44 px на телефоне (были ~32 px). */
@media (max-width: 768px) {
  .rf-tab {
    min-height: 44px;
  }
}
.rf-search-wrap {
  position: relative;
  margin-bottom: 16px;
}
.rf-search-wrap i {
  position: absolute;
  top: 50%;
  left: 12px;
  transform: translateY(-50%);
  color: var(--ios-text-secondary, #8e8e93);
}
.rf-search-input {
  padding-left: 36px;
}
.rf-group {
  margin-bottom: 20px;
}
.rf-group-title {
  padding: 0 4px 8px;
  font-size: var(--bdk-fs-sm);
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--ios-text-secondary, #8e8e93);
}
.rf-field-row[hidden] {
  display: none !important;
}
.rf-hint-input {
  font-size: var(--bdk-fs-sm);
  color: var(--ios-text-secondary);
}
.rf-sticky-bar {
  position: sticky;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin: 0 -16px;
  padding: 12px 16px calc(env(safe-area-inset-bottom) + 12px);
  border-top: 1px solid var(--ios-separator, rgba(60, 60, 67, 0.12));
  background: var(--ios-bg-sheet, #fff);
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.04);
}
.rf-changed-badge {
  margin-right: auto;
  font-size: var(--bdk-fs-sm);
  color: var(--ios-text-secondary, #6e6e73);
}
/* «Сохранить» на страницах настроек — ступень lg (была встроенная 1rem). */
.bdk-settings-save {
  font-size: var(--bdk-fs-lg);
}
/* Колонка страниц настроек (дисциплина, публичные страницы, версии
   приложения, внешние площадки): шапка и карточка — одной шириной, по
   центру. Раньше max-width стоял встроенным стилем на самой карточке. */
.bdk-settings-page {
  max-width: 760px;
  margin: 0 auto;
}

/* ---- 13. Термины глоссария: касание на телефоне (Ф4, К20) ---------- */
/* {% term %} (apps/core/templatetags/bdk_glossary.py) теперь рендерит
   <button>, а не <abbr title=…> — на телефоне title вообще никак не
   открывался. Кнопка использует общий клик-делегат .bdk-help-toggle из
   base.html (тот же, что у «?»), но .bdk-help-toggle в ui_help.css
   рассчитан на круглую 22×22 иконку — сбрасываем эту геометрию и
   возвращаем вид обычного подчёркнутого текста (.bdk-term, site.css:2359)
   плюс браузерный reset самой кнопки (шрифт/рамка/фон). Компаунд-селектор
   .bdk-term.bdk-help-toggle специфичнее обоих исходных одноклассовых правил
   — порядок подключения ui_help.css/ui_partials.css в base.html не важен. */
.bdk-term.bdk-help-toggle {
  display: inline;
  width: auto;
  height: auto;
  margin-left: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  vertical-align: baseline;
}
/* Тач-зона 44×44 псевдоэлементом (как у иконки «?») тут не годится: термин —
   слово в потоке текста или в ячейке таблицы, а не отдельная иконка с полями
   вокруг; раздутая невидимая зона накрыла бы соседние слова/ссылки. Тап по
   самому слову — тот же осознанный компромисс, что и у обычной ссылки внутри
   текста (у них тоже нет увеличенной тач-зоны). */
.bdk-term.bdk-help-toggle::after {
  content: none;
}
.bdk-term.bdk-help-toggle:hover,
.bdk-term.bdk-help-toggle:focus-visible {
  background: transparent;
}

/* Неинтерактивный термин (interactive=False, рендерится как <abbr>, не как
   <button> — см. docstring term() в bdk_glossary.py) намеренно стоит внутри
   своего кликабельного предка (ссылка сортировки, вкладка-Alpine) — кнопку
   туда вложить нельзя. На устройствах без наведения (@media hover: none)
   тап по такому слову просто активирует предка, а пунктирное подчёркивание
   и курсор-подсказка обещают пояснение, которого по тапу не будет — снимаем
   декор. На компьютере наведение по-прежнему показывает title как раньше,
   здесь ничего не меняем. Интерактивный термин (button.bdk-term.bdk-help-toggle
   выше) не задет — это другой элемент, к нему abbr-селектор не относится. */
@media (hover: none) {
  abbr.bdk-term {
    text-decoration: none;
    cursor: inherit;
  }
}

/* ---- 14. Доработки по замеру после волны 2: карточки-ссылки, тач-цели, мелкий текст ---- */

/* Общий модификатор мобильных карточек, где короткая ссылка-заголовок
   (a.bdk-mobile-card-title) должна вести на весь объект — по образцу
   карточки звонка (раздел 1, .bdk-call-card) и карточки сделки
   (.bdk-dl-card-link, site.css). Ссылка растягивается на всю карточку через
   ::after, остальные интерактивные элементы подняты над ним z-index'ом —
   иначе становятся ненажимаемыми (кнопка действия, чекбокс, select внутри
   карточки делают своё, отдельное от перехода в объект). Класс ставится в
   шаблоне только там, где заголовок карточки реально ссылка — на карточках
   с заголовком-span (нет прав/некуда вести) модификатор не добавляется, и
   вся карточка остаётся некликабельной, как раньше. */
.bdk-mobile-card--link {
  position: relative;
}
.bdk-mobile-card--link a.bdk-mobile-card-title::after {
  content: "";
  position: absolute;
  inset: 0;
}
.bdk-mobile-card--link a:not(.bdk-mobile-card-title),
.bdk-mobile-card--link button,
.bdk-mobile-card--link input,
.bdk-mobile-card--link label,
.bdk-mobile-card--link select,
.bdk-mobile-card--link textarea,
.bdk-mobile-card--link summary,
.bdk-mobile-card--link audio,
.bdk-mobile-card--link form {
  position: relative;
  z-index: 1;
}

/* SLA сделок (crm/reports/deal_sla.html): чекбокс выбора зрительно остаётся
   тем же 20×20 (.bdk-sla-card-check, раздел 10), но тач-цель вокруг —
   44×44 (HIG); по словам проверяющего, голый чекбокс «налезал на левую
   границу карточки». Раздутие компенсируем отрицательными полями строго в
   пределах внутреннего отступа карточки (.bdk-mobile-card: padding 12px
   14px, mobile_ux.css) — строка и карточка не увеличиваются, а тач-зона
   доходит ровно до края карточки и не вылезает за него. Обёртка — <label>,
   попадает в список поднятых элементов правила выше (сам чекбокс — тот же
   .stuck-deal-checkbox с тем же x-model.number, шаблон не меняет логику). */
.bdk-sla-card-check-hit {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: -12px 0 -12px -14px;
  cursor: pointer;
}

/* Брокеры рынка (market/broker_list.html): вся карточка уже кликабельна
   (hx-get на самой карточке — не трогаем), но номер телефона внутри был
   строкой текста ~18 px, ниже тач-цели. Тот же приём, что и у номера в
   карточке звонка (.bdk-call-card-line a, раздел 11). onclick
   stopPropagation в разметке уже не даёт тапу по номеру открыть карточку. */
@media (max-width: 768px) {
  .bdk-broker-card a[href^="tel:"] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}

/* Пользователи АТС (crm/telephony/megafon_vats_users.html): логин в <code>
   наследует кегль контекста (14 px в карточке, 12 px в таблице через
   .small), но моноширинный шрифт браузера рисует его заметно мельче
   объявленной кегли — измерено ~10,5 px что в карточке, что в таблице.
   Фиксируем кегль явно токеном шкалы вместо наследования от контекста. */
.bdk-vats-login {
  font-size: var(--bdk-fs-xs);
}