/* Договоры CRM v2 «спокойная плотность» (docs/design-crm-v2.md, разделы 4, 6
 * и 9; холсты docs/mockups/crm-v2/Leases.dc.html и Lease.dc.html): реестр,
 * карточка договора и её блоки — ДС, каникулы, план начислений, документы,
 * счета. Компоненты (панель, таблица, полосы, «Требует действия», фильтры) —
 * в ui.css; здесь только раскладка экрана. Только токены tokens.css. */

/* ============================================================
 * Реестр договоров
 * ============================================================ */

/* Номер договора — заголовок строки (и карточки на телефоне) */
.leases-registry__number,
.leases-registry__number:hover {
  color: var(--text);
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
}

.leases-registry__number:hover {
  color: var(--accent);
}

.leases-registry__tenant {
  font-weight: 500;
}

.leases-registry__term {
  white-space: nowrap;
}

.leases-registry .cell__sub.num {
  white-space: nowrap;
}

/* Единица ставки — переносится («₽/мес или 4 % оборота»): колонка суммы
 * не забирает ширину у названий */
.leases-registry td.cell--num .cell__sub {
  white-space: normal;
}

.leases-registry__expiring {
  color: var(--warning);
}

/* Пустое состояние — белая панель под фильтрами */
.leases-registry__empty {
  display: flex;
  min-height: 240px;
}

/* Кнопка «Показать» нужна только без JS: Stimulus ставит hidden, а
 * display у .btn иначе побеждал бы атрибут */
.filters .btn[hidden] {
  display: none;
}

/* Метки «требует внимания» в строке: переносятся, «ещё N» — белая */
.lease-reasons {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.lease-reasons__item {
  display: inline-flex;
}

.lease-reasons__item--more .chip {
  background: var(--surface);
}

/* Фильтр таба «Требуют внимания» по причине (Р-31): метки-ссылки */
.lease-reason-filter {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1-5);
}

.lease-reason-filter__item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1-5);
  padding: var(--space-1) var(--space-2-5);
  background: var(--surface);
  border: 1px solid var(--border-control);
  border-radius: var(--radius-badge);
  color: var(--text-secondary);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}

.lease-reason-filter__item:hover {
  color: var(--text);
  text-decoration: none;
}

.lease-reason-filter__item--active,
.lease-reason-filter__item--active:hover {
  color: var(--warning);
  background: var(--warning-bg);
  border-color: var(--warning-border);
}

.lease-reason-filter__count {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

@media (pointer: coarse) {
  .lease-reason-filter__item {
    min-height: var(--touch-target);
  }
}

/* На телефоне ячейка «Требует внимания» — метки справа; длинный заголовок
 * карточки («Продолжить оформление») переносится, а не наезжает на статус */
@media (max-width: 767px) {
  .leases-registry .leases-registry__number {
    white-space: normal;
  }

  .leases-registry .table--cards td .lease-reasons {
    justify-content: flex-end;
  }
}

/* ============================================================
 * Карточка договора: полосы, «Требует действия», таймлайн
 * ============================================================ */

.lease-card__promise {
  color: var(--warning);
}

.lease-card .strip--money .lease-card__overdue {
  color: var(--danger);
}

.lease-card__warning {
  color: var(--warning);
  font-weight: 500;
}

/* Планшет: полосы по две ячейки в ряд — четыре ячейки 2 × 2, а не 3 + 1 */
@media (min-width: 768px) and (max-width: 1179px) {
  .lease-card .strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Телефон (раздел 9): блок «Требует действия» — сразу под шапкой, до полос */
@media (max-width: 767px) {
  .lease-card > .lease-attention {
    order: -1;
  }
}

/* «Требует действия»: долг — красным, справка — вторичным */
.lease-attention .attention__item--danger .attention__what {
  color: var(--danger);
}

.lease-attention .attention__item--info .attention__what {
  color: var(--text-secondary);
}

/* Площадь по договору расходится с площадью помещения */
.lease-area-mismatch {
  color: var(--warning);
}

/* «Условия во времени»: дата, метки; расчёт; НДС и день оплаты */
.lease-timeline__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-1-5) var(--space-2);
}

.lease-timeline__formula {
  margin-top: var(--space-1);
  overflow-wrap: anywhere;
}

.lease-timeline__note {
  margin-top: var(--space-0-5);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  color: var(--text-secondary);
}

.lease-timeline__note--pending {
  color: var(--warning);
}

/* button_to оборачивает кнопку в form — в строке действий шапки и панелей
 * форма не ломает поток */
.page-header__actions form,
.lease-card .panel__actions form,
.lease-amendment__actions form,
.lease-holiday__actions form,
.charge-plan form {
  display: inline-flex;
  margin: 0;
}

/* ============================================================
 * Блок «Доп. соглашения» (Р-29): ДС со статусом подписи, превью
 * «было → стало» и действия; форма ИПЦ для индексации по ИПЦ
 * ============================================================ */

.lease-amendments__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.lease-amendment {
  display: flex;
  flex-direction: column;
  gap: var(--space-1-5);
  padding: var(--space-4) var(--space-5);
  border-top: 1px solid var(--border-soft);
}

.panel__header + .lease-amendment {
  border-top: 0;
}

.lease-amendment__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2) var(--space-3);
}

.lease-amendment__heading {
  display: flex;
  flex-direction: column;
  gap: var(--space-0-5);
  min-width: 0;
}

.lease-amendment__title {
  font-weight: 600;
}

.lease-amendment__summary {
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  color: var(--text-secondary);
}

.lease-amendment__status {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--space-1-5);
}

/* Превью влияния: ставка и сумма в месяц — моно, переносится на узком экране */
.lease-amendment__preview {
  padding: var(--space-1-5) var(--space-3);
  background: var(--surface-subtle);
  border-radius: var(--radius);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  overflow-wrap: anywhere;
}

.lease-amendment__note {
  font-size: var(--font-size-hint);
  line-height: var(--line-height-hint);
  color: var(--text-muted);
}

.lease-amendment__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-1);
}

/* Индексация на карточке: ждёт ИПЦ или срок подошёл раньше утреннего джоба */
.lease-indexation {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  border-bottom: 1px solid var(--border-soft);
}

.lease-indexation--due {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  background: var(--warning-row-bg);
}

.lease-indexation__form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-2);
}

.lease-indexation__form .field {
  flex: 1 1 160px;
  max-width: 240px;
}

/* ============================================================
 * Блок «Арендные каникулы» (Р-47)
 * ============================================================ */

.lease-holidays__empty {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2-5);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  color: var(--text-secondary);
}

.lease-holidays__empty-icon {
  flex: none;
  color: var(--text-faint);
}

.lease-holiday {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3-5) var(--space-5);
  border-top: 1px solid var(--border-soft);
}

.panel__header + .lease-holiday {
  border-top: 0;
}

.lease-holiday__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.lease-holiday__period {
  font-weight: 600;
}

.lease-holiday__basis {
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}

.lease-holiday__meta,
.lease-holiday__note {
  font-size: var(--font-size-hint);
  line-height: var(--line-height-hint);
  color: var(--text-muted);
}

/* Форма каникул (модал карточки и страница): чекбоксы видов в строку */
.rent-holiday-form__kinds {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.rent-holiday-form__kind {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1-5);
  margin-right: var(--space-4);
}

.rent-holiday-form__share {
  max-width: 200px;
}

.rent-holiday-page {
  max-width: 560px;
}

@media (pointer: coarse) {
  .rent-holiday-form__kind {
    min-height: var(--touch-target);
  }
}

/* ============================================================
 * План начислений (Р-30): прогноз, прошлые «начислено / не начислено»,
 * серые месяцы до начала учёта под разделителем. Таблица — shared/table
 * с закреплённой колонкой периода
 * ============================================================ */

.charge-plan__forecast {
  color: var(--text-muted);
}

.charge-plan__action {
  text-align: right;
  white-space: nowrap;
}

.charge-plan .table tbody tr.charge-plan__summary td {
  padding-top: var(--space-2);
  padding-bottom: var(--space-2);
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
}

/* Разделитель «До начала учёта в системе» — обычным регистром */
.charge-plan .table tbody tr.charge-plan__divider td {
  padding-top: var(--space-2-5);
  padding-bottom: var(--space-1-5);
  border-top: 1px solid var(--border-panel);
  background: var(--surface-subtle);
  font-size: var(--font-size-label);
  line-height: var(--line-height-label);
  font-weight: 500;
  color: var(--text-secondary);
}

.charge-plan .table tbody tr.charge-plan__divider:hover {
  background: transparent;
}

/* Строки на всю ширину — не закреплённая ячейка, перенос внутри */
.charge-plan .table--sticky-first tbody tr:is(.charge-plan__summary, .charge-plan__divider) td:first-child {
  position: static;
  white-space: normal;
  box-shadow: none;
}

/* Месяцы до начала учёта — приглушённо: система их не ведёт */
.charge-plan .table tbody tr.charge-plan__row--before td {
  color: var(--text-muted);
}

/* Каникулы месяца второй строкой под периодом (Р-47) */
.charge-plan__note {
  font-size: var(--font-size-hint);
  line-height: var(--line-height-hint);
  font-weight: 400;
  color: var(--text-muted);
  white-space: normal;
}

/* Каникулы, заведённые после начисления (Р-47): строки их не учли */
.charge-plan__note--late {
  color: var(--warning);
}

/* ============================================================
 * Боковая колонка: счета и документы договора
 * ============================================================ */

.lease-invoices,
.lease-docs {
  margin: 0;
  padding: 0;
  list-style: none;
}

.lease-invoices li + li,
.lease-docs__row + .lease-docs__row {
  border-top: 1px solid var(--border-soft);
}

.lease-invoices__item {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3) var(--space-5);
  color: var(--text);
  text-decoration: none;
}

.lease-invoices__item:hover {
  background: var(--row-hover);
  color: var(--text);
  text-decoration: none;
}

.lease-invoices__item:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.lease-invoices__line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-1) var(--space-3);
}

.lease-invoices__title {
  color: var(--accent);
  font-weight: 500;
}

.lease-invoices__sum {
  font-weight: 500;
  white-space: nowrap;
}

.lease-invoices__line--meta {
  align-items: center;
  font-size: var(--font-size-secondary);
  line-height: var(--line-height-secondary);
  color: var(--text-secondary);
}

.lease-invoices__badges {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.lease-docs__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-1) var(--space-3);
  padding: var(--kv-row-pad-y) var(--space-5);
}

.lease-docs__name {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.lease-docs__date {
  font-size: var(--font-size-hint);
  line-height: var(--line-height-hint);
  color: var(--text-muted);
}

@media (max-width: 767px) {
  .lease-amendment,
  .lease-holiday,
  .lease-invoices__item,
  .lease-docs__row {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
  }
}

/* Номер счёта в плане — без переноса внутри номера */
.charge-plan .table td a {
  white-space: nowrap;
}