:root{
  --bg:#f4f6f8; --panel:#fff; --ink:#1c2530; --muted:#66717f;
  --line:#dfe4ea; --brand:#1f6feb; --brand-dark:#1552b8;
  --ok:#1a7f37; --warn:#9a6700; --err:#b42318;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}

.topbar{background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.topbar-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:10px 16px;flex-wrap:wrap}
.brand{font-weight:600;font-size:18px;color:var(--ink)}
.nav{display:flex;gap:14px;flex-wrap:wrap}
.nav a{color:var(--muted);font-size:15px}
.nav a:hover{color:var(--brand)}
.userbox{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted)}
.userbox .role{background:#eef2f7;border-radius:10px;padding:2px 8px;font-size:12px}
.burger{display:none;margin-left:auto;font-size:20px;background:none;border:0;cursor:pointer}

.page{max-width:1200px;margin:0 auto;padding:20px 16px 60px}
.footer{max-width:1200px;margin:0 auto;padding:16px;display:flex;justify-content:space-between;
  color:var(--muted);font-size:13px;border-top:1px solid var(--line)}

h1{font-size:22px;margin:0 0 16px}
h2{font-size:17px;margin:24px 0 10px}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.card .num{font-size:24px;font-weight:600}
.card .lbl{color:var(--muted);font-size:14px}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px}
table{width:100%;border-collapse:collapse;font-size:15px}
th,td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:500;font-size:13px;text-transform:uppercase;letter-spacing:.02em}
tbody tr:hover{background:#fafbfc}
.num-col{text-align:right;white-space:nowrap}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}

.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
input[type=text],input[type=password],select{
  padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:15px;background:#fff}
button,.btn{padding:8px 14px;border-radius:8px;font-size:15px;cursor:pointer;
  border:1px solid rgba(29,78,216,.35);background:rgba(29,78,216,.12);
  color:#1e3fb0;font-weight:600}
button:hover,.btn:hover{background:rgba(29,78,216,.2);border-color:rgba(29,78,216,.5);
  color:#17318f}
.btn-light{background:#fff;color:var(--brand)}
.btn-light:hover{background:#eef4ff}
.chip{display:inline-block;padding:2px 8px;border-radius:10px;background:#eef2f7;
  font-size:12px;color:var(--muted)}

.flash{padding:10px 14px;border-radius:8px;margin-bottom:10px;font-size:15px}
.flash-error{background:#fdecea;color:var(--err)}
.flash-success{background:#e8f5ec;color:var(--ok)}
.flash-warning{background:#fff6e5;color:var(--warn)}

.pager{display:flex;gap:8px;align-items:center;margin-top:14px;color:var(--muted);font-size:14px}
.login-wrap{max-width:360px;margin:8vh auto;padding:0 16px}
.login-wrap .panel{padding:22px}
label{display:block;margin:10px 0 4px;font-size:14px;color:var(--muted)}
input[type=text],input[type=password]{width:100%}
.muted{color:var(--muted);font-size:14px}

@media (max-width:760px){
  .burger{display:block}
  .nav{display:none;width:100%;flex-direction:column;gap:8px;padding-top:8px}
  body.nav-open .nav{display:flex}
  .userbox{width:100%;margin-left:0;justify-content:space-between}
  table{font-size:14px}
  th:nth-child(n+4),td:nth-child(n+4){display:none}
  th,td{padding:7px 6px}
}

/* --- формы продажи --- */
.suggest{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--line);
  border-radius:8px;box-shadow:0 6px 18px rgba(20,30,50,.12);max-height:280px;overflow:auto;
  z-index:20;display:none}
.suggest-item{padding:8px 10px;cursor:pointer;border-bottom:1px solid #f0f2f5;font-size:14px}
.suggest-item:hover{background:#f4f8ff}
.cell-product{min-width:260px}
.stock-hint{font-size:12px;margin-top:2px}
.quick-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line)}
.quick-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.quick-sum{width:110px;text-align:right;white-space:nowrap}
.quick-total{font-size:22px;font-weight:600}
.summary-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:8px 0;border-top:1px solid var(--line);margin-top:8px}
.big-total{font-size:24px;font-weight:600}

/* --- права ролей --- */
.permissions{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:4px 14px}
.perm{display:flex;align-items:center;gap:8px;font-size:14px;padding:3px 0;cursor:pointer}
.perm input{width:auto;margin:0}
.perm .mono{font-size:11px;color:var(--muted);margin-left:auto}

/* --- каталог: категории слева, товары справа --- */
.catalog{display:grid;grid-template-columns:300px 1fr;gap:14px;align-items:start}
.cats{height:calc(100vh - 145px);min-height:420px;overflow:auto;padding:10px 8px;
  position:sticky;top:10px;overscroll-behavior:contain}
.cat-leaf,.cat>summary{display:flex;align-items:center;gap:6px;padding:5px 8px;
  border-radius:7px;color:var(--ink);font-size:14px;cursor:pointer;text-decoration:none}
.cat-leaf:hover,.cat>summary:hover{background:#f2f6fc;text-decoration:none}
.cat-leaf.active,.cat>summary.active{background:#e8f0fe;font-weight:600}
.cat>summary{list-style:none}
.cat>summary::-webkit-details-marker{display:none}
.cat-icon{flex:none;font-size:13px;line-height:1}
.cat-icon .i-open{display:none}
.cat[open]>summary .cat-icon .i-closed{display:none}
.cat[open]>summary .cat-icon .i-open{display:inline}
.cat>summary a{flex:1;color:inherit;text-decoration:none}
.cat-children{margin-left:14px;border-left:1px solid var(--line);padding-left:4px}
.cat-leaf{padding-left:22px}
.cnt{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.products-list{min-width:0}

@media (max-width:860px){
  .catalog{grid-template-columns:1fr}
  .cats{max-height:none}
}

/* --- карточки справочников --- */
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px 18px}
.card-field{display:flex;flex-direction:column;gap:4px}
.card-field label{font-size:13px;color:var(--muted);margin:0}
.card-field input[type=text],.card-field select,.card-field textarea{
  width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:15px}
.card-field input[type=checkbox]{width:auto;align-self:flex-start;margin-top:4px}
/* Ссылки в таблицах (списки, журнал, отчёты) — чёрным, как обычный текст:
   владелец: «кликабельные строки также должны быть чёрными буквами». Строка
   выглядит ровно, но остаётся кликабельной; при наведении ссылка подсвечивается
   и подчёркивается, чтобы было видно, что на неё можно нажать. Кнопки (.btn) в
   таблицах не трогаем — это кнопки, у них своя подсветка. */
table a:not(.btn){color:var(--ink);text-decoration:none}
table a:not(.btn):hover,table a:not(.btn):focus{color:var(--brand);text-decoration:underline}
/* тот же чёрный вид для ссылок вне таблиц (например, в карточках) */
.link-black,.link-black:visited{color:var(--ink);text-decoration:none}
.link-black:hover,.link-black:focus{color:var(--brand);text-decoration:underline}

/* --- перенос товаров перетаскиванием --- */
.drag-col{width:28px;text-align:center;color:var(--muted);cursor:grab;user-select:none}
tr[draggable='true']:hover .drag-col{color:var(--brand)}
tr.dragging{opacity:.45}
.cat.drop-hover,.cat-leaf.drop-hover{background:#e6f0ff;outline:2px dashed var(--brand);
  border-radius:8px}
.hint{font-size:13px;margin:12px 0 0}
.chips{display:inline-flex;gap:8px;margin-left:10px;vertical-align:middle}
.chips .btn{padding:5px 12px;font-size:14px}
details.move{position:relative;display:inline-block}
details.move>summary{list-style:none;cursor:pointer;font-size:17px;color:var(--brand)}
details.move>summary::-webkit-details-marker{display:none}
.move-form{position:absolute;right:0;top:24px;z-index:20;background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:10px;box-shadow:0 8px 24px rgba(15,23,42,.16);width:250px;
  display:flex;flex-direction:column;gap:8px}
.move-form select{width:100%;padding:6px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:#0f172a;
  color:#fff;padding:10px 18px;border-radius:10px;font-size:14px;opacity:0;pointer-events:none;
  transition:opacity .18s,transform .18s;z-index:50;max-width:90vw}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast-error{background:#b42318}
.btn-danger:hover{background:#8f1c14}
.panel-warn{border-color:#f0c2bd;background:#fff8f7}
.lead{font-size:17px}
ul.plain{margin:8px 0 0;padding-left:20px}
ul.plain li{margin-bottom:4px}
label.check{display:flex;gap:8px;align-items:flex-start;margin:10px 0;font-size:15px}
.row-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.inline-form{display:flex;gap:6px;align-items:center}
.inline-form input{padding:5px 8px;border:1px solid var(--line);border-radius:8px;font-size:14px}

/* --- панель действий над списком --- */
.list-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:10px 14px}
.list-actions .btn,.list-actions button{padding:7px 12px;font-size:14px}
.pick-col{width:34px;text-align:center}
.pick-col input{width:16px;height:16px;cursor:pointer}
tr.row-selected{background:#eef4ff}
tr.row-selected td{background:#eef4ff}
.choice-list{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.choice-list label.check{margin:0}

/* --- пометка «удалён» --- */
.chip-danger{background:#fde8e6;color:#b42318;border-color:#f3c2bd}

/* --- расхождения в инвентаризации --- */
.diff-plus{color:#1a7f37;font-weight:600}
.diff-minus{color:#b42318;font-weight:600}

/* --- настройки заполнения отчёта --- */
.fill-settings{display:flex;gap:24px;flex-wrap:wrap;margin-top:10px;
  border-top:1px solid var(--line);padding-top:12px}
.fill-scope{flex:1;min-width:280px}
.fill-flags{min-width:240px}
.fill-groups{margin:6px 0 10px 26px}
.fill-groups select{width:100%;max-width:420px;padding:6px}
.fill-groups label{font-size:13px;color:var(--muted)}

/* --- выпадающее меню «Создать на основании» --- */
details.based-on{position:relative;display:inline-block}
details.based-on>summary{list-style:none;cursor:pointer}
details.based-on>summary::-webkit-details-marker{display:none}
details.based-on .move-form{display:flex;flex-direction:column;gap:6px;width:220px}

/* --- выбор категорий галочками --- */
.group-actions{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.group-tree{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:8px;
  padding:8px 10px;background:#fff;max-width:460px}
.group-item{margin:0;padding:2px 0;font-size:14px}
.group-item input{margin-right:6px}

/* --- печатные формы --- */
.print-page{background:#fff;padding:24px;max-width:1000px;margin:0 auto;font-size:14px}
.print-actions{display:flex;gap:10px;align-items:center;margin-bottom:18px;flex-wrap:wrap}
.print-head{display:flex;justify-content:space-between;gap:20px;margin-bottom:14px;
  border-bottom:2px solid #333;padding-bottom:10px}
.print-title h1{margin:0;font-size:20px}
.print-meta{width:100%;margin-bottom:12px}
.print-meta th{text-align:left;width:120px;color:#555;font-weight:normal;padding:2px 6px}
.print-meta td{padding:2px 6px}
.print-lines{width:100%;border-collapse:collapse}
.print-lines th,.print-lines td{border:1px solid #999;padding:4px 6px}
.print-lines th{background:#f2f2f2;text-align:left}
.print-total td{background:#fafafa}
.print-sign{display:flex;justify-content:space-between;margin-top:36px;align-items:flex-end}
@media print{.print-actions{display:none}.print-page{padding:0;max-width:none}}


/* ======================= оформление: деловой стиль ======================= */
:root{
  --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --bg:#f6f8fb;
  --brand:#1d4ed8; --brand-dark:#1e3fb0; --accent:#0ea5a4;
  --ok:#0f766e; --warn:#b45309; --danger:#b42318;
  --radius:12px; --shadow:0 1px 2px rgba(15,23,42,.06),0 8px 24px -12px rgba(15,23,42,.18);
}
body{background:var(--bg);color:var(--ink);
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
.topbar{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 1px 2px rgba(15,23,42,.04)}
.topbar-inner{max-width:1320px;margin:0 auto;padding:0 20px}
.brand{font-weight:700;letter-spacing:-.01em}
.nav a{padding:6px 10px;border-radius:8px;color:#334155;font-size:14.5px}
.nav a:hover{background:#eef2ff;color:var(--brand)}
.page{max-width:1320px;margin:0 auto;padding:22px 20px 60px}
h1{font-size:26px;letter-spacing:-.02em;margin:0 0 18px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
h2{font-size:17px;margin:0 0 12px;letter-spacing:-.01em}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:16px 18px;margin-bottom:16px}
button,.btn{border-radius:9px;font-weight:500;transition:background .15s,box-shadow .15s}
button:hover,.btn:hover{box-shadow:0 2px 10px -4px rgba(29,78,216,.5)}
.btn-light{background:#fff;border:1px solid var(--line);color:#334155}
.btn-light:hover{background:#f8fafc;border-color:#c7d2fe;color:var(--brand)}
table{width:100%;border-collapse:separate;border-spacing:0}
thead th{background:#f8fafc;color:#475569;font-weight:600;font-size:13.5px;
  text-align:left;padding:10px 10px;border-bottom:1px solid var(--line)}
tbody td{padding:9px 10px;border-bottom:1px solid #f1f5f9}
tbody tr:hover td{background:#f8fafc}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:14px 16px;min-width:150px}
.card .num{font-size:24px;font-weight:700;letter-spacing:-.02em}
.card .lbl{color:var(--muted);font-size:13px}
.cards{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.chip{background:#eef2ff;color:#3730a3;border:1px solid #e0e7ff;border-radius:999px;
  padding:2px 9px;font-size:12.5px}
.flash{border-radius:10px;padding:11px 14px;margin-bottom:12px;border:1px solid transparent}
.flash-success{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
.flash-error{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.flash-warning{background:#fffbeb;border-color:#fde68a;color:#92400e}
input[type=text],input[type=date],input[type=password],select,textarea{
  border:1px solid var(--line);border-radius:9px;padding:8px 10px;font-size:14.5px;background:#fff}
input:focus,select:focus,textarea:focus{outline:none;border-color:#93c5fd;
  box-shadow:0 0 0 3px rgba(59,130,246,.15)}
.footer{border-top:1px solid var(--line);color:var(--muted);font-size:13px}

/* --- бизнес-схема на главной --- */
.h1-note{font-size:13px;font-weight:400}
.scheme{margin-bottom:16px}
.scheme-row{display:grid;grid-template-columns:190px 1fr;gap:14px;align-items:start;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:14px 16px}
.scheme-label{font-weight:600;color:#334155;font-size:14px;padding-top:6px}
.scheme-label span{display:block;font-weight:400;color:var(--muted);font-size:12.5px;margin-top:2px}
.scheme-blocks{display:flex;gap:10px;flex-wrap:wrap}
.block{display:block;min-width:190px;max-width:250px;flex:1 1 190px;text-decoration:none;
  border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:#fcfdff;
  transition:border-color .15s,box-shadow .15s,transform .15s}
.block b{display:block;color:var(--ink);font-size:14.5px}
.block span{display:block;color:var(--muted);font-size:12.5px;margin-top:3px}
.block:hover{border-color:#93c5fd;box-shadow:0 6px 18px -10px rgba(29,78,216,.5);transform:translateY(-1px)}
.block-accent{background:#eff6ff;border-color:#bfdbfe}
.block-muted{background:#f8fafc}
.scheme-arrow{text-align:center;color:#94a3b8;font-size:13px;padding:6px 0}
@media (max-width:820px){.scheme-row{grid-template-columns:1fr}}


/* --- схема: связи, этапы, легенда --- */
.quick-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.quick-actions b{margin-right:4px}
.scheme-legend{display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:13.5px;color:#475569}
.scheme-legend .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
.dot-1{background:#6366f1}.dot-2{background:#1d4ed8}.dot-3{background:#0ea5a4}
.dot-4{background:#c2410c}.dot-5{background:#94a3b8}

.scheme-row{position:relative;border-left:4px solid var(--line)}
.stage-1{border-left-color:#6366f1}
.stage-2{border-left-color:#1d4ed8}
.stage-3{border-left-color:#0ea5a4}
.stage-4{border-left-color:#c2410c}
.stage-5{border-left-color:#94a3b8}
.scheme-row .scheme-label{position:relative}
.scheme-row .scheme-label:before{content:"";position:absolute;left:-24px;top:8px;width:10px;height:10px;
  border-radius:50%;background:currentColor;opacity:.25}
.stage-1 .scheme-label:before{background:#6366f1;opacity:1}
.stage-2 .scheme-label:before{background:#1d4ed8;opacity:1}
.stage-3 .scheme-label:before{background:#0ea5a4;opacity:1}
.stage-4 .scheme-label:before{background:#c2410c;opacity:1}
.stage-5 .scheme-label:before{background:#94a3b8;opacity:1}

.scheme-arrow{position:relative;color:#94a3b8;font-size:13px;padding:8px 0}
.scheme-arrow:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;
  background:linear-gradient(#e2e8f0,#cbd5e1);transform:translateX(-50%);z-index:0}
.scheme-arrow{text-align:center}
.scheme-arrow>*{position:relative;z-index:1;background:var(--bg);padding:0 10px}

.scheme:hover .block{opacity:.55}
.scheme .block:hover{opacity:1;border-color:#1d4ed8;box-shadow:0 10px 24px -12px rgba(29,78,216,.6);
  transform:translateY(-2px)}
.block{border-left:3px solid #e2e8f0}
.stage-1 .block{border-left-color:#c7d2fe}
.stage-2 .block{border-left-color:#bfdbfe}
.stage-3 .block{border-left-color:#99f6e4}
.stage-4 .block{border-left-color:#fed7aa}
.stage-5 .block{border-left-color:#e2e8f0}

/* --- название программы --- */
.brand{display:flex;flex-direction:column;line-height:1.1}
.brand-sub{font-size:11px;font-weight:400;color:var(--muted);letter-spacing:.02em}

/* ============ единый стиль: элементы главной на всех страницах ============ */

/* заголовок страницы — как на главной: акцентная полоса, подпись, отступ */
.page h1{position:relative;padding:0 0 12px 16px;border-bottom:1px solid var(--line);
  margin-bottom:18px}
.page h1:before{content:"";position:absolute;left:0;top:4px;bottom:14px;width:4px;
  border-radius:4px;background:linear-gradient(#1d4ed8,#0ea5a4)}
.page h1 .chip{font-weight:500}
.page h1 .h1-note{font-size:13px;font-weight:400;color:var(--muted)}

/* панели: заголовок раздела с точкой, как в легенде схемы */
.panel h2{display:flex;align-items:center;gap:8px}
.panel h2:before{content:"";width:9px;height:9px;border-radius:50%;
  background:#1d4ed8;flex:0 0 auto;opacity:.85}
.panel-warn h2:before{background:#b45309}
.panel h2 .chip{margin-left:auto}

/* верхние панели с поиском и кнопками — как блок «быстрые действия» */
.toolbar.panel,.list-actions,.quick-actions{border-left:4px solid #bfdbfe}
.list-actions{background:#fbfdff}
.quick-actions{border-left-color:#1d4ed8}

/* таблицы: единый ритм, аккуратные служебные строки.
   ВАЖНО (правило владельца): у таблицы всегда подчёркнута нижняя строка —
   таблица должна быть «дорисована» до конца, без пустоты снизу. Раньше здесь
   стояло правило, снимавшее у последней строки нижнюю границу — и у таблицы
   пропадала нижняя линия (в печатных формах тоже: оно специфичнее, чем
   `.blank-grid td`). Больше нижнюю границу не снимаем. */
tbody td.muted,tr td.muted{background:#fbfcfe}
.pick-col input[type=checkbox]{accent-color:#1d4ed8}

/* карточки-показатели и кликабельные блоки — одинаковое поведение */
.card:hover{transform:translateY(-1px);transition:transform .15s}
.num-col{text-align:right;font-variant-numeric:tabular-nums}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px}

/* формы: подписи как на главной */
label{font-size:13px;color:#475569}
.fields .card-field label{margin-bottom:2px}

/* пустые состояния */
.panel .muted:only-child{padding:10px 0}

/* меню пользователя в шапке */
.userbox .role{background:#eef2ff;color:#3730a3;border-radius:999px;padding:2px 8px;font-size:12px}
.userbox .logout{color:var(--brand)}

/* --- название программы в шапке: заметно и всегда на виду --- */
.brand{gap:0;padding:2px 14px 2px 0;border-right:1px solid var(--line);margin-right:6px}
.brand-name{font-size:17px;font-weight:800;letter-spacing:.02em;color:var(--ink);
  text-transform:uppercase}
.brand:hover .brand-name{color:var(--brand)}
.brand-sub{font-size:11.5px;font-weight:500;color:var(--muted);letter-spacing:.04em;
  text-transform:uppercase}
@media (max-width:700px){.brand-name{font-size:15px}.brand-sub{display:none}}

/* --- графики в отчётах: полоски на CSS --- */
/* Подписи под столбцами не наезжают друг на друга: у каждой колонки своя
   ширина, длинное название переносится по строкам, полное — в подсказке. */
.chart{display:flex;gap:8px;align-items:flex-start;overflow-x:auto;
  padding:10px 4px 0}
.chart-col{display:flex;flex-direction:column;align-items:center;
  min-width:76px;max-width:150px;flex:1 0 76px}
.chart-bar-area{display:flex;flex-direction:column;justify-content:flex-end;
  align-items:center;height:180px;width:100%}
.chart-bar{width:100%;max-width:46px;border-radius:6px 6px 0 0;
  background:linear-gradient(180deg,#3b82f6,#1d4ed8);transition:filter .15s}
.chart-col:hover .chart-bar{filter:brightness(1.1)}
.chart-value{font-size:11.5px;color:#475569;margin-bottom:4px;white-space:nowrap}
.chart-label{font-size:11px;color:var(--muted);margin-top:6px;text-align:center;
  line-height:1.15;max-width:100%;white-space:normal;overflow-wrap:break-word;
  hyphens:auto}

/* --- большие таблицы прокручиваются внутри себя, а не всей страницей --- */
.table-scroll{max-height:70vh;overflow:auto;border:1px solid var(--line);
  border-radius:12px;background:#fff;overscroll-behavior:contain}
.table-scroll table{margin:0;border:0;border-radius:0}
.table-scroll thead th{position:sticky;top:0;z-index:3;background:#f8fafc;
  box-shadow:inset 0 -1px 0 var(--line)}
.table-scroll td,.table-scroll th{background-clip:padding-box}
.table-scroll tr:first-child th:first-child{border-top-left-radius:11px}
.table-scroll tr:first-child th:last-child{border-top-right-radius:11px}
.table-scroll-hint{font-size:12.5px;color:var(--muted);margin:6px 0 0}
.group-tree{max-height:52vh;overflow:auto;overscroll-behavior:contain}

/* --- журнал уже созданных документов внизу формы/карточки --- */
.journal{margin-top:18px}
.journal h2{font-size:16px}
.journal table{font-size:13.5px}
.journal td,.journal th{padding:7px 8px}
.journal .chip{font-weight:500}

/* --- автозаполнение реквизитов: кнопки внутри полей и подсказка --- */
.btn-mini{padding:4px 10px;font-size:12.5px;margin-top:6px}
.fill-status{margin:8px 0 0;font-size:13.5px;min-height:18px}
.fill-ok{color:#15803d}
.fill-bad{color:#b42318}

/* --- отчёт: подпись «по какой фирме сделан отчёт» --- */
.report-firm{margin:-4px 0 12px;font-size:14.5px;line-height:1.5}
.report-firm .muted{font-size:13.5px}

/* --- вкладки отчёта (показатель / группировка / группы товаров) --- */
.tabs{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:0 0 12px}
.tabs-inline{margin-top:-4px}
.tabs-label{font-size:13px;color:var(--muted);margin-right:2px}
.tab{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:10px;
  border:1px solid var(--line);background:#fff;color:var(--text);font-size:14px;
  text-decoration:none;white-space:nowrap}
.tab:hover{border-color:#c7d2fe;background:#f8faff}
.tab-active{background:rgba(29,78,216,.14);border-color:rgba(29,78,216,.4);
  color:#1e3fb0;font-weight:600}
.tab-active:hover{background:rgba(29,78,216,.22);border-color:rgba(29,78,216,.55);
  color:#17318f}
.tab .chip{background:#eef2ff;color:#3730a3}
.tab-active .chip{background:rgba(29,78,216,.16);color:#1e3fb0}
th.col-active{background:#eef2ff;color:#1e3a8a;box-shadow:inset 0 -2px 0 #1d4ed8}
td.col-active{background:#f5f7ff}

/* --- иконки разделов и кнопок: единый вид --- */
.nav a{display:inline-flex;align-items:center;gap:4px}
.block b{display:flex;align-items:center;gap:7px}
.block b:first-letter{font-size:15px}
.btn,button{display:inline-flex;align-items:center;gap:6px}
.list-actions .btn,.list-actions button,gap{white-space:nowrap}

/* --- название всегда слева вверху, на всех страницах --- */
.topbar-inner{display:flex;align-items:center;gap:8px}
.print-brand{margin-right:auto;text-decoration:none}
.nav a,.userbox{white-space:nowrap}
@media (max-width:700px){.topbar-inner{flex-wrap:wrap}}

/* --- логотип на прозрачном фоне --- */
.brand{display:flex;flex-direction:row;align-items:center;gap:10px}
.brand-logo{height:30px;width:auto;display:block}
/* в шапке программы — только логотип: название («BAZIS PRO — система учёта»)
   уже написано внутри самого логотипа, отдельным текстом его не дублируем */
.brand-logo-only{padding:2px 14px 2px 0}
.brand-logo-only .brand-logo{height:42px}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.login-brand{display:flex;justify-content:center;margin-bottom:6px}
.login-brand img{height:64px;width:auto}
.print-logo{height:52px;width:auto;margin-bottom:8px}
.print-head{align-items:flex-start}
@media (max-width:700px){.brand-logo{height:24px}
  .brand-logo-only .brand-logo{height:34px}
  .brand-sub{display:none}}
@media (max-width:420px){.brand-logo-only .brand-logo{height:28px}}

/* --- вход: без крупного логотипа, он есть в шапке --- */
.login-panel{max-width:420px}
.login-title{text-align:center;font-size:16px;color:#334155;margin:6px 0 10px}
.login-title:before{display:none}

/* --- реквизиты организации в печатной форме --- */
/* Компактно: блок по высоте — примерно как логотип слева (владелец: «сделать
   компактней, чтобы по высоте было как высота логотипа»). Четыре строки:
   название, налоги, адрес с контактами, банк. */
.print-org{flex:1;font-size:10px;line-height:1.3}
.print-org b{font-size:11px}
.print-head{gap:14px}

/* ============ компактная шапка: больше рабочего экрана ============ */
/* Шапка — одна строка: логотип, меню (прокручивается по горизонтали, если не
   влезло) и пользователь. Ничего не переносится на вторую строку, поэтому
   рабочая область начинается сразу под ней. */
.topbar-inner{max-width:1600px;gap:8px;padding:5px 14px;flex-wrap:nowrap;
  min-height:46px}
.brand{padding:0 12px 0 0;margin-right:2px;flex:0 0 auto;gap:8px}
.brand-logo{height:24px}
.brand-name{font-size:15px;letter-spacing:.01em}
.brand-sub{font-size:10px;letter-spacing:.06em}
.nav{flex:1 1 auto;flex-wrap:nowrap;gap:2px;overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-ms-overflow-style:none;padding:0}
.nav::-webkit-scrollbar{height:0;display:none}
.nav a{padding:5px 8px;font-size:13.5px;border-radius:7px;white-space:nowrap;flex:0 0 auto}
.userbox{flex:0 0 auto;gap:8px;font-size:13px;white-space:nowrap}
.userbox .role{padding:1px 7px;font-size:11.5px}

/* страница: шире рабочая область, меньше пустых отступов */
.page{max-width:1600px;padding:12px 16px 24px}
.page h1{font-size:21px;padding:0 0 8px 14px;margin-bottom:12px}
.panel{padding:12px 14px;margin-bottom:10px}
.panel h2{font-size:16px;margin-bottom:8px}
tbody td{padding:7px 9px}
thead th{padding:8px 9px}
.cards{gap:10px}
.footer{padding:7px 16px;font-size:12px;max-width:1600px}

/* категории слева: шапка стала ниже — окну можно быть выше */
.cats{height:calc(100vh - 118px)}
.table-scroll{max-height:74vh}

@media (max-width:900px){
  .burger{display:block}
  .nav{display:none;width:100%;flex-direction:column;gap:6px;padding-top:6px;
    overflow:visible}
  body.nav-open .nav{display:flex}
  .topbar-inner{flex-wrap:wrap}
  .userbox{width:100%;margin-left:0;justify-content:space-between}
  .cats{height:auto}
}

/* ============ страница товаров: компактные панели над таблицей ============ */
/* Поиск, кнопки действий, размер страницы и печать — в одной строке, чтобы
   таблица товаров занимала больше места по высоте. */
.panel-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;
  padding:7px 12px;border-left:4px solid #bfdbfe;background:#fbfdff}
.panel-tools form{margin:0}
.panel-tools .toolbar{flex:1 1 460px;margin:0;gap:6px}
.panel-tools .list-actions{flex:0 1 auto;padding:0;background:none;border:0;gap:6px}
.panel-tools input[type=text],.panel-tools select{padding:6px 9px;font-size:14px}
.panel-tools button,.panel-tools .btn{padding:6px 11px;font-size:13.5px}
.panel-tools .list-actions button,.panel-tools .list-actions .btn{padding:6px 10px;font-size:13.5px}
.panel-tools label{margin:0;display:inline;font-size:12.5px}
.panel-tools .per-inline,.panel-tools .per-inline div{display:inline-flex;align-items:center;gap:5px}
.panel-tools .chip{font-size:12.5px}
.h1-tools{display:flex;align-items:center;gap:8px;margin-left:auto}
.h1-tools .per-inline,.h1-tools .per-inline div{display:inline-flex;align-items:center;gap:5px}
.h1-tools label{margin:0;display:inline;font-size:12.5px;color:var(--muted)}
.h1-tools input[type=text],.h1-tools select{padding:5px 8px;font-size:13px}
.h1-tools .btn,.h1-tools button{padding:5px 10px;font-size:13px}
.h1-tools .move>summary{padding:5px 10px;font-size:13px}
.h1-tools .move-form{top:28px}
@media (max-width:900px){
  .panel-tools .toolbar,.panel-tools .list-actions{flex:1 1 100%}
  .h1-tools{margin-left:0}
}

/* колонка «Учёт» в списках и формах документов */
.acct-col{width:58px;text-align:center}
.acct-col input{width:16px;height:16px;cursor:pointer;accent-color:#1d4ed8}

/* ============ читаемость списков и мягкие опасные кнопки ============ */
/* Кнопка удаления — не «пожар», а спокойное предупреждение */
.btn-danger{background:rgba(220,38,38,.16);color:#9f1d15;border-color:rgba(220,38,38,.45);
  font-weight:600}
.btn-danger:hover{background:rgba(220,38,38,.24);border-color:rgba(220,38,38,.6);
  color:#7f1710}
.list-actions .btn-danger{background:rgba(220,38,38,.14)}

/* Полосатость длинных таблиц: чётные строки чуть темнее — читать легче.
   Порядок правил важен: выделенные и наведённые строки перекрывают полоску. */
tbody tr:nth-child(even) > td{background:#f2f5fa}
tbody tr.row-selected > td{background:#eef4ff}
tbody tr:hover > td{background:#eef2f7}
tbody tr.row-selected:hover > td{background:#e4edff}
.table-scroll tbody tr:nth-child(even) > td{background:#f2f5fa}
.journal tbody tr:nth-child(even) > td{background:#f2f5fa}

/* активная категория при прокрутке не прилипает к краю окна */
.cat-leaf.active,.cat>summary.active{scroll-margin:10px}

/* ============ кнопки: спокойнее и читаемее ============ */
/* Главные кнопки («Найти», «Добавить») — мягкий синий фон вместо плотного:
   текст читается, а действие всё равно заметно. */

/* полосы с кнопками — чуть темнее фона, чтобы кнопки были заметны */
.toolbar,.toolbar.panel,.list-actions,.panel-tools,.quick-actions,
.period-form{background:#eef2f7}
.panel-tools{background:#eaeff6}
.list-actions{background:#eef2f7}
.toolbar.panel{border-left-color:#a9c2f0}
thead th{background:#eef2f7}

/* клик по строке: курсор-рука, без смены цвета при наведении (продажи) */
tr[data-href]{cursor:pointer}
table.no-hover tbody tr:hover > td{background:transparent}
table.no-hover tbody tr:nth-child(even):hover > td{background:#f2f5fa}
table.no-hover tbody tr:hover > td.muted{background:transparent}

/* перенос контрагента на вкладку группы (опт / розница / поставщики) */
.tab.drop-hover{background:#e6f0ff;outline:2px dashed var(--brand);
  border-color:var(--brand)}
tr.dragging{opacity:.5}

/* форма продажи: панели кнопок над таблицей товаров */
.sale-top{margin-bottom:10px}
.row-tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.row-tools button,.row-tools .btn-light{padding:5px 10px;font-size:13.5px}
.move-form.wide{width:320px}
.move-form.wide b{display:block;margin-top:6px;font-size:12.5px;color:var(--muted)}

/* выпадающие списки кнопок (Печать, Отправить, Скидка, Создать на основании):
   не уходят за край экрана и не растягивают страницу */
.move-form{max-width:calc(100vw - 24px);max-height:60vh;overflow:auto}
.panel-tools .move-form,.sale-top .move-form{top:100%}
/* список открывается прямо под своей кнопкой; если он не помещается у края
   окна, его сдвигает скрипт (app/static/list.js) */
.panel-tools .move,.sale-top .move,.h1-tools .move{position:relative}
.panel-tools .move-form,.sale-top .move-form,.h1-tools .move-form{
  right:0;left:auto;width:min(360px, calc(100vw - 32px))}

/* ============ кнопки в стиле главной страницы ============ */
/* Как блоки и карточки на сводке: мягкая заливка, скругление 10 px, лёгкая тень
   и подъём при наведении, аккуратный переход. */
button,.btn,.btn-light,.tab{
  border-radius:10px;font-weight:600;letter-spacing:.01em;
  transition:background .15s,border-color .15s,box-shadow .15s,transform .15s;
  box-shadow:0 1px 2px rgba(15,23,42,.04)}
button:hover,.btn:hover,.btn-light:hover,.tab:hover{
  box-shadow:0 6px 18px -10px rgba(29,78,216,.5);transform:translateY(-1px)}
button:active,.btn:active,.btn-light:active,.tab:active{transform:translateY(0)}
.btn-light{background:#fcfdff}
.btn-light:hover{background:#f5f8ff}
.btn-danger{box-shadow:0 1px 2px rgba(180,35,24,.06)}
.btn-danger:hover{box-shadow:0 6px 18px -10px rgba(220,38,38,.45)}
.tab-active{box-shadow:inset 0 0 0 1px rgba(29,78,216,.18),0 1px 2px rgba(15,23,42,.04)}
/* мелкие кнопки в панелях — та же геометрия, но компактнее */
.panel-tools .btn,.panel-tools button,.row-tools .btn-light,.row-tools button{
  border-radius:9px}

/* совсем немного объёма: светлый верх, чуть тёмный низ и мягкая внутренняя
   подсветка — как у аккуратных кнопок на главной */
button,.btn{
  background-image:linear-gradient(180deg,rgba(255,255,255,.55),rgba(29,78,216,.06));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 1px 2px rgba(15,23,42,.07)}
button:hover,.btn:hover{
  background-image:linear-gradient(180deg,rgba(255,255,255,.7),rgba(29,78,216,.12));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 6px 18px -10px rgba(29,78,216,.5)}
.btn-light{
  background-image:linear-gradient(180deg,#ffffff,#f4f7fc);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 2px rgba(15,23,42,.07)}
.btn-light:hover{
  background-image:linear-gradient(180deg,#ffffff,#eef4ff);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 6px 18px -10px rgba(29,78,216,.45)}
.btn-danger{
  background-image:linear-gradient(180deg,rgba(255,255,255,.45),rgba(220,38,38,.12));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 1px 2px rgba(180,35,24,.1)}
.tab{background-image:linear-gradient(180deg,#ffffff,#f7f9fd)}
.tab-active{background-image:linear-gradient(180deg,rgba(255,255,255,.6),rgba(29,78,216,.14))}

/* меню в шапке — только иконки; название показывается при наведении */
.nav a{padding:7px 11px;font-size:22px;line-height:1;border-radius:11px;
  display:inline-flex;align-items:center;justify-content:center;min-width:42px;
  background:rgba(29,78,216,.07);border:1px solid rgba(29,78,216,.14);
  transition:background .15s,border-color .15s,box-shadow .15s,transform .15s}
.nav a:hover{background:rgba(29,78,216,.18);border-color:rgba(29,78,216,.4);
  box-shadow:0 6px 18px -10px rgba(29,78,216,.5);transform:translateY(-1px)}
.nav a:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
/* текущий раздел — заметнее остальных */
.nav a.nav-active{background:rgba(29,78,216,.2);border-color:rgba(29,78,216,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}

/* логин в шапке — ссылка на свой профиль */
.userbox .user-name{color:var(--ink);font-weight:600;text-decoration:none;
  padding:4px 9px;border-radius:9px;border:1px solid transparent}
.userbox .user-name:hover{background:rgba(29,78,216,.1);border-color:rgba(29,78,216,.25);
  color:var(--brand);text-decoration:none}

/* столбцы, которые выравниваются по центру (прайс-лист: остаток, единица, цена) */
.col-center{text-align:center}
.col-center input{text-align:center}
th.col-center,td.col-center{text-align:center}

/* подпись и печать в печатных формах */
/* Печать ставится точно в место «М.П.» бланка (владелец: «печать в документах
   расположить там, где М.П.») — отдельной картинкой, без наложения на подпись. */
.stamp-cell{vertical-align:bottom}
.stamp-image-alone{height:94px;width:auto;display:block;margin:0 0 2px 10px;
  mix-blend-mode:multiply}
@media print{.stamp-image-alone{mix-blend-mode:multiply}}
.sign-left{min-width:320px}
.sign-role{font-weight:600;margin-bottom:4px}
.sign-area{position:relative;min-height:70px}
.sign-image{height:66px;width:auto;display:block;margin:0 0 -18px 8px}
.stamp-image{height:120px;width:auto;display:block;margin:-70px 0 0 150px;
  mix-blend-mode:multiply}
.sign-line{letter-spacing:1px}
@media print{.stamp-image{mix-blend-mode:multiply}}

/* печатная форма: реквизиты сторон и итоги — как в образцах бланков */
.print-parties{width:100%;margin:10px 0 14px;font-size:13.5px}
.print-parties th{width:120px;text-align:left;vertical-align:top;color:#333;
  font-weight:600;padding:3px 6px 3px 0}
.print-parties td{padding:3px 0}
.print-totals{margin:10px 0 0;display:flex;justify-content:space-between;
  align-items:flex-start;gap:20px;font-size:13.5px}
.print-totals table{width:auto;min-width:260px}
.print-totals th{text-align:right;font-weight:600;padding:2px 8px 2px 0}
.print-totals td{padding:2px 0}
.sign-pair{display:flex;gap:40px;margin-top:10px;font-size:13px}

/* ТОРГ-12: сетка официального бланка */
.torg12{font-size:11.5px;color:#000}
.torg12 table{width:100%;border-collapse:collapse}
.torg12 th,.torg12 td{border:1px solid #333;padding:2px 3px;vertical-align:top;font-size:11px}
.torg12 .left{text-align:left}
.torg12-note,.torg12-hint{font-size:10.5px;color:#333;margin:2px 0}
.torg12-hint{font-style:italic}
.torg12-party{margin:6px 0 0}
.torg12-codes td{border:none;padding:0}
.torg12-head td{border:none;text-align:center;padding:8px 4px}
.torg12-title{font-weight:700;font-size:14px}
.torg12-numbers th{font-weight:400;font-size:10px}
.torg12-table td.num-col{text-align:right;white-space:nowrap}
.torg12-total td{background:#f2f2f2}
.torg12-tail td{border:none;padding:3px 2px}
.torg12-tail .line{display:inline-block;border-bottom:1px solid #333;min-width:120px;
  height:26px;line-height:26px;vertical-align:bottom}
.torg12-tail .line.short{min-width:60px}
.torg12-signs td{border:none;padding:6px 4px;vertical-align:bottom}
.torg12-signs .sign-cell{position:relative;min-width:150px}
.torg12-signs .sign-image{height:44px;width:auto;display:block;margin:0 0 -13px 12px}
.torg12-signs .stamp-image{height:94px;width:auto;display:block;margin:-56px 0 0 110px;
  mix-blend-mode:multiply}
@media print{.print-actions{display:none}.stamp-image{mix-blend-mode:multiply}}

/* ============ печатные формы по образцам бланков владельца ============ */
/* Общая основа: все формы собраны в `_blank.html`, вёрстка — из образцов
   `data/inbox/ОБРАЗЦЫ БЛАНКОВ`. Значения столбцов: слева, числа — справа,
   «Ед.» и номера — по центру. */
.blank{font-size:11.5px;color:#000;line-height:1.35}
.blank table{border-collapse:collapse;width:100%}
.blank-grid{border-collapse:collapse;width:100%}
.blank-grid th,.blank-grid td{border:1px solid #333;padding:2px 4px;vertical-align:top}
.blank-grid thead th{background:#f2f2f2;font-weight:600;text-align:center}
.blank .left{text-align:left}
.blank .right{text-align:right}
.blank .center{text-align:center}
.blank .num{text-align:right;white-space:nowrap}
.blank .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.blank .muted{color:#555}
.blank-total td{background:#f7f7f7}
.blank-title{text-align:center;font-size:15px;font-weight:700;margin:12px 0 8px}
.blank-title-left{font-size:14px;margin:0}
.blank-line{margin:5px 0}
.blank-note,.blank-note-title{margin:6px 0}
.blank-note td{border:none;vertical-align:top;padding:0}
.blank-note-title{text-align:center;font-weight:600}
.blank-fields{margin:8px 0}
.blank-fields th{width:190px;text-align:left;vertical-align:top;font-weight:600;
  padding:3px 6px 3px 0;border:none}
.blank-fields td{padding:3px 0;border:none}
.blank-parties{margin:8px 0;border-collapse:collapse}
.blank-parties th{width:110px;text-align:left;vertical-align:top;font-weight:600;
  padding:3px 6px 3px 0;border:none}
.blank-parties td{padding:3px 0;border:none}
.c-num{width:36px}
.c-art{width:110px}
.c-unit{width:60px}
.c-qty{width:72px}
.c-money{width:96px}
.c-addr{width:180px}
.c-code{width:70px;text-align:center}
/* поле для заполнения от руки: линия ниже текста, сверху остаётся место,
   куда вписывают данные (владелец: «подчёркивание слишком высоко») */
.blank .field{display:inline-block;border-bottom:1px solid #333;min-width:110px;
  height:26px;line-height:26px;vertical-align:bottom}
.blank .field.short{min-width:60px}
.blank .field.mini{min-width:26px}
.blank-signs{width:100%;margin-top:16px}
.blank-signs td{border:none;padding:6px 4px;vertical-align:bottom}
.blank-signs .sign-role-cell{width:170px;font-weight:600}
.blank-signs .sign-cell{position:relative;min-width:190px}
.blank-signs .sign-image{height:44px;width:auto;display:block;margin:0 0 -13px 12px}
.blank-signs .stamp-image{height:94px;width:auto;display:block;
  margin:-56px 0 0 104px;mix-blend-mode:multiply}
.print-footer{margin-top:14px;font-size:10.5px}

/* ТТН: типовая форма №1-Т */
.ttn{font-size:10.5px}
.ttn-form-note td{border:none;padding:0 0 4px}
.ttn-form-title{font-weight:700;font-size:13px;text-align:center;
  vertical-align:middle}
.ttn-head td,.ttn-head th{padding:3px 4px}
.ttn-label{width:130px;text-align:left}
.ttn-date{text-align:center}
.ttn-section{margin:10px 0 4px;font-weight:700}
.ttn-table{font-size:9.5px}
.ttn-numbers th{font-weight:400;text-align:center}
.ttn-tail td{border:none;padding:3px 2px}
.ttn-transport{font-size:10px}
.ttn-transport th{text-align:left;width:130px}
.ttn-extra{font-size:9.5px}
.ttn-extra th{text-align:center;font-weight:600}
.ttn-signs{font-size:10.5px}

/* Счёт-фактура и УПД */
.faktura-table{font-size:9.5px}
.faktura-table td{vertical-align:top}
.faktura-signs td{font-size:10.5px}
.upd-head td{padding:3px 4px}
.upd-title{font-weight:700;font-size:13px;text-align:center;vertical-align:middle}
.upd-status{text-align:left;padding:4px 6px}
.upd-fields th{width:210px}
.upd-tail td{font-size:10px}
.upd-pair th{text-align:center;font-size:10.5px}
.upd-pair td{font-size:10px}
.upd-signs{font-size:10px}

/* Счёт на оплату */
.schet-bank{font-size:11px}
.schet-bank td{padding:3px 4px}
.schet-bank .c-code{width:90px}

/* ПКО (форма КО-1): ордер и квитанция на одном листе, между ними — линия отреза */
.pko-wrap{width:100%;border-collapse:collapse}
.pko-wrap>tbody>tr>td{border:none;vertical-align:top;padding:0}
.pko-half{width:46%}
.pko-cut{width:8%;text-align:center;vertical-align:middle;padding:0 6px}
.pko-cut span{display:inline-block;writing-mode:vertical-rl;transform:rotate(180deg);
  font-size:10px;color:#555;letter-spacing:1px}
.pko-cut:before,.pko-cut:after{content:"";display:block;border-left:1px dashed #999;
  height:46%}
.pko-form-note{font-size:10px;margin:0 0 4px}
.pko-title{text-align:center;font-weight:700;font-size:13px;margin:8px 0}
.pko-org{margin:4px 0;text-align:center}
.pko-codes{font-size:10px}
.pko-number th{font-weight:600;text-align:center;font-size:10px}
.pko-debet th{font-weight:600;text-align:center;font-size:9.5px}
.pko-lines{width:100%;border-collapse:collapse;margin-top:6px}
.pko-lines td{border:none;padding:3px 2px;vertical-align:bottom}
.pko-label{width:110px}
.pko-value{border-bottom:1px solid #333}
.pko-sum-rub,.pko-sum-kop{display:inline-block;min-width:60px;text-align:center;
  font-weight:600}
.pko-signs{width:100%;border-collapse:collapse;margin-top:10px;font-size:10px}
.pko-signs td{border:none;padding:4px 2px;vertical-align:bottom}
.pko-role{width:120px}
.pko-sign-cell{position:relative;min-width:120px}
.pko .sign-image{height:38px;width:auto;display:block;margin:0 0 -12px 8px}
.pko .stamp-image{height:80px;width:auto;display:block;margin:-48px 0 0 78px;
  mix-blend-mode:multiply}

/* на печати убираем служебные кнопки и переключатель формы */
@media print{
  .no-print,.print-menu{display:none}
  .blank-grid th,.blank-grid td{border-color:#000}
}

/* ============ раздел «Инструкция» (иконка ❓ в правом углу шапки) ============ */
/* иконка инструкции — такая же крупная и заметная, как иконки меню:
   та же высота (22 px), та же подложка и подъём при наведении */
.help-link{font-size:22px;line-height:1;text-decoration:none;min-width:42px;
  padding:7px 11px;border-radius:11px;display:inline-flex;align-items:center;
  justify-content:center;background:rgba(29,78,216,.12);
  border:1px solid rgba(29,78,216,.26);
  transition:background .15s,border-color .15s,box-shadow .15s,transform .15s}
.help-link:hover{background:rgba(29,78,216,.22);border-color:rgba(29,78,216,.48);
  box-shadow:0 6px 18px -10px rgba(29,78,216,.5);transform:translateY(-1px);
  color:var(--brand)}
.help-link:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.help-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;
  position:sticky;top:0;z-index:5}
.help-toolbar input[type="search"]{flex:1 1 320px;min-width:220px}
.help-intro{margin-bottom:12px}
.help-layout{display:flex;gap:14px;align-items:flex-start}
.help-toc{flex:0 0 300px;max-height:calc(100vh - 140px);overflow:auto;
  position:sticky;top:64px}
.help-toc ol{margin:6px 0 0;padding-left:20px}
.help-toc li{margin:3px 0;font-size:13px}
.help-body{flex:1 1 auto;min-width:0}
.help-section{margin-bottom:14px;scroll-margin-top:76px}
.help-section h2{margin-top:0}
.help-section h3{margin:14px 0 6px;font-size:15px}
.help-section h4{margin:12px 0 4px;font-size:14px}
.help-section p{margin:6px 0}
.help-section ul,.help-section ol{margin:6px 0;padding-left:22px}
.help-section li{margin:3px 0}
.help-table{width:100%;border-collapse:collapse;margin:8px 0;font-size:13px}
.help-table th,.help-table td{border:1px solid #d5dbe5;padding:4px 6px;
  text-align:left;vertical-align:top}
.help-table th{background:#f2f5fa}
.help-section pre{background:#f6f8fb;border:1px solid #d5dbe5;border-radius:6px;
  padding:8px 10px;overflow:auto;font-size:12.5px}
.help-section code{background:#f2f5fa;border-radius:4px;padding:0 3px;
  font-size:12.5px}
.help-section blockquote{margin:8px 0;padding:6px 10px;border-left:3px solid #cbd5e1;
  background:#f8fafc;color:#475569}
.help-faq{border:1px solid #d5dbe5;border-radius:8px;margin:6px 0;padding:2px 10px;
  background:#fdfefe}
.help-faq summary{cursor:pointer;font-weight:600;padding:7px 0}
.help-faq[open] summary{color:#1d4ed8}
.help-faq-body{padding:0 0 8px}
@media (max-width:900px){
  .help-layout{flex-direction:column}
  .help-toc{position:static;flex:1 1 auto;max-height:none;width:100%}
}
@media print{
  .help-toc,.help-toolbar,.help-link{display:none}
  .help-section{page-break-inside:auto}
  .help-faq{break-inside:avoid}
  .help-faq-body{display:block !important}
}

/* РКО (форма КО-2) — как ПКО, но один бланк на листе, без квитанции */
.rko{font-size:11.5px}
.rko .pko-lines td{padding:4px 2px}
.rko-received{margin-top:14px}
.rko .pko-label{width:150px}
/* подпись и печать — над своей линией, а не поверх строки «Приложение» */
.rko .pko-signs{margin-top:14px}
.rko .pko-signs td{vertical-align:bottom;padding-top:12px}
.rko .sign-image{height:44px;width:auto;display:block;margin:0 0 -13px 12px}
.rko .stamp-image{height:94px;width:auto;display:block;margin:-26px 0 0 96px;
  mix-blend-mode:multiply}

/* Платёжное поручение (форма 0401060) */
.platezhka{font-size:11px}
.platezhka-note td{border:none;padding:0 0 6px;font-size:10px;vertical-align:top}
.platezhka-okud{font-size:15px;letter-spacing:2px}
.platezhka-stamps td{border:none;padding:0 0 4px;font-size:9.5px}
.platezhka-title td{padding:4px 6px}
.platezhka-name{font-weight:700;font-size:13px}
.platezhka-table th,.platezhka-table td{padding:3px 5px}
.platezhka-label{width:150px;text-align:left;font-weight:600;background:#f7f7f7}
.platezhka-codes th{font-weight:600;text-align:center;font-size:10px}
.platezhka-signs{width:100%;margin-top:14px;border-collapse:collapse}
.platezhka-signs td{border:none;padding:6px 4px;vertical-align:top}
.platezhka-sign-cell{position:relative;min-width:220px}
.platezhka .sign-image{height:44px;width:auto;display:block;margin:0 0 -13px 12px}
.platezhka .stamp-image{height:94px;width:auto;display:block;
  margin:-56px 0 0 104px;mix-blend-mode:multiply}
.platezhka-sign-role{font-weight:600;margin-bottom:4px}
.platezhka-bank-marks{width:45%}
.platezhka-bank-box{height:70px;border:1px solid #333}
@media print{.platezhka-bank-box{border-color:#000}}


/* ============ пользователи: карточки и доступ к организациям ============ */
.users-list{display:flex;flex-direction:column;gap:14px}
.user-card:has(.chip-warn){background:#fffdf7;border-left-color:#fbbf24}
.user-card:has(.chip-warn) .user-name{color:#92400e}
.user-card{padding:14px 16px;border-left:4px solid #bfdbfe}
.user-card-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding-bottom:10px;border-bottom:1px solid var(--line)}
.user-card-title{display:flex;align-items:center;gap:10px}
/* имя пользователя — самое заметное в карточке */
.user-avatar{font-size:22px;line-height:1;background:rgba(29,78,216,.1);
  border-radius:10px;padding:4px 7px}
.user-name{font-size:19px;font-weight:700;color:var(--ink);line-height:1.2}
.user-login{font-size:12.5px}
.chip-warn{background:#fef3c7;color:#92400e}
.user-card-meta{font-size:12.5px;color:var(--muted);margin-left:auto}
.user-role-form,.user-access-form{display:flex;align-items:center;gap:8px}
.user-role-form label{font-size:12.5px;color:var(--muted)}
.user-role-form select{min-width:180px}
.org-rights{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.org-rights-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.org-rights-head .muted{font-size:12.5px;max-width:640px}
.org-rights-tools{margin-left:auto;display:flex;gap:6px}
.org-rights-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));
  gap:8px 14px}
.org-right{display:flex;align-items:center;gap:10px;background:#f8fafd;
  border:1px solid var(--line);border-radius:10px;padding:6px 10px}
.org-right{flex-wrap:wrap}
.org-right-name{flex:1 1 100%;min-width:0;font-size:13px;line-height:1.3;
  white-space:normal;overflow-wrap:break-word}
.org-right-full{font-weight:600}
.org-right-short{font-size:12px;display:block}
.org-right-toggles{display:flex;gap:8px;flex-wrap:wrap}
.org-toggle{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;
  color:#475569;background:#fff;border:1px solid var(--line);border-radius:8px;
  padding:3px 8px;cursor:pointer;white-space:nowrap}
.org-toggle input{width:15px;height:15px;accent-color:#1d4ed8;cursor:pointer}
.org-toggle:hover{background:#eef2ff;border-color:rgba(29,78,216,.4)}
.org-rights-save{display:flex;align-items:center;gap:12px}
.org-rights-save .muted{font-size:12.5px}
.btn-save{font-weight:600}

/* ============ доступ к организациям и переключатель в шапке ============ */
.org-switch{margin-left:auto;flex:0 0 auto}
.org-switch select{max-width:220px;padding:5px 8px;border-radius:9px;
  border:1px solid rgba(29,78,216,.26);background:rgba(29,78,216,.08);
  color:var(--ink);font-size:13px}
.org-switch + .userbox{margin-left:0}



/* ============ сообщения между пользователями и Max ============ */
.nav-badge{position:absolute;margin:-14px 0 0 18px;background:#dc2626;color:#fff;
  border-radius:999px;font-size:10.5px;padding:0 5px;line-height:15px;
  font-weight:600}
.nav a{position:relative}
.message-compose{display:flex;flex-direction:column;gap:10px}
.message-compose-text{display:flex;flex-direction:column;gap:4px}
.message-compose textarea{width:100%;min-height:70px}
.message-compose-buttons{display:flex;gap:10px;flex-wrap:wrap}
.messages-table tr{cursor:pointer}
.message-thread{display:flex;flex-direction:column;gap:10px;max-width:820px}
.message{padding:8px 12px;border-radius:12px;border:1px solid var(--line);
  background:#fff;max-width:80%}
.message-mine{align-self:flex-end;background:rgba(29,78,216,.07)}
.message-theirs{align-self:flex-start;background:#f8fafc}
.message-body{white-space:pre-wrap;font-size:14px}
.message-meta{font-size:11.5px;margin-top:4px;display:flex;align-items:center;
  gap:6px;flex-wrap:wrap}
.inline-form{display:inline}
.user-max-form{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.user-max-form label{font-size:12.5px;color:var(--muted);white-space:nowrap}
.user-max-form input{flex:1 1 320px;min-width:220px;font-size:13px}