/* ============================================================
 * Кабинет арендатора v2 — каркас КА-0 и «Помощь» (plans/cabinets/,
 * plans/tenant-cabinet-v2/KA-0-frame.md; прототип docs/mockups/cabinets).
 * Меню «Я и компания», главная по компании (дела, деньги по
 * арендодателю, заявки, быстрые действия, «Здание»), вкладки «Денег»,
 * «Помощь» с «Авария?». Только токены --ios-* (страж portal_tokens_s0)
 * ============================================================ */

/* --- Меню «Я и компания» (КА-0 п. 11): аватар-кнопка <details> --- */

.portal-me {
  position: relative;
  flex: none;
}

.portal-me__summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--ios-touch-min);
  min-height: var(--ios-touch-min);
  list-style: none;
  cursor: pointer;
}

.portal-me__summary::-webkit-details-marker {
  display: none;
}

.portal-me__summary[aria-current="page"] .portal-nav__avatar,
.portal-me[open] .portal-nav__avatar {
  box-shadow: 0 0 0 var(--ios-focus-width) var(--ios-accent);
}

.portal-me__menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: var(--ios-z-menu);
  min-width: var(--ios-receipt-width);
  padding: var(--ios-space-2) 0;
  border-radius: var(--ios-radius-plate);
  background: var(--ios-surface);
  box-shadow: var(--ios-shadow-popover);
}

.portal-me__who {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: var(--ios-space-2) var(--ios-space-4) var(--ios-space-3);
  border-bottom: 1px solid var(--ios-separator);
}

.portal-me__name {
  font: var(--ios-type-button-nav);
  font-weight: 600;
}

.portal-me__sub {
  color: var(--ios-text-secondary);
  font: var(--ios-type-caption);
}

.portal-me__items {
  margin: 0;
  padding: 0;
  list-style: none;
}

.portal-me__signout-form {
  margin: 0;
}

.portal-body .portal-me__item {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: var(--ios-touch-min);
  box-sizing: border-box;
  padding: 0 var(--ios-space-4);
  border: 0;
  background: none;
  color: var(--ios-text);
  font: var(--ios-type-button-nav);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.portal-body .portal-me__item:hover {
  background: var(--ios-tab-hover-bg);
}

.portal-body .portal-me__signout {
  color: var(--ios-status-danger);
}

@media (min-width: 900px) {
  /* На десктопе аватар — справа, меню раскрывается влево */
  .portal-me {
    order: 10;
  }

  .portal-me__menu {
    right: 0;
    left: auto;
  }
}

/* --- Главная по компании (КА-0 п. 4): две колонки от 1184 px --- */

.portal-home {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1184px) {
  .portal-home {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--ios-home-side);
    gap: var(--ios-space-8);
    align-items: start;
  }
}

/* «Требует действия»: точка срочности, что сделать, кнопки справа */
.portal-agenda__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.portal-agenda__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ios-space-2) var(--ios-space-3);
  padding: var(--ios-space-3) var(--ios-space-4);
  border-top: 1px solid var(--ios-separator);
}

.portal-agenda__item:first-child {
  border-top: 0;
}

.portal-agenda__dot {
  flex: none;
  width: var(--ios-space-2);
  height: var(--ios-space-2);
  border-radius: 50%;
  background: var(--ios-accent);
}

.portal-agenda__dot--danger {
  background: var(--ios-status-danger);
}

.portal-agenda__dot--warning {
  background: var(--ios-status-warning);
}

.portal-agenda__text {
  flex: 1 1 60%;
  min-width: 0;
}

.portal-agenda__title {
  margin: 0;
  font: var(--ios-type-button-nav);
  font-weight: 600;
  overflow-wrap: anywhere;
}

.portal-agenda__detail {
  margin: var(--ios-space-1) 0 0;
  color: var(--ios-text-secondary);
  font: var(--ios-type-caption);
}

.portal-agenda__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ios-space-2);
}

.portal-agenda__confirmed {
  margin: 0 0 var(--ios-space-3);
  padding: var(--ios-space-3) var(--ios-space-4);
  border-radius: var(--ios-radius-plate);
  background: var(--ios-status-success-bg);
  font: var(--ios-type-secondary);
}

.portal-agenda__ok {
  display: flex;
  align-items: center;
  gap: var(--ios-space-3);
  padding: var(--ios-space-4);
}

.portal-agenda__ok-icon {
  display: flex;
  flex: none;
  width: var(--ios-space-8);
  height: var(--ios-space-8);
  color: var(--ios-status-success);
}

.portal-agenda__ok-text {
  margin: 0;
  font: var(--ios-type-secondary);
}

.portal-forecasts {
  margin: var(--ios-space-3) 0 0;
  padding: 0;
  list-style: none;
  color: var(--ios-text-secondary);
  font: var(--ios-type-secondary);
}

.portal-forecasts__item + .portal-forecasts__item {
  margin-top: var(--ios-space-2);
}

/* Маленькая кнопка строки дел — визуально 32, зона нажатия 44 */
.portal-body .portal-button--small {
  min-height: var(--ios-touch-min);
  padding: 0 var(--ios-space-4);
  font: var(--ios-type-button-nav);
}

/* «Деньги» — карточка на арендодателя */
.portal-money-card {
  padding: var(--ios-space-4);
  container-type: inline-size;
}

.portal-money-card + .portal-money-card {
  margin-top: var(--ios-space-3);
}

/* Кегль суммы — формулой от ширины карточки: число знаков даёт класс
 * --len-N (portal_amount_len_class), как у суммы прежнего hero */
.portal-money-card__amount {
  --len: 16;
  margin: var(--ios-space-1) 0 0;
  font-family: var(--ios-font-mono);
  font-size: clamp(var(--ios-amount-min), calc(100cqi / (var(--len) * var(--ios-amount-advance))), var(--ios-amount-max));
  font-weight: 600;
  line-height: var(--ios-amount-leading);
}

.portal-money-card__amount.portal-hero__amount--len-6 { --len: 6; }
.portal-money-card__amount.portal-hero__amount--len-7 { --len: 7; }
.portal-money-card__amount.portal-hero__amount--len-8 { --len: 8; }
.portal-money-card__amount.portal-hero__amount--len-9 { --len: 9; }
.portal-money-card__amount.portal-hero__amount--len-10 { --len: 10; }
.portal-money-card__amount.portal-hero__amount--len-11 { --len: 11; }
.portal-money-card__amount.portal-hero__amount--len-12 { --len: 12; }
.portal-money-card__amount.portal-hero__amount--len-13 { --len: 13; }
.portal-money-card__amount.portal-hero__amount--len-14 { --len: 14; }
.portal-money-card__amount.portal-hero__amount--len-15 { --len: 15; }
.portal-money-card__amount.portal-hero__amount--len-16 { --len: 16; }

.portal-money-card__overdue {
  margin: var(--ios-space-2) 0 0;
  color: var(--ios-status-danger);
  font: var(--ios-type-secondary);
  font-weight: 600;
}

/* Начисленный штраф (Р-51) под строкой просрочки: текст штрафа с пунктом и
 * условием — объяснение его суммы (у штрафа нет таблицы, как у пени) */
.portal-money-card__fine {
  margin: var(--ios-space-1) 0 0;
  color: var(--ios-text-secondary);
  font: var(--ios-type-secondary);
}

.portal-money-card__due {
  margin: var(--ios-space-2) 0 0;
  color: var(--ios-text-secondary);
  font: var(--ios-type-secondary);
}

.portal-money-card__invoices {
  margin: var(--ios-space-3) 0 0;
  padding: 0;
  list-style: none;
  font: var(--ios-type-secondary);
}

.portal-money-card__invoices li + li {
  margin-top: var(--ios-space-1);
}

.portal-money-card__invoice {
  display: inline-flex;
  min-height: var(--ios-touch-min);
  align-items: center;
}

.portal-money-card__more {
  color: var(--ios-text-secondary);
}

.portal-money-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ios-space-2);
  margin-top: var(--ios-space-3);
}

/* Быстрые действия — плитки по две в ряд */
.portal-quick__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ios-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}

.portal-body .portal-quick__item {
  display: flex;
  align-items: center;
  min-height: var(--ios-row-height);
  box-sizing: border-box;
  height: 100%;
  padding: var(--ios-space-3) var(--ios-space-4);
  border-radius: var(--ios-radius-plate);
  background: var(--ios-surface);
  color: var(--ios-accent);
  font: var(--ios-type-button-nav);
  font-weight: 600;
  text-decoration: none;
}

.portal-body .portal-quick__item:hover {
  background: var(--ios-accent-tint);
}

/* «Здание»: управляющий и аварийная служба */
.portal-building__card + .portal-building__card {
  margin-top: var(--ios-space-3);
}

.portal-building__property {
  margin: 0;
  padding: var(--ios-space-3) var(--ios-space-4) 0;
  color: var(--ios-text-secondary);
  font: var(--ios-type-caption);
  font-weight: 600;
}

.portal-building__address {
  margin: 0 0 var(--ios-space-3);
}

.portal-body .portal-building__tel {
  display: inline-flex;
  flex: none;
  align-items: center;
  min-height: var(--ios-touch-min);
  font: var(--ios-type-button-nav);
  font-weight: 600;
  white-space: nowrap;
}

.portal-building__row--emergency .portal-building__tel {
  color: var(--ios-sos-accent);
}

.portal-building__facts {
  margin-top: var(--ios-space-3);
}

.portal-building__fact {
  text-align: right;
  overflow-wrap: anywhere;
}

/* --- Вкладки раздела (КА-0 п. 5, п. 9): «Деньги», договор, заявки --- */

.portal-money-tabs {
  margin: 0 0 var(--ios-space-6);
}

.portal-body .portal-money-tabs .portal-chip[aria-current="page"] {
  background: var(--ios-text);
  color: var(--ios-surface);
  font-weight: 600;
}

/* «Скачать за период» (КА-0 п. 5) */
.portal-period-export {
  margin: 0 0 var(--ios-space-6);
}

.portal-period-export__toggle {
  display: inline-flex;
  align-items: center;
  min-height: var(--ios-touch-min);
  cursor: pointer;
}

.portal-period-export__form {
  display: grid;
  gap: var(--ios-space-3);
  max-width: var(--ios-container-narrow);
  margin-top: var(--ios-space-2);
}

.portal-period-export__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ios-space-2);
}

.portal-lease-money__card + .portal-lease-money__card {
  margin-top: var(--ios-space-3);
}

.portal-recon__with {
  margin: 0;
  font: var(--ios-type-secondary);
  font-weight: 600;
}

/* --- Лист «Оплата» по арендодателю (КА-0 п. 6) --- */

.portal-copy-all {
  position: relative;
  margin: 0 0 var(--ios-space-4);
}

.portal-copy-all[data-clipboard-state="copied"] .portal-copy-all__button {
  background: var(--ios-status-success-bg);
}

.portal-pay-docs {
  margin: 0;
  padding: 0;
  list-style: none;
}

.portal-pay-docs__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--ios-space-2);
  min-height: var(--ios-touch-min);
  border-top: 1px solid var(--ios-separator);
  font: var(--ios-type-secondary);
}

.portal-pay-docs__item:first-child {
  border-top: 0;
}

.portal-pay-docs__note {
  color: var(--ios-text-secondary);
  font: var(--ios-type-caption);
}


/* «По каким договорам» в листе обещания группы */
.portal-promise-leases {
  display: grid;
  gap: var(--ios-space-1);
  margin: 0 0 var(--ios-space-4);
}

/* Сумма и причина обещания (Д-02): свёрнуто до нажатия — лист на телефоне
 * не удлиняется */
.portal-promise-more {
  display: grid;
  gap: var(--ios-space-3);
  margin: 0 0 var(--ios-space-4);
}

.portal-promise-more__summary {
  min-height: var(--ios-touch-min);
  display: flex;
  align-items: center;
  font: var(--ios-type-secondary);
  color: var(--ios-accent);
  cursor: pointer;
}

.portal-promise-more__comment {
  margin-top: var(--ios-space-2);
}

.portal-check {
  display: flex;
  align-items: center;
  gap: var(--ios-space-2);
  min-height: var(--ios-touch-min);
  font: var(--ios-type-secondary);
}

/* --- «Помощь» (КА-0 п. 10, ИН-2) --- */

.portal-sos {
  margin: 0 0 var(--ios-space-6);
  padding: var(--ios-space-4);
  border: 1px solid var(--ios-sos-border);
  border-radius: var(--ios-card-radius);
  background: var(--ios-sos-bg);
}

.portal-sos__title {
  margin: 0;
  color: var(--ios-sos-accent);
  font: var(--ios-type-block);
}

.portal-sos__text {
  margin: var(--ios-space-1) 0 var(--ios-space-3);
  color: var(--ios-sos-text);
  font: var(--ios-type-secondary);
}

.portal-sos__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ios-space-2);
}

.portal-sos__actions + .portal-sos__property,
.portal-sos__property + .portal-sos__actions {
  margin-top: var(--ios-space-2);
}

.portal-sos__property {
  margin: var(--ios-space-1) 0 0;
  color: var(--ios-sos-text);
  font: var(--ios-type-caption);
}

.portal-body .portal-sos__call {
  background: var(--ios-sos-accent);
  color: var(--ios-text-on-accent);
  font-weight: 600;
}

.portal-body .portal-sos__call:hover {
  background: var(--ios-sos-accent);
  color: var(--ios-text-on-accent);
}

.portal-body .portal-sos__report {
  border: 1px solid var(--ios-sos-border);
  background: var(--ios-surface);
  color: var(--ios-sos-accent);
  font-weight: 600;
}

.portal-requests__create {
  margin: var(--ios-space-4) 0 0;
}

/* Подсказка «Подробности» по виду заявки — видна подсказка выбранного
 * вида (:has по выбранному option, без JS); без :has — все подсказки */
.portal-request-form__form:has(.portal-request-form__kind) .portal-request-hint {
  display: none;
}

.portal-request-form__form:has(.portal-request-form__kind option[value="maintenance"]:checked) .portal-request-hint--maintenance,
.portal-request-form__form:has(.portal-request-form__kind option[value="meeting_room"]:checked) .portal-request-hint--meeting_room,
.portal-request-form__form:has(.portal-request-form__kind option[value="pass"]:checked) .portal-request-hint--pass,
.portal-request-form__form:has(.portal-request-form__kind option[value="cleaning"]:checked) .portal-request-hint--cleaning,
.portal-request-form__form:has(.portal-request-form__kind option[value="other"]:checked) .portal-request-hint--other {
  display: block;
}

.portal-request-hints {
  margin: calc(-1 * var(--ios-space-2)) 0 var(--ios-space-4);
}

/* Строки «название — подстрока» из span (дела, «Ждут вас», «Здание»,
 * заявки на главной): каждая — своей строкой */
.portal-row__text > span.portal-row__title,
.portal-row__text > span.portal-row__sub {
  display: block;
}

/* Телефон ссылкой не рвётся по дефисам */
.portal-body a.portal-num,
.portal-body .portal-sos__call .portal-num {
  white-space: nowrap;
}

/* «Позвонить +7 (423) 200-00-01» — во всю ширину карточки «Авария?» */
.portal-body .portal-sos__call {
  flex: 1 1 100%;
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}
