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

/* --- Плитки KPI --- */

.dash-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.dash-tile {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 10px 12px 12px;
  background: var(--surface);
  border: 1px solid var(--border-panel);
  color: var(--text);
  text-decoration: none;
}

.dash-tile:hover {
  border-color: var(--accent-border);
  box-shadow: var(--shadow-card);
}

.dash-tile:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.dash-tile__label {
  font-size: var(--font-size-label);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: var(--letter-spacing-label);
  color: var(--text-muted);
}

.dash-tile__value {
  font-size: 18px;
  font-weight: 600;
  white-space: nowrap;
}

.dash-tile--debt .dash-tile__value {
  color: var(--danger);
}

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

/* Определение показателя — мелким текстом под числом */
.dash-tile__definition {
  margin-top: auto;
  padding-top: 4px;
  font-size: var(--font-size-chip);
  line-height: 1.35;
  color: var(--text-faint);
}

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

.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;
}

.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);
}

.dash-aging__bar--late {
  color: var(--disc-bar-late);
}

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

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

.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;
  grid-template-columns: minmax(120px, 1fr) 70px 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;
}

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

.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) 56px auto;
  }
}

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

/* Главная директора (plans/dashboards D2): витрина сверху, долг по объектам
   таблицей с баром в ячейке, вознаграждение УК */
.dash-director {
  margin-bottom: var(--space-3);
}

.dash-hero__bullet {
  margin-top: var(--space-1-5);
}

.dash-aging-table th,
.dash-aging-table td {
  white-space: nowrap;
}

.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);
}

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

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

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

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

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