/* ===== Манораи Амирон — дизайн платформы =====
   Фирменные цвета (--accent, --ink, --gold) и шрифт задаются в «Администрирование → Оформление»:
   core/ui.py пишет их в <style id="uiVars">; всё остальное (оттенки, фон, меню) выводится из них здесь. */
:root {
  --accent: #2D5BE3; --accent-rgb: 45, 91, 227; --on-accent: #FFFFFF;          /* кнопки, ссылки, выбранное */
  --ink: #0E1A3A; --ink-rgb: 14, 26, 58;                                      /* тёмный фирменный: меню, логотип */
  --gold: #D4A72C; --gold-rgb: 212, 167, 44;                                  /* второй акцент: метки, активный пункт */
  --font: "Onest", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --brand: var(--ink);
  --accent-600: color-mix(in oklab, var(--accent) 84%, #000);
  --accent-50: color-mix(in oklab, var(--accent) 8%, #fff);
  --accent-100: color-mix(in oklab, var(--accent) 15%, #fff);
  --accent-200: color-mix(in oklab, var(--accent) 32%, #fff);
  --accent-ring: rgba(var(--accent-rgb), .2);
  --bg: color-mix(in oklab, var(--accent) 3%, #F3F5F8);
  --surface: #FFFFFF;
  --surface-2: color-mix(in oklab, var(--accent) 2%, #F7F8FA);
  --surface-3: color-mix(in oklab, var(--accent) 5%, #F5F7FA);
  --hover: color-mix(in oklab, var(--accent) 5%, #F7F8FA);
  --border: #E3E7EE;
  --border-strong: #D2D8E2;
  --border-soft: #EDF0F4;
  --text: #141A29;
  --text-2: #364054;
  --muted: #687287;
  --muted-2: #98A1B3;
  --row-sel: color-mix(in oklab, var(--accent) 11%, #fff);
  --radius: 14px; --r-sm: 9px; --r-xs: 7px;
  --shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 2px 8px -2px rgba(16, 24, 40, .06);
  --shadow-lg: 0 18px 44px -14px rgba(16, 24, 40, .24);
  --fs: 14.5px; --root-fs: 16px; --fs-table: 13px;           /* --fs-table — текст в таблицах и списках документов */
  --topbar-h: 62px;
  --chat-bg: color-mix(in oklab, var(--accent) 3%, #F4F6F9);
  --chat-me: color-mix(in oklab, var(--accent) 12%, #fff);
  --chat-me-border: color-mix(in oklab, var(--accent) 24%, #fff);
  --chat-grp-bg: #E8EEFB;
  --chat-obj-bg: #FFF4DB;
  --chart-grid: #EDF0F4;
  --chart-text: #687287;
  --chart-line: var(--ink);
  --sb-w: 256px;
  --bs-body-font-family: var(--font);
  --bs-body-color: var(--text);
  --bs-body-bg: var(--surface);      /* фон полей, списков, окон; фон страницы задан у body */
  --bs-primary: var(--accent);
  --bs-primary-rgb: var(--accent-rgb);
  --bs-link-color-rgb: var(--accent-rgb);
  --bs-link-hover-color-rgb: var(--accent-rgb);
  --bs-border-color: var(--border);
  --bs-border-radius: var(--r-sm);
  --bs-border-radius-sm: var(--r-xs);
  --bs-border-radius-lg: var(--radius);
  --bs-focus-ring-color: var(--accent-ring);
}
[data-size="xs"] { --fs: 12.5px; --root-fs: 14px; --fs-table: 11.5px; }
[data-size="s"] { --fs: 13.5px; --root-fs: 15px; --fs-table: 12px; }
[data-size="l"] { --fs: 15.5px; --root-fs: 17px; --fs-table: 14px; }
[data-radius="sharp"] { --radius: 6px; --r-sm: 4px; --r-xs: 3px; }
[data-radius="round"] { --radius: 20px; --r-sm: 12px; --r-xs: 10px; }
[data-density="compact"] { --topbar-h: 54px; }
html { font-size: var(--root-fs); }
html, body { overflow-x: hidden; overflow-x: clip; }   /* clip не мешает «липким» заголовкам таблиц и верхней панели */
body { font-size: var(--fs); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
a { text-decoration: none; }
h4 { font-weight: 700; font-size: 1.35rem; letter-spacing: -.01em; color: var(--text); }
h5 { font-weight: 650; }
.text-muted { color: var(--muted) !important; }

/* ---- каркас: боковое меню + верхняя панель ---- */
.sidebar { background: var(--surface); border-right: 1px solid var(--border); }
@media (min-width: 992px) {
  body.with-sidebar .sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sb-w); display: flex; flex-direction: column; z-index: 1030; }
  body.with-sidebar .main-wrap { margin-left: var(--sb-w); }
}
@media (max-width: 991.98px) { .sidebar.offcanvas-lg { width: 280px; } }
.sb-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 12px; border-bottom: 1px solid var(--border); }
.brand { display: flex; align-items: center; gap: 10px; color: var(--text); }
.brand .logo { width: 38px; height: 38px; border-radius: 10px; background: linear-gradient(135deg, var(--brand), #2F5597); color: #fff; font-weight: 700;
  display: grid; place-items: center; font-size: 14px; letter-spacing: .02em; }
.brand-text { display: flex; flex-direction: column; line-height: 1.15; }
.brand-text b { font-size: 14.5px; }
.brand-text small { color: var(--muted); font-size: 11.5px; }
.sb-nav { padding: 8px 10px 24px; overflow-y: auto; flex: 1; }
.sb-group { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--muted-2); padding: 14px 10px 6px; }
.sb-link { position: relative; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; color: var(--text-2); font-weight: 500; font-size: 14px; margin-bottom: 1px; }
.sb-link i { font-size: 1.05rem; color: var(--muted); width: 20px; text-align: center; }
.sb-link:hover { background: var(--surface-2); color: var(--text); }
.sb-link.active { background: var(--accent-50); color: var(--accent-600); }
.sb-link.active i { color: var(--accent); }

.topbar { position: sticky; top: 0; z-index: 1020; height: 62px; display: flex; align-items: center; gap: 10px; padding: 0 20px;
  background: rgba(255, 255, 255, .92); backdrop-filter: saturate(180%) blur(8px); border-bottom: 1px solid var(--border); }
.content { padding: 22px 24px 40px; }   /* на всю ширину экрана */
@media (max-width: 576px) { .content { padding: 14px 10px 30px; } .topbar { padding: 0 10px; } }
.btn-icon { width: 38px; height: 38px; display: inline-grid; place-items: center; border-radius: var(--r-sm); border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-size: 1.15rem; padding: 0; }
.btn-icon:hover { background: var(--surface-2); }
.btn-icon .dot { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: #E5484D; color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.user-btn { display: flex; align-items: center; gap: 8px; border: 0; background: none; padding: 4px 6px; border-radius: 10px; color: var(--text); }
.user-btn:hover { background: var(--surface-2); }
.user-btn b { display: block; font-size: 13px; line-height: 1.1; }
.user-btn small { display: block; font-size: 11px; color: var(--muted); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--accent-50); color: var(--accent-600); font-weight: 700; display: grid; place-items: center; }

/* свёрнутое меню: только иконки (кнопка слева в верхней панели, запоминается) */
@media (min-width: 992px) {
  body.with-sidebar.sb-collapsed { --sb-w: 72px; }
  body.sb-collapsed .sidebar .brand-text, body.sb-collapsed .sb-link span:not(.badge), body.sb-collapsed .sb-group { display: none; }
  body.sb-collapsed .sb-head { justify-content: center; padding: 16px 0 12px; }
  body.sb-collapsed .sb-nav { padding: 8px 8px 24px; }
  body.sb-collapsed .sb-link { justify-content: center; padding: 10px 0; margin-bottom: 3px; }
  body.sb-collapsed .sb-link i { font-size: 1.2rem; width: auto; }
  body.sb-collapsed .sb-link .badge { position: absolute; top: 2px; right: 4px; font-size: 10px; padding: 2px 5px; }
  body.sb-collapsed .sb-nav > .sb-link:first-child { margin-top: 6px; }
}
body.with-sidebar .sidebar, body.with-sidebar .main-wrap { transition: width .15s ease, margin-left .15s ease; }

/* глобальный поиск */
.gsearch { position: relative; flex: 1; max-width: 520px; }
.gsearch > i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted-2); }
.gsearch input { width: 100%; height: 38px; border: 1px solid var(--border); border-radius: var(--r-sm); padding: 0 40px 0 36px; background: var(--surface-2); font-size: 14px; outline: none; }
.gsearch input:focus { background: var(--surface); border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
.gsearch kbd { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: var(--surface); color: var(--muted); border: 1px solid var(--border); font-size: 11px; padding: 1px 6px; box-shadow: none; }
.gs-drop { display: none; position: absolute; top: 44px; left: 0; right: 0; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-lg); max-height: 70vh; overflow-y: auto; padding: 6px; z-index: 1050; }
.gs-drop.show { display: block; }
.gs-group { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted-2); font-weight: 600; padding: 8px 10px 4px; }
.gs-item { display: block; padding: 7px 10px; border-radius: 8px; color: var(--text); }
.gs-item:hover { background: var(--surface-2); }
.gs-item b { font-weight: 600; font-size: 13.5px; display: block; }
.gs-item small { color: var(--muted); font-size: 12px; }
.gs-empty { padding: 12px; color: var(--muted); }

/* ---- карточки и блоки (используются во всех разделах) ---- */
.box { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.card-h { background: var(--surface); color: var(--text); font-weight: 650; font-size: 14px; padding: 11px 14px; border: 1px solid var(--border);
  border-bottom: 0; border-radius: var(--radius) var(--radius) 0 0; }
.card-h + .box, .card-h + form.box, .card-h + div > .box:first-child { border-top-left-radius: 0; border-top-right-radius: 0; }
.card-h[style*="background"] { color: #fff; }
.kpi { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; height: 100%; box-shadow: var(--shadow); transition: transform .12s, box-shadow .12s; }
a .kpi:hover, a.kpi:hover { transform: translateY(-1px); box-shadow: var(--shadow-lg); }
.kpi .v { font-size: 1.45rem; font-weight: 700; color: var(--text); letter-spacing: -.01em; line-height: 1.2; }
.kpi .l { font-size: .8rem; color: var(--muted); margin-top: 2px; }
.row.box { box-shadow: var(--shadow); }
.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sms { white-space: pre-wrap; font-size: 12px; background: var(--surface-2); border: 1px dashed var(--border); padding: 8px; border-radius: 8px; }

/* ---- таблицы ---- */
/* строка заголовков таблицы закреплена: при прокрутке вниз названия колонок остаются под верхней панелью (во всех разделах) */
:root { --sticky-top: var(--topbar-h); }
.table tr:first-child > th, .table thead th { position: sticky; top: var(--sticky-top); z-index: 3; box-shadow: inset 0 -1px 0 var(--border-strong); }
/* внутри блока с прокруткой отступ считается от верха самого блока, а не окна — там заголовок стоит на месте (top: 0),
   иначе он съезжает на 62px вниз, поверх первых строк */
.table-responsive .table tr:first-child > th, .table-responsive .table thead th,
.modal .table tr:first-child > th, .modal .table thead th,
.table.th-local tr:first-child > th, .table.th-local thead th { top: 0; }
/* таблицы в блоке с горизонтальной прокруткой: закреплённая копия строки заголовков (скрипт в base.html) */
.float-head { position: fixed; z-index: 1015; overflow: hidden; background: var(--surface-2); box-shadow: 0 6px 12px -8px rgba(16, 24, 40, .35);
  border-bottom: 1px solid var(--border-strong); pointer-events: auto; }
.float-head table { margin: 0 !important; }
.float-head th { position: static !important; }
.float-head input, .float-head .col-resizer { visibility: hidden; }
.table { --bs-table-bg: transparent; margin-bottom: 0; font-size: var(--fs-table); }
.table > :not(caption) > * > * { border-bottom-color: var(--border-soft); }
.table th { font-size: calc(var(--fs-table) - 1px); font-weight: 600; color: var(--muted); text-transform: none; background: var(--surface-2); white-space: nowrap; }
.table tr:first-child > th { border-top: 0; }
.table-hover > tbody > tr:hover > *, .table-hover tr:hover > td { --bs-table-accent-bg: var(--hover); background: var(--hover); }
table.table-sm td, table.table-sm th { vertical-align: middle; padding: 7px 10px; }
.box > .table th:first-child, .box > table th:first-child { border-top-left-radius: var(--radius); }
.box > .table th:last-child, .box > table th:last-child { border-top-right-radius: var(--radius); }

/* ---- кнопки, формы, значки ---- */
.btn { border-radius: var(--r-sm); font-weight: 500; }
.btn-sm { border-radius: var(--r-xs); }
.btn-primary { --bs-btn-bg: var(--accent); --bs-btn-border-color: var(--accent); --bs-btn-hover-bg: var(--accent-600); --bs-btn-hover-border-color: var(--accent-600);
  --bs-btn-active-bg: var(--accent-600); --bs-btn-active-border-color: var(--accent-600); --bs-btn-disabled-bg: var(--accent); --bs-btn-disabled-border-color: var(--accent); }
.btn-outline-primary { --bs-btn-color: var(--accent-600); --bs-btn-border-color: var(--accent-200); --bs-btn-hover-bg: var(--accent); --bs-btn-hover-border-color: var(--accent);
  --bs-btn-active-bg: var(--accent-600); --bs-btn-active-border-color: var(--accent-600); }
.btn-light-soft { background: var(--surface); border: 1px solid var(--border); color: var(--text-2); }
.btn-light-soft:hover { background: var(--surface-2); }
.form-control, .form-select { border-radius: var(--r-sm); border-color: var(--border-strong); }
.form-control:focus, .form-select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
.form-check-input:checked { background-color: var(--accent); border-color: var(--accent); }
.form-label { font-weight: 500; color: var(--text-2); }
.nav-pills .nav-link { border-radius: var(--r-sm); color: var(--text-2); font-weight: 500; }
.nav-pills .nav-link.active { background: var(--accent); color: var(--on-accent); }
.badge { font-weight: 600; }
.dropdown-menu { border-color: var(--border); border-radius: var(--radius); padding: 6px; box-shadow: var(--shadow-lg); }
.dropdown-item { border-radius: var(--r-xs); padding: 7px 10px; }
.dropdown-item.active, .dropdown-item:active { background: var(--accent); color: var(--on-accent); }
.alert { border-radius: var(--r-sm); }
.legend span { display: inline-block; padding: 2px 8px; margin: 2px; border: 1px solid var(--border-strong); border-radius: 6px; font-size: 12px; }

/* уведомления */
.toast { border-radius: var(--radius); box-shadow: var(--shadow-lg); background: var(--surface); min-width: 300px; }
.toast-body { font-weight: 500; }
.toast-success { border-left: 4px solid var(--accent) !important; } .toast-success .bi { color: var(--accent); }
.toast-danger { border-left: 4px solid #E5484D !important; } .toast-danger .bi { color: #E5484D; }
.toast-warning { border-left: 4px solid #E8A317 !important; } .toast-warning .bi { color: #E8A317; }
.toast-info { border-left: 4px solid #3B7DDD !important; } .toast-info .bi { color: #3B7DDD; }

/* страница входа */
.auth-card { width: 100%; max-width: 400px; background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--radius) + 4px); box-shadow: var(--shadow-lg); padding: 30px; }

/* старая шахматка (раздел «Квартиры») */
.chess { border-collapse: separate; border-spacing: 3px; }
.chess td { width: 86px; min-width: 70px; height: 54px; font-size: 11px; text-align: center; border: 1px solid var(--border-strong); border-radius: 6px; padding: 2px; line-height: 1.15; cursor: pointer; }
.chess td.fl { width: 34px; min-width: 34px; font-weight: 700; border: none; cursor: default; background: none; }
.chess td.empty { border: none; background: none; cursor: default; }
.chess td a { color: #000; display: block; }

/* ===== Журнал «Касса и банк» (как МойСклад) ===== */
.ms-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.ms-toolbar h4 { margin-right: 4px; }
.ms-search { position: relative; flex: 1 1 260px; max-width: 380px; }
.ms-search > i { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--muted-2); font-size: 13px; }
.ms-search input { width: 100%; height: 31px; border: 1px solid var(--border-strong); border-radius: 7px; padding: 0 10px 0 30px; font-size: 13.5px; background: var(--surface); outline: none; }
.ms-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
.sel-box { display: inline-grid; place-items: center; min-width: 34px; height: 31px; padding: 0 8px; border: 1px solid var(--border-strong); border-radius: 7px; background: var(--surface); font-weight: 600; font-size: 13px; }
.ms-filters { padding: 14px 16px; }
.chips.chips-sm label { min-width: 0; height: 30px; padding: 0 9px; font-size: 12.5px; font-weight: 500; }
.acc-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.acc-chip { display: flex; flex-direction: column; padding: 7px 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-sm); color: var(--text); min-width: 130px; box-shadow: var(--shadow); }
.acc-chip:hover { border-color: var(--accent-200); color: var(--text); }
.acc-chip span { font-size: 11.5px; color: var(--muted); } .acc-chip b { font-size: 15px; } .acc-chip small { font-size: 11px; color: var(--muted); }
.ms-table-wrap { overflow: hidden; }
.ops-table thead th { position: sticky; top: 0; z-index: 2; border-bottom: 2px solid var(--border-strong) !important; }
.ops-table th a { color: var(--text-2); white-space: nowrap; } .ops-table th a span { font-size: 10px; color: var(--accent); }
.ops-table tbody tr { cursor: pointer; } .ops-table tbody tr.sel > * { background: var(--row-sel) !important; }
.ops-table td { white-space: nowrap; }
.ops-table th, .ops-table td { overflow: hidden; text-overflow: ellipsis; }
.ops-table th[draggable="true"] { cursor: grab; user-select: none; padding-right: 14px; }
.ops-table th.dragging { opacity: .45; }
.ops-table th.drop-before { box-shadow: inset 3px 0 0 var(--accent); }
.ops-table th.drop-after { box-shadow: inset -3px 0 0 var(--accent); }
.col-resizer { position: absolute; top: 0; right: 0; width: 10px; height: 100%; cursor: col-resize; z-index: 3; touch-action: none; }
.col-resizer::after { content: ""; position: absolute; top: 22%; bottom: 22%; right: 4px; width: 2px; border-radius: 2px; background: var(--border-strong); }
.ops-table th:hover .col-resizer::after, .col-resizer:hover::after { background: var(--accent); }
body.col-resizing, body.col-resizing * { cursor: col-resize !important; user-select: none !important; }
.ops-table td[data-c="cp"], .ops-table td[data-c="art"], .ops-table td[data-c="comment"] { max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.chips.chips-sm label { display: inline-flex; align-items: center; gap: 4px; }
.ms-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 14px; border-top: 1px solid var(--border); background: var(--surface-2); font-size: 13.5px; }

/* ===== Дашборд продаж ===== */
.kpi.dk { padding: 14px 16px; }
.dk-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.dk-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--accent-50); color: var(--accent-600); font-size: 1.05rem; }
.dk-ic.warn { background: #FFF4DB; color: #B7791F; }
.dk-ic.bad { background: #FDE8E8; color: #D9463E; }
.dk-delta { font-size: 12px; font-weight: 600; padding: 2px 7px; border-radius: 999px; display: inline-flex; align-items: center; gap: 3px; }
.dk-delta.up { background: #E7F5EF; color: #1D7A5B; }
.dk-delta.down { background: #FDE8E8; color: #C0392B; }
.kpi.dk .v small { font-weight: 500; }
.dh { font-weight: 650; font-size: 14.5px; margin-bottom: 10px; }
.dh small { display: block; color: var(--muted); font-weight: 400; font-size: 12px; margin-top: 1px; }
.ch { position: relative; height: 260px; }
.ch-lg { height: 320px; }
.ch-empty { height: 100%; display: grid; place-content: center; text-align: center; color: var(--muted-2); gap: 6px; }
.ch-empty i { font-size: 2rem; }

/* ===== Каталог квартир (как Flatris) ===== */
.cat-bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.view-switch { display: flex; flex-wrap: wrap; gap: 8px; }
.view-switch a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border: 1px solid var(--border-strong); border-radius: var(--r-sm); background: var(--surface); color: var(--text-2); font-weight: 500; font-size: 14px; box-shadow: var(--shadow); }
.view-switch a:hover { background: var(--surface-2); }
.view-switch a.active { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.view-switch a.active:hover { background: var(--accent-600); }
.filters { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px 16px; margin-bottom: 14px; }
.filters .lbl { font-size: 12px; font-weight: 600; color: var(--muted); margin-bottom: 4px; }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chips input { display: none; }
.chips label { min-width: 38px; height: 36px; padding: 0 10px; display: inline-grid; place-items: center; border: 1px solid var(--border-strong); border-radius: var(--r-sm); cursor: pointer; font-weight: 600; background: var(--surface); user-select: none; }
.chips input:checked + label { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.range { display: flex; gap: 6px; align-items: center; }
.range input { min-width: 0; }
.cat-summary { color: var(--muted); font-size: 13px; }
.cat-summary b { color: var(--text); }
.legend-dots { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12.5px; color: var(--text-2); }
.legend-dots span { display: inline-flex; align-items: center; gap: 6px; }
.legend-dots i { width: 12px; height: 12px; border-radius: 4px; display: inline-block; }

.active-filters { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: -4px 0 14px; padding: 8px 12px; background: #FFF8E6;
  border: 1px solid #F3DDA0; border-radius: 10px; }
.fchip { display: inline-flex; align-items: center; gap: 6px; background: var(--surface); color: var(--text); border: 1px solid #E5C977; border-radius: 999px;
  padding: 3px 10px; font-size: 13px; font-weight: 500; }
.fchip i { font-size: 11px; color: var(--muted); }
.fchip:hover { background: #FDEBC0; color: var(--text); }

/* интерактив */
.ia-wrap { display: grid; grid-template-columns: 250px 1fr; gap: 14px; }
@media (max-width: 991.98px) { .ia-wrap { grid-template-columns: 1fr; } }
.floors { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 10px; max-height: 76vh; overflow-y: auto; }
.floors .fh { display: grid; grid-template-columns: 38px 1fr 46px; gap: 6px; font-size: 11px; color: var(--muted); font-weight: 600; padding: 0 6px 6px; }
.floor-row { display: grid; grid-template-columns: 38px 1fr 46px; gap: 6px; align-items: center; padding: 4px 6px; border-radius: 8px; color: var(--text); }
.floor-row:hover { background: var(--surface-2); }
.floor-row.active { background: var(--accent-50); outline: 1px solid var(--accent-200); }
.floor-row .fn { font-weight: 700; font-size: 13px; }
.floor-row .bars { display: flex; gap: 3px; }
.floor-row .bars span { flex: 1; height: 16px; border-radius: 4px; background: var(--border-soft); font-size: 10px; line-height: 16px; text-align: center; color: #fff; font-weight: 600; }
.floor-row .bars span.has { background: #2FA36B; }
.floor-row .fc { text-align: right; font-size: 12px; color: var(--muted); }
.floor-row .fc b { color: var(--accent-600); }
.plan-box { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 12px; position: relative; }
.plan-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; justify-content: space-between; margin-bottom: 8px; }
.floor-nav { display: flex; align-items: center; gap: 8px; }
.floor-nav .fbig { font-size: 1.3rem; font-weight: 700; min-width: 90px; text-align: center; }
.plan-stage { position: relative; width: 100%; }
.plan-stage .plan-svg { display: block; width: 100%; height: auto; max-height: calc(100vh - 240px - var(--tabs-extra)); min-height: 320px; user-select: none; }
.plan-stage polygon { cursor: pointer; transition: fill-opacity .12s, stroke-width .12s; stroke-width: 3; }
.plan-stage polygon:hover { fill-opacity: .72 !important; stroke-width: 7; }
.plan-stage polygon.dim { cursor: default; }
.plan-tip { position: absolute; pointer-events: none; background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow-lg); padding: 8px 10px; font-size: 12.5px; z-index: 5; display: none; min-width: 160px; }
.plan-tip b { font-size: 13.5px; }
.scene-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.scene-tabs a { padding: 5px 12px; border-radius: 999px; border: 1px solid var(--border-strong); color: var(--text-2); font-size: 13px; font-weight: 500; background: var(--surface); }
.scene-tabs a.active { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }

/* планировки */
.lay-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.lay-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; transition: transform .12s, box-shadow .12s; color: var(--text); }
.lay-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); color: var(--text); }
.lay-img { aspect-ratio: 4 / 3; background: var(--surface-2); display: grid; place-items: center; overflow: hidden; border-bottom: 1px solid var(--border); position: relative; }
.lay-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 8px; }
.lay-img .promo { position: absolute; top: 10px; left: 10px; }
.lay-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.lay-title { font-weight: 700; font-size: 15px; }
.lay-price { font-size: 1.1rem; font-weight: 700; color: var(--accent-600); }
.lay-meta { font-size: 12.5px; color: var(--muted); }
.lay-floors { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.lay-floors span { font-size: 11px; background: var(--accent-50); color: var(--accent-600); border-radius: 5px; padding: 1px 6px; font-weight: 600; }

/* список */
.cat-table tr[data-unit] { cursor: pointer; }
.st-dot { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500; }
.st-dot i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.cat-table th a { color: var(--muted); }
.cat-table th a:hover { color: var(--text); }

/* шахматка и шахматка+ */
.chess-scroll { overflow-x: auto; padding-bottom: 6px; }
.chess-wrap { display: flex; gap: 16px; align-items: flex-start; width: max-content; }
.chess-sec { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 10px 10px 8px; }
.chess-sec h6 { font-weight: 700; margin: 0 0 8px; display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.chess-sec h6 small { color: var(--muted); font-weight: 500; }
.cg { display: grid; gap: 4px; }
.cg .fl { font-size: 11px; color: var(--muted); font-weight: 600; display: grid; place-items: center; }
.cell { border-radius: 6px; border: 1px solid transparent; font-size: 12px; font-weight: 600; display: grid; place-items: center; cursor: pointer; transition: transform .08s, box-shadow .08s; position: relative; color: #1E2633; }
.cell:hover { transform: scale(1.06); box-shadow: 0 4px 12px rgba(16, 24, 40, .18); z-index: 2; }
.cell.dim { opacity: .3; filter: grayscale(.6); }
.cell.dim:hover { opacity: .75; filter: none; }
.cell.none { background: transparent; cursor: default; }
.cell.none:hover { transform: none; box-shadow: none; }
.cell .pr { position: absolute; top: -5px; right: -5px; width: 14px; height: 14px; border-radius: 50%; background: #E5484D; color: #fff; font-size: 9px; display: grid; place-items: center; }
.cg.small .cell { width: 36px; height: 30px; }
.cg.plus .cell { width: 128px; height: 84px; place-items: stretch; padding: 6px 8px; border-left-width: 4px; text-align: left; }
.cell .top { display: flex; justify-content: space-between; font-size: 12px; }
.cell .mid { font-size: 11.5px; color: #3F4A5C; font-weight: 500; }
.cell .bot { font-size: 12.5px; font-weight: 700; }
.cell .who { font-size: 11px; color: #3F4A5C; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* карточка квартиры (всплывающее окно) */
.modal-content { border-radius: calc(var(--radius) + 4px); border: 0; box-shadow: var(--shadow-lg); }
.uc-img { background: var(--surface-2); border-radius: 12px; display: grid; place-items: center; min-height: 260px; overflow: hidden; }
.uc-img img { max-width: 100%; max-height: 420px; object-fit: contain; }
.uc-price { font-size: 1.6rem; font-weight: 700; letter-spacing: -.01em; }
.uc-props { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; font-size: 13.5px; }
.uc-props div span { color: var(--muted); display: block; font-size: 12px; }
.uc-props div b { font-weight: 600; }
.uc-status { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; }

/* публичный каталог (для сайта) */
body.public { background: #F6F8FB; }
.pub-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; padding: 14px 18px; background: var(--surface); border-bottom: 1px solid var(--border); }
.pub-head .t { font-weight: 700; font-size: 16px; }
.pub-main { padding: 16px 18px 30px; max-width: 1600px; margin: 0 auto; }

@media (max-width: 576px) {
  .kpi .v { font-size: 1.15rem; }
  h4 { font-size: 1.15rem; }
  .view-switch a { padding: 7px 10px; font-size: 13px; }
  .view-switch a span { display: none; }
  .cg.plus .cell { width: 108px; height: 78px; }
}

/* ---- финансовые отчёты и документы (раздел «Касса») ---- */
.fin-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.fin-bar .form-control, .fin-bar .form-select { width: auto; }
.rep { font-size: 13px; }
.rep th, .rep td { white-space: nowrap; }
.rep td.lbl, .rep th.lbl { white-space: normal; min-width: 230px; }
.rep tr.sec > td { background: var(--surface-2); font-weight: 700; text-transform: uppercase; font-size: 12px; letter-spacing: .03em; color: var(--text-2); }
.rep tr.grp > td { font-weight: 600; }
.rep tr.grp .tg { cursor: pointer; user-select: none; }
.rep tr.grp .tg i { display: inline-block; transition: transform .15s; color: var(--muted); font-size: 11px; margin-right: 4px; }
.rep tr.grp.closed .tg i { transform: rotate(-90deg); }
.rep tr.art > td.lbl { padding-left: 30px; color: var(--text-2); }
.rep tr.cp > td.lbl { padding-left: 52px; color: var(--muted); font-size: 12.5px; }
.rep tr.tot > td { font-weight: 700; border-top: 2px solid var(--border-strong); background: var(--surface-2); }
.rep tr.bal > td { font-weight: 600; color: var(--text-2); background: var(--surface-3); }
.rep a.n { color: inherit; text-decoration: none; }
.rep a.n:hover { color: var(--accent-600); text-decoration: underline; }
.rep .neg { color: #D9463E; }
.rep .zero { color: var(--muted-2); }
.rep .bad { color: #D9463E; font-weight: 600; }
.rep .good { color: #1D7A5B; }
.pct-bar { height: 5px; border-radius: 3px; background: var(--border-soft); min-width: 60px; overflow: hidden; }
.pct-bar > span { display: block; height: 100%; background: var(--accent); border-radius: 3px; }
.pct-bar.over > span { background: #E5484D; }
.hub-card { display: flex; gap: 14px; align-items: flex-start; padding: 16px; height: 100%; color: var(--text); background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); transition: transform .12s, box-shadow .12s; }
.hub-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-lg); color: var(--text); }
.hub-card .ic { flex: 0 0 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-50); color: var(--accent-600); font-size: 1.25rem; }
.hub-card b { display: block; font-size: 15px; margin-bottom: 3px; }
.hub-card p { margin: 0; font-size: 12.5px; color: var(--muted); }
.hub-card .tag { font-size: 10.5px; font-weight: 600; padding: 1px 6px; border-radius: 6px; background: var(--border-soft); color: var(--text-2); margin-left: 6px; vertical-align: 2px; }
.acc-pick .dropdown-menu { min-width: 250px; }
.bud-grid input { width: 92px; text-align: right; padding: 2px 6px; font-size: 12.5px; }
.bud-grid td, .bud-grid th { padding: 3px 4px; }
.bud-grid .yr { width: 110px; font-weight: 600; }
@media print {
  .sidebar, .topbar, .noprint, .float-head, .toast-container, .btn { display: none !important; }
  body.with-sidebar .main-wrap { margin-left: 0 !important; }
  .content { padding: 0 !important; }
  .box, .kpi { box-shadow: none !important; }
  body { background: #fff !important; }
  .rep tr.art { display: table-row !important; }
  .table-responsive { overflow: visible !important; }
}

/* ---- форма документа (ПКО/РКО и др.) в стиле МойСклад ---- */
.doc-form { max-width: 1400px; }
.doc-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; margin: -6px 0 16px; background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); position: sticky; top: calc(var(--topbar-h) + 8px); z-index: 20; }
.doc-toolbar .btn { font-size: 14px; }
.btn-save { background: var(--accent); border-color: var(--accent); color: var(--on-accent); font-weight: 600; padding-left: 16px; padding-right: 16px; }
.btn-save:hover, .btn-save:focus-visible, .btn-save:active { background: var(--accent-600); border-color: var(--accent-600); color: var(--on-accent); }
.doc-menus { display: flex; }
.doc-menus > .dropdown > .btn { border-radius: 0; margin-left: -1px; }
.doc-menus > .dropdown:first-child > .btn { border-radius: 8px 0 0 8px; margin-left: 0; }
.doc-menus > .dropdown:last-child > .btn { border-radius: 0 8px 8px 0; }
.doc-who { line-height: 1.3; }
.doc-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 16px; }
.doc-title { font-size: 1.125rem; font-weight: 600; color: var(--text); letter-spacing: -.01em; }
.doc-title-sep { font-size: 14px; color: var(--muted); }
.doc-head .form-control, .doc-head .form-select { height: 32px; padding-top: 3px; padding-bottom: 3px; font-size: 14px; }
.doc-num { position: relative; }
.doc-head #id_doc_number { width: 112px; padding-right: 30px; font-variant-numeric: tabular-nums; }
.doc-num-btn { position: absolute; top: 3px; right: 3px; width: 26px; height: 26px; display: grid; place-items: center; padding: 0; border: 0;
  border-radius: var(--r-xs); background: transparent; color: var(--muted); font-size: 13px; }
.doc-num-btn:hover { background: var(--hover); color: var(--accent-600); }
.doc-head #id_date { width: 140px; }
.doc-head #id_time { width: 92px; }
.dt-pair input[type=time] { flex: 0 0 96px; width: 96px; }
.doc-status select { min-width: 0; width: auto; }
.num-modal { max-width: 460px; }
.num-modal-ic { font-size: 1.6rem; line-height: 1; color: #E8A317; }
.num-modal .text-2 { color: var(--text-2); }
.doc-saved { padding: 8px 12px; border: 1px solid var(--accent-200); border-radius: 10px; background: var(--accent-50); color: var(--text); }
.doc-saved > .bi { color: var(--accent-600); }
.dfield { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 4px 12px; align-items: start; margin-bottom: 11px; }
.dfield > label { padding-top: 7px; color: var(--text); font-size: 14px; }
.dfield > label.req::before { content: "* "; color: #E5484D; }
.dfield .form-control, .dfield .form-select { font-size: 14px; }
.doc-cur { max-width: 520px; }
.cur-chip { display: inline-block; padding: 6px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-2); font-size: 14px; }
.readonly, input.readonly { background: var(--surface-2) !important; color: var(--muted); }
.btn-icon-sm { width: 36px; height: 36px; display: inline-grid; place-items: center; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  color: var(--accent-600); padding: 0; flex: 0 0 36px; }
.btn-icon-sm:hover { background: var(--surface-2); color: var(--accent); }
.doc-tabs .nav-link { color: var(--accent-600); font-weight: 500; }
.doc-tabs .nav-link.active { color: var(--text); font-weight: 650; }
.doc-tab-body { border: 1px solid var(--border); border-top: 0; border-radius: 0 0 var(--radius) var(--radius); padding: 12px; background: var(--surface); }
.doc-paid th { font-weight: 500; color: var(--muted); font-size: 13px; }
.doc-totals { display: grid; gap: 10px; padding: 6px 0 0 10%; }
.doc-totals > div { display: flex; justify-content: space-between; align-items: baseline; font-size: 1.35rem; }
.doc-totals span { font-weight: 700; } .doc-totals b { font-variant-numeric: tabular-nums; }
.ts-wrapper.form-select, .ts-wrapper.form-control { padding: 0 !important; }
.ts-control { min-height: 36px; font-size: 14px; }
.ts-dropdown .create { color: var(--accent-600); }
@media (max-width: 768px) { .dfield { grid-template-columns: 1fr; } .dfield > label { padding-top: 0; } .doc-totals { padding-left: 0; } .doc-toolbar { position: static; } }

/* ---- чат ---- */
.chat-panel { width: 440px !important; max-width: 100vw; background: var(--surface); }
.ch-full { height: calc(100vh - 124px - var(--tabs-extra)); min-height: 460px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden;
  background: var(--surface); box-shadow: var(--shadow); }
.ch-wrap { position: relative; display: flex; height: 100%; overflow: hidden; }
.ch-list { display: flex; flex-direction: column; min-width: 0; }
.ch-room { display: flex; flex-direction: column; min-width: 0; position: relative; background: var(--chat-bg); }
.mode-full .ch-list { width: 340px; flex: 0 0 340px; border-right: 1px solid var(--border); }
.mode-full .ch-room { flex: 1; }
.mode-full .ch-back { display: none; }
.mode-panel .ch-list, .mode-panel .ch-room { width: 100%; flex: 0 0 100%; transition: transform .18s ease; }
.mode-panel.show-room .ch-list, .mode-panel.show-room .ch-room { transform: translateX(-100%); }
.ch-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); min-height: 56px; background: var(--surface); }
.ch-head > b { font-size: 16px; }
.ch-room-title { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.ch-room-title b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-room-title small { color: var(--muted); font-size: 12px; }
.ch-btn { border: 0; background: transparent; color: var(--muted); border-radius: 8px; padding: 5px 8px; display: inline-flex; align-items: center; gap: 4px;
  font-size: 14px; text-decoration: none; }
.ch-btn:hover { background: var(--surface-2); color: var(--text); }
.ch-btn-p { color: var(--accent-600); font-weight: 600; }
.ch-search { position: relative; padding: 8px 12px; border-bottom: 1px solid var(--border); }
.ch-search i { position: absolute; left: 24px; top: 17px; color: var(--muted); font-size: 13px; }
.ch-search input { width: 100%; border: 1px solid var(--border); border-radius: 8px; padding: 6px 10px 6px 32px; font-size: 14px; background: var(--surface-2); color: var(--text); }
.ch-share { padding: 8px 12px; background: var(--accent-50); color: var(--accent-600); font-size: 13px; border-bottom: 1px solid var(--border); }
.ch-rooms, .ch-pick { flex: 1; overflow-y: auto; }
.ch-item { display: flex; gap: 10px; align-items: center; padding: 9px 12px; color: var(--text); border-bottom: 1px solid var(--border-soft); text-decoration: none; }
.ch-item:hover { background: var(--surface-2); color: var(--text); }
.ch-item.active { background: var(--accent-50); }
.ch-item-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ch-item-top { display: flex; justify-content: space-between; gap: 8px; }
.ch-item-top b { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-item-top small { color: var(--muted); font-size: 11.5px; white-space: nowrap; }
.ch-item-last { color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ch-item.unread .ch-item-top b, .ch-item.unread .ch-item-last { color: var(--text); font-weight: 650; }
.ch-count { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--accent); color: var(--on-accent); font-size: 11.5px; font-weight: 700;
  display: grid; place-items: center; }
.ch-count.at { background: #E5484D; } .ch-count.muted { background: #98A2B3; }
.ch-ava { flex: 0 0 36px; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700;
  background: var(--accent-50); color: var(--accent-600); }
.ch-ava.grp { background: var(--chat-grp-bg); color: #3B6FD8; } .ch-ava.obj { background: var(--chat-obj-bg); color: #B7791F; border-radius: 10px; }
.ch-none, .ch-loading { padding: 24px; text-align: center; color: var(--muted); font-size: 13px; }
.ch-empty-room { margin: auto; text-align: center; color: var(--muted); } .ch-empty-room i { font-size: 2.5rem; }
.ch-msgs { flex: 1; overflow-y: auto; padding: 10px 12px 6px; }
.ch-day { text-align: center; margin: 10px 0; }
.ch-day span { background: var(--surface); border: 1px solid var(--border); border-radius: 999px; padding: 2px 10px; font-size: 11.5px; color: var(--muted); }
.ch-msg { display: flex; gap: 8px; align-items: flex-end; margin-top: 8px; position: relative; }
.ch-msg.same { margin-top: 2px; padding-left: 40px; }
.ch-msg.me { flex-direction: row-reverse; } .ch-msg.me.same { padding-left: 0; }
.ch-msg .ch-ava { flex-basis: 32px; width: 32px; height: 32px; font-size: 12px; }
.ch-bubble { max-width: 78%; background: var(--surface); border: 1px solid var(--border); border-radius: 14px 14px 14px 4px; padding: 6px 10px 4px;
  box-shadow: 0 1px 1px rgba(16, 24, 40, .04); overflow-wrap: anywhere; }
.ch-msg.me .ch-bubble { background: var(--chat-me); border-color: var(--chat-me-border); border-radius: 14px 14px 4px 14px; }
.ch-msg.sys .ch-bubble { max-width: 100%; background: var(--accent-50); border-color: transparent; font-size: 13px; margin: 0 auto; }
.ch-author { font-size: 12px; font-weight: 650; color: var(--accent-600); margin-bottom: 1px; }
.ch-text { font-size: 14px; line-height: 1.4; color: var(--text); }
.ch-text a { color: var(--accent-600); }
.ch-meta { font-size: 10.5px; color: var(--muted); text-align: right; margin-top: 1px; }
.ch-quote { border-left: 3px solid var(--accent); padding: 2px 8px; margin: 2px 0 4px; font-size: 12.5px; color: var(--muted); background: var(--surface-2); border-radius: 4px; }
.ch-quote b { color: var(--text); }
.ch-mention { color: var(--accent-600); font-weight: 600; }
.ch-mention.me { background: #FFF1C2; color: #8A5A00; border-radius: 4px; padding: 0 3px; }
.ch-img img { max-width: 240px; max-height: 220px; border-radius: 10px; margin-top: 4px; display: block; }
.ch-file { display: inline-flex; gap: 6px; align-items: center; margin-top: 4px; padding: 6px 10px; border-radius: 8px; background: var(--surface-2); font-size: 13px; }
.ch-acts { display: none; gap: 2px; align-self: center; }
.ch-msg:hover .ch-acts { display: inline-flex; }
.ch-acts button { border: 0; background: var(--surface); color: var(--muted); border-radius: 6px; width: 26px; height: 26px; display: grid; place-items: center; }
.ch-acts button:hover { color: var(--accent-600); background: var(--surface-2); }
.ch-down { position: absolute; right: 16px; bottom: 90px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--border); background: var(--surface);
  color: var(--muted); box-shadow: var(--shadow); }
.ch-compose { border-top: 1px solid var(--border); background: var(--surface); position: relative; }
.ch-bar { display: flex; gap: 10px; align-items: center; padding: 6px 12px; font-size: 12.5px; color: var(--muted); border-bottom: 1px solid var(--border-soft); }
.ch-bar span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ch-input { display: flex; gap: 6px; align-items: flex-end; padding: 8px 10px; }
.ch-input textarea { flex: 1; resize: none; border: 1px solid var(--border); border-radius: 12px; padding: 7px 12px; font-size: 14px; max-height: 160px;
  background: var(--surface-2); color: var(--text); outline: none; }
.ch-input textarea:focus { border-color: var(--accent); background: var(--surface); }
.ch-send { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; border: 0; background: var(--accent); color: var(--on-accent); }
.ch-send:disabled { opacity: .5; }
.ch-mentions { position: absolute; bottom: 100%; left: 10px; right: 10px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  box-shadow: var(--shadow-lg); max-height: 260px; overflow-y: auto; z-index: 5; }
.ch-mentions a { display: flex; gap: 10px; align-items: center; padding: 7px 10px; color: var(--text); text-decoration: none; }
.ch-mentions a:hover, .ch-mentions a:first-child { background: var(--surface-2); }
.ch-mentions small { display: block; color: var(--muted); font-size: 11.5px; }
.ch-mentions .ch-ava { flex-basis: 30px; width: 30px; height: 30px; }
.ch-room.drop::after { content: "Отпустите файл, чтобы прикрепить"; position: absolute; inset: 0; display: grid; place-items: center;
  background: rgba(var(--accent-rgb), .12); border: 2px dashed var(--accent); color: var(--accent-600); font-weight: 600; z-index: 6; }
.ch-overlay { position: absolute; inset: 0; background: rgba(15, 20, 26, .35); z-index: 10; display: grid; place-items: center; padding: 16px; }
.ch-dialog { background: var(--surface); border-radius: 14px; width: 100%; max-width: 420px; max-height: 100%; display: flex; flex-direction: column; overflow: hidden;
  box-shadow: var(--shadow-lg); }
.ch-dialog .ch-pick { max-height: 60vh; }
.ch-checks { max-height: 38vh; overflow-y: auto; display: grid; gap: 4px; }
.ch-checks label { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.chat-toast { background: var(--surface); color: var(--text); box-shadow: var(--shadow-lg); cursor: pointer; border-left: 4px solid var(--accent) !important; }
@media (max-width: 768px) {
  .mode-full .ch-list { width: 100%; flex-basis: 100%; }
  .mode-full.show-room .ch-list { display: none; }
  .mode-full .ch-back { display: inline-flex; }
  .mode-full:not(.show-room) .ch-room { display: none; }
  .ch-full { height: calc(100vh - 92px - var(--tabs-extra)); }
}

/* ---- тёмная тема (выбирается в меню пользователя; хранится в браузере) ---- */
[data-bs-theme="dark"] {
  color-scheme: dark;
  --accent-600: color-mix(in oklab, var(--accent) 80%, #fff);
  --accent-50: color-mix(in oklab, var(--accent) 13%, #11151D);
  --accent-100: color-mix(in oklab, var(--accent) 20%, #11151D);
  --accent-200: color-mix(in oklab, var(--accent) 36%, #11151D);
  --accent-ring: rgba(var(--accent-rgb), .3);
  --brand: var(--accent);
  --bg: color-mix(in oklab, var(--ink) 30%, #07090D);
  --surface: color-mix(in oklab, var(--ink) 20%, #10131A);
  --surface-2: color-mix(in oklab, var(--ink) 20%, #161A22);
  --surface-3: color-mix(in oklab, var(--ink) 24%, #13171F);
  --hover: color-mix(in oklab, var(--ink) 20%, #1B202A);
  --border: color-mix(in oklab, var(--ink) 18%, #252B36);
  --border-strong: color-mix(in oklab, var(--ink) 18%, #323946);
  --border-soft: color-mix(in oklab, var(--ink) 18%, #1C212A);
  --text: #E8ECF3;
  --text-2: #C3CAD6;
  --muted: #939CAE;
  --muted-2: #717A8C;
  --row-sel: color-mix(in oklab, var(--accent) 20%, #10131A);
  --shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 2px 8px -2px rgba(0, 0, 0, .35);
  --shadow-lg: 0 18px 44px -14px rgba(0, 0, 0, .7);
  --chat-bg: color-mix(in oklab, var(--ink) 30%, #0B0E13);
  --chat-me: color-mix(in oklab, var(--accent) 22%, #10131A);
  --chat-me-border: color-mix(in oklab, var(--accent) 34%, #10131A);
  --chat-grp-bg: #1B2A45;
  --chat-obj-bg: #3A2F14;
  --chart-grid: #252B36;
  --chart-text: #939CAE;
  --chart-line: var(--accent);
  --bs-body-color: var(--text);
  --bs-body-bg: var(--surface);      /* фон полей, списков, окон; фон страницы задан у body */
  --bs-border-color: var(--border);
  --bs-secondary-bg: var(--surface-2);
  --bs-tertiary-bg: var(--surface-2);
  --bs-link-color-rgb: var(--accent-rgb);
  --bs-link-hover-color-rgb: var(--accent-rgb);
  --bs-emphasis-color: #F2F5F9;
}
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select { background-color: var(--surface-2); border-color: var(--border-strong); color: var(--text); }
[data-bs-theme="dark"] .form-control:focus, [data-bs-theme="dark"] .form-select:focus { background-color: var(--surface); }
[data-bs-theme="dark"] .form-control::placeholder { color: var(--muted-2); }
[data-bs-theme="dark"] .form-control:disabled, [data-bs-theme="dark"] .form-control[readonly] { background-color: var(--surface-3); }
[data-bs-theme="dark"] .dropdown-menu, [data-bs-theme="dark"] .modal-content, [data-bs-theme="dark"] .offcanvas { background: var(--surface); border-color: var(--border); }
[data-bs-theme="dark"] .dropdown-item:hover { background: var(--hover); }
[data-bs-theme="dark"] .table { --bs-table-color: var(--text); --bs-table-striped-bg: var(--surface-2); }
[data-bs-theme="dark"] .btn-light-soft { color: var(--text-2); }
[data-bs-theme="dark"] .btn-light-soft:hover { background: var(--hover); color: var(--text); }
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-border-color: var(--accent-200); }
[data-bs-theme="dark"] .text-bg-light, [data-bs-theme="dark"] .badge.text-bg-light { background: var(--surface-2) !important; color: var(--text-2) !important; }
[data-bs-theme="dark"] .bg-light { background: var(--surface-2) !important; }
[data-bs-theme="dark"] .table-warning { --bs-table-bg: #3A2F14; --bs-table-color: var(--text); }
[data-bs-theme="dark"] .alert-warning { background: #33290F; border-color: #5C4816; color: #F2D78A; }
[data-bs-theme="dark"] .alert-info { background: #10283F; border-color: #1E4466; color: #A9CFF5; }
[data-bs-theme="dark"] .alert-danger { background: #3A1518; border-color: #6B2328; color: #F5B0B4; }
[data-bs-theme="dark"] .text-success { color: #4CC99A !important; }
[data-bs-theme="dark"] .text-danger, [data-bs-theme="dark"] .rep .neg, [data-bs-theme="dark"] .rep .bad { color: #FF7B7F !important; }
[data-bs-theme="dark"] .rep .good { color: #4CC99A; }
[data-bs-theme="dark"] .dk-ic.warn { background: #3A2F14; color: #F2C35A; }
[data-bs-theme="dark"] .dk-ic.bad { background: #3A1518; color: #FF7B7F; }
[data-bs-theme="dark"] .dk-delta.up { background: #123328; color: #4CC99A; }
[data-bs-theme="dark"] .dk-delta.down { background: #3A1518; color: #FF7B7F; }
[data-bs-theme="dark"] .active-filters { background: #2B2410; border-color: #5C4816; }
[data-bs-theme="dark"] .fchip { border-color: #7A6320; }
[data-bs-theme="dark"] .fchip:hover { background: #3A2F14; }
[data-bs-theme="dark"] .acc-chip:hover, [data-bs-theme="dark"] .floor-row.active { border-color: var(--accent-200); outline-color: var(--accent-200); }
[data-bs-theme="dark"] .gsearch input { background: var(--surface-2); color: var(--text); }
[data-bs-theme="dark"] .gsearch input:focus { background: var(--surface); }


[data-bs-theme="dark"] .ch-mention.me { background: #4A3A0E; color: #F7D774; }
[data-bs-theme="dark"] .plan-box img, [data-bs-theme="dark"] .lay-img img { background: #fff; border-radius: 8px; }
[data-bs-theme="dark"] .ts-control, [data-bs-theme="dark"] .ts-dropdown { background: var(--surface-2); color: var(--text); border-color: var(--border-strong); }
[data-bs-theme="dark"] .ts-dropdown .active { background: var(--hover); color: var(--text); }
[data-bs-theme="dark"] .ts-control input { color: var(--text); }

.dropdown-item.theme-opt.active, .dropdown-item.menu-on { font-weight: 600; background: var(--accent-50); color: var(--accent-600); }
.ts-control > .item { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 24px); }
.ts-wrapper.single .ts-control { padding-right: 2rem !important; }
.doc-sheet { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px 22px 22px; }
.doc-sheet .doc-tab-body { background: var(--surface); }
.doc-sheet .form-control, .doc-sheet .form-select, .doc-sheet .ts-control { border-color: var(--border-strong); }
.doc-sheet .form-control:focus, .doc-sheet .form-select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }

/* Скан паспорта (crm/passport.py) */
.scan-drop { display: block; text-align: center; cursor: pointer; padding: 28px 16px; border: 2px dashed var(--border-strong); border-radius: var(--radius); background: var(--surface-2); color: var(--text-2); }
.scan-drop:hover, .scan-drop.over { border-color: var(--accent); background: var(--accent-50); }
/* скан паспорта: два способа рядом — файл и камера компьютера */
.scan-choice { display: flex; gap: 12px; align-items: stretch; }
.scan-choice .scan-drop { flex: 1 1 0; min-width: 0; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.scan-ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; font-size: 24px; background: var(--surface); color: var(--accent); box-shadow: var(--shadow); }
.scan-cam { flex: 0 0 34%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 22px 16px; text-align: center;
  border: 2px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius: var(--radius); color: var(--text);
  background: linear-gradient(160deg, var(--accent-50), color-mix(in srgb, var(--accent) 16%, var(--surface))); transition: border-color .12s, transform .12s, box-shadow .12s; }
.scan-cam .scan-ic { background: var(--accent); color: #fff; }
.scan-cam .small { color: var(--text-2); max-width: 260px; }
.scan-cam:hover { border-color: var(--accent); box-shadow: var(--shadow-lg); transform: translateY(-1px); }
.scan-cam[hidden] { display: none; }
@media (max-width: 767px) { .scan-choice { flex-direction: column; } .scan-cam { flex-basis: auto; } }
.scan-thumb { position: relative; width: 150px; padding: 6px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); text-align: center; }
.scan-thumb img { width: 100%; height: 100px; object-fit: cover; border-radius: 4px; }
.scan-thumb .btn-close { position: absolute; top: 4px; right: 4px; background-color: var(--surface); border-radius: 50%; padding: 4px; }
.scan-img { width: 100%; border-radius: 6px; border: 1px solid var(--border); }
.form-control.ocr-filled { border-left: 4px solid #3BA776; }
.form-control.ocr-unsure { border-left: 4px solid #E8A317; background: #FFF7E0; }
.ocr-legend { display: inline-block; width: 14px; height: 12px; margin-right: 4px; vertical-align: -1px; border: 1px solid var(--border-strong); border-left-width: 4px; border-radius: 2px; }
.ocr-legend.ocr-filled { border-left-color: #3BA776; }
.ocr-legend.ocr-unsure { border-left-color: #E8A317; background: #FFF7E0; }
[data-bs-theme="dark"] .form-control.ocr-unsure, [data-bs-theme="dark"] .ocr-legend.ocr-unsure { background: #33290F; }
.sec-tabs { display: inline-flex; gap: 2px; padding: 2px; background: var(--surface); border: 1px solid var(--border); border-radius: calc(var(--r-sm) + 2px); }
.sec-tabs a { padding: 3px 11px; border-radius: var(--r-xs); color: var(--text-2); font-weight: 500; font-size: calc(var(--fs) - 1px); display: inline-flex; gap: 5px; align-items: center; }   /* компактно, следует размеру текста */
.sec-tabs a:hover { background: var(--hover); color: var(--text); }
.sec-tabs a.active { background: var(--accent-50); color: var(--accent-600); font-weight: 650; }
.star-btn { color: var(--muted-2); } .star-btn.on { color: #E8A317; }
.draft-row > td { color: var(--muted) !important; }
.draft-row > td a { opacity: .8; }
.draft-badge { background: #FFF1C2; color: #8A5A00; font-weight: 600; font-size: 10.5px; vertical-align: 1px; }
[data-bs-theme="dark"] .draft-badge { background: #4A3A0E; color: #F7D774; }
.posted-box { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; margin-left: 4px; cursor: pointer; user-select: none; }
.posted-box input { width: 1.15em; height: 1.15em; margin: 0; }
.draft-note { background: #FFF4DB; border: 1px solid #F5D48A; color: #7A5200; border-radius: 10px; padding: 8px 12px; font-size: 13.5px; }
[data-bs-theme="dark"] .draft-note { background: #33290F; border-color: #5C4816; color: #F2D78A; }
.bst-stock { background: #E8EEFB; color: #2F5CB8; } .bst-sale { background: #FFF1C2; color: #8A5A00; }
.bst-sold { background: #E3F4EC; color: #1D7A5B; } .bst-used { background: #EEF1F5; color: #475467; } .bst-written_off { background: #FDE8E8; color: #C0392B; }
[data-bs-theme="dark"] .bst-stock { background: #1B2A45; color: #9DB8F2; } [data-bs-theme="dark"] .bst-sale { background: #4A3A0E; color: #F7D774; }
[data-bs-theme="dark"] .bst-sold { background: #123328; color: #4CC99A; } [data-bs-theme="dark"] .bst-used { background: #26303C; color: #C4CCD7; }
[data-bs-theme="dark"] .bst-written_off { background: #3A1518; color: #FF7B7F; }
/* ---- справочник статей (дерево групп, как «Учётные статьи» в ПланФакт) ---- */
.ref-page { max-width: 1000px; }
.ref-crumb { font-size: 12.5px; color: var(--muted); margin-bottom: 4px; display: flex; gap: 6px; align-items: center; }
.at-bar { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin: 16px 0 12px; }
.at-bar .ms-search { max-width: 250px; }
.at-bar .ms-search input { height: 34px; }
.sec-tabs .cnt { font-size: 11.5px; font-weight: 600; color: var(--muted); background: var(--surface-2); border-radius: 10px; padding: 0 7px; line-height: 18px; }
.sec-tabs a.active .cnt { background: var(--surface); color: var(--accent-600); }
.at-tree { overflow: hidden; }
.at-head, .at-grp-h, .at-row { display: grid; grid-template-columns: minmax(0, 1fr) 84px 130px 40px; align-items: center; column-gap: 12px; }
.at-head { padding: 9px 16px; font-size: 12px; font-weight: 600; color: var(--muted); background: var(--surface-2); border-bottom: 1px solid var(--border); }
.at-note { padding: 10px 16px; font-size: 13px; color: var(--text-2); background: var(--surface-3); border-bottom: 1px solid var(--border); }
.at-note i { color: var(--accent); margin-right: 4px; }
.at-grp + .at-grp, .at-grp + .at-empty { border-top: 1px solid var(--border); }
.at-grp-h { padding: 9px 16px; cursor: pointer; user-select: none; background: var(--surface-2); }
.at-grp-h:hover { background: var(--surface-3); }
.at-grp-h .t { display: flex; align-items: center; gap: 8px; font-weight: 650; min-width: 0; }
.at-grp-h .gname { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.at-grp-h .chev { color: var(--muted-2); font-size: 11px; transition: transform .15s; }
.at-grp-h .fold { color: #D99A2B; font-size: 15px; }
.at-grp-h .fc, .at-grp.collapsed .fo { display: none; } .at-grp.collapsed .fc { display: inline; }   /* открытая / закрытая папка */
.at-grp.collapsed .chev { transform: rotate(-90deg); }
.at-grp.collapsed .at-list { display: none; }
.at-grp-h .gcnt { font-size: 11.5px; font-weight: 600; color: var(--muted); background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; padding: 0 7px; line-height: 17px; }
.at-grp-h .acts { display: inline-flex; gap: 2px; opacity: 0; transition: opacity .12s; }
.at-grp-h:hover .acts, .at-grp-h:focus-within .acts { opacity: 1; }
.at-grp-h .at-num { font-weight: 650; color: var(--text); }
.at-list { min-height: 2px; }
.at-list:empty { min-height: 38px; }
.at-list:empty::after { content: "Пусто — перетащите статью сюда"; display: block; padding: 9px 16px 9px 52px; font-size: 12.5px; color: var(--muted-2); }
.at-row { position: relative; padding: 7px 16px 7px 52px; border-top: 1px solid var(--border-soft); background: var(--surface); }
.at-row:hover { background: var(--hover); }
.at-row .nm { min-width: 0; line-height: 1.3; }
.at-row .nm > a, .at-row .nm > span:first-child { color: var(--text); font-weight: 500; }
.at-row .nm > a:hover { color: var(--accent-600); }
.at-row .tj { font-size: 12px; color: var(--muted); margin-top: 1px; }
.at-grip { position: absolute; left: 28px; top: 50%; transform: translateY(-50%); color: var(--muted-2); cursor: grab; opacity: 0; font-size: 15px; }
.at-row:hover .at-grip { opacity: 1; }
.at-tag { display: inline-block; font-size: 11px; font-weight: 600; padding: 1px 8px; border-radius: 10px; margin-left: 8px; vertical-align: 1px; white-space: nowrap; }
.at-tag.pay { background: var(--accent-50); color: var(--accent-600); }
.at-tag.off { background: var(--surface-2); color: var(--muted); border: 1px solid var(--border); }
.at-lock { color: var(--muted-2); font-size: 11px; margin-left: 6px; vertical-align: 1px; }
.at-num { text-align: right; font-variant-numeric: tabular-nums; color: var(--text-2); white-space: nowrap; }
.at-num a { color: var(--text-2); } .at-num a:hover { color: var(--accent-600); }
.at-num .z { color: var(--muted-2); }
.at-row.off .nm > a, .at-row.off .nm > span:first-child, .at-row.off .at-num { color: var(--muted); }
.at-tree:not(.show-off) .at-row.off, .at-tree:not(.show-off) .at-grp.all-off { display: none; }
.at-row.nomatch, .at-grp.nomatch { display: none !important; }
.at-tree.searching .at-grp.collapsed .at-list { display: block; }
.at-more { opacity: 0; }
.at-row:hover .at-more, .at-more[aria-expanded="true"], .at-more:focus { opacity: 1; }
.at-row.hl { animation: atHl 2.4s ease-out; }
@keyframes atHl { 0%, 40% { background: var(--row-sel); } 100% { background: var(--surface); } }
.at-ghost { opacity: .45; background: var(--row-sel) !important; }
.sortable-drag { box-shadow: var(--shadow-lg); }
.at-empty { padding: 28px 16px; text-align: center; color: var(--muted); }
.at-hint { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 10px; font-size: 12.5px; color: var(--muted); }
.btn-icon-xs { width: 28px; height: 28px; padding: 0; display: inline-grid; place-items: center; border: 0; border-radius: 7px; background: transparent; color: var(--muted); font-size: 14px; }
.btn-icon-xs:hover, .btn-icon-xs[aria-expanded="true"] { background: var(--surface-2); color: var(--accent-600); }
.seg2 { display: flex; gap: 0; padding: 3px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 10px; }
.seg2 .btn { flex: 1; border: 0; border-radius: 8px; font-weight: 600; color: var(--muted); padding: 6px 10px; }
.seg2 .btn-check:checked + .btn { background: var(--surface); color: var(--text); box-shadow: var(--shadow); }
.seg2 .btn-check:checked + .btn .bi-arrow-down-left { color: var(--accent); }
.seg2 .btn-check:checked + .btn .bi-arrow-up-right { color: #D9534F; }
.seg2 .btn-check:disabled + .btn { opacity: .75; }
.ae-sys { font-size: 13px; color: var(--text-2); background: var(--surface-3); border: 1px solid var(--border); border-radius: 10px; padding: 8px 12px; margin-bottom: 14px; }
.ae-switches { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); }
#artEdit .form-label, #grpEdit .form-label { font-size: 13px; font-weight: 600; margin-bottom: 4px; }
@media (max-width: 575.98px) {
  .at-head, .at-grp-h, .at-row { grid-template-columns: minmax(0, 1fr) 96px 32px; }
  .at-col-n { display: none; }
  .at-row { padding-left: 36px; } .at-grip { left: 14px; opacity: .6; }
  .at-grp-h .acts, .at-more { opacity: 1; }
  .at-bar .ms-search { max-width: none; flex-basis: 100%; }
  .at-bar .sec-tabs { max-width: 100%; overflow-x: auto; }
  .at-bar .sec-tabs a { white-space: nowrap; padding: 5px 10px; }
}
[data-bs-theme="dark"] .at-grp-h .fold { color: #D9A441; }
[data-bs-theme="dark"] .at-grp-h { background: #19202A; } [data-bs-theme="dark"] .at-grp-h:hover { background: var(--hover); }
[data-bs-theme="dark"] .seg2 .btn-check:checked + .btn { background: var(--hover); }

/* =====================================================================================================
   Дизайн 2.0 — боковое меню (3 вида), стеклянная панель, фон «сияние», плотность, кнопки, вход, «Оформление»
   Все цвета — из --accent / --ink / --gold (Администрирование → Оформление).
   ===================================================================================================== */
body { font-family: var(--font); font-feature-settings: "cv11", "ss01"; }
h4 { font-weight: 700; letter-spacing: -.02em; }
.card-h { font-weight: 700; }
.brand-title { color: var(--ink); }
[data-bs-theme="dark"] .brand-title { color: var(--text); }
::selection { background: rgba(var(--accent-rgb), .22); }
html { scrollbar-color: var(--border-strong) transparent; }
a:focus-visible, .btn:focus-visible, .btn-icon:focus-visible, .sb-link:focus-visible, .user-btn:focus-visible {
  outline: 2px solid rgba(var(--accent-rgb), .6); outline-offset: 2px; box-shadow: none; }

/* ---- фон страницы: однотонный или «сияние» ---- */
[data-bg="aurora"] body.with-sidebar {
  background: radial-gradient(1100px 520px at 18% -14%, rgba(var(--accent-rgb), .10), transparent 62%),
              radial-gradient(900px 480px at 100% -8%, rgba(var(--gold-rgb), .10), transparent 58%), var(--bg);
  background-attachment: fixed; }
[data-bs-theme="dark"][data-bg="aurora"] body.with-sidebar {
  background: radial-gradient(1100px 520px at 18% -14%, rgba(var(--accent-rgb), .16), transparent 62%),
              radial-gradient(900px 480px at 100% -8%, rgba(var(--gold-rgb), .06), transparent 58%), var(--bg);
  background-attachment: fixed; }

/* ---- боковое меню: светлое / тёмное (фирменный тёмный) / цветное ---- */
.sidebar, .topnav {
  --sb-bg: var(--surface); --sb-title: var(--text); --sb-text: var(--text-2); --sb-muted: var(--muted-2); --sb-icon: var(--muted);
  --sb-hover: var(--surface-2); --sb-hover-text: var(--text); --sb-active-bg: var(--accent-50); --sb-active-text: var(--accent-600);
  --sb-active-icon: var(--accent); --sb-border: var(--border); --sb-bar: var(--accent); --sb-scroll: var(--border-strong);
  background: var(--sb-bg); border-right: 1px solid var(--sb-border); color: var(--sb-text); }
[data-sidebar="dark"] .sidebar, [data-sidebar="dark"] .topnav {
  --sb-bg: radial-gradient(420px 280px at 0% 0%, rgba(var(--accent-rgb), .32), transparent 70%),
           radial-gradient(380px 320px at 100% 100%, rgba(var(--gold-rgb), .10), transparent 70%),
           linear-gradient(180deg, color-mix(in oklab, var(--ink) 92%, #fff) 0%, var(--ink) 50%, color-mix(in oklab, var(--ink) 86%, #000) 100%);
  --sb-title: #fff; --sb-text: rgba(255, 255, 255, .76); --sb-muted: rgba(255, 255, 255, .4); --sb-icon: rgba(255, 255, 255, .55);
  --sb-hover: rgba(255, 255, 255, .07); --sb-hover-text: #fff;
  --sb-active-bg: linear-gradient(90deg, rgba(var(--accent-rgb), .55), rgba(var(--accent-rgb), .14));
  --sb-active-text: #fff; --sb-active-icon: var(--gold); --sb-border: rgba(255, 255, 255, .07); --sb-bar: var(--gold);
  --sb-scroll: rgba(255, 255, 255, .18); }
[data-sidebar="accent"] .sidebar, [data-sidebar="accent"] .topnav {
  --sb-bg: radial-gradient(380px 260px at 100% 0%, rgba(var(--gold-rgb), .24), transparent 70%),
           linear-gradient(185deg, color-mix(in oklab, var(--accent) 90%, #fff) 0%, var(--accent) 45%, color-mix(in oklab, var(--accent) 60%, var(--ink)) 100%);
  --sb-title: var(--on-accent); --sb-text: color-mix(in srgb, var(--on-accent) 86%, transparent);
  --sb-muted: color-mix(in srgb, var(--on-accent) 55%, transparent); --sb-icon: color-mix(in srgb, var(--on-accent) 72%, transparent);
  --sb-hover: color-mix(in srgb, var(--on-accent) 12%, transparent); --sb-hover-text: var(--on-accent);
  --sb-active-bg: color-mix(in srgb, var(--on-accent) 20%, transparent); --sb-active-text: var(--on-accent); --sb-active-icon: var(--on-accent);
  --sb-border: color-mix(in srgb, var(--on-accent) 12%, transparent); --sb-bar: var(--gold);
  --sb-scroll: color-mix(in srgb, var(--on-accent) 30%, transparent); }
[data-bs-theme="dark"][data-sidebar="accent"] .sidebar, [data-bs-theme="dark"][data-sidebar="accent"] .topnav {
  --sb-bg: linear-gradient(185deg, color-mix(in oklab, var(--accent) 34%, var(--ink)) 0%, color-mix(in oklab, var(--accent) 18%, #0A0C10) 100%);
  --sb-title: #fff; --sb-text: rgba(255, 255, 255, .8); --sb-muted: rgba(255, 255, 255, .45); --sb-icon: rgba(255, 255, 255, .62);
  --sb-hover: rgba(255, 255, 255, .08); --sb-hover-text: #fff; --sb-active-bg: rgba(255, 255, 255, .14); --sb-active-text: #fff;
  --sb-active-icon: var(--gold); --sb-border: rgba(255, 255, 255, .08); --sb-scroll: rgba(255, 255, 255, .2); }
.sb-head { border-bottom: 1px solid var(--sb-border); padding: 16px 16px 14px; }
.sidebar .brand { color: var(--sb-title); }
.sidebar .brand-text b { color: var(--sb-title); font-weight: 700; letter-spacing: -.01em; }
.sidebar .brand-text small { color: var(--sb-muted); }
.sb-nav { scrollbar-width: thin; scrollbar-color: var(--sb-scroll) transparent; }
.sb-group { color: var(--sb-muted); font-size: 10.5px; letter-spacing: .1em; padding: 16px 12px 6px; }
.sb-link { color: var(--sb-text); border-radius: var(--r-sm); padding: 8px 11px; transition: background .14s, color .14s; }
.sb-link i { color: var(--sb-icon); transition: color .14s; }
.sb-link:hover { background: var(--sb-hover); color: var(--sb-hover-text); }
.sb-link:hover i { color: var(--sb-hover-text); }
.sb-link.active { background: var(--sb-active-bg); color: var(--sb-active-text); font-weight: 600; }
.sb-link.active i { color: var(--sb-active-icon); }
.sb-link.active::before { content: ""; position: absolute; left: -10px; top: 7px; bottom: 7px; width: 3px; border-radius: 0 3px 3px 0; background: var(--sb-bar);
  box-shadow: 0 0 10px rgba(var(--gold-rgb), .6); }
body.sb-collapsed .sb-link.active::before { left: -8px; }
[data-sidebar="dark"] .sidebar .btn-close, [data-sidebar="accent"] .sidebar .btn-close { filter: invert(1) grayscale(1) brightness(2); }

/* логотип: золотой знак на тёмном меню, тёмный с золотыми буквами — на светлом */
.brand .logo { width: 40px; height: 40px; flex: 0 0 40px; border-radius: calc(var(--r-sm) + 2px); display: grid; place-items: center; overflow: hidden;
  background: linear-gradient(140deg, color-mix(in oklab, var(--gold) 80%, #fff) 0%, var(--gold) 48%, color-mix(in oklab, var(--gold) 68%, #4A3300) 100%);
  color: var(--ink); font-weight: 800; font-size: 14px; letter-spacing: .02em;
  box-shadow: 0 8px 18px -8px rgba(var(--gold-rgb), .7), inset 0 1px 0 rgba(255, 255, 255, .45); }
[data-sidebar="light"] .sidebar .brand .logo {
  background: linear-gradient(140deg, color-mix(in oklab, var(--ink) 78%, var(--accent)) 0%, var(--ink) 100%); color: var(--gold);
  box-shadow: 0 8px 18px -8px rgba(var(--ink-rgb), .6), inset 0 1px 0 rgba(255, 255, 255, .12); }
.brand .logo.has-img { background: #fff; padding: 4px; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .45); }
.brand .logo img { width: 100%; height: 100%; object-fit: contain; }

/* ---- верхняя панель: матовое стекло ---- */
.topbar { height: var(--topbar-h); background: color-mix(in srgb, var(--bg) 72%, transparent);
  -webkit-backdrop-filter: saturate(170%) blur(16px); backdrop-filter: saturate(170%) blur(16px);
  border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, transparent); }
.btn-icon { background: var(--surface); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); transition: border-color .14s, color .14s, background .14s; }
.btn-icon:hover { background: var(--surface); border-color: var(--accent-200); color: var(--accent-600); }
.gsearch input { background: var(--surface); box-shadow: 0 1px 2px rgba(16, 24, 40, .04); transition: border-color .14s, box-shadow .14s; }
.avatar { background: linear-gradient(140deg, var(--accent), color-mix(in oklab, var(--accent) 55%, var(--gold))); color: var(--on-accent);
  box-shadow: 0 6px 14px -6px rgba(var(--accent-rgb), .7); }
.user-btn:hover { background: var(--surface); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }

/* ---- кнопки и поля ---- */
.btn-primary { --bs-btn-color: var(--on-accent); --bs-btn-hover-color: var(--on-accent); --bs-btn-active-color: var(--on-accent);
  --bs-btn-disabled-color: var(--on-accent); font-weight: 600;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 60%);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .1), 0 6px 14px -8px rgba(var(--accent-rgb), .85); transition: box-shadow .16s, background-color .16s; }
.btn-primary:hover { box-shadow: 0 1px 2px rgba(16, 24, 40, .1), 0 10px 22px -10px rgba(var(--accent-rgb), .95); }
.btn-outline-primary { --bs-btn-hover-color: var(--on-accent); --bs-btn-active-color: var(--on-accent); }
.btn-light-soft { box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.btn-light-soft:hover { border-color: var(--border-strong); color: var(--text); }
.form-control, .form-select { transition: border-color .14s, box-shadow .14s; }
.form-control:hover:not(:focus):not(:disabled), .form-select:hover:not(:focus):not(:disabled) { border-color: color-mix(in oklab, var(--border-strong) 60%, var(--accent)); }
.form-check-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
.form-switch .form-check-input:focus:not(:checked) { --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2398A1B3'/%3e%3c/svg%3e"); }
.badge.text-bg-primary { color: var(--on-accent) !important; }
.progress-bar { background-color: var(--accent); }

/* ---- карточки: фирменная полоска при наведении ---- */
.kpi { position: relative; overflow: hidden; }
.kpi::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; opacity: 0; transition: opacity .16s;
  background: linear-gradient(90deg, var(--accent), color-mix(in oklab, var(--accent) 35%, var(--gold))); }
a .kpi:hover::before, a.kpi:hover::before, .hub-card:hover::before { opacity: 1; }
.hub-card { position: relative; overflow: hidden; }
.hub-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; opacity: 0; transition: opacity .16s;
  background: linear-gradient(90deg, var(--accent), color-mix(in oklab, var(--accent) 35%, var(--gold))); }
.hub-card .ic, .dk-ic { background: linear-gradient(140deg, var(--accent-50), var(--accent-100)); }

/* ---- плотность «Компактно» ---- */
[data-density="compact"] .content { padding: 16px 18px 30px; }
[data-density="compact"] .sb-link { padding: 6px 11px; }
[data-density="compact"] .sb-group { padding: 12px 12px 4px; }
[data-density="compact"] .table > :not(caption) > * > * { padding-top: .3rem; padding-bottom: .3rem; }
[data-density="compact"] table.table-sm td, [data-density="compact"] table.table-sm th { padding: 4px 8px; }
[data-density="compact"] .kpi { padding: 10px 12px; }
[data-density="compact"] .form-control, [data-density="compact"] .form-select { padding-top: .28rem; padding-bottom: .28rem; }
[data-density="compact"] .btn:not(.btn-sm):not(.btn-lg):not(.btn-icon) { padding-top: .28rem; padding-bottom: .28rem; }
[data-density="compact"] .btn-icon { width: 34px; height: 34px; }
[data-density="compact"] .dfield { margin-bottom: 7px; }
[data-density="compact"] .box.p-3, [data-density="compact"] .ap-card { padding: 12px 14px !important; }

/* ---- страница входа ---- */
body.auth-page { background: var(--bg); }
body.auth-page { min-height: 100vh; }
body.auth-page .content { padding: 0; display: block; min-height: 100vh; max-width: none; }
.auth-split { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); }
.auth-hero { position: relative; overflow: hidden; color: #fff; padding: 44px 56px 40px; display: flex; flex-direction: column; gap: 28px;
  background: radial-gradient(720px 500px at 0% 0%, rgba(var(--accent-rgb), .55), transparent 66%),
              radial-gradient(620px 440px at 100% 100%, rgba(var(--gold-rgb), .22), transparent 60%),
              linear-gradient(160deg, color-mix(in oklab, var(--ink) 86%, #fff), var(--ink) 55%, color-mix(in oklab, var(--ink) 80%, #000)); }
.auth-hero .pattern { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 75% 15%, #000 0, transparent 75%); mask-image: radial-gradient(ellipse 80% 70% at 75% 15%, #000 0, transparent 75%); }
.auth-hero .pattern .pz { fill: none; stroke: rgba(var(--gold-rgb), .2); stroke-width: 1; }
.auth-hero .skyline { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 46%; pointer-events: none; }
.skyline .b { fill: rgba(255, 255, 255, .035); stroke: rgba(var(--gold-rgb), .55); stroke-width: 1.2; }
.skyline .hi { fill: rgba(var(--gold-rgb), .08); stroke: rgba(var(--gold-rgb), .85); }
.skyline .w { fill: rgba(var(--gold-rgb), .5); }
.skyline .ln { fill: none; stroke: rgba(var(--gold-rgb), .55); stroke-width: 1.2; }
.skyline .gr { fill: none; stroke: rgba(255, 255, 255, .14); stroke-width: 1; }
.auth-hero .brand, .auth-copy, .auth-foot { position: relative; z-index: 1; }
.auth-hero .brand-text b { color: #fff; font-size: 16px; }
.auth-hero .brand-text small { color: rgba(255, 255, 255, .6); }
.auth-copy { margin-top: 6vh; }
.auth-copy .kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 14px; }
.auth-copy .kicker::before { content: ""; width: 26px; height: 2px; background: var(--gold); border-radius: 2px; }
.auth-copy h1 { font-size: clamp(30px, 3.3vw, 48px); font-weight: 700; letter-spacing: -.035em; line-height: 1.06; max-width: 560px; margin: 0; }
.auth-copy h1 span { background: linear-gradient(92deg, var(--gold), color-mix(in oklab, var(--gold) 55%, #fff)); -webkit-background-clip: text;
  background-clip: text; color: transparent; }
.auth-copy p { color: rgba(255, 255, 255, .74); max-width: 470px; font-size: 15.5px; line-height: 1.55; margin: 16px 0 0; }
.auth-feats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.auth-feats span { display: inline-flex; gap: 7px; align-items: center; padding: 7px 13px; border-radius: 999px; font-size: 13px; color: rgba(255, 255, 255, .9);
  background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .13); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.auth-feats i { color: var(--gold); }
.auth-foot { margin-top: auto; font-size: 12px; color: rgba(255, 255, 255, .5); }
.auth-main { display: grid; place-items: center; padding: 40px 24px;
  background: radial-gradient(700px 420px at 100% 0%, rgba(var(--accent-rgb), .08), transparent 60%), var(--bg); }
.auth-card { max-width: 420px; padding: 36px 34px 30px; box-shadow: var(--shadow-lg); }
.auth-card h2 { font-size: 1.7rem; font-weight: 700; letter-spacing: -.03em; }
.input-icon { position: relative; }
.input-icon > i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--muted-2); pointer-events: none; }
.input-icon .form-control { padding-left: 42px; }
.input-icon .pw-eye { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: 0; background: none; color: var(--muted); padding: 6px 8px;
  border-radius: var(--r-xs); }
.input-icon .pw-eye:hover { color: var(--accent-600); background: var(--surface-2); }
@media (max-width: 991.98px) {
  .auth-split { grid-template-columns: 1fr; }
  .auth-hero { padding: 26px 22px 110px; gap: 14px; }
  .auth-copy { margin-top: 4px; }
  .auth-copy h1 { font-size: 26px; }
  .auth-copy p, .auth-feats, .auth-foot { display: none; }
  .auth-hero .skyline { height: 60%; }
  .auth-main { padding: 24px 16px 40px; align-items: start; }
}

/* ---- Администрирование → Оформление ---- */
.ap-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; }
@media (max-width: 1199.98px) { .ap-grid { grid-template-columns: 1fr; } .ap-preview { position: static !important; } }
.ap-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px 20px; margin-bottom: 16px; }
.ap-card h6 { font-weight: 700; font-size: 15px; margin: 0 0 2px; display: flex; align-items: center; gap: 8px; }
.ap-card h6 i { color: var(--accent); }
.ap-card .hint { color: var(--muted); font-size: 12.5px; margin-bottom: 14px; }
.ap-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 767.98px) { .ap-cols { grid-template-columns: 1fr; } }
.ap-cols > .ap-card { margin-bottom: 0; }
.ap-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 12px; }
.ap-preset { position: relative; border: 1.5px solid var(--border); border-radius: var(--r-sm); background: var(--surface); padding: 0; overflow: hidden;
  text-align: left; cursor: pointer; color: var(--text); transition: border-color .14s, transform .14s, box-shadow .14s; }
.ap-preset:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.ap-preset.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); }
.ap-preset .mock { height: 76px; display: grid; grid-template-columns: 30% 1fr; }
.ap-preset .mock .sb { position: relative; background: linear-gradient(180deg, color-mix(in oklab, var(--p-ink) 88%, #fff), var(--p-ink)); }
.ap-preset .mock .sb i { position: absolute; left: 7px; right: 7px; height: 5px; border-radius: 3px; background: rgba(255, 255, 255, .22); }
.ap-preset .mock .sb i:nth-child(1) { top: 10px; background: var(--p-gold); right: 14px; }
.ap-preset .mock .sb i:nth-child(2) { top: 24px; background: color-mix(in srgb, var(--p-accent) 80%, #fff); }
.ap-preset .mock .sb i:nth-child(3) { top: 35px; } .ap-preset .mock .sb i:nth-child(4) { top: 46px; }
.ap-preset .mock .mn { background: #F4F6F9; padding: 10px 9px; display: flex; flex-direction: column; gap: 5px; }
.ap-preset .mock .mn i { height: 5px; border-radius: 3px; background: #DCE1E9; width: 78%; }
.ap-preset .mock .mn i:nth-child(2) { width: 52%; }
.ap-preset .mock .mn b { margin-top: auto; width: 46px; height: 14px; border-radius: 5px; background: var(--p-accent); }
.ap-preset .cap { padding: 8px 10px 9px; display: block; }
.ap-preset .cap b { font-size: 13.5px; display: block; }
.ap-preset .cap small { color: var(--muted); font-size: 11.5px; line-height: 1.25; display: block; }
.ap-preset .tick, .ap-opt .tick { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; border-radius: 50%; background: var(--accent); color: var(--on-accent);
  display: none; place-items: center; font-size: 13px; box-shadow: 0 2px 6px rgba(0, 0, 0, .2); }
.ap-preset.on .tick, .ap-opt.on .tick { display: grid; }
.ap-preset.custom .mock { background: conic-gradient(from 200deg at 60% 55%, #2D5BE3, #7442E6, #C21F4B, #C0532B, #D4A72C, #0B8560, #0B7C93, #2D5BE3); }
.ap-colors { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--border); }
.ap-colors label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-2); }
.ap-colors input[type="color"] { width: 42px; height: 34px; padding: 3px; border: 1px solid var(--border-strong); border-radius: var(--r-xs); background: var(--surface); cursor: pointer; }
.ap-colors small { display: block; color: var(--muted); font-size: 11.5px; }
.ap-seg { display: flex; flex-wrap: wrap; gap: 10px; }
.ap-opt { position: relative; flex: 1 1 120px; border: 1.5px solid var(--border); border-radius: var(--r-sm); background: var(--surface); padding: 10px 12px 11px;
  cursor: pointer; text-align: left; color: var(--text); display: flex; flex-direction: column; gap: 7px; transition: border-color .14s, box-shadow .14s, background .14s; }
.ap-opt:hover { border-color: var(--accent-200); }
.ap-opt.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring); background: var(--accent-50); }
.ap-opt b { font-size: 13.5px; font-weight: 600; }
.ap-opt small { color: var(--muted); font-size: 11.5px; line-height: 1.3; }
.ap-opt > .ic { font-size: 1.3rem; color: var(--accent); line-height: 1; }
.ap-opt .sbm { height: 46px; border-radius: 6px; border: 1px solid var(--border); overflow: hidden; display: grid; grid-template-columns: 34% 1fr; }
.ap-opt .sbm .l { position: relative; }
.ap-opt .sbm .l::before, .ap-opt .sbm .l::after { content: ""; position: absolute; left: 6px; right: 8px; height: 4px; border-radius: 2px; top: 10px; background: currentColor; opacity: .35; }
.ap-opt .sbm .l::after { top: 20px; right: 12px; }
.ap-opt .sbm .l.dark { background: var(--ink); color: #fff; }
.ap-opt .sbm .l.light { background: var(--surface); color: var(--text); border-right: 1px solid var(--border); }
.ap-opt .sbm .l.accent { background: var(--accent); color: var(--on-accent); }
.ap-opt .sbm .r { background: var(--bg); }
.ap-font .smp { font-size: 21px; font-weight: 600; letter-spacing: -.015em; line-height: 1.1; }
.ap-font .smp em { font-style: normal; color: var(--accent); }
.ap-font small { font-variant-numeric: tabular-nums; }
.ap-rad { display: block; width: 38px; height: 26px; border: 2px solid var(--accent); background: var(--accent-50); }
.ap-bgm { height: 36px; border-radius: 6px; border: 1px solid var(--border); }
.ap-bgm.aurora { background: radial-gradient(90px 40px at 10% 0%, rgba(var(--accent-rgb), .35), transparent 70%),
  radial-gradient(80px 40px at 100% 0%, rgba(var(--gold-rgb), .35), transparent 70%), var(--bg); }
.ap-bgm.plain { background: var(--bg); }
.ap-dens { display: flex; flex-direction: column; gap: 3px; } .ap-dens i { height: 4px; border-radius: 2px; background: var(--border-strong); }
.ap-dens.comfort { gap: 6px; }
.ap-disabled { opacity: .45; pointer-events: none; filter: grayscale(.4); }
.ap-note { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border-radius: var(--r-sm); margin-bottom: 16px; font-size: 13.5px;
  background: color-mix(in oklab, var(--gold) 14%, var(--surface)); border: 1px solid color-mix(in oklab, var(--gold) 40%, var(--surface)); color: var(--text); }
.ap-note i { color: color-mix(in oklab, var(--gold) 70%, #000); font-size: 1.1rem; }
.ap-preview { position: sticky; top: calc(var(--topbar-h) + 16px); }
.ap-sample .kpi { box-shadow: none; }
.ap-logo { width: 72px; height: 72px; border-radius: var(--radius); border: 1px dashed var(--border-strong); display: grid; place-items: center; overflow: hidden;
  background: var(--surface-2); color: var(--muted); flex: 0 0 72px; }
.ap-logo img { width: 100%; height: 100%; object-fit: contain; padding: 6px; background: #fff; }
.ap-save { position: sticky; bottom: calc(14px + var(--tabs-bottom)); z-index: 30; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 4px; padding: 10px 14px;
  border-radius: var(--radius); background: color-mix(in srgb, var(--surface) 86%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  border: 1px solid var(--border); box-shadow: var(--shadow-lg); }
.ap-dirty { color: var(--muted); font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
.ap-dirty.on { color: color-mix(in oklab, var(--gold) 75%, #000); font-weight: 600; }
[data-bs-theme="dark"] .ap-dirty.on { color: var(--gold); }

/* AI-ассистент (assistant/) */
.ai-wrap { display: grid; grid-template-columns: 260px 1fr; gap: 12px; align-items: start; }
.ai-side { padding: 10px; max-height: calc(100vh - 170px - var(--tabs-extra)); overflow-y: auto; }
.ai-conv { display: flex; flex-direction: column; padding: 6px 8px; border-radius: 8px; color: var(--text-2); text-decoration: none; font-size: 13px; }
.ai-conv small { color: var(--text-3, #98A2B3); font-size: 11px; }
.ai-conv:hover { background: var(--surface-2); color: var(--text); }
.ai-conv.on { background: var(--accent-50); color: var(--text); font-weight: 600; }
.ai-main { display: flex; flex-direction: column; padding: 12px; height: calc(100vh - 170px - var(--tabs-extra)); min-height: 420px; }
.ai-log { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 4px 4px 12px; }
.ai-empty { margin: auto; text-align: center; max-width: 640px; }
.ai-empty > .bi { font-size: 34px; color: var(--accent); }
.ai-msg { max-width: 86%; }
.ai-msg .ai-body { padding: 10px 14px; border-radius: 14px; line-height: 1.5; overflow-x: auto; }
.ai-user { align-self: flex-end; }
.ai-user .ai-body { background: var(--accent); color: #fff; white-space: pre-wrap; border-bottom-right-radius: 4px; }
.ai-assistant { align-self: flex-start; }
.ai-assistant .ai-body { background: var(--surface-2); border: 1px solid var(--border); border-bottom-left-radius: 4px; }
.ai-assistant .ai-body > :last-child { margin-bottom: 0; }
.ai-assistant .ai-body table { border-collapse: collapse; margin: 6px 0; font-size: 13px; }
.ai-assistant .ai-body th, .ai-assistant .ai-body td { border: 1px solid var(--border-strong); padding: 3px 8px; }
.ai-assistant .ai-body th { background: var(--surface); }
.ai-foot { font-size: 11px; color: var(--text-3, #98A2B3); margin: 3px 6px 0; }
.ai-wait { align-self: flex-start; color: var(--text-2); font-size: 13px; }
.ai-wait .ai-body::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 8px; border: 2px solid var(--accent); border-right-color: transparent; border-radius: 50%; animation: ai-spin .8s linear infinite; vertical-align: -1px; }
@keyframes ai-spin { to { transform: rotate(360deg); } }
.ai-error .ai-body { background: #FDECEC; color: #B42318; border: 1px solid #F5C2C0; }
[data-bs-theme="dark"] .ai-error .ai-body { background: #3A1715; color: #F7B4AE; border-color: #6B2420; }
.ai-input { display: flex; gap: 8px; align-items: flex-end; border-top: 1px solid var(--border); padding-top: 10px; }
.ai-input textarea { resize: none; }
@media (max-width: 767px) { .ai-wrap { grid-template-columns: 1fr; } .ai-side { max-height: 160px; } .ai-msg { max-width: 100%; } }

/* Мастер первого запуска (коробочная версия) */
.setup-wrap { max-width: 1100px; margin: 28px auto 48px; padding: 0 16px; }

/* Переключатель языка в верхней панели */
.btn-icon.lang-btn { width: auto; padding: 0 10px; display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 600; }
.btn-icon.lang-btn .bi { font-size: 1.05rem; }

/* ---- навигация 2.0: избранное, группы-гармошки, поиск раздела, меню слева или сверху ---- */
:root { --bar-h: 62px; --nav-h: 46px; }
[data-density="compact"] { --bar-h: 54px; --nav-h: 40px; }
.topbar { display: block; padding: 0; }
.tb-row { height: var(--bar-h); display: flex; align-items: center; gap: 10px; padding: 0 20px; }
@media (max-width: 576px) { .tb-row { padding: 0 10px; } }
.tb-brand { display: none; margin-right: 6px; }
.tb-brand .logo { width: 34px; height: 34px; flex-basis: 34px; font-size: 13px; }
.tb-brand .brand-text b { font-size: 14px; white-space: nowrap; }

.sb-find { position: relative; padding: 10px 12px 2px; }
.sb-find i { position: absolute; left: 24px; top: 50%; margin-top: 4px; transform: translateY(-50%); font-size: 13px; color: var(--sb-muted); pointer-events: none; }
.sb-find input { width: 100%; height: 34px; padding: 0 10px 0 32px; border-radius: var(--r-sm); font-size: 13px;
  border: 1px solid var(--sb-border); background: color-mix(in srgb, var(--sb-hover) 70%, transparent); color: var(--sb-title); outline: 0; }
.sb-find input::placeholder { color: var(--sb-muted); }
.sb-find input:focus { border-color: var(--sb-bar); }
.sb-find input::-webkit-search-cancel-button { filter: grayscale(1); }
.sb-sec { margin-bottom: 2px; }
button.sb-group, .sb-favs .sb-group { width: 100%; display: flex; align-items: center; gap: 6px; border: 0; background: none; text-align: left;
  border-radius: var(--r-sm); cursor: pointer; }
.sb-favs .sb-group { cursor: default; }
.sb-favs .sb-group i { color: var(--gold); font-size: 10px; }
button.sb-group:hover { color: var(--sb-hover-text); background: var(--sb-hover); }
.sb-chev { margin-left: auto; font-size: 10px; transition: transform .16s; opacity: .7; }
.sb-sec.closed .sb-chev { transform: rotate(-90deg); }
.sb-sec.closed .sb-items { display: none; }
.sb-nav.finding .sb-sec .sb-items { display: block; }
.sb-star { margin-left: auto; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; opacity: 0; transition: opacity .12s;
  color: var(--sb-icon); flex: 0 0 22px; }
.sb-link .badge + .sb-star { margin-left: 4px; }
.sb-link:hover .sb-star, .sb-star:focus { opacity: .8; }
.sb-star:hover { opacity: 1; color: var(--gold); background: var(--sb-hover); }
.sb-star i { font-size: 12px; width: auto !important; color: inherit !important; }
.sb-star.on { color: var(--gold); }
.sb-favs .sb-star { display: none; }
.sb-tune { display: flex; align-items: center; gap: 10px; margin: 10px 0 0; padding: 7px 11px; border-radius: var(--r-sm); font-size: 12.5px;
  color: var(--sb-muted); border: 1px dashed var(--sb-border); }
.sb-tune i { width: 20px; text-align: center; }
.sb-tune:hover { color: var(--sb-hover-text); background: var(--sb-hover); }
@media (min-width: 992px) {
  body.sb-collapsed .sb-find, body.sb-collapsed .sb-favs, body.sb-collapsed .sb-star, body.sb-collapsed .sb-tune span, body.sb-collapsed button.sb-group { display: none; }
  body.sb-collapsed .sb-sec.closed .sb-items { display: block; }
  body.sb-collapsed .sb-sec + .sb-sec { border-top: 1px solid var(--sb-border); padding-top: 4px; margin-top: 4px; }
  body.sb-collapsed .sb-tune { justify-content: center; padding: 8px 0; }
}

/* меню сверху (как в Odoo): вторая строка панели, группы — выпадающие списки */
.topnav { display: none; height: var(--nav-h); align-items: center; gap: 2px; padding: 0 14px; overflow-x: auto; scrollbar-width: none;
  background: var(--sb-bg); border-top: 1px solid var(--sb-border); border-right: 0; }
.topnav::-webkit-scrollbar { display: none; }
.tn-link { display: inline-flex; align-items: center; gap: 7px; height: calc(var(--nav-h) - 12px); padding: 0 12px; border: 0; background: none;
  border-radius: var(--r-sm); color: var(--sb-text); font-weight: 500; font-size: 13.5px; white-space: nowrap; transition: background .14s, color .14s; }
.tn-link i { color: var(--sb-icon); font-size: 1rem; }
.tn-link:hover, .tn-link.show { background: var(--sb-hover); color: var(--sb-hover-text); }
.tn-link.active { background: var(--sb-active-bg); color: var(--sb-active-text); font-weight: 600; }
.tn-link.active i { color: var(--sb-active-icon); }
.tn-link .badge { font-size: 10px; }
.tn-star { color: var(--gold) !important; }
.tn-sep { width: 1px; height: 20px; background: var(--sb-border); margin: 0 6px; flex: 0 0 1px; }
.topnav .dropdown-menu { font-size: 13.5px; min-width: 240px; }
.topnav .dropdown-item i { color: var(--muted); }
.topnav .dropdown-item.active i { color: inherit; }
@media (min-width: 992px) and (max-width: 1399.98px) { .tn-main span:not(.badge) { display: none; } .tn-main { padding: 0 10px; } }
@media (min-width: 992px) {
  html[data-nav="top"] { --topbar-h: calc(var(--bar-h) + var(--nav-h)); }
  html[data-nav="top"] body.with-sidebar .sidebar { display: none !important; }
  html[data-nav="top"] body.with-sidebar .main-wrap { margin-left: 0; }
  html[data-nav="top"] #sbToggle { display: none !important; }
  html[data-nav="top"] .tb-brand { display: flex; }
  html[data-nav="top"] .topnav { display: flex; }
}

/* ---- «Где меню» и «Моё меню» в Оформлении ---- */
.ap-opt .sbm.top { grid-template-columns: 1fr; grid-template-rows: 13px 1fr; }
.ap-opt .sbm.top .l::before { top: 4.5px; left: 6px; right: auto; width: 14px; }
.ap-opt .sbm.top .l::after { top: 4.5px; left: 26px; right: auto; width: 14px; }
/* ---- «Моё меню» ---- */
#menu { scroll-margin-top: calc(var(--topbar-h) + 12px); }
.mn-list { columns: 2 300px; column-gap: 18px; }
.mn-g { break-inside: avoid; margin-bottom: 12px; }
.mn-gt { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--muted-2); padding: 4px 8px; }
.mn-row { display: flex; align-items: center; gap: 8px; padding: 3px 4px 3px 8px; border-radius: var(--r-sm); }
.mn-row:hover { background: var(--surface-2); }
.mn-ic { color: var(--muted); width: 18px; text-align: center; }
.mn-t { flex: 1; min-width: 0; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mn-row.off .mn-t, .mn-row.off .mn-ic { opacity: .45; text-decoration: line-through; }
.mn-b { width: 28px; height: 28px; border: 0; background: none; border-radius: 7px; color: var(--muted-2); display: grid; place-items: center; font-size: 14px; }
.mn-b:hover { background: var(--surface); color: var(--text); box-shadow: 0 1px 2px rgba(16, 24, 40, .08); }
.mn-fav.on { color: var(--gold); }
.mn-home.on { color: var(--accent); }
.mn-eye.on { color: #E5484D; }
.mn-row:not(:hover) .mn-b:not(.on) { opacity: .35; }

/* ---- компактные списки: выпадающие варианты мелко, плотно, но читаемо (как в 1С / МойСклад) ---- */
:root { --list-fs: 13.5px; --list-py: 4px; }
[data-size="l"] { --list-fs: 14.5px; }
[data-size="s"] { --list-fs: 12.5px; --list-py: 3px; }

/* обычные списки <select>: новый вид выпадающего списка (Edge / Chrome 135+); в других браузерах — системный */
@supports (appearance: base-select) {
  select.form-select:not([multiple]):not([size]) { appearance: base-select; }
  select.form-select:not([multiple]):not([size])::picker-icon { display: none; }            /* стрелка — своя, как была */
  select.form-select:not([multiple]):not([size])::picker(select) {
    appearance: base-select; border: 1px solid var(--border-strong); border-radius: var(--r-sm); background: var(--surface); color: var(--text);
    box-shadow: var(--shadow-lg); padding: 4px; margin-block: 3px; max-height: min(380px, 60vh); min-width: anchor-size(width);
    font-size: var(--list-fs); scrollbar-width: thin; }
  select.form-select:not([multiple]):not([size]) option {
    padding: var(--list-py) 10px; min-block-size: 0; line-height: 1.35; border-radius: 6px; font-size: var(--list-fs); gap: 0; white-space: nowrap; }
  select.form-select:not([multiple]):not([size]) option::checkmark { display: none; }
  select.form-select:not([multiple]):not([size]) option:hover,
  select.form-select:not([multiple]):not([size]) option:focus-visible { background: var(--hover); color: var(--text); outline: 0; }
  select.form-select:not([multiple]):not([size]) option:checked { background: var(--accent-50); color: var(--accent-600); font-weight: 600; }
  select.form-select:not([multiple]):not([size]) option:disabled { color: var(--muted-2); }
  select.form-select:not([multiple]):not([size]) optgroup { font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; padding: 6px 10px 2px; }
  select.form-select:not([multiple]):not([size]) optgroup option { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--text); }
}
/* системный список (другие браузеры): хотя бы мельче и плотнее, где это разрешено */
select.form-select option { font-size: var(--list-fs); padding: 2px 8px; }

/* списки с поиском (Tom Select): его CSS подключается позже нашего — поэтому «body» впереди */
body .ts-dropdown { font-size: var(--list-fs); line-height: 1.35; border: 1px solid var(--border-strong); border-radius: var(--r-sm); box-shadow: var(--shadow-lg);
  margin-top: 3px; padding: 4px; background: var(--surface); color: var(--text); width: max-content; min-width: 100%; max-width: min(560px, 92vw); }
body .ts-dropdown .ts-dropdown-content { max-height: min(380px, 60vh); scrollbar-width: thin; }
body .ts-dropdown .option, body .ts-dropdown .create, body .ts-dropdown .no-results, body .ts-dropdown .no-more-results {
  padding: var(--list-py) 10px; line-height: 1.35; border-radius: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body .ts-dropdown .optgroup-header { padding: 6px 10px 2px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); background: none; }
body .ts-dropdown .optgroup:before { margin: 4px 0; }
body .ts-dropdown .active { background: var(--hover); color: var(--text); }
body .ts-dropdown .selected { background: var(--accent-50); color: var(--accent-600); font-weight: 600; }
body .ts-dropdown .selected.active { background: color-mix(in oklab, var(--accent-50) 70%, var(--hover)); }
body .ts-dropdown .create { color: var(--accent-600); }
body .ts-dropdown .option[data-value=""]:empty::after { content: "— не выбрано —"; color: var(--muted); }
body .ts-dropdown .option .text-muted, body .ts-dropdown .option small { font-size: .9em; }

/* меню кнопок (Создать, Печать, Изменить…) */
.dropdown-menu { font-size: var(--list-fs); padding: 4px; }
.dropdown-item { padding: var(--list-py) 10px; line-height: 1.35; }
.dropdown-header { padding: 6px 10px 2px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.dropdown-divider { margin: 4px 0; }

/* ---- Администрирование → Нумерация документов (money/numbering.py) ---- */
.nb-table th { font-weight: 500; color: var(--muted); font-size: 13px; }
.nb-warn { color: #9A6400; font-variant-numeric: tabular-nums; } .nb-bad { color: #C0392B; font-weight: 600; font-variant-numeric: tabular-nums; }
[data-bs-theme="dark"] .nb-warn { color: #F2C35B; } [data-bs-theme="dark"] .nb-bad { color: #FF7B7F; }
.nb-rules > div { display: flex; gap: 8px; padding: 3px 0; color: var(--text-2); } .nb-rules .bi { color: var(--accent-600); flex: 0 0 auto; }
.nb-start { width: 130px; }
.nb-preview { max-height: 420px; overflow: auto; border: 1px solid var(--border); border-radius: var(--r-sm); }
.nb-preview thead th { position: sticky; top: 0; background: var(--surface-2); font-weight: 500; color: var(--muted); font-size: 13px; }
.nb-caution { display: flex; gap: 10px; padding: 8px 12px; font-size: 13px; border-radius: 10px; background: #FFF4DB; border: 1px solid #F5D48A; color: #7A5200; }
[data-bs-theme="dark"] .nb-caution { background: #33290F; border-color: #5C4816; color: #F2D78A; }

/* ---- подсказки: значки «?» и экскурсии (guide, static/guide.js) ---- */
.hint-q { display: inline-grid; place-items: center; width: 18px; height: 18px; margin: 0 0 0 4px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--muted-2); font-size: 13px; line-height: 1; vertical-align: -2px; cursor: help; }
.hint-q:hover, .hint-q:focus-visible { color: var(--accent-600); background: var(--accent-50); outline: 0; }
.float-head .hint-q { display: none; }
.hint-pop { --bs-popover-max-width: 320px; --bs-popover-font-size: 13px; --bs-popover-bg: var(--surface); --bs-popover-border-color: var(--border-strong);
  --bs-popover-body-color: var(--text-2); --bs-popover-body-padding-x: 12px; --bs-popover-body-padding-y: 9px; box-shadow: var(--shadow-lg); line-height: 1.45; }
.driver-popover.ma-tour { font-family: var(--font); background: var(--surface); color: var(--text); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 16px 18px 14px; max-width: 360px; min-width: 260px; }
.ma-tour .driver-popover-title { font-size: 15.5px; font-weight: 650; color: var(--text); padding-right: 22px; }
.ma-tour .driver-popover-description { font-size: 13.5px; line-height: 1.5; color: var(--text-2); }
.ma-tour .driver-popover-progress-text { font-size: 12px; color: var(--muted); }
.ma-tour .driver-popover-close-btn { color: var(--muted-2); } .ma-tour .driver-popover-close-btn:hover { color: var(--text); }
.ma-tour .driver-popover-footer { margin-top: 14px; }
.ma-tour .driver-popover-footer-btn { font: 500 13px/1.3 var(--font); text-shadow: none; padding: 6px 12px; border-radius: var(--r-xs);
  border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); }
.ma-tour .driver-popover-footer-btn:hover { background: var(--surface-2); }
.ma-tour .driver-popover-next-btn { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.ma-tour .driver-popover-next-btn:hover { background: var(--accent-600); border-color: var(--accent-600); }
.ma-tour .driver-popover-arrow { border-color: var(--surface); }
.ma-tour .driver-popover-arrow-side-left { border-top-color: transparent; border-bottom-color: transparent; border-right-color: transparent; }
.ma-tour .driver-popover-arrow-side-right { border-top-color: transparent; border-bottom-color: transparent; border-left-color: transparent; }
.ma-tour .driver-popover-arrow-side-top { border-bottom-color: transparent; border-left-color: transparent; border-right-color: transparent; }
.ma-tour .driver-popover-arrow-side-bottom { border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; }
[data-bs-theme="dark"] .driver-overlay path { fill: #000; }
.help-menu { min-width: 300px; }
.help-sw { padding-left: 3.4em; font-size: 14px; cursor: pointer; white-space: normal; max-width: 320px; }
.help-sw .form-check-input { cursor: pointer; }
.help-menu .help-note { max-width: 300px; white-space: normal; }
.guide-welcome { position: fixed; left: 16px; bottom: calc(16px + var(--tabs-bottom)); z-index: 1085; display: flex; gap: 12px; max-width: 420px; padding: 14px 16px;
  background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg);
  animation: gw-in .25s ease-out; }
.guide-welcome .gw-ic { flex: 0 0 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--accent-50); color: var(--accent-600); font-size: 19px; }
.guide-welcome b { display: block; font-size: 15px; margin-bottom: 2px; }
.guide-welcome p { font-size: 13px; color: var(--text-2); margin: 0 0 10px; line-height: 1.45; }
.guide-welcome .gw-btns { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.guide-welcome .btn-link { color: var(--muted); text-decoration: none; }
@keyframes gw-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 575px) { .guide-welcome { left: 8px; right: 8px; bottom: calc(8px + var(--tabs-bottom)); max-width: none; } }

/* ---- «Назад» / «Вперёд» в верхней панели (как стрелки в 1С) ---- */
.tb-hist { display: inline-flex; gap: 4px; }
.tb-hist .btn-icon { width: 34px; height: 34px; font-size: 1.05rem; }
@media (max-width: 576px) { .tb-hist .btn-icon { width: 30px; height: 30px; } }

/* ---- колокольчик уведомлений ---- */
#ntBtn .dot[hidden] { display: none; }
#ntBtn .dot { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; font-size: 10.5px; line-height: 18px; }
#ntBtn.has-new i { animation: nt-ring 1.2s ease 1; transform-origin: 50% 10%; }
@keyframes nt-ring { 0%, 100% { transform: rotate(0); } 20% { transform: rotate(14deg); } 40% { transform: rotate(-12deg); } 60% { transform: rotate(8deg); } 80% { transform: rotate(-4deg); } }
.nt-panel { width: 380px; max-width: calc(100vw - 20px); padding: 0; overflow: hidden; }
.nt-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.nt-tasks { display: flex; align-items: center; gap: 8px; padding: 8px 14px; font-size: 13px; color: var(--text); border-bottom: 1px solid var(--border);
  background: var(--accent-50); text-decoration: none; }
.nt-list { max-height: min(62vh, 520px); overflow-y: auto; }
.nt-item { display: flex; gap: 10px; padding: 10px 14px; color: var(--text); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--border) 60%, transparent); position: relative; }
.nt-item:hover { background: var(--bg); color: var(--text); }
.nt-item.new { background: color-mix(in oklab, var(--accent) 7%, var(--surface)); }
.nt-item.new::before { content: ""; position: absolute; left: 5px; top: 18px; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.nt-ic { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; display: grid; place-items: center; background: var(--accent-50); color: var(--accent); }
.nt-ic.k-money { background: color-mix(in oklab, #1F9D55 14%, var(--surface)); color: #1F9D55; }
.nt-ic.k-approve { background: color-mix(in oklab, #E5A000 16%, var(--surface)); color: #9A6700; }
.nt-ic.k-system { background: color-mix(in oklab, #E5484D 14%, var(--surface)); color: #E5484D; }
.nt-tx { display: flex; flex-direction: column; min-width: 0; font-size: 13px; line-height: 1.35; }
.nt-tx b { font-weight: 600; }
.nt-tx span { color: var(--text-2); }
.nt-tx small { color: var(--muted); font-size: 11.5px; margin-top: 2px; }
.nt-empty { padding: 22px 14px; text-align: center; color: var(--muted); font-size: 13px; }
.nt-foot { display: block; text-align: center; padding: 9px; font-size: 13px; border-top: 1px solid var(--border); }
.nt-page .nt-item:last-child { border-bottom: 0; }
.nt-toasts { position: fixed; right: 18px; bottom: 18px; z-index: 1090; display: flex; flex-direction: column; gap: 8px; width: 360px; max-width: calc(100vw - 36px); }
.nt-toast { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 12px 32px -12px rgba(0, 0, 0, .35);
  padding-right: 34px; animation: nt-in .25s ease; transition: opacity .35s, transform .35s; }
.nt-toast.out { opacity: 0; transform: translateY(8px); }
.nt-x { position: absolute; top: 6px; right: 6px; border: 0; background: transparent; color: var(--muted); padding: 2px 6px; }
@keyframes nt-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* ---- компактное меню слева (как панель разделов 1С): мельче шрифт, плотнее строки ---- */
.sb-link { font-size: 13px; padding: 6px 10px; gap: 9px; line-height: 1.25; }
.sb-link i { font-size: .98rem; width: 18px; }
.sb-group { font-size: 10px; padding: 12px 10px 4px; }
[data-density="compact"] .sb-link { padding: 4px 10px; }
[data-density="compact"] .sb-group { padding: 9px 10px 3px; }
[data-size="s"] .sb-link { font-size: 12.5px; }
[data-size="l"] .sb-link { font-size: 14px; }

/* ---- панель открытых разделов и документов (как «Панель открытых» в 1С / вкладки браузера) ---- */
:root { --tabs-h: 34px; --tabs-extra: 0px; --tabs-bottom: 0px; }
/* страницы на всю высоту окна (ассистент, чат, печать) вычитают панель открытых окон — вверху она делает шапку выше, внизу закрывает низ */
html[data-tabs="top"], html[data-tabs="bottom"] { --tabs-extra: var(--tabs-h); }
html[data-tabs="bottom"] { --tabs-bottom: var(--tabs-h); }
html[data-tabs="top"] { --topbar-h: calc(var(--bar-h) + var(--tabs-h)); }
@media (min-width: 992px) { html[data-tabs="top"][data-nav="top"] { --topbar-h: calc(var(--bar-h) + var(--nav-h) + var(--tabs-h)); } }
.tabbar { display: flex; align-items: flex-end; gap: 4px; height: var(--tabs-h); padding: 0 12px 0 16px; }
.tabbar[hidden] { display: none; }
html[data-tabs="top"] .tabbar { border-top: 1px solid color-mix(in srgb, var(--border) 60%, transparent); }
html[data-tabs="bottom"] .tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1025; align-items: flex-start;
  background: color-mix(in srgb, var(--bg) 88%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-top: 1px solid var(--border); }
@media (min-width: 992px) { html[data-tabs="bottom"] body.with-sidebar .tabbar { left: var(--sb-w); } }
html[data-tabs="bottom"] body { padding-bottom: var(--tabs-h); }
html[data-tabs="bottom"] .nt-toasts { bottom: calc(var(--tabs-h) + 14px); }
/* всё, что прижато к низу окна, поднимается над нижней панелью вкладок (у Bootstrap .bottom-0 — !important) */
html[data-tabs="bottom"] .toast-container.bottom-0 { bottom: var(--tabs-h) !important; }
.tb-tabs { display: flex; align-items: inherit; gap: 2px; flex: 1; min-width: 0; height: 100%; overflow-x: auto; scrollbar-width: none; }
.tb-tabs::-webkit-scrollbar { display: none; }
.tb-tab { position: relative; display: flex; align-items: center; gap: 6px; flex: 0 1 auto; min-width: 90px; max-width: 220px; height: 29px;
  padding: 0 4px 0 10px; font-size: 12.5px; color: var(--text-2); text-decoration: none; white-space: nowrap;
  border: 1px solid transparent; border-radius: 8px 8px 0 0; transition: background .12s, color .12s; }
html[data-tabs="bottom"] .tb-tab { border-radius: 0 0 8px 8px; }
.tb-tab i.bi:first-child { color: var(--muted); font-size: 13px; flex: 0 0 auto; }
.tb-tab span { overflow: hidden; text-overflow: ellipsis; flex: 1; min-width: 0; }
.tb-tab:hover { background: var(--surface-2); color: var(--text); }
.tb-tab.on { background: var(--surface); color: var(--text); font-weight: 600; border-color: var(--border); }
html[data-tabs="top"] .tb-tab.on { border-bottom-color: var(--surface); margin-bottom: -1px; }
html[data-tabs="bottom"] .tb-tab.on { border-top-color: var(--surface); margin-top: -1px; }
.tb-tab.on i.bi:first-child { color: var(--accent); }
.tb-tab:first-child { flex: 0 0 auto; min-width: 0; padding-right: 10px; }
.tb-tab .x { border: 0; background: transparent; color: var(--muted); width: 20px; height: 20px; padding: 0; border-radius: 5px;
  display: grid; place-items: center; flex: 0 0 20px; opacity: 0; }
.tb-tab:hover .x, .tb-tab.on .x { opacity: 1; }
.tb-tab .x:hover { background: color-mix(in oklab, #E5484D 14%, transparent); color: #E5484D; }
.tb-more { align-self: center; }
.tb-mbtn { border: 0; background: transparent; color: var(--muted); width: 28px; height: 26px; border-radius: 6px; }
.tb-mbtn:hover { background: var(--surface-2); color: var(--text); }
.tabs-show-item { display: none; }
html[data-tabs="off"] .tabs-show-item { display: block; }
@media print { .tabbar { display: none !important; } }
/* строка «Итого» (table-light) в тёмной теме — не белая */
[data-bs-theme="dark"] .table-light { --bs-table-bg: var(--surface-2); --bs-table-color: var(--text); --bs-table-border-color: var(--border); color: var(--text); }

/* подсказка: в текстовое поле вставили картинку */
.paste-hint { position: fixed; left: 50%; bottom: calc(24px + var(--tabs-bottom)); transform: translateX(-50%); z-index: 1095; max-width: min(560px, calc(100vw - 32px));
  background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: 0 12px 32px -12px rgba(0, 0, 0, .4);
  padding: 10px 14px; font-size: 13px; animation: nt-in .2s ease; transition: opacity .35s; }
.paste-hint i { color: var(--accent); margin-right: 6px; }
.paste-hint.out { opacity: 0; }
html[data-tabs="bottom"] .paste-hint { bottom: calc(var(--tabs-h) + 16px); }
/* страница AI-ассистента: чат занимает всё место от заголовка до низа окна — при любой высоте шапки
   и положении панели открытых окон (вверху, внизу, скрыта); поле ввода всегда видно без прокрутки страницы */
@media (min-width: 768px) {
  .content:has(> .ai-wrap) { display: flex; flex-direction: column; height: calc(100vh - var(--topbar-h) - var(--tabs-bottom)); padding-bottom: 14px; }
  .content:has(> .ai-wrap) > * { flex-shrink: 0; }
  .content:has(> .ai-wrap) > .ai-wrap { flex: 1 1 auto; min-height: 0; grid-template-rows: minmax(0, 1fr); align-items: stretch; }
  .content:has(> .ai-wrap) .ai-main { height: auto; min-height: 0; }
  .content:has(> .ai-wrap) .ai-side { max-height: none; min-height: 0; }
}

/* ---- «Что нового» после обновления (core/whatsnew.py): значок в шапке, список, метки «новое» в меню ---- */
.news-dot { position: absolute; top: 5px; right: 5px; width: 9px; height: 9px; border-radius: 50%; background: #E5484D; box-shadow: 0 0 0 2px var(--surface); }
.news-dot[hidden] { display: none; }
.news-panel { width: 400px; max-width: calc(100vw - 20px); padding: 0; overflow: hidden; }
.news-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.news-head span { font-size: 12px; color: var(--muted); }
.news-list { max-height: min(60vh, 460px); overflow-y: auto; }
.news-item { display: flex; flex-direction: column; gap: 2px; padding: 9px 14px; border-bottom: 1px solid var(--border-soft); color: var(--text); text-decoration: none; font-size: 13px; }
a.news-item:hover { background: var(--hover); color: var(--text); }
.news-item b { font-weight: 600; }
.news-item span:not(.nav-new) { color: var(--text-2); font-size: 12.5px; line-height: 1.35; }
.news-all { display: flex; align-items: center; gap: 6px; padding: 9px 14px; font-size: 13px; text-decoration: none; }
.news-all:hover { background: var(--hover); }
.nav-new { display: inline-block; margin-left: auto; padding: 0 6px; border-radius: 6px; font-size: 10.5px; font-weight: 600; line-height: 17px;
  background: #E5484D; color: #fff; text-transform: lowercase; letter-spacing: .01em; flex: 0 0 auto; }
.news-item .nav-new, .dropdown-item .nav-new, .tn-link .nav-new { margin-left: 6px; }
.nav-new-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: #E5484D; margin-left: 6px; vertical-align: 2px; }
.sb-group .nav-new-dot { margin-left: 6px; margin-right: auto; }
.news-rel { margin-bottom: 18px; }
.news-rel h6 { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.news-rel h6 span { font-size: 12.5px; color: var(--muted); font-weight: 400; }
.sb-link .nav-new + .sb-star { margin-left: 4px; }
body.sb-collapsed .sb-link.has-new::after { content: ""; position: absolute; top: 6px; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: #E5484D; }
.news-ver { padding: 6px 14px 4px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); background: var(--surface-2); }
/* Пометки договора: переоформлен / переоформляется / расторгается / возврат (crm/_marks.html) */
.cmarks { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.cmark { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px; border-radius: 999px; border: 1px solid; font-size: 11px;
  font-weight: 600; line-height: 1.5; white-space: nowrap; text-decoration: none; }
.cmark:hover { filter: brightness(.95); text-decoration: none; }
.cmark-info { background: #EAF1FF; border-color: #B9CCF5; color: #1D4FC4; }
.cmark-warn { background: #FFF4D6; border-color: #F0D58C; color: #8A5A00; }
.cmark-danger { background: #FDECEC; border-color: #F3B8B8; color: #B42318; }
[data-bs-theme="dark"] .cmark-info { background: #16264A; border-color: #2E4A85; color: #9DB8F5; }
[data-bs-theme="dark"] .cmark-warn { background: #3D2F0B; border-color: #6B5316; color: #F2CF6B; }
[data-bs-theme="dark"] .cmark-danger { background: #3F1716; border-color: #7A2C2A; color: #F5A3A0; }
.ctr-toolbar select.form-select-sm { max-width: 220px; }

/* Подзаголовок внутри группы меню (core.context.SUBS): тонкая подпись с линией — между пунктами одной группы */
.sb-sub { display: flex; align-items: center; gap: 8px; padding: 9px 11px 3px; font-size: 11px; font-weight: 600; color: var(--sb-muted); }
.sb-sub::after { content: ""; flex: 1; height: 1px; background: var(--sb-border); opacity: .8; }
.sb-items > .sb-sub:first-child { padding-top: 2px; }
.sb-nav.finding .sb-sub { display: none; }
@media (min-width: 992px) { body.sb-collapsed .sb-sub { display: none; } }