/* ─────────────────────────────────────────────────────────────────────────
   ИТОГИ ВМЕСТО ИНСТРУМЕНТОВ — аудит экранов 24 сентября 2026.

   Правила экранов, которые в тот день начали показывать то, что продукт уже
   знал: голос за 24 часа, сводку «Интеграций», отметку «AI» у задач, выбор
   часового пояса, список CRM. Отдельный файл, а не приписка в redesign.css:
   в ту же ночь оболочку правили параллельно, и общий хвост одного файла
   сталкивал бы правки. Своей палитры нет — только токены --pk-* / --rp-*,
   поэтому файл стоит после pack-design.css и до rtl.css. Стороны — только
   логические (inline-start / inline-end): test-arabic-locale следит за всеми
   файлами src/*.css.
   ───────────────────────────────────────────────────────────────────────── */

/* ── /voice: имя страницы и «за последние 24 часа» ─────────────────────── */

/* Заголовок стоит внутри сетки страницы, а у сетки свой зазор: второй отступ
   снизу у .pk-header дал бы двойной промежуток до шапки голоса. */
.voice-page > .pk-header { margin-bottom: 0; }

/* ОДНА КОЛОНКА СЕТКИ, НЕ ШИРЕ СТРАНИЦЫ. Колонка по умолчанию — `auto`, и она
   растягивалась до самого широкого min-content ребёнка: замер на 390 px —
   страница 352 px, колонка 382 px, у каждой карточки срезан правый край
   (main прячет переполнение, поэтому прокрутки не было — было обрезание).
   minmax(0, 1fr) держит колонку в ширину страницы; на широком экране
   ничего не меняется — одна колонка и так во всю ширину. */
.page-stack.voice-page { grid-template-columns: minmax(0, 1fr); }

.voice-day {
  display: grid;
  gap: 8px;
  padding: 10px 14px;
}
.voice-day-head {
  margin: 0;
  color: var(--pk-muted, var(--rp-ink-2));
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.voice-day-note { margin: 0; color: var(--pk-dim, var(--rp-ink-3)); font-size: 12px; }
.voice-day-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}
.voice-day-tile {
  display: grid;
  gap: 2px;
  align-content: start;
  min-width: 0;
  padding: 8px 12px;
  border: 1px solid var(--pk-line, var(--rp-line));
  border-radius: var(--rp-r-sm, 8px);
  background: none;
  color: inherit;
  font: inherit;
  text-align: start;
}
/* A bare `button { min-height: 40px }` lives in the legacy sheets; the tile
   sizes to its two lines like its non-button siblings. */
.app-shell .voice-day-tile.is-link { min-height: 0; cursor: pointer; }
.voice-day-tile.is-link:hover { border-color: var(--pk-line-2, var(--rp-line-2)); }
.voice-day-value {
  color: var(--pk-text, var(--rp-ink));
  font-size: 20px;
  font-weight: 650;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.voice-day-label { color: var(--pk-muted, var(--rp-ink-2)); font-size: 12px; }

/* «Состояние линии» ушло в Admin View: у клиента в первой строке стола две
   карточки, и они делят ширину строки, а не оставляют третью колонку пустой.
   Свои медиа-правила повторены: этот класс сильнее по специфичности, чем
   .voice-comp-top в медиа-запросах redesign.css, и без них перебил бы одну
   колонку на телефоне. */
.voice-comp-top.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 900px) {
  .voice-comp-top.is-two { grid-template-columns: minmax(0, 1fr); }
}

/* ── «Интеграции»: подключено · требует внимания · не подключено ─────── */

.isum {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 2px 0 10px;
}
.isum-chip {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  padding: 7px 14px;
  border: 1px solid var(--pk-line-2, var(--rp-line));
  border-radius: 999px;
  background: var(--pk-card, transparent);
  color: var(--pk-muted, var(--rp-ink-2));
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
/* The legacy bare-button min-height would make the pills 40px tall. */
.app-shell .isum-chip, .app-shell .isum-clear { min-height: 0; }
.isum-chip:hover:not(:disabled) { border-color: var(--pk-blue-line, var(--rp-line-2)); color: var(--pk-text, var(--rp-ink)); }
.isum-chip:disabled { cursor: default; opacity: 0.55; }
.isum-n { color: var(--pk-text, var(--rp-ink)); font-size: 15px; font-weight: 650; font-variant-numeric: tabular-nums; }
.isum-chip.is-connected .isum-n { color: var(--pk-green, var(--rp-green)); }
.isum-chip.is-attention .isum-n { color: var(--pk-amber, var(--rp-amber)); }
.isum-chip.is-on { border-color: var(--pk-blue-line, var(--rp-line-2)); background: var(--pk-blue-soft, transparent); color: var(--pk-text, var(--rp-ink)); }
.isum-wait { color: var(--pk-dim, var(--rp-ink-3)); font-size: 12.5px; }
/* «из них сейчас не удалось проверить: N» — рядом с «Не подключено», тихо (24.09.2026). */
.isum-unchecked { color: var(--pk-amber, var(--rp-amber)); font-size: 12.5px; align-self: center; }
.isum-clear {
  padding: 4px 10px;
  border: 0;
  background: none;
  color: var(--pk-muted, var(--rp-ink-2));
  font: inherit;
  font-size: 12.5px;
  text-decoration: underline;
  cursor: pointer;
}
/* ── CRM: строка инструментов на телефоне и колонки списка ─────────────── */

/* «⋯» — только на телефоне. */
.workspace .pk-bar .pk-bar-overflow { display: none; }
/* Замер на 390 px: четыре ряда кнопок, ~160 px до первой карточки. Теперь один
   ряд — поиск, «+ Новый лид», «Фильтры», «⋯»; остальное (имя воронки, вид,
   «Ещё», карта доски, 🔥, ⚡) показывается строкой ниже, когда «⋯» нажата.
   Решает CSS, кнопка лишь меняет aria-expanded (состояние — во view доски).
   Без :has() браузер отбросит правило целиком — и строка останется прежней,
   многорядной, а не сломанной. */
@media (max-width: 640px) {
  .workspace .pk-bar { flex-wrap: wrap; row-gap: 8px; }
  .workspace .pk-bar .crm-search { order: 0; flex: 1 1 0; min-width: 0; }
  .workspace .pk-bar .pk-new { order: 1; }
  .workspace .pk-bar .pk-filter { order: 2; }
  .workspace .pk-bar .pk-bar-overflow {
    order: 3;
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0 11px;
    font-size: 16px; line-height: 1;
  }
  .workspace .pk-bar .pk-chips { order: 4; flex-basis: 100%; }
  .workspace .pk-bar > :is(.pk-pipe, .pk-pipename, .pk-ctl-view, .pk-bar-count, .crm-more, .pk-nav, .pk-score-sort, .pk-automate) { order: 5; }
  .workspace .pk-bar:not(:has(> .pk-bar-overflow[aria-expanded="true"])) > :is(.pk-pipe, .pk-pipename, .pk-ctl-view, .crm-more, .pk-nav, .pk-score-sort, .pk-automate) { display: none; }
}
/* На узком телефоне поиск — своей строкой (24.09.2026, мобильный проход): в
   одном ряду с «+ Новый лид», «Фильтры» и «⋯» полю оставалось 78 px на 375 и
   93 на 390, и от подсказки «Имя, телефон…» было видно «Им». Кнопки встают
   рядом строкой ниже — они в неё помещаются. */
@media (max-width: 480px) {
  .workspace .pk-bar .crm-search { flex: 1 1 100%; }
  /* Лупа внутри поля — под палец: 34 px вместо 26 (место справа в поле уже
     оставлено, 38 px, а с «×» — 64). */
  .workspace .pk-bar .crm-search-go { width: 34px; height: 34px; }
  .workspace .pk-bar .crm-search input { min-height: 38px; }
}

/* Колонки «Скоринг» и «Ждёт ответа»: чип скоринга — тот же, что на доске. */
.crm-list td.c-score, .crm-list td.c-waiting { white-space: nowrap; }
.crm-list td.is-unknown, .crm-list td.is-none { color: var(--pk-dim, var(--rp-ink-3)); cursor: help; }

/* ШИРИНА КОЛОНКИ — ПО ИМЕНИ, А НЕ ПО МЕСТУ (24.09.2026).
   pack-design.css раздаёт ширины через th:nth-last-child(12…1) — двенадцать
   колонок, считая с конца. «Скоринг» и «Ждёт ответа» сделали их четырнадцать,
   и счёт с конца отдал все 100% последним двенадцати: «Сделка» и «Контакт»
   получили ширину 0 (замер на превью, 1440: th «Сделка» — 0 px). Здесь ширина
   привязана к имени колонки (класс col-<ключ> на th; при table-layout: fixed
   ширины задаёт первая строка — заголовок). Сумма — 100% для полного набора;
   если «Скоринга» или «Ждёт ответа» нет, остальные делят место пропорционально.
   Вес .by-key (0,4,1) выше правил по месту (0,3,1) — порядок файлов не важен. */
.crm-listv .crm-list.by-key th.col-title    { width: 12.5%; }
.crm-listv .crm-list.by-key th.col-contact  { width: 10%; }
.crm-listv .crm-list.by-key th.col-phone    { width: 9.5%; }
.crm-listv .crm-list.by-key th.col-company  { width: 7.5%; }
.crm-listv .crm-list.by-key th.col-stage    { width: 7.5%; }
.crm-listv .crm-list.by-key th.col-score    { width: 6%; }
.crm-listv .crm-list.by-key th.col-waiting  { width: 5%; }
.crm-listv .crm-list.by-key th.col-owner    { width: 8%; }
.crm-listv .crm-list.by-key th.col-priority { width: 6%; }
.crm-listv .crm-list.by-key th.col-source   { width: 6.5%; }
.crm-listv .crm-list.by-key th.col-value    { width: 7%; }
.crm-listv .crm-list.by-key th.col-activity { width: 5.5%; }
.crm-listv .crm-list.by-key th.col-next     { width: 4.5%; }
.crm-listv .crm-list.by-key th.col-created  { width: 4.5%; }
/* Колонки нет — её доля уходит «Сделке», а не расползается по всем, включая
   колонку галочек (замер: без «Скоринга» она росла с 34 до 77 px). */
.crm-listv .crm-list.by-key.no-score th.col-title { width: 18.5%; }
.crm-listv .crm-list.by-key.no-waiting th.col-title { width: 17.5%; }
.crm-listv .crm-list.by-key.no-score.no-waiting th.col-title { width: 23.5%; }
/* Чип «🔥 82» — 47 px: в узкой колонке ему нужна клетка без лишних полей. */
.crm-listv .crm-list.by-key td.c-score { padding-inline: 6px; }
/* …и заголовкам этих двух колонок тоже (24.09.2026, мобильный проход). На
   узком экране таблица стоит на своих 1180 px, «Скоринг» получает 69 px,
   «Ждёт ответа» — 57, и при полях по 10 px «СКОРИНГ» (58 px текста) и
   «ОТВЕТА» (45) срезались на середине слова: это не кнопки-сортировки, у
   которых перенос включён (pack-design.css, «A VALUE MAY BE SHORTENED…»). */
@media (max-width: 980px) {
  .crm-listv .crm-list.by-key th.col-score,
  .crm-listv .crm-list.by-key th.col-waiting { padding-inline: 4px; }
  /* «WAITING» (58 px) не помещался и в 49 px без полей: процент «Сделки»
     отдан «Ждёт ответа» — сумма та же, «Сделка» (136 px) и так с многоточием.
     Без «Скоринга» его 6 % по-прежнему уходят «Сделке»: 11,5 + 6 = 17,5
     (без «Ждёт ответа» — те же 17,5, без обеих — 23,5, как и на столе). */
  .crm-listv .crm-list.by-key th.col-title { width: 11.5%; }
  .crm-listv .crm-list.by-key th.col-waiting { width: 6%; }
  .crm-listv .crm-list.by-key.no-score th.col-title { width: 17.5%; }
}
.crm-listv .crm-list.by-key td.c-score .pk-score { margin: 0; }

/* СПИСОК, КОТОРЫЙ НЕ ВЛЕЗ, ПРОКРУЧИВАЕТСЯ ВБОК САМ (аудит 24.09.2026, §2.2).
   Замер на превью, 390 px: таблица 1180 px (min-width из redesign.css), обёртка
   332 px — и 819 px таблицы за правым краем, куда не добраться. Три правила
   вместе: обёртка `overflow: visible` (pack-design.css, раздел 11 — на широком
   экране одна прокрутка, страницы, и шапка липнет к ней), общее правило
   узкого экрана `table { display: block; overflow-x: auto }` (redesign.css)
   делало таблицу своим блоком шириной 1180, а main.workspace прячет
   переполнение. Прокрутки не было нигде — было обрезание. На 1280 то же самое:
   18 px последней колонки.
   Теперь обёртка сама прокручивается вбок — ровно тогда, когда таблица не
   помещается: запрос контейнера по ширине панели списка, а не экрана, поэтому
   порог точный при любой ширине меню. Где помещается (1440, 1536), не меняется
   ничего: одна прокрутка страницы и липкая к ней шапка. Страница вбок не
   ездит — ширина панели больше не зависит от таблицы (inline-size).
   Колонка «Сделка» стоит на месте, пока остальное едет: по ней понятно, чья
   это строка. Вертикально шапка на узком экране не липнет — у прокрутки вбок
   своя область, и `top` отсчитывался бы от неё; строки при этом не
   перекрываются. */
.crm-listv { container-type: inline-size; container-name: crm-list; }
@container crm-list (max-width: 1179.98px) {
  /* `position: relative` — the scroller is also the containing block of what
     sits in the cells absolutely (the screen-reader text of «Ждёт ответа»):
     without it those 1 px spans were placed against an ancestor outside the
     scroller, at x = 702 on a 390 px screen, and stretched main.workspace to
     703 px of scrollable width (measured in the preview). */
  .crm-listv > .crm-list-wrap {
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
  }
  .crm-listv > .crm-list-wrap > table.crm-list { display: table; overflow: visible; }
  .crm-listv .crm-list thead th { top: 0; }
  .crm-listv .crm-list :is(th.col-title, td.c-title) {
    position: sticky;
    inset-inline-start: 0;
    z-index: 2;
    background: var(--t68, var(--rp-panel));
    border-inline-end: 1px solid var(--pk-line, var(--rp-line));
  }
  .crm-listv .crm-list thead th.col-title { z-index: 4; }
  .crm-listv .crm-list tbody tr:hover > td.c-title {
    background: linear-gradient(rgb(var(--ch-accent) / 0.07), rgb(var(--ch-accent) / 0.07)), var(--t68, var(--rp-panel));
  }
  .crm-listv .crm-list tbody tr.picked > td.c-title {
    background: linear-gradient(rgb(var(--ch-blue) / 0.12), rgb(var(--ch-blue) / 0.12)), var(--t68, var(--rp-panel));
  }
}

/* ── «Задачи»: выполнено AI-агентом ─────────────────────────────────────── */

.tsk-ai {
  display: inline-block;
  margin-inline-start: 6px;
  padding: 0 6px;
  border: 1px solid var(--pk-blue-line, var(--rp-line-2));
  border-radius: 999px;
  background: var(--pk-blue-soft, transparent);
  color: var(--pk-text, var(--rp-ink));
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 16px;
  vertical-align: 1px;
  cursor: help;
}
.tsk-shown { margin: 10px 2px 0; }

/* ── «Настройки»: без внутреннего меню, часовой пояс с поиском ─────────── */

/* Меню слева дублировало вкладки над ним и ушло; форма — во всю ширину. */
.set13.set13-single { grid-template-columns: minmax(0, 1fr); }
.set13.set13-single .set13-body { border-inline-start: 0; padding-inline-start: 0; }
.set13-tz { align-content: start; }
.set13-tz .set13-tz-search { min-height: 36px; }
/* Поле, чьё сохранённое значение экран не прочитал (24.09.2026): пунктир, а
   после отказа сохранить — красная рамка. Подпись под полями говорит, почему. */
.set13-profile-form .is-unknown :is(select, input[type="text"]) { border-style: dashed; }
.set13-profile-form .is-missing :is(select, input[type="text"]) {
  border-color: var(--rp-red, var(--lg-red-4));
  box-shadow: 0 0 0 1px var(--rp-red, var(--lg-red-4));
}
.set13-unknown-note {
  margin: 10px 0 0;
  color: var(--pk-muted, var(--rp-ink-2));
  font-size: 12.5px;
}
.set13-unknown-note.is-missing { color: var(--rp-red, var(--lg-red-4)); }
.set13-elsewhere {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--pk-line, var(--rp-line));
  color: var(--pk-muted, var(--rp-ink-2));
  font-size: 12.5px;
}

/* ── Колокол на телефоне: окно целиком на экране (24.09.2026) ─────────────
   Окно уведомлений привязано к правому краю колокола (inset-inline-end: 0) и
   шире места слева от него: на 390 px колокол кончается на x = 309, окно
   шириной 358 начиналось на x = −49 — «ation centre», «… tasks», обрезанные
   строки (замер на превью). На узком экране окно стоит у полей экрана, а по
   высоте — там же, под колоколом: top: auto оставляет его на своём месте в
   потоке. Слишком длинное прокручивается внутри, а не уходит за низ. */
@media (max-width: 560px) {
  .rp-pop.rp-pop-bell {
    position: fixed;
    top: auto;
    inset-inline: 16px;
    width: auto;
    margin-top: 8px;
    max-height: calc(100vh - 140px);
    max-height: calc(100dvh - 140px);
    overflow-y: auto;
  }
}
/* …и окно поиска — так же (24.09.2026, мобильный проход). На ≤480 px поиск в
   полосе стал значком лупы 40 px у левого края, а окно поиска (343 px)
   по-прежнему центрировалось по нему (left: 50% и сдвиг на половину, в
   redesign.css): начиналось на x = −131, левая треть — за краем экрана (замер
   375×812, открытое окно). На узком экране — у полей экрана, под полосой. */
@media (max-width: 560px) {
  .rp-pop.rp-pop-search {
    /* rtl-exempt: поля симметричны — по 16 px с обеих сторон при любом
       направлении письма; физические left/right перебивают физический же
       left: 50% из redesign.css (у него та же пометка). */
    position: fixed;
    top: auto;
    left: 16px; right: 16px;
    width: auto;
    transform: none;
    margin-top: 8px;
  }
}

/* ── «Операции»: схема маршрута сворачивается, когда маршрут уже есть ─────
   Заголовок схемы стал <summary>: сетка .ops-flow-head снимает у него
   стандартный маркер, поэтому свой — стрелка у конца строки. Отступ между
   заголовком и схемой — только у раскрытой (у .ops-flow свой gap, но внутри
   <details> он не действует). */
.ops-flow-fold > summary.ops-flow-head {
  position: relative;
  padding-inline-end: 28px;
  list-style: none;
  cursor: pointer;
}
.ops-flow-fold > summary.ops-flow-head::-webkit-details-marker { display: none; }
.ops-flow-fold > summary.ops-flow-head::after {
  content: "▾";
  position: absolute;
  inset-inline-end: 4px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--pk-muted, var(--rp-ink-2));
  font-size: 14px;
}
.ops-flow-fold:not([open]) > summary.ops-flow-head::after { content: "▸"; }
[dir="rtl"] .ops-flow-fold:not([open]) > summary.ops-flow-head::after { content: "◂"; }
.ops-flow-fold[open] > .ops-flow-track { margin-top: 14px; }
.ops-flow.is-folded { padding-block: 12px; }

.idesk-filter-note {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: var(--pk-muted, var(--rp-ink-2));
  font-size: 13px;
}
