/* ============================================================
   cab-prosrochki.css — окно «Просрочки» (js/blocks/prosrochki.js) и страница
   #/overdue (js/pages/overdue.js). Приставка cab-pr-.

   Цвета — токены системы: просрочка тем же тёплым цветом, что «is-late» в списках
   кабинета (--mpr-work-*), без красного. Узкий режим включает само окно классом
   is-narrow по matchMedia, поэтому здесь нет второй границы ширины, которая могла бы
   разойтись с той, что в скрипте.
   ============================================================ */

/* Окно шире обычного широкого (880 px): слева список, справа карточка. Высота
   постоянная — столбцы прокручиваются каждый сам, и окно не прыгает при смене дела. */
.cab-pr-dialog .mpr-dialog__shell { width: min(1180px, 100%); height: min(88vh, 860px); height: min(88dvh, 860px); max-height: none; }
.cab-pr-dialog .mpr-dialog__head { padding: 12px 20px 10px; }
.cab-pr-dialog .mpr-dialog__title { margin: 4px 0 0; }
.cab-pr-dialog .mpr-dialog__body { flex: 1 1 auto; min-height: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; }

.cab-pr { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; outline: none; }

/* верхняя полоса: виды, отбор по проекту, поиск */
.cab-pr-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 20px; border-bottom: 1px solid var(--mpr-line-soft); }
.cab-pr-bar[hidden] { display: none; }
.cab-pr-seg { flex: 0 1 auto; min-width: 0; }
.cab-pr-filter { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; padding: 3px 4px 3px 12px; border: 1px solid var(--mpr-line); border-radius: var(--mpr-r-pill); background: var(--mpr-card-strong); font-size: 12.5px; }
.cab-pr-filter[hidden] { display: none; }
.cab-pr-filter__cap { color: var(--mpr-muted); }
.cab-pr-filter__name { min-width: 0; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; color: var(--mpr-forest); }
.cab-pr-search { flex: 1 1 220px; min-width: 180px; min-height: 36px; padding: 6px 12px; border: 1px solid var(--mpr-line); border-radius: var(--mpr-r-sm); background: #fff; font: inherit; font-size: 13px; color: var(--mpr-forest); }
.cab-pr-search:focus { outline: none; border-color: var(--mpr-line-strong); box-shadow: 0 0 0 3px rgba(143, 149, 80, .22); }
.cab-pr-note { padding: 7px 20px; border-bottom: 1px solid var(--mpr-line-soft); background: var(--mpr-cream); font-size: 12.5px; color: var(--mpr-muted); }
.cab-pr-note[hidden] { display: none; }

/* «Срок прошёл, отметки нет» — отдельная категория, а не просрочка: пунктирная рамка у
   кнопки вида, спокойный цвет у хвоста заголовка, у числа дней и у счётчика группы */
.cab-pr-seg .np-seg__btn.cab-pr-seg__aside { border-style: dashed; }
.cab-pr-dialog .cab-pr-title__aside { font-weight: 400; color: var(--mpr-muted); }
.cab-pr-row.is-nomark .cab-pr-row__late { font-weight: 500; color: var(--mpr-muted); }
.cab-pr-grp__n.is-nomark { border-color: var(--mpr-line); background: var(--mpr-card-strong); color: var(--mpr-muted); }
.cab-pr-empty__more { margin-top: 12px; }

/* два столбца */
.cab-pr-main { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.cab-pr-main.is-empty { grid-template-columns: 1fr; }
.cab-pr-main.is-empty .cab-pr-card { display: none; }
.cab-pr-list { min-height: 0; overflow-y: auto; padding: 8px 10px 16px; border-right: 1px solid var(--mpr-line-soft); overscroll-behavior: contain; }
.cab-pr-main.is-empty .cab-pr-list { border-right: 0; }
.cab-pr-card { min-height: 0; overflow-y: auto; padding: 18px 22px 20px; overscroll-behavior: contain; }
.cab-pr-empty { padding: 28px 12px; text-align: center; font-size: 14px; color: var(--mpr-muted); }

/* группа — один проект */
.cab-pr-grp + .cab-pr-grp { margin-top: 2px; }
.cab-pr-grp__head { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; border-radius: var(--mpr-r-sm); background: transparent; font: inherit; text-align: left; color: var(--mpr-forest); cursor: pointer; }
.cab-pr-grp__head:hover { background: rgba(143, 149, 80, .08); }
.cab-pr-grp__head:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(143, 149, 80, .28); }
.cab-pr-grp__arrow { flex: 0 0 auto; width: 7px; height: 7px; margin: 0 3px; border-right: 1.6px solid var(--mpr-muted); border-bottom: 1.6px solid var(--mpr-muted); transform: rotate(-45deg); transition: transform .15s; }
.cab-pr-grp.is-open .cab-pr-grp__arrow { transform: rotate(45deg); }
.cab-pr-grp__names { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.cab-pr-grp__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.cab-pr-grp__org { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--mpr-muted); }
.cab-pr-grp__n { flex: 0 0 auto; min-width: 28px; padding: 2px 8px; border: 1px solid var(--mpr-work-line); border-radius: var(--mpr-r-pill); background: var(--mpr-work-bg); font-family: var(--mpr-mono); font-size: 11.5px; text-align: center; color: var(--mpr-work-fg); }
.cab-pr-grp__rows { padding: 0 0 8px 20px; }

/* строка дела: текст в одну строку, срок, «−N дн.» */
.cab-pr-row { width: 100%; min-height: 36px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 6px 10px; border: 1px solid transparent; border-radius: var(--mpr-r-sm); background: transparent; font: inherit; font-size: 13px; text-align: left; color: var(--mpr-forest); cursor: pointer; }
.cab-pr-row:hover { background: rgba(143, 149, 80, .08); }
.cab-pr-row:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(143, 149, 80, .28); }
.cab-pr-row.is-on { border-color: var(--mpr-line-strong); background: var(--mpr-card-strong); box-shadow: var(--mpr-shadow-soft); }
.cab-pr-row__what { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cab-pr-row__due { font-family: var(--mpr-mono); font-size: 11.5px; color: var(--mpr-muted); }
.cab-pr-row__late { min-width: 58px; font-family: var(--mpr-mono); font-size: 11.5px; font-weight: 600; text-align: right; color: var(--mpr-work-fg); }
.cab-pr-more { margin: 4px 0 0 10px; padding: 4px 0; border: 0; background: none; font: inherit; font-size: 12.5px; color: var(--mpr-moss-deep); text-decoration: underline; cursor: pointer; }

/* карточка выбранного дела */
.cab-pr-card__hint { padding: 28px 0; font-size: 13.5px; color: var(--mpr-muted); }
.cab-pr-back { min-height: 40px; display: inline-flex; align-items: center; margin: 0 0 8px -8px; padding: 6px 8px; border: 0; background: none; font: inherit; font-size: 13.5px; font-weight: 600; color: var(--mpr-moss-deep); cursor: pointer; }
.cab-pr-card__kind { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--mpr-muted); }
.cab-pr-card__project { margin-top: 6px; font-size: 17px; font-weight: 600; line-height: 1.3; color: var(--mpr-forest); overflow-wrap: anywhere; }
.cab-pr-card__org { margin-top: 2px; font-size: 12.5px; color: var(--mpr-muted); }
.cab-pr-card__what { margin: 14px 0 0; padding: 12px 14px; border: 1px solid var(--mpr-line-soft); border-radius: var(--mpr-r-sm); background: rgba(255, 255, 255, .72); font-size: 14px; line-height: 1.5; color: var(--mpr-forest); white-space: pre-wrap; overflow-wrap: anywhere; }
.cab-pr-card__facts { margin: 12px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cab-pr-fact { min-width: 0; padding: 8px 12px; border: 1px solid var(--mpr-line-soft); border-radius: var(--mpr-r-sm); background: rgba(255, 255, 255, .55); }
.cab-pr-fact dt { font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--mpr-muted); }
.cab-pr-fact dd { margin: 2px 0 0; font-size: 13.5px; font-weight: 500; color: var(--mpr-forest); overflow-wrap: anywhere; }
.cab-pr-fact.is-late { border-color: var(--mpr-work-line); background: var(--mpr-work-bg); }
.cab-pr-fact.is-late dd { font-weight: 600; color: var(--mpr-work-fg); }
.cab-pr-fact.is-muted dd { font-weight: 400; color: var(--mpr-muted); }
.cab-pr-card__acts { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.cab-pr-card__nav { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--mpr-line-soft); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cab-pr-card__pos { font-family: var(--mpr-mono); font-size: 12px; color: var(--mpr-muted); }
.cab-pr-card__nav .np-btn[disabled] { opacity: .45; cursor: default; }

/* узкий экран: один столбец — либо список, либо карточка */
.cab-pr.is-narrow .cab-pr-main { grid-template-columns: 1fr; }
.cab-pr.is-narrow .cab-pr-list { padding: 6px 6px 16px; border-right: 0; }
.cab-pr.is-narrow:not(.is-card) .cab-pr-card { display: none; }
.cab-pr.is-narrow.is-card .cab-pr-bar,
.cab-pr.is-narrow.is-card .cab-pr-note,
.cab-pr.is-narrow.is-card .cab-pr-list { display: none; }
.cab-pr.is-narrow .cab-pr-card { padding: 10px 16px 18px; }
.cab-pr.is-narrow .cab-pr-card__facts { grid-template-columns: 1fr; }
.cab-pr.is-narrow .cab-pr-bar { padding: 8px 12px; }
/* Переключатель видов: короткие подписи ставит скрипт, а кнопки, которым не хватило
   строки, переносятся вниз. Прокрутка вбок прятала их («Контрольные точ…» за краем). */
.cab-pr.is-narrow .cab-pr-seg { flex: 1 1 100%; flex-wrap: wrap; overflow: visible; }
.cab-pr.is-narrow .cab-pr-seg .np-seg__btn { flex: 0 0 auto; white-space: nowrap; padding: 5px 10px; }
.cab-pr.is-narrow .cab-pr-search { flex: 1 1 100%; min-width: 0; }
.cab-pr.is-narrow .cab-pr-note { padding: 6px 12px; }
.cab-pr.is-narrow .cab-pr-grp__rows { padding-left: 8px; }
.cab-pr.is-narrow .cab-pr-row { min-height: 48px; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "what what" "due late"; row-gap: 2px; }
.cab-pr.is-narrow .cab-pr-row__what { grid-area: what; }
.cab-pr.is-narrow .cab-pr-row__due { grid-area: due; }
.cab-pr.is-narrow .cab-pr-row__late { grid-area: late; }

/* телефон: окно становится нижним листом (mpr-site.css), высота — почти весь экран */
@media (max-width: 560px) {
  .cab-pr-dialog .mpr-dialog__shell { height: 92vh; height: 92dvh; }
  .cab-pr-dialog .mpr-dialog__head { padding: 10px 14px 8px; }
  .cab-pr-dialog .mpr-dialog__title { font-size: 16px; }
}

/* страница #/overdue под закрытым окном */
.cab-pr-page__again { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--mpr-line-soft); border-radius: var(--mpr-r); background: var(--mpr-card); }