/* ═══════════════════════════════════════════════════════════════════════════
   ОФОРМЛЕНИЕ СИСТЕМЫ — «Сливовая шапка» (выбор владельца 16.08.2026).

   Фирменное взято с terraplast.info по его же CSS: пурпур #95358C, светлые
   сиреневые фоны, шрифт Manrope, логотип. Шрифт лежит здесь же, в статике,
   и не тянется с внешнего CDN — портал работает без интернета у пользователя.

   Стиль собран на переменных: чтобы поменять оттенок или скругление во всей
   системе, правится ОДИН блок :root ниже, а не 27 шаблонов. Раньше эти правила
   жили внутри _base.html — того самого файла, из-за которого экран «Движения»
   простоял мёртвым трое суток; теперь оформление и разметка разъехались, и
   правка цвета больше не может уронить скрипт страницы.

   Что НЕ менялось намеренно: структура таблиц, набор и порядок колонок, палитра
   БДДС и палитра сроков в реестре — их владелец знает наизусть по Excel.
   ═══════════════════════════════════════════════════════════════════════════ */

@font-face {
  font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('/static/fonts/manrope-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap;
  src: url('/static/fonts/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* фирменный пурпур и его оттенки */
  --accent:       #95358C;
  --accent-h:     #7C2C74;
  --accent-ink:   #6E2768;
  --accent-soft:  #F3E8F4;
  --accent-ring:  rgba(149, 53, 140, .22);

  /* нейтрали */
  --bg:           #F6F6FA;
  --surface:      #FFFFFF;
  --surface-2:    #F1F0F6;
  --line:         #E6E4EE;
  --line-strong:  #D5D2DF;
  --ink:          #1E1B22;
  --muted:        #6E6878;
  --faint:        #A9A4B2;

  /* смысловые цвета */
  --ok:      #177A44;  --ok-soft:     #E6F5EC;
  --danger:  #B3261E;  --danger-soft: #FBE9E9;
  --warn:    #8A5A12;  --warn-soft:   #FCF2E0;

  /* форма */
  --r-card:  12px;
  --r-btn:   9px;
  --r-input: 8px;
  --r-pill:  999px;
  --e1: 0 1px 2px rgba(30, 20, 40, .05), 0 6px 18px rgba(30, 20, 40, .05);
  --e2: 0 4px 12px rgba(30, 20, 40, .09), 0 2px 4px rgba(30, 20, 40, .06);
  --e3: 0 16px 40px rgba(30, 20, 40, .18), 0 4px 12px rgba(30, 20, 40, .10);
  --dur: 140ms;
  --ease: cubic-bezier(.2, 0, 0, 1);

  /* шапка */
  --hdr-bg: linear-gradient(90deg, #2C0F30 0%, #3E1642 60%, #4A1A4E 100%);
  --hdr-ink: #F6EAF6;
  --hdr-ink-2: #C6A9C8;
}

* { box-sizing: border-box; }

/* Атрибут hidden обязан выигрывать у оформления. Любое правило вида display:flex у класса
   перебивает браузерное [hidden]{display:none} — и скрытый элемент проступает на экране.
   Поймано рендером сразу после рестайла: жёлтый бейдж «новые заявки» висел на реестре,
   хотя новых заявок не было. */
[hidden] { display: none !important; }

body {
  font-family: 'Manrope', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
  font-size: 14px; line-height: 1.5; margin: 0;
  background: var(--bg); color: var(--ink);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

/* ── шапка ─────────────────────────────────────────────────────────────── */
header {
  background: var(--hdr-bg); color: var(--hdr-ink);
  padding: 0 20px; min-height: 54px;
  display: flex; flex-wrap: wrap; gap: 2px; align-items: center;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .18);
}
header .brand { order: -3; display: flex; align-items: center; margin-right: 14px; flex: none; }
/* Логотип — маской, а не картинкой: один файл красится в нужный цвет (белым на тёмной
   шапке, пурпуром на светлом входе) и не требует второй, «инверсной» версии. */
header .brand .logo {
  display: block; width: 132px; height: 20px; background: var(--hdr-ink);
  -webkit-mask: url('/static/logo-terraplast.svg') no-repeat center / contain;
          mask: url('/static/logo-terraplast.svg') no-repeat center / contain;
}
header a {
  color: var(--hdr-ink-2); text-decoration: none;
  font-size: 12px; font-weight: 600; line-height: 1;
  padding: 18px 8px; position: relative; white-space: nowrap;
  transition: color var(--dur) var(--ease);
}
header a:hover { color: #fff; text-decoration: none; }
/* Текущий пункт меню. Подсветка сделана СЕЛЕКТОРАМИ по пути страницы (header[data-path]),
   а не классом на ссылке: разметку ссылок дословно проверяют тесты роль-гейта, и
   косметика не имеет права её двигать. Ценой — перечисление адресов здесь. */
header[data-path="/"] a.nav-home,
header[data-path="/owner"] a[href="/owner"],
header[data-path="/payments"] a[href="/payments"],
header[data-path="/changes"] a[href="/changes"],
header[data-path="/bdds"] a[href="/bdds"],
header[data-path="/sales"] a[href="/sales"],
header[data-path="/procurement"] a[href="/procurement"],
header[data-path="/procurement-register"] a[href="/procurement-register"],
header[data-path="/payments-log"] a[href="/payments-log"],
header[data-path="/obligations"] a[href="/obligations"],
header[data-path="/calc"] a[href="/calc"],
header[data-path="/cash"] a[href="/cash"],
header[data-path="/movements"] a[href="/movements"],
header[data-path="/salary"] a[href="/salary"],
header[data-path="/notifications"] a[href="/notifications"],
header[data-path="/control"] a[href="/control"],
header[data-path="/articles"] a[href="/articles"],
header[data-path="/article-rules"] a[href="/article-rules"],
header[data-path="/contracts"] a[href="/contracts"],
header[data-path="/imports/1c"] a[href="/imports/1c"],
header[data-path="/imports/reestr"] a[href="/imports/reestr"],
header[data-path="/contacts"] a[href="/contacts"],
header[data-path="/settings"] a[href="/settings"],
header[data-path="/plan-form"] a[href="/plan-form"],
header[data-path="/regular-payments"] a[href="/regular-payments"] { color: #fff; }

header[data-path="/"] a.nav-home::after,
header[data-path="/owner"] a[href="/owner"]::after,
header[data-path="/payments"] a[href="/payments"]::after,
header[data-path="/changes"] a[href="/changes"]::after,
header[data-path="/bdds"] a[href="/bdds"]::after,
header[data-path="/sales"] a[href="/sales"]::after,
header[data-path="/procurement"] a[href="/procurement"]::after,
header[data-path="/procurement-register"] a[href="/procurement-register"]::after,
header[data-path="/payments-log"] a[href="/payments-log"]::after,
header[data-path="/obligations"] a[href="/obligations"]::after,
header[data-path="/calc"] a[href="/calc"]::after,
header[data-path="/cash"] a[href="/cash"]::after,
header[data-path="/movements"] a[href="/movements"]::after,
header[data-path="/salary"] a[href="/salary"]::after,
header[data-path="/notifications"] a[href="/notifications"]::after,
header[data-path="/control"] a[href="/control"]::after,
header[data-path="/articles"] a[href="/articles"]::after,
header[data-path="/article-rules"] a[href="/article-rules"]::after,
header[data-path="/contracts"] a[href="/contracts"]::after,
header[data-path="/imports/1c"] a[href="/imports/1c"]::after,
header[data-path="/imports/reestr"] a[href="/imports/reestr"]::after,
header[data-path="/contacts"] a[href="/contacts"]::after,
header[data-path="/settings"] a[href="/settings"]::after,
header[data-path="/plan-form"] a[href="/plan-form"]::after,
header[data-path="/regular-payments"] a[href="/regular-payments"]::after {
  content: ''; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px;
  background: var(--accent); border-radius: 3px 3px 0 0;
}
.who { margin-left: auto; order: 99; font-size: 11.5px; color: var(--hdr-ink-2); padding-left: 12px;
  white-space: nowrap; }
.who a { padding: 6px 0; color: #fff; text-decoration: underline; }

main { max-width: 1180px; margin: 18px auto; padding: 0 18px; }
h1 { font-size: 19px; font-weight: 800; letter-spacing: -.02em; margin: 0 0 12px; }
h2 { font-size: 14.5px; font-weight: 700; letter-spacing: -.01em; margin: 0 0 8px; }

/* ── таблицы (оформление; структура и колонки не тронуты) ──────────────── */
table { border-collapse: collapse; width: 100%; background: var(--surface); font-size: 13px; }
th, td { border: 1px solid var(--line); padding: 6px 9px; text-align: left; }
th { background: #F6EFF7; color: #5B4B60; font-weight: 700; font-size: 12px; }

/* ── поля и кнопки ─────────────────────────────────────────────────────── */
input, select, textarea {
  font: inherit; font-size: 13px; color: var(--ink);
  background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-input);
  padding: 7px 10px; margin: 2px 0;
  transition: border-color var(--dur), box-shadow var(--dur);
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring);
}
input[type=checkbox], input[type=radio] { accent-color: var(--accent); }
button {
  font: inherit; font-size: 12.5px; font-weight: 700; line-height: 1;
  background: var(--accent); color: #fff; border: 1px solid transparent;
  border-radius: var(--r-btn); padding: 9px 14px; margin: 2px 0; cursor: pointer;
  transition: background var(--dur) var(--ease), box-shadow var(--dur), transform 90ms;
}
button:hover { background: var(--accent-h); box-shadow: 0 6px 14px rgba(149, 53, 140, .22); }
button:active { transform: scale(.96); }
button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
button:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }
button.secondary { background: var(--surface); color: var(--ink); border-color: var(--line-strong); }
button.secondary:hover { background: var(--surface); border-color: var(--accent); color: var(--accent-ink);
  box-shadow: none; }

.card {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card);
  box-shadow: var(--e1); padding: 15px 17px; margin-bottom: 14px;
}
.pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 9px; border-radius: var(--r-pill); font-size: 11.5px; font-weight: 700;
  background: var(--surface-2); color: var(--muted);
}
/* статусы сдачи планов — те же коды, оттенки приведены к новой палитре */
.s-not_opened { background: var(--surface-2); color: var(--muted); }
.s-open { background: #E7EFFB; color: #1F4C86; }
.s-in_progress { background: var(--warn-soft); color: var(--warn); }
.s-submitted { background: #E3ECFA; color: #23508F; }
.s-accepted { background: var(--ok-soft); color: var(--ok); }
.s-overdue { background: var(--danger-soft); color: var(--danger); }
.s-returned_for_revision { background: #FDEBDC; color: #92500F; }
.s-locked { background: #E9E7EE; color: #5B5566; }
.muted { color: var(--muted); font-size: 12px; }
.err { color: var(--danger); } .ok { color: var(--ok); }

/* Вид рядового отдела: body.role-dept включает JS по роли */
.dept-only { display: none; }
.role-dept .dept-only { display: block; }
.role-dept .priv { display: none; }
/* FOUC: пока меню грузится (не пришёл /api/auth/me) — пункты по ролям скрыты,
   иначе отдел на миг видит все 14 пунктов и успевает кликнуть чужое (→403). */
body.menu-loading [data-roles] { display: none; }
header a.nav-home { order: -2; }                 /* «Главная» — первой */
header a.nav-form { order: -1; }                 /* «План бюджета подразделения» — вторым */

/* Вход: логотип крупно над формой — это первый экран рабочего дня. */
.login-card { max-width: 420px; }
.login-card .login-logo {
  display: block; width: 186px; height: 29px; margin: 4px 0 16px; background: var(--accent);
  -webkit-mask: url('/static/logo-terraplast.svg') no-repeat left center / contain;
          mask: url('/static/logo-terraplast.svg') no-repeat left center / contain;
}
.login-card form > div { margin-bottom: 8px; }
.login-card input { width: 100%; }
.login-card code { background: var(--surface-2); border-radius: 5px; padding: 1px 5px; font-size: 12px; }

/* ── палитра БДДС (Excel-вид). НЕ трогаем: владелец сверяет по ней глазами. ── */
:root {
  --bdds-balance:  #99FFCC;
  --bdds-plan:     #DCE6F1;
  --bdds-fact:     #FDE9D9;
  --bdds-section:  #C6D9F0;
  --bdds-subgroup: #F2F2F2;
  --bdds-head:     #DDEBF7;
  --bdds-border:   #b9c2cf;
  --bdds-section-in:  #DCEEDC;
  --bdds-section-out: #F6DDDD;
}
table.bdds { border-collapse: collapse; font-size: 12px; white-space: nowrap; }
table.bdds th, table.bdds td { border: 1px solid var(--bdds-border); padding: 2px 5px; }
table.bdds .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.bdds .col-plan { background: var(--bdds-plan); }
table.bdds .col-fact { background: var(--bdds-fact); }
table.bdds .r-balance { background: var(--bdds-balance); font-weight: bold; }
table.bdds .r-section { background: var(--bdds-section); font-weight: bold; }
table.bdds .r-subgroup { background: var(--bdds-subgroup); font-weight: bold; }
table.bdds .r-head { background: var(--bdds-head); font-weight: bold; }
/* Окно прокрутки: полоса всегда на виду (не в самом низу страницы) */
.bdds-wrap { max-height: 72vh; overflow: auto; border: 1px solid var(--bdds-border); border-radius: 8px; }
/* Залипающая шапка (две строки) */
table.bdds thead th { position: sticky; z-index: 3; height: 24px; box-sizing: border-box; }
table.bdds thead tr:first-child th { top: 0; }
table.bdds thead tr:nth-child(2) th { top: 24px; }
/* Замороженный первый столбец «Статья» */
table.bdds th:first-child, table.bdds td:first-child {
  position: sticky; left: 0; z-index: 2; background: #fff;
}
table.bdds thead th:first-child { z-index: 4; }
table.bdds .r-section  td:first-child { background: var(--bdds-section); }
table.bdds .r-subgroup td:first-child { background: var(--bdds-subgroup); }
table.bdds .r-balance  td:first-child { background: var(--bdds-balance); }
table.bdds .r-head     th:first-child { background: var(--bdds-head); }
table.bdds .r-section.inflow,  table.bdds .r-section.inflow  td:first-child { background: var(--bdds-section-in); }
table.bdds .r-section.outflow, table.bdds .r-section.outflow td:first-child { background: var(--bdds-section-out); }
/* Сворачиваемое дерево БДДС: раздел/категория кликабельны, ▾/▸ маркер */
table.bdds tbody tr.r-section, table.bdds tbody tr.r-subgroup { cursor: pointer; }
table.bdds tbody tr.r-section:hover td, table.bdds tbody tr.r-subgroup:hover td,
table.bdds tbody tr.r-section:hover td:first-child, table.bdds tbody tr.r-subgroup:hover td:first-child { filter: brightness(0.97); }
table.bdds .tw { display: inline-block; width: 1em; color: #5b6b7f; user-select: none; }
/* Узкий первый столбец: названия переносятся по словам (видно больше цифр) */
table.bdds thead th:first-child { width: 190px; max-width: 190px; }
table.bdds tbody tr:not(.r-section):not(.r-subgroup):not(.r-balance) td:first-child {
  width: 190px; max-width: 190px; white-space: normal; word-break: break-word;
}
table.bdds td.muted { white-space: normal; max-width: 84px; word-break: break-word; }

/* Универсальная «липкая» таблица (заморозка как в Excel) */
.tbl-scroll { max-height: 72vh; overflow: auto; border: 1px solid var(--line); border-radius: 8px; }

/* §17 на страницах, которые НЕ переведены в режим «один экран» (у них на странице больше
   одной таблицы — например БДДС + план закупок, а растянуть по высоте можно только одну).
   Там окно прокрутки живёт по max-height, и на невысоком экране его нижняя кромка вместе
   с горизонтальным бегунком уезжала под сгиб: чтобы двинуть таблицу вбок, надо было сначала
   прокрутить страницу вниз — ровно то, что владелец считает браком.
   Окно само укорачивается на низких экранах, чтобы бегунок оставался на виду. Правило стоит
   ПОСЛЕ обоих объявлений: при равной специфичности побеждает последнее.
   На fit-страницах не действует — там окно тянется по флексу (специфичность выше). */
@media (max-height: 860px) {
  .bdds-wrap, .tbl-scroll { max-height: 56vh; }
}
.tbl-scroll thead th { position: sticky; top: 0; z-index: 3; }
table.sticky thead th { position: sticky; top: 0; z-index: 3; }
table.sticky th:first-child, table.sticky td:first-child { position: sticky; left: 0; z-index: 2; background: #fff; }
table.sticky thead th:first-child { z-index: 4; }

/* §17 (требование владельца): страница «на всю высоту окна» — таблица влезает в ОДИН экран,
   а её горизонтальный бегунок ВСЕГДА виден внизу окна. Opt-in: body-класс fit-viewport
   + класс fit-fill на элементе, который растягивается на остаток высоты. */
body.fit-viewport { display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
body.fit-viewport > header { flex: 0 0 auto; }
body.fit-viewport > main { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
body.fit-viewport > main > * { flex: 0 0 auto; }
body.fit-viewport > main > .fit-fill { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
body.fit-viewport .fit-fill > * { flex: 0 0 auto; }
body.fit-viewport .fit-fill .bdds-wrap,
body.fit-viewport .fit-fill .tbl-scroll { flex: 1 1 auto; min-height: 0; max-height: none; }
body.fit-viewport .bdds-wrap.fit-fill,
body.fit-viewport .tbl-scroll.fit-fill { max-height: none; }
/* Заметный горизонтальный бегунок — сразу видно, что таблица едет вбок. */
body.fit-viewport .bdds-wrap::-webkit-scrollbar,
body.fit-viewport .tbl-scroll::-webkit-scrollbar { height: 13px; width: 13px; }
body.fit-viewport .bdds-wrap::-webkit-scrollbar-track,
body.fit-viewport .tbl-scroll::-webkit-scrollbar-track { background: var(--surface-2); border-radius: 7px; }
body.fit-viewport .bdds-wrap::-webkit-scrollbar-thumb,
body.fit-viewport .tbl-scroll::-webkit-scrollbar-thumb { background: #A99CB0; border-radius: 7px; border: 2px solid var(--surface-2); }
body.fit-viewport .bdds-wrap::-webkit-scrollbar-thumb:hover,
body.fit-viewport .tbl-scroll::-webkit-scrollbar-thumb:hover { background: #8B7C93; }
body.fit-viewport .bdds-wrap, body.fit-viewport .tbl-scroll { scrollbar-color: #A99CB0 var(--surface-2); }
@media print { body.fit-viewport { display: block !important; height: auto !important; overflow: visible !important; } }
/* §17 п.1: на fit-страницах максимум места отдаём ТАБЛИЦЕ — сжимаем «хром» вокруг. */
body.fit-viewport > main { margin: 6px auto; }
body.fit-viewport > main > h1 { font-size: 15px; margin: 2px 0 6px; }
body.fit-viewport > main > .card { padding: 7px 10px; margin-bottom: 6px; }
body.fit-viewport .fit-fill > h2 { font-size: 13px; margin: 0 0 4px; }
body.fit-viewport .fit-fill > .print-controls { margin: 2px 0 !important; }
body.fit-viewport .legend.legend-compact { padding: 3px 9px; font-size: 12px; }
/* Управление на fit-страницах — компактнее: на реестре крупные поля переносили строку
   остатков на второй ряд, и таблица теряла ~30 px высоты. §17 п.1: место — таблице. */
body.fit-viewport button { padding: 6px 11px; font-size: 12px; }
body.fit-viewport input, body.fit-viewport select { padding: 5px 8px; font-size: 12.5px; }
body.fit-viewport header { min-height: 48px; }
body.fit-viewport header a { padding: 15px 8px; }

/* Компактная форма (плотная сетка, мелкий шрифт) — переиспользуемо */
.form-compact { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: flex-end; font-size: .85rem; }
.form-compact label { display: flex; flex-direction: column; gap: 3px; font-size: .76rem; font-weight: 600;
  color: var(--muted); }
.form-compact input { font-size: .85rem; padding: 5px 8px; margin: 0; width: 150px; }
.form-compact select { font-size: .85rem; padding: 5px 8px; margin: 0; }
.form-compact label.chk { flex-direction: row; align-items: center; gap: 6px; }
.form-compact label.chk input { width: auto; }
/* Поле выбора файла: ширину отдаём содержимому, иначе имя файла превращается в «f…». */
.form-compact input[type=file] { width: auto; max-width: 100%; border-style: dashed; background: #FBFAFD; }
.file-picked { font-size: .78rem; color: var(--ok); font-weight: 600; margin: 0; flex-basis: 100%; word-break: break-all; }
.file-picked:empty { display: none; }

/* ---- Выбор статьи с поиском (combo): совпадения поднимаются НАВЕРХ ---- */
.combo { position: relative; display: inline-block; min-width: 230px; }
.combo-input { width: 100%; font-size: .85rem; padding: 5px 8px; }
.combo-input.picked { background: var(--accent-soft); border-color: var(--accent); }
.combo-list { position: absolute; z-index: 60; left: 0; right: 0; top: 100%; background: var(--surface);
  border: 1px solid var(--line-strong); border-radius: 0 0 var(--r-input) var(--r-input); max-height: 46vh;
  overflow-y: auto; box-shadow: var(--e2); }
.combo-list[hidden] { display: none; }
.combo-item { padding: 6px 9px; font-size: .85rem; cursor: pointer; display: flex; gap: 8px;
  align-items: baseline; justify-content: space-between; }
.combo-item:hover, .combo-item.active { background: var(--accent-soft); }
.combo-item .dir { font-size: .7rem; color: var(--muted); white-space: nowrap; }
.combo-item mark { background: #FDECA8; padding: 0; }
.combo-empty { padding: 7px 9px; font-size: .8rem; color: var(--faint); }
.form-compact button { font-size: .85rem; padding: 7px 12px; }
details.collapse > summary { cursor: pointer; font-weight: 700; font-size: 14px; padding: 5px 0; user-select: none; }
/* Свёрнутый details браузер прячет через content-visibility, а не display:none — коробка
   остаётся, у неё живая прокрутка, и замер §17 честно видел «окно с бегунком за экраном»
   у СВЁРНУТОГО блока. Гасим явно: свёрнуто — значит нет. */
details.collapse:not([open]) > *:not(summary) { display: none; }

/* Кликабельная строка реестра */
table.bdds tbody tr.clickable { cursor: pointer; }
table.bdds tbody tr.clickable:hover td,
table.bdds tbody tr.clickable:hover td:first-child { background: var(--accent-soft); }

/* Модал (оверлей + окно) — переиспользуемо */
.modal-overlay { position: fixed; inset: 0; background: rgba(30, 20, 40, .45); z-index: 50;
  display: flex; align-items: center; justify-content: center; }
.modal-overlay[hidden] { display: none; }
.modal { background: var(--surface); border-radius: 14px; max-width: 560px; width: 92vw; max-height: 88vh;
  overflow: auto; box-shadow: var(--e3); padding: 18px 20px; }
.modal h3 { margin: 0 0 8px; font-size: 17px; font-weight: 800; letter-spacing: -.01em; }
.modal .close { float: right; background: var(--surface-2); color: var(--muted); border: 1px solid var(--line);
  padding: 4px 10px; }
.modal .close:hover { background: var(--line); color: var(--ink); box-shadow: none; }
.modal .grid2 { display: grid; grid-template-columns: max-content 1fr; gap: 5px 12px; font-size: 13px; margin: 12px 0; }
.modal .row-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.modal .partial-block, .modal .facts-block { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 12px; }
.modal input { font-size: 13px; padding: 6px 9px; width: 130px; }
.modal label { font-size: 13px; }

/* SP-1 палитра реестра платежей (оттенки листа владельца — НЕ трогаем) */
:root {
  --pay-overdue:  #ffc7ce;
  --pay-today:    #ffeb9c;
  --pay-soon:     #c6efce;
  --pay-sched:    #b7e1f3;
  --pay-partial:  #f4cccc;
  --pay-deferred: #c6efce;
}
.pay-overdue { background: var(--pay-overdue); }  .pay-today { background: var(--pay-today); }
.pay-soon { background: var(--pay-soon); }        .pay-sched { background: var(--pay-sched); }
.pay-partial { background: var(--pay-partial); }  .pay-deferred { background: var(--pay-deferred); }
table.bdds tbody tr.partial td { background: var(--pay-partial); }
table.bdds tbody tr.grp { cursor: pointer; background: #EFEAF3; font-weight: bold; }
table.bdds tbody tr.grp td { padding: 4px 8px; }
.grp-mark { display: inline-block; width: 12px; height: 12px; border: 1px solid var(--bdds-border);
  vertical-align: middle; margin-right: 6px; }
.defmark { display: inline-block; background: var(--pay-deferred); padding: 0 6px; border-radius: 3px; }
.deferred-cell { cursor: pointer; }
.legend { font-size: 12px; }
.legend span { margin-right: 14px; white-space: nowrap; }
.legend i { display: inline-block; width: 12px; height: 12px; border: 1px solid var(--bdds-border);
  vertical-align: middle; margin-right: 4px; }

/* ── ПЕЧАТЬ (Волна 3): как в Excel — только таблица, все столбцы на лист, все строки
   через листы. Печать идёт из чистой области #printArea (клон таблицы). ── */
#printArea { display: none; }
@media print {
  @page { size: landscape; margin: 8mm; }
  html, body { background: #fff !important; height: auto !important; min-height: 0 !important;
    overflow: visible !important; margin: 0 !important; }
  body > * { display: none !important; }
  body > #printArea { display: block !important; }
  #printArea .print-h { font-size: 13px; font-weight: 700; margin: 0 0 8px; }
  #printArea table { border-collapse: collapse !important; width: 100% !important; table-layout: auto !important;
    font-size: 8.5px; background: #fff !important; white-space: normal !important; }
  #printArea col { width: auto !important; }
  #printArea th, #printArea td { border: 1px solid #999 !important; padding: 2px 3px !important; text-align: left;
    vertical-align: top; position: static !important; left: auto !important; top: auto !important;
    white-space: normal !important; max-width: none !important; width: auto !important; }
  #printArea thead th, #printArea tr.grp td, #printArea tr.r-sum td, #printArea .r-section td,
  #printArea .r-subgroup td, #printArea .r-head th, #printArea .r-balance td {
    background: #e6ecf7 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; font-weight: bold; }
  #printArea td.num, #printArea th.num, #printArea td.sum-cell { text-align: right !important; }
  #printArea tr { page-break-inside: avoid; }
  #printArea thead { display: table-header-group; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}
