/* Главная (Р-33; Д2 — «Обзор» по виду роли): переключатель вида, цепочка
 * месяца, графики и рейтинг объектов (компоненты — charts.css), старение
 * долга полосами на CSS, крупнейшие должники, «Требуют внимания», закрытие
 * месяца.
 * Только токены из tokens.css; панели — общий .panel (debtors.css).
 * Таблиц со sticky-шапкой и .empty-state внутри нет: правило ui.css
 * `.app-scroll:has(.table-scroll, .empty-state…)` снимает со страницы
 * скролл — главная скроллится обычным .app-scroll. */

/* --- Колонки --- */

.dash-columns {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.dash-main {
  flex: 1.3;
  min-width: min(460px, 100%);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dash-side {
  flex: 1;
  min-width: min(340px, 100%);
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Вид «Инженер» (доводка Д3б): на телефоне боковая колонка — аварии,
   просрочка, без исполнителя — первой, над графиками (02-roles §2.7 «план
   дня»); на широком экране — справа, как у всех видов */
@media (max-width: 767px) {
  .dash-columns--side-first .dash-side {
    order: -1;
  }
}

.dash-link {
  font-size: var(--font-size-hint);
}

/* --- Старение долга --- */

.dash-aging__row {
  display: grid;
  grid-template-columns: 100px minmax(80px, 1fr) 150px 110px;
  gap: 10px;
  align-items: center;
  padding: 6px 12px;
  font-size: 12.5px;
  border-top: 1px solid var(--border-soft);
}

.dash-aging__row:first-child {
  border-top: none;
}

.dash-aging__label {
  color: var(--text-secondary);
}

/* Полоса старения — <progress> (CSP без inline-стилей, W3): фон дорожки и
 * заливка на токенах дисциплины, без системного вида */
.dash-aging__bar {
  display: block;
  width: 100%;
  height: 10px;
  border: 0;
  background: var(--neutral-bg);
  color: var(--disc-bar);
  appearance: none;
}

.dash-aging__bar::-webkit-progress-bar {
  background: var(--neutral-bg);
}

.dash-aging__bar::-webkit-progress-value {
  background: var(--disc-bar);
}

.dash-aging__bar::-moz-progress-bar {
  background: var(--disc-bar);
}

/* Корзина больше 90 дней — весом, без цвета статуса (Д3б, кандидат Р-674
   п. 12): корзина — не оценка, красный без слова запрещён (С-5) */
.dash-aging__row--oldest .dash-aging__label,
.dash-aging__row--oldest .dash-aging__sum {
  font-weight: 700;
  color: var(--text);
}

.dash-aging__sum {
  text-align: right;
  font-weight: 600;
  white-space: nowrap;
}

.dash-aging__count {
  font-size: var(--font-size-hint);
  color: var(--text-muted);
  white-space: nowrap;
}

/* --- Крупнейшие должники --- */

.dash-debtors__row {
  display: grid;
  /* дни — по содержимому: число и статус словом (ui_status) */
  grid-template-columns: minmax(120px, 1fr) auto 150px;
  gap: 10px;
  align-items: baseline;
  padding: 6px 12px;
  font-size: 12.5px;
  border-top: 1px solid var(--border-soft);
}

.dash-debtors__row:first-child {
  border-top: none;
}

.dash-debtors__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dash-debtors__days,
.dash-debtors__sum {
  text-align: right;
  white-space: nowrap;
}

.dash-debtors__sum {
  font-weight: 600;
}

/* Дни и статус словом (ui_status): число, иконка и слово в строку; тесно —
   статус уходит под число (колонка auto сжимается до самого широкого из
   них). Раскладка — здесь целиком, без класса .debtor-overdue из
   debtors.css: «Крупнейшие должники» главной и «Показателей → Долги» от
   стилей реестра должников не зависят */
.dash-debtors__days {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-1-5);
}

/* --- «Требуют внимания» и закрытие месяца --- */

.dash-attention,
.dash-close {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dash-attention__item,
.dash-close__item {
  padding: 7px 12px;
  font-size: 13px;
  border-top: 1px solid var(--border-soft);
}

.dash-attention__item:first-child,
.dash-close__item:first-child {
  border-top: none;
}

.dash-attention__main {
  display: flex;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
}

.dash-attention__links {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 12px;
  margin-top: 3px;
}

.dash-close__item {
  display: flex;
  gap: 8px;
  align-items: baseline;
  flex-wrap: wrap;
}

.dash-close__item--ok .dash-close__text {
  color: var(--text-muted);
}

.dash-close__text {
  flex: 1;
  min-width: 160px;
}

.dash-close__action {
  margin-left: auto;
}

/* button_to оборачивает кнопку в форму — форма не должна ломать строку */
.dash-close__item form {
  margin-left: auto;
}

/* Кнопки пустого состояния в ряд */
.dash-empty-actions {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 12px;
}

/* Узкий экран: колонки старения сжимаются, счётчик арендаторов — под суммой */
@media (max-width: 560px) {
  .dash-aging__row {
    grid-template-columns: 76px minmax(40px, 1fr) auto;
  }

  .dash-aging__count {
    grid-column: 2 / -1;
    text-align: right;
  }

  .dash-debtors__row {
    grid-template-columns: minmax(100px, 1fr) auto auto;
  }

}

/* Ссылки на главные собственников под расходами (plans/expenses E7) */
.dash-owner-homes {
  border-top: 1px solid var(--border-soft);
}

/* Долг по объектам: своя прокрутка внутри карточки (широкая таблица не
   вылезает за неё), объект — слева и с переносом, суммы — вправо */
.dash-aging-table__wrap {
  overflow-x: auto;
  padding: 0 var(--space-3) var(--space-3);
}

/* Обёртка в порядке Tab (прокрутка с клавиатуры) — видимый фокус, как у рейтинга */
.dash-aging-table__wrap:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.dash-aging-table {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}

.dash-aging-table th,
.dash-aging-table td {
  padding: var(--space-2-5) var(--space-2);
  border-top: 1px solid var(--border-soft);
  vertical-align: top;
  white-space: nowrap;
}

.dash-aging-table thead th {
  border-top: none;
  font-size: var(--font-size-label);
  font-weight: 500;
  color: var(--text-muted);
  text-align: right;
}

.dash-aging-table .dash-aging-table__object {
  min-width: 140px;
  font-weight: 500;
  text-align: left;
  white-space: normal;
}

.dash-aging-table td {
  text-align: right;
}

.dash-aging-table__total {
  font-weight: 600;
}

.dash-aging-table__cell .num {
  display: block;
}

.dash-aging-table__bar {
  display: block;
  width: 100%;
  min-width: 60px;
  height: 4px;
  margin-top: 3px;
  appearance: none;
  border: none;
  border-radius: 2px;
  background: var(--neutral-bg);
  overflow: hidden;
}

.dash-aging-table__bar::-webkit-progress-bar {
  background: var(--neutral-bg);
}

.dash-aging-table__bar::-webkit-progress-value {
  background: var(--text-faint);
}

.dash-aging-table__bar::-moz-progress-bar {
  background: var(--text-faint);
}

/* Ячейка «больше 90 дн» — весом и тёмной полосой, без цвета статуса (Д3б) */
.dash-aging-table__cell--oldest .num {
  font-weight: 700;
}

.dash-aging-table__cell--oldest .dash-aging-table__bar::-webkit-progress-value {
  background: var(--text);
}

.dash-aging-table__cell--oldest .dash-aging-table__bar::-moz-progress-bar {
  background: var(--text);
}

.dash-fee__note {
  color: var(--text-muted);
}

.dash-fee__risk {
  color: var(--text-secondary);
}

#dash-objects .dash-attention__item {
  padding-left: var(--space-5);
  padding-right: var(--space-5);
}

/* --- «Обзор» по виду роли (Д2) ---
 * Переключатель вида — кнопки-формы в ряд (вид .ind-switch из indicators.css),
 * подпись — под ним; цепочка — во всю ширину над колонками; число раздела —
 * строкой «подпись · число · статус · пояснение» над графиком */

.dash-view {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
  margin-bottom: var(--space-3);
}

.dash-view__label {
  font-size: var(--font-size-hint);
  color: var(--text-muted);
}

.dash-view__switch {
  flex-wrap: wrap;
}

.dash-view__form {
  display: contents;
}

/* .ind-switch__item написан для ссылок <a>, а здесь пункты — <button> из
   button_to: снимаем системный вид кнопки (фон, рамку, шрифт), иначе
   неактивные виды рисуются серой выпуклой кнопкой. Сброс шрифта перекрывает
   размер и насыщенность .ind-switch__item — возвращаем их */
.dash-view button.ind-switch__item {
  margin: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: var(--font-size-secondary);
  cursor: pointer;
}

.dash-view button.ind-switch__item--active {
  background: var(--accent-bg);
  font-weight: 600;
}

.dash-view button.ind-switch__item:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.dash-view__hint {
  font-size: var(--font-size-hint);
  color: var(--text-muted);
}

.dash-chain {
  margin-bottom: var(--space-3);
}

.dash-chain__body {
  padding: var(--space-2) var(--space-3) var(--space-3);
}

.dash-figure {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-1) var(--space-2);
  padding: var(--space-2) var(--space-3) 0;
}

.dash-figure__label {
  font-size: var(--font-size-hint);
  color: var(--text-muted);
}

.dash-figure__value {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.dash-figure__sub {
  font-size: var(--font-size-hint);
  color: var(--text-secondary);
}

#dash-collected .col-chart,
#dash-fee-series .col-chart,
#dash-occupancy .col-chart,
#dash-managers .chart-bars,
#dash-channels .chart-bars {
  margin: var(--space-2) var(--space-3) var(--space-3);
}

/* Рейтинг объектов: статусы словом и иконкой в ячейках, своя прокрутка на
   телефоне */
.dash-rating__wrap {
  overflow-x: auto;
  padding: 0 var(--space-3) var(--space-3);
}

/* Обёртка в порядке Tab (прокрутка с клавиатуры) — видимый фокус */
.dash-rating__wrap:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.dash-rating {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}

.dash-rating th,
.dash-rating td {
  padding: var(--space-2) var(--space-2);
  border-top: 1px solid var(--border-soft);
  text-align: left;
  vertical-align: top;
}

.dash-rating thead th {
  border-top: none;
  font-size: var(--font-size-label);
  font-weight: 500;
  color: var(--text-muted);
}

.dash-rating tbody th {
  min-width: 140px;
  font-weight: 500;
}

.dash-rating td {
  white-space: nowrap;
}

.dash-rating__value {
  margin-right: var(--space-1-5);
}

/* «Требуют внимания»: счётчик сразу за подписью, статус — справа строки (колонка статусов ровная, счётчик не стоит
   посередине строки на разной высоте по x); остальные — под «ещё k» */
.dash-attention__main--counted {
  justify-content: flex-start;
}

.dash-attention__status {
  margin-left: var(--space-1);
}

.dash-attention__main--counted > .dash-attention__status {
  margin-left: auto;
}

.dash-attention__more summary {
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-hint);
  color: var(--text-secondary);
  cursor: pointer;
}

/* Д3а: деньги против бюджета и план-факт расходов по зданиям у операционного
   директора — те же отступы, что у графиков «Обзора» */
.dash-cash-budget {
  display: grid;
  gap: var(--space-3);
}

#dash-expense-budget .chart-bars {
  margin: var(--space-2) var(--space-3) var(--space-3);
}