/* «Отчёт → Перезвоны» (ТЗ №90, п. 5.1): строки «название · полоса · число» для «Сколько ждали» и «По дням недели», плотные строки таблиц.
   Подключается после ds.css; значения — только переменные из tokens.css (ни цветов, ни размеров шрифта числом). Разметка — webapp/public/js/pages/callbacks.js. */

.cb-row { flex-wrap: nowrap; gap: var(--sp-3); padding: var(--sp-2) 0; }
.cb-row .ds-row-main { flex: 0 0 9em; font-weight: var(--fw-strong); }
.cb-bar { flex: 1 1 auto; min-width: 48px; }
.cb-count { flex: 0 0 auto; min-width: 72px; text-align: right; font-weight: var(--fw-strong); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cb-count .muted { margin-left: var(--sp-1); font-weight: var(--fw-text); }

.cb-table th, .cb-table td { padding-top: var(--sp-2); padding-bottom: var(--sp-2); }
.cb-table .cb-raw { display: block; font-size: var(--fs-12); }
.cb-table td:last-child { white-space: nowrap; }

@media (max-width: 720px) {
  .cb-row .ds-row-main { flex-basis: 7em; }
  /* Телефон: быстрые периоды и «Отдел» переносятся строкой ниже, а не уезжают за край и не налезают друг на друга; панель не липнет — две строки съели бы экран. */
  .cb-filters { position: static; flex-wrap: wrap; overflow-x: visible; }
  .cb-filters .period-picker { flex: 1 1 100%; }
}