/* Экраны должников в виде CRM v2 (docs/design-crm-v2.md, разделы 4, 6 и 9):
 * реестр (shared/table, cards), карточка — полоса денег с барчартом
 * дисциплины, баннер эскалации, неоплаченные счета (детальная таблица),
 * пени, лента коммуникаций, модалы. Только токены из tokens.css.
 * Стили «Напоминаний» — в reminders.css. */

/* --- Прежние общие классы панелей других экранов: главная (.panel__head,
 *     .panel__empty, .panel__footnote) и карточка собственника (.kpi). Экраны
 *     денег перешли на .panel__header, .strip и .metric из ui.css; эти
 *     правила оставлены для чужих экранов, удалить на зачистке C4, когда
 *     главная и собственники перейдут на компоненты ui.css --- */

.panel__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2-5);
  padding: var(--space-2) var(--space-3);
  background: var(--surface-subtle);
  border-bottom: 1px solid var(--border-panel);
}

.panel__empty {
  padding: var(--space-3-5) var(--space-3);
  font-size: var(--font-size-secondary);
  color: var(--text-muted);
}

.panel__footnote {
  padding: var(--space-2) var(--space-3) var(--space-2-5);
  border-top: 1px solid var(--border-soft);
  font-size: var(--font-size-hint);
  color: var(--text-muted);
}

.kpi__label {
  font-size: var(--font-size-label);
  line-height: var(--line-height-label);
  font-weight: 500;
  color: var(--text-secondary);
}

.kpi__value {
  font-family: var(--font-mono);
  font-size: var(--font-size-h2);
  font-weight: 600;
}

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

.kpi--wide {
  min-width: 220px;
}

/* --- Реестр должников --- */

.debtors-registry__party .table__link {
  font-weight: 600;
  color: var(--text);
}

.debtors-registry__party .table__link:hover {
  color: var(--accent);
}

/* Следующее действие на телефоне — текст целиком, слева под подписью */
@media (max-width: 767px) {
  .table.table--cards tbody td.debtors-registry__next {
    text-align: left;
    padding-left: 0;
    padding-top: var(--space-5);
  }

  .table.table--cards tbody td.debtors-registry__next::before {
    width: 100%;
  }
}

.debtor-overdue--danger { color: var(--danger); }
.debtor-overdue--warning { color: var(--warning); }

/* --- Полоса денег карточки: мини-барчарт платёжной дисциплины --- */

.disc-bars {
  display: flex;
  align-items: flex-end;
  gap: var(--space-0-5);
  height: 30px;
}

.disc-bar {
  width: 8px;
  border-radius: 2px 2px 0 0;
  background: var(--disc-bar);
}

.disc-bar--late {
  background: var(--disc-bar-late);
}

/* Высота бара — класс из DebtorsHelper#debtor_discipline_bar_class */
.disc-bar--h3 { height: 3px; }
.disc-bar--h6 { height: 6px; }
.disc-bar--h9 { height: 9px; }
.disc-bar--h12 { height: 12px; }
.disc-bar--h15 { height: 15px; }
.disc-bar--h18 { height: 18px; }
.disc-bar--h21 { height: 21px; }
.disc-bar--h22 { height: 22px; }

.debtor-money .strip__sub strong {
  font-weight: 600;
  color: var(--text);
}

/* --- Баннер эскалации (и «Telegram выключен» в «Напоминаниях»): текст
 *     слева, действие 32 справа; на телефоне действие — под текстом --- */

.note-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-4);
  padding: var(--space-3) var(--space-4);
  border: 1px solid;
  border-radius: var(--radius-panel);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
}

.note-banner__text {
  display: flex;
  flex: 1 1 320px;
  flex-direction: column;
  gap: var(--space-0-5);
  min-width: 0;
}

.note-banner strong {
  font-weight: 600;
}

.note-banner--info {
  color: var(--info);
  background: var(--info-bg);
  border-color: var(--info-border);
}

.note-banner--warning {
  color: var(--warning);
  background: var(--warning-bg);
  border-color: var(--warning-border);
}

.note-banner--muted {
  color: var(--neutral);
  background: var(--neutral-bg);
  border-color: var(--neutral-border);
}

.note-banner__action {
  margin-left: auto;
}

@media (max-width: 767px) {
  .note-banner__action {
    margin-left: 0;
  }
}

/* --- Неоплаченные счета: детальная таблица, итог в подвале --- */

.debtor-invoices__row a {
  font-weight: 500;
}

/* Арендодатель у номера, который есть и у другого арендодателя (Р-27) */
.debtor-invoices__landlord {
  color: var(--text-secondary);
}

.debtor-invoices__view {
  display: block;
  margin-top: var(--space-1);
}

.table tfoot tr.debtor-invoices__total td {
  padding: var(--table-cell-pad-y) var(--table-cell-pad-x);
  border-top: 1px solid var(--border-panel);
  background: var(--surface-subtle);
  font-weight: 600;
}

/* Подпись итога на четыре колонки — не закреплена (закреплённая колонка
 * детальной таблицы рисовала бы разделитель посреди строки итога) */
.table tfoot tr.debtor-invoices__total td:first-child {
  position: static;
  padding-left: var(--table-cell-pad-edge);
  box-shadow: none;
}

.table tfoot tr.debtor-invoices__total td:last-child {
  padding-right: var(--table-cell-pad-edge);
}

.debtor-empty {
  font-size: var(--font-size-secondary);
  color: var(--text-muted);
}

/* --- Пени: основание, состояние, сумма, действия 32 --- */

.pen-row {
  padding: var(--space-3) var(--space-5);
  border-bottom: 1px solid var(--border-soft);
}

.pen-row:last-child {
  border-bottom: none;
}

.pen-row__main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
}

.pen-row__base {
  flex: 1 1 260px;
  min-width: 0;
  font-weight: 500;
}

.pen-row__amount {
  margin-left: auto;
  font-weight: 600;
  white-space: nowrap;
}

.pen-row__amount--waived {
  text-decoration: line-through;
  color: var(--text-muted);
}

.pen-row__info {
  margin-top: var(--space-1);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  color: var(--text-secondary);
}

/* --- Лента коммуникаций --- */

.feed-row {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  padding: var(--space-2-5) var(--space-5);
  border-bottom: 1px solid var(--border-soft);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
}

.feed-row:last-child {
  border-bottom: none;
}

.feed-row__text {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}

.feed-row__text strong {
  font-weight: 600;
  color: var(--text);
}

.feed-row__date {
  margin-left: auto;
  font-size: var(--font-size-hint);
  color: var(--text-muted);
  white-space: nowrap;
}

@media (max-width: 767px) {
  .pen-row,
  .feed-row {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
  }

  .feed-row {
    flex-wrap: wrap;
  }
}

/* --- Модалы экранов денег (пауза, претензия, прощение пени, а также
 *     товарооборот, выставление пакета, импорт выписки): тело — стопка с
 *     зазором 12, без полей абзацев --- */

.modal-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.modal-form p,
.modal-form .turnover-calc {
  margin: 0;
}

/* Претензия: обёртка контроллера копирования — та же колонка, что у формы
 * в окне (тело прокручивается, подвал на месте) */
.claim-modal {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

.claim-text {
  width: 100%;
  font-family: var(--font-mono);
  font-size: var(--font-size-hint);
  line-height: var(--line-height-hint);
  resize: vertical;
}

.claim-copied {
  font-size: var(--font-size-hint);
  color: var(--success);
}