/* ============================================================================
   Новый облик портала DVEXP («Новый интерфейс»), 25.09.2026.
   Образец — макет анкеты ПЗ: ~/Documents/ДВЭП/портал/pzxml/дизайн/2026-09-17-макет-анкеты.html

   Всё, что ниже, работает ТОЛЬКО под корневым классом body.zk-new (его ставит
   homepage/static/homepage/zakl-theme-1-00.js по localStorage «zakl.ui»).
   Без этого класса страница выглядит ровно как раньше — ни одного правила
   без префикса .zk-new, кроме объявления переменных (они никого не красят сами
   по себе) и служебного скрытия .zk-only.

   Светлая тема — по умолчанию; тёмная — html[data-theme="dark"] или
   html[data-theme="auto"] + системная тёмная (prefers-color-scheme).
   Шрифт Montserrat подключён локально (homepage/static/fonts/montserrat/) —
   Google Fonts не используется (портал должен работать без интернета).

   Разделы файла:
     1. Токены
     2. Основа страницы, шапка, хлебные крошки
     3. Кнопки
     4. Поля ввода и формы
     5. Карточки, вкладки, таблицы, модалки, плашки, значки
     6. Анкета «Заключение ЕГРЗ (XML)»: панель действий, разделы, поля, блоки
     7. Мини-навигация по разделам, плашки-уведомления
     8. Телефон и печать
   ============================================================================ */

/* ---------------------------------------------------------------- 1. токены */
:root {
  --zk-bg: #f5f6f8;
  --zk-surface: #ffffff;
  --zk-surface-2: #f9fafb;
  --zk-surface-3: #eef1f5;
  --zk-line: #e3e6ea;
  --zk-line-strong: #cfd4da;
  --zk-text: #1f2933;
  --zk-muted: #6b7280;
  --zk-ink: #263d66;            /* фирменный синий разделов — был заливкой, стал чернилами */
  --zk-ink-soft: #e9eef6;
  --zk-brand: #ea5921;          /* оранжевый ДВЭП — только главное действие */
  --zk-brand-hover: #d34c17;
  --zk-err: #c0392b;  --zk-err-bg: #fdecea;  --zk-err-line: #f3b7b0;
  --zk-warn: #b7791f; --zk-warn-bg: #fff6e5; --zk-warn-line: #f1d79a;
  --zk-ok: #2f855a;   --zk-ok-bg: #e6f4ec;   --zk-ok-line: #a9d8bb;
  --zk-info: #2b6cb0; --zk-info-bg: #e8f1fb; --zk-info-line: #b3d0ee;
  --zk-radius: 8px;
  --zk-radius-lg: 10px;
  --zk-shadow: 0 1px 2px rgba(31, 41, 51, .06), 0 4px 16px rgba(31, 41, 51, .06);
  --zk-shadow-up: 0 -2px 12px rgba(31, 41, 51, .08);
  --zk-font: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  --zk-navbar-h: 72px;          /* .navbar {min-height:72px} из styles.css */
}

html[data-theme="dark"] {
  --zk-bg: #14181d; --zk-surface: #1c2229; --zk-surface-2: #222a32; --zk-surface-3: #2a333c;
  --zk-line: #2c353f; --zk-line-strong: #3a4552;
  --zk-text: #e6e9ed; --zk-muted: #9aa4b1; --zk-ink: #9db4dc; --zk-ink-soft: #243347;
  --zk-err: #f08a7e; --zk-err-bg: #3a2220; --zk-err-line: #6b3630;
  --zk-warn: #e2b060; --zk-warn-bg: #3a2f1a; --zk-warn-line: #6b5527;
  --zk-ok: #7fcf9c; --zk-ok-bg: #1d3327; --zk-ok-line: #2f5a3f;
  --zk-info: #7fb0e4; --zk-info-bg: #1b2a3a; --zk-info-line: #2f4a68;
  --zk-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 16px rgba(0, 0, 0, .35);
  --zk-shadow-up: 0 -2px 12px rgba(0, 0, 0, .45);
}
@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    --zk-bg: #14181d; --zk-surface: #1c2229; --zk-surface-2: #222a32; --zk-surface-3: #2a333c;
    --zk-line: #2c353f; --zk-line-strong: #3a4552;
    --zk-text: #e6e9ed; --zk-muted: #9aa4b1; --zk-ink: #9db4dc; --zk-ink-soft: #243347;
    --zk-err: #f08a7e; --zk-err-bg: #3a2220; --zk-err-line: #6b3630;
    --zk-warn: #e2b060; --zk-warn-bg: #3a2f1a; --zk-warn-line: #6b5527;
    --zk-ok: #7fcf9c; --zk-ok-bg: #1d3327; --zk-ok-line: #2f5a3f;
    --zk-info: #7fb0e4; --zk-info-bg: #1b2a3a; --zk-info-line: #2f4a68;
    --zk-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 4px 16px rgba(0, 0, 0, .35);
    --zk-shadow-up: 0 -2px 12px rgba(0, 0, 0, .45);
  }
}

/* блоки нового интерфейса не показываются в старом (на случай, если разметка
   отрисована Vue без v-if; основной способ — v-if="zkNew") */
body:not(.zk-new) .zk-only { display: none !important; }

/* --------------------------------------------- 2. основа, шапка, навигация */
body.zk-new {
  font-family: var(--zk-font);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
/* страницы входа и восстановления пароля (users/base.html) живут на тёмной фотографии —
   фон и цвет текста у них свои, новый облик только приводит в порядок карточку и поля */
body.zk-new:not([data-zk-page="auth"]) {
  background: var(--zk-bg);
  color: var(--zk-text);
}
body.zk-new h1, body.zk-new h2, body.zk-new h3,
body.zk-new h4, body.zk-new h5, body.zk-new h6 { color: var(--zk-text); font-weight: 600; }
body.zk-new h4 { font-size: 1.25rem; }
body.zk-new h5 { font-size: 1.1rem; }
body.zk-new h6 { font-size: .95rem; }
body.zk-new a { color: var(--zk-ink); }
body.zk-new hr { border-top-color: var(--zk-line); }
body.zk-new .text-muted { color: var(--zk-muted) !important; }
body.zk-new :focus-visible { outline: 2px solid var(--zk-brand); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { body.zk-new * { transition: none !important; } }

body.zk-new .site-header .navbar {
  background: var(--zk-text) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .12);
}
body.zk-new .site-header .navbar-brand { font-weight: 700; letter-spacing: .02em; }
body.zk-new .site-header .navbar-nav .nav-link {
  color: #cbd5db; font-size: 13px; font-weight: 500;
}
body.zk-new .site-header .navbar-nav .nav-link:hover { color: #fff; }

body.zk-new .breadcrumb {
  background: transparent;
  padding: .5rem 0;
  margin-bottom: .25rem;
  font-size: 12px;
}
body.zk-new .breadcrumb-item + .breadcrumb-item::before { color: var(--zk-muted); }
body.zk-new .breadcrumb-item.active { color: var(--zk-muted); }

/* переключатель «Новый интерфейс / Старый» (zakl-theme-1-00.js) */
.zk-switch {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--zk-font); font-size: 12px; color: #6b7280;
}
.zk-switch button {
  border: 1px solid #cfd4da; background: #fff; color: #374151;
  border-radius: 6px; padding: 3px 10px; font: inherit; cursor: pointer;
  transition: background .15s, border-color .15s;
}
.zk-switch button:hover { border-color: #6b7280; }
.zk-switch button[aria-pressed="true"] { background: #263d66; border-color: #263d66; color: #fff; }
body.zk-new .zk-switch { color: var(--zk-muted); }
body.zk-new .zk-switch button {
  background: var(--zk-surface); border-color: var(--zk-line-strong); color: var(--zk-text);
}
body.zk-new .zk-switch button[aria-pressed="true"] {
  background: var(--zk-ink); border-color: var(--zk-ink); color: #fff;
}
.zk-switch-fixed { position: fixed; right: 14px; bottom: 78px; z-index: 1035; opacity: .85; }
.zk-switch-fixed:hover { opacity: 1; }
/* в старом облике кнопка «Сохранить XML» висит выше (bottom: 8%) — поднимаем переключатель,
   чтобы он её не перекрывал */
body:not(.zk-new) .zk-switch-fixed { bottom: 142px; }

/* переключатель в шапке портала (base.html, пункт меню справа от имени пользователя).
   Правый нижний угол страницы освобождён под плавающее «Сохранить». */
.zk-nav-switch { display: flex; align-items: center; }
.zk-switch-nav { padding: 0 10px; }
.zk-switch-compact { gap: 3px; }
.zk-switch-compact button {
  padding: 2px 8px; font-size: 11px; line-height: 18px;
  background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .28); color: #cbd5db;
}
.zk-switch-compact button:hover { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .5); color: #fff; }
.zk-switch-compact button[aria-pressed="true"] { background: #4a6fae; border-color: #4a6fae; color: #fff; }
body.zk-new .zk-switch-nav button { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .28); color: #cbd5db; }
body.zk-new .zk-switch-nav button:hover { background: rgba(255, 255, 255, .14); color: #fff; }
body.zk-new .zk-switch-nav button[aria-pressed="true"] { background: #4a6fae; border-color: #4a6fae; color: #fff; }
/* в бургер-меню (узкий экран) пункт встаёт в строку списка */
@media (max-width: 1199.98px) {
  .zk-nav-switch { justify-content: center; padding: 6px 0; }
}

/* вход, регистрация, восстановление пароля */
body.zk-new[data-zk-page="auth"] .content-section {
  background: rgba(20, 24, 29, .62);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 14px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .35);
  padding: 22px 34px;
}
body.zk-new[data-zk-page="auth"] label,
body.zk-new[data-zk-page="auth"] .form-group { color: #e8eaed; font-size: 13px; }
body.zk-new[data-zk-page="auth"] .form-control {
  background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .35);
  color: #fff; border-radius: var(--zk-radius); height: 40px;
}
body.zk-new[data-zk-page="auth"] .form-control:focus {
  background: rgba(255, 255, 255, .14); border-color: var(--zk-brand);
  box-shadow: 0 0 0 3px rgba(234, 89, 33, .25); color: #fff;
}
body.zk-new[data-zk-page="auth"] .btn {
  background: var(--zk-brand); border-color: var(--zk-brand); color: #fff; height: 40px; padding: 0 22px;
}
body.zk-new[data-zk-page="auth"] .btn:hover { background: var(--zk-brand-hover); border-color: var(--zk-brand-hover); color: #fff; }
body.zk-new[data-zk-page="auth"] hr { border-top-color: rgba(255, 255, 255, .2); }
body.zk-new[data-zk-page="auth"] a { color: #ffb38f; }
body.zk-new[data-zk-page="auth"] .zk-switch { color: rgba(255, 255, 255, .75); }
body.zk-new[data-zk-page="auth"] .zk-switch button {
  background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .3); color: #fff;
}
body.zk-new[data-zk-page="auth"] .zk-switch button[aria-pressed="true"] { background: var(--zk-brand); border-color: var(--zk-brand); }

/* ------------------------------------------------------------- 3. кнопки */
body.zk-new .btn {
  border-radius: var(--zk-radius);
  font-weight: 500;
  font-size: 13px;
  border: 1px solid var(--zk-line-strong);
  background: var(--zk-surface);
  color: var(--zk-text);
  transition: background .15s, border-color .15s, box-shadow .15s, color .15s;
  box-shadow: none;
}
body.zk-new .btn:hover { background: var(--zk-surface-2); border-color: var(--zk-muted); color: var(--zk-text); }
body.zk-new .btn:focus, body.zk-new .btn.focus { box-shadow: 0 0 0 3px var(--zk-ink-soft); }
body.zk-new .btn-sm { font-size: 12px; border-radius: 6px; }
body.zk-new .btn-lg { font-size: 15px; }
body.zk-new .btn.disabled, body.zk-new .btn:disabled { opacity: .5; }
body.zk-new .btn svg, body.zk-new .btn .icon { vertical-align: -.125em; }

body.zk-new .btn-primary,
body.zk-new .btn-outline-primary:hover,
body.zk-new .btn-outline-primary:not(:disabled):not(.disabled):active {
  background: var(--zk-ink); border-color: var(--zk-ink); color: #fff;
}
body.zk-new .btn-primary:hover { background: #1c2f52; border-color: #1c2f52; color: #fff; }
body.zk-new .btn-outline-primary { color: var(--zk-ink); border-color: var(--zk-line-strong); background: var(--zk-surface); }
body.zk-new .btn-secondary { background: var(--zk-surface-3); border-color: var(--zk-line-strong); color: var(--zk-text); }
body.zk-new .btn-secondary:hover { background: var(--zk-line); border-color: var(--zk-muted); color: var(--zk-text); }
body.zk-new .btn-outline-secondary { color: var(--zk-muted); border-color: var(--zk-line-strong); background: var(--zk-surface); }
body.zk-new .btn-outline-secondary:hover { color: var(--zk-text); background: var(--zk-surface-2); border-color: var(--zk-muted); }
body.zk-new .btn-success { background: var(--zk-ok); border-color: var(--zk-ok); color: #fff; }
body.zk-new .btn-success:hover { background: #256c49; border-color: #256c49; color: #fff; }
body.zk-new .btn-outline-success { color: var(--zk-ok); border-color: var(--zk-ok-line); background: var(--zk-surface); }
body.zk-new .btn-outline-success:hover { color: #fff; background: var(--zk-ok); border-color: var(--zk-ok); }
body.zk-new .btn-danger { background: var(--zk-err); border-color: var(--zk-err); color: #fff; }
body.zk-new .btn-danger:hover { background: #a3271b; border-color: #a3271b; color: #fff; }
body.zk-new .btn-outline-danger { color: var(--zk-err); border-color: var(--zk-err-line); background: var(--zk-surface); }
body.zk-new .btn-outline-danger:hover { color: #fff; background: var(--zk-err); border-color: var(--zk-err); }
body.zk-new .btn-warning { background: var(--zk-warn-bg); border-color: var(--zk-warn-line); color: var(--zk-warn); }
body.zk-new .btn-warning:hover { background: #ffedcc; border-color: var(--zk-warn); color: var(--zk-warn); }
body.zk-new .btn-info { background: var(--zk-info-bg); border-color: var(--zk-info-line); color: var(--zk-info); }
body.zk-new .btn-info:hover { background: #d8e8f8; border-color: var(--zk-info); color: var(--zk-info); }
body.zk-new .btn-dark { background: var(--zk-text); border-color: var(--zk-text); color: var(--zk-surface); }
body.zk-new .btn-light { background: var(--zk-surface); border-color: var(--zk-line-strong); color: var(--zk-text); }
body.zk-new .btn-link { border-color: transparent; background: transparent; color: var(--zk-ink); }
body.zk-new .btn-outline-dark { border-radius: 40px; border-color: var(--zk-line-strong); color: var(--zk-text); }
body.zk-new .btn-outline-dark:hover { background: var(--zk-text); color: var(--zk-surface); }
body.zk-new .btn-outline-dark1 { border-radius: var(--zk-radius); border-color: var(--zk-line-strong); color: var(--zk-text); }

/* главное действие страницы — оранжевое (ставится классом zk-main) */
body.zk-new .btn.zk-main,
body.zk-new .zk-main > .btn {
  background: var(--zk-brand) !important; border-color: var(--zk-brand) !important; color: #fff !important;
}
body.zk-new .btn.zk-main:hover,
body.zk-new .zk-main > .btn:hover { background: var(--zk-brand-hover) !important; border-color: var(--zk-brand-hover) !important; }

body.zk-new .btn-group > .btn { border-radius: 0; }
body.zk-new .btn-group > .btn:first-child { border-radius: var(--zk-radius) 0 0 var(--zk-radius); }
body.zk-new .btn-group > .btn:last-child { border-radius: 0 var(--zk-radius) var(--zk-radius) 0; }
body.zk-new .btn-group > .btn:only-child { border-radius: var(--zk-radius); }

/* ------------------------------------------------- 4. поля ввода и формы */
body.zk-new .form-control,
body.zk-new .custom-select,
body.zk-new .input-group-text {
  background: var(--zk-surface);
  color: var(--zk-text);
  border: 1px solid var(--zk-line-strong);
  border-radius: var(--zk-radius);
  font-size: 13px;
  transition: border-color .15s, box-shadow .15s;
}
body.zk-new .form-control:focus,
body.zk-new .custom-select:focus {
  border-color: var(--zk-ink);
  box-shadow: 0 0 0 3px var(--zk-ink-soft);
  background: var(--zk-surface);
  color: var(--zk-text);
}
body.zk-new .form-control::placeholder { color: var(--zk-muted); opacity: .8; }
body.zk-new .form-control:disabled,
body.zk-new .form-control[readonly] {
  background: var(--zk-surface-2); color: var(--zk-muted); border-style: dashed;
}
body.zk-new .form-control.is-valid,
body.zk-new .custom-select.is-valid,
body.zk-new .was-validated .form-control:valid {
  border-color: var(--zk-ok-line); background-color: var(--zk-surface);
}
body.zk-new .form-control.is-invalid,
body.zk-new .custom-select.is-invalid,
body.zk-new .was-validated .form-control:invalid {
  border-color: var(--zk-err); background-color: var(--zk-err-bg);
}
body.zk-new .form-control.is-valid:focus { box-shadow: 0 0 0 3px var(--zk-ok-bg); }
body.zk-new .form-control.is-invalid:focus { box-shadow: 0 0 0 3px var(--zk-err-bg); }
body.zk-new .invalid-feedback { color: var(--zk-err); font-size: 12px; }
body.zk-new .valid-feedback { color: var(--zk-ok); font-size: 12px; }
body.zk-new .custom-control-label { font-size: 13px; }
body.zk-new .custom-control-input:checked ~ .custom-control-label::before {
  background: var(--zk-ink); border-color: var(--zk-ink);
}
body.zk-new .input-group-text { background: var(--zk-surface-2); color: var(--zk-muted); font-size: 12px; }
body.zk-new .form-input-custom, body.zk-new .form-input-custom:focus { border-radius: var(--zk-radius); }
body.zk-new label { font-size: 13px; margin-bottom: .2rem; }
body.zk-new .b-form-datepicker .btn,
body.zk-new .b-form-timepicker .btn { border: 0; background: transparent; }

/* «*» у обязательного поля: красная звёздочка вместо полужирной заливки */
body.zk-new .bgc-required { font-weight: 500; background: transparent; }
body.zk-new .bgc-required::after { content: " *"; color: var(--zk-err); font-weight: 700; }

/* ------------------------- 5. карточки, вкладки, таблицы, модалки, плашки */
body.zk-new .card,
body.zk-new .content-section {
  background: var(--zk-surface);
  border: 1px solid var(--zk-line);
  border-radius: var(--zk-radius-lg);
  box-shadow: none;
}
body.zk-new .card-header {
  background: var(--zk-surface);
  border-bottom: 1px solid var(--zk-line);
  padding: 8px 10px;
}
body.zk-new .card-body { padding: 14px; }

body.zk-new .nav-pills {
  display: flex; flex-wrap: wrap; gap: 4px;
  padding: 4px; background: var(--zk-surface-2);
  border: 1px solid var(--zk-line); border-radius: var(--zk-radius-lg);
}
body.zk-new .nav-pills .nav-link {
  border-radius: 7px; color: var(--zk-muted); font-weight: 500; font-size: 13px;
  padding: 8px 12px; border: 0; background: transparent; text-align: center;
  transition: background .15s, color .15s;
}
body.zk-new .nav-pills .nav-link:hover { background: var(--zk-surface-3); color: var(--zk-text); }
body.zk-new .nav-pills .nav-link.active { background: var(--zk-ink); color: #fff; }
body.zk-new .nav-tabs { border-bottom: 1px solid var(--zk-line); }
body.zk-new .nav-tabs .nav-link.active { background: var(--zk-surface); border-color: var(--zk-line) var(--zk-line) var(--zk-surface); }

body.zk-new .table { color: var(--zk-text); font-size: 13px; }
body.zk-new .table th, body.zk-new .table td {
  border-color: var(--zk-line); padding: 7px 8px; vertical-align: middle;
}
body.zk-new .table thead th {
  background-color: var(--zk-surface-2); color: var(--zk-muted);
  font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  border-bottom: 1px solid var(--zk-line-strong);
}
body.zk-new .table tbody tr:nth-child(even) > td { background: var(--zk-surface-2); }
body.zk-new .table-hover tbody tr:hover > td { background: var(--zk-ink-soft); }
body.zk-new .table-bordered, body.zk-new .table-bordered th, body.zk-new .table-bordered td { border-color: var(--zk-line); }
body.zk-new table td, body.zk-new table th { border-color: var(--zk-line); }

body.zk-new .modal-content {
  background: var(--zk-surface); color: var(--zk-text);
  border: 1px solid var(--zk-line); border-radius: 12px; box-shadow: var(--zk-shadow);
}
body.zk-new .modal-header, body.zk-new .modal-footer { border-color: var(--zk-line); padding: 12px 18px; }
body.zk-new .modal-title { font-size: 15px; font-weight: 600; }
body.zk-new .modal-body { padding: 14px 18px; }

body.zk-new .alert {
  border-radius: var(--zk-radius); border: 1px solid var(--zk-line);
  border-left-width: 3px; font-size: 13px; padding: 10px 14px;
}
body.zk-new .alert-warning { background: var(--zk-warn-bg); border-color: var(--zk-warn-line); border-left-color: var(--zk-warn); color: var(--zk-warn); }
body.zk-new .alert-danger { background: var(--zk-err-bg); border-color: var(--zk-err-line); border-left-color: var(--zk-err); color: var(--zk-err); }
body.zk-new .alert-success { background: var(--zk-ok-bg); border-color: var(--zk-ok-line); border-left-color: var(--zk-ok); color: var(--zk-ok); }
body.zk-new .alert-info { background: var(--zk-info-bg); border-color: var(--zk-info-line); border-left-color: var(--zk-info); color: var(--zk-info); }

body.zk-new .badge {
  border-radius: 12px; font-weight: 600; font-size: 11px; padding: .3em .6em;
  font-variant-numeric: tabular-nums; border: 1px solid transparent;
}
body.zk-new .badge-danger { color: var(--zk-err); background: var(--zk-err-bg); border-color: var(--zk-err-line); }
body.zk-new .badge-warning { color: var(--zk-warn); background: var(--zk-warn-bg); border-color: var(--zk-warn-line); }
body.zk-new .badge-success { color: var(--zk-ok); background: var(--zk-ok-bg); border-color: var(--zk-ok-line); }
body.zk-new .badge-info { color: var(--zk-info); background: var(--zk-info-bg); border-color: var(--zk-info-line); }
body.zk-new .badge-primary { color: var(--zk-ink); background: var(--zk-ink-soft); border-color: var(--zk-ink-soft); }
body.zk-new .badge-light { color: var(--zk-muted); background: var(--zk-surface-2); border-color: var(--zk-line); }
body.zk-new .badge-secondary { color: var(--zk-muted); background: var(--zk-surface-3); border-color: var(--zk-line); }

body.zk-new .list-group-item { background: var(--zk-surface); border-color: var(--zk-line); color: var(--zk-text); }
body.zk-new .page-link { color: var(--zk-ink); border-color: var(--zk-line); background: var(--zk-surface); }
body.zk-new .page-item.active .page-link { background: var(--zk-ink); border-color: var(--zk-ink); color: #fff; }
body.zk-new .progress { background: var(--zk-surface-3); border-radius: 6px; }
body.zk-new .tooltip-inner { background: var(--zk-text); border-radius: 6px; font-size: 12px; }
body.zk-new .b-overlay-wrap > .b-overlay .bg-light { background: var(--zk-bg) !important; }

/* ------------------------------------------- 6. анкета «Заключение ЕГРЗ» */

/* 6.1 панель действий — липкая, одно главное действие */
body.zk-new .zk-toolbar {
  position: sticky;
  top: calc(var(--zk-navbar-h) + 4px);
  z-index: 1020;
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  margin: 0 0 14px;
  padding: 8px 10px;
  background: var(--zk-surface);
  border: 1px solid var(--zk-line);
  border-radius: var(--zk-radius-lg);
  box-shadow: var(--zk-shadow);
}
body.zk-new .zk-toolbar > * { margin: 0 !important; }
body.zk-new .zk-toolbar .zk-status { margin-left: auto !important; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
body.zk-new .zk-toolbar .badge { font-size: 12px !important; height: 26px; display: inline-flex; align-items: center; padding: 0 10px; }
body.zk-new .zk-toolbar .zk-sep { width: 1px; height: 24px; background: var(--zk-line); }

/* 6.2 разделы — белые карточки с полосой состояния слева */
body.zk-new .zk-sec {
  display: flex; align-items: center; gap: 10px; flex-wrap: nowrap;
  margin: 16px 0 0 !important;          /* .row имеет отрицательные поля — убираем */
  padding: 10px 12px;
  background: var(--zk-surface) !important;
  color: var(--zk-text) !important;
  border: 1px solid var(--zk-line);
  border-left: 3px solid var(--zk-ink);
  border-radius: var(--zk-radius-lg) var(--zk-radius-lg) 0 0;
}
body.zk-new .zk-sec.zk-closed { border-radius: var(--zk-radius-lg); }
body.zk-new .zk-sec-err { border-left-color: var(--zk-err); }
body.zk-new .zk-sec-ok { border-left-color: var(--zk-ok); }
body.zk-new .zk-sec-warn { border-left-color: var(--zk-warn); }
body.zk-new .zk-sec-off { border-left-color: var(--zk-line-strong); opacity: .72; }
body.zk-new .zk-sec > .col-2 {
  flex: 0 0 auto; max-width: none; width: auto; padding: 0;
}
body.zk-new .zk-sec > .col-10 {
  flex: 1 1 auto; max-width: none; width: auto; padding: 0;
  display: flex; align-items: center; gap: 10px; min-width: 0;
}
/* метки старого вида, которые в новом заменены: «!» у вкладки и в заголовке раздела
   (их место занял счётчик ошибок и полоса состояния слева) */
body.zk-new .zk-oldmark { display: none !important; }
body.zk-new .zk-sec .badge-danger { display: none; }
body.zk-new .zk-sec p {
  margin: 0 !important; padding: 0 !important; text-align: left !important;
  font-size: 13.5px; font-weight: 600; color: var(--zk-text);
  max-width: none; flex: none;
}
body.zk-new .zk-sec p strong { font-weight: 700; }
body.zk-new .zk-sec .btn {
  width: 30px; height: 30px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px; border: 1px solid var(--zk-line);
  background: var(--zk-surface-2); color: var(--zk-muted);
  transform: none; position: static; top: auto;
}
/* «глаз» → шеврон (тот же обработчик, разметка не трогается) */
body.zk-new .zk-sec .btn svg { display: none; }
body.zk-new .zk-sec .btn::after {
  content: "›"; font-size: 19px; line-height: 1; font-weight: 700;
  display: block; transition: transform .15s; transform: translateY(-1px);
}
body.zk-new .zk-sec.zk-open .btn { color: var(--zk-ink); border-color: var(--zk-ink-soft); background: var(--zk-ink-soft); }
body.zk-new .zk-sec.zk-open .btn::after { transform: rotate(90deg) translateX(-1px); }
/* тело раздела — продолжение карточки */
body.zk-new .zk-sec > .col-10 > p { flex: 1 1 auto; min-width: 0; }
body.zk-new .zk-sec + div {
  border: 1px solid var(--zk-line); border-top: 0;
  border-radius: 0 0 var(--zk-radius-lg) var(--zk-radius-lg);
  background: var(--zk-surface);
  padding: 4px 12px 10px;
}
body.zk-new .zk-sec.zk-closed + div { border: 0; padding: 0; }
/* короткий статус справа */
body.zk-new .zk-state {
  margin-left: auto; font-size: 12px; font-weight: 500; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 6px; color: var(--zk-muted);
}
body.zk-new .zk-state.zk-s-err { color: var(--zk-err); }
body.zk-new .zk-state.zk-s-ok { color: var(--zk-ok); }
body.zk-new .zk-state.zk-s-warn { color: var(--zk-warn); }
body.zk-new .zk-state::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none;
}

/* 6.3 поля: «метка — поле» в одну сетку, без серых полос */
body.zk-new .tab-content .form-group.row.justify-content-center > .col-md-5,
body.zk-new .tab-content .form-group.row.justify-content-center > .col-md-4 {
  padding-right: 10px;
}
body.zk-new .tab-content .form-group.row > [class*="col-md-"] > p.div-text-vert-center {
  position: static; transform: none; top: auto;
  margin: 0; padding: 5px 0 0; font-size: 13px; line-height: 1.35;
}
body.zk-new .tab-content .form-group.row {
  margin-bottom: 0;
  padding: 5px 0;
  border-top: 1px dashed var(--zk-line);
}
body.zk-new .tab-content .form-group.row:first-child { border-top: 0; }
body.zk-new .tab-content .container > .form-group.row { margin-left: 0; margin-right: 0; }

/* 6.4 вложенные блоки записей */
body.zk-new .parcing-data {
  border: 1px solid var(--zk-line) !important;
  border-width: 1px !important;
  border-radius: var(--zk-radius) !important;
  border-color: var(--zk-line) !important;
  background: var(--zk-surface-2);
  padding: 10px 12px;
  margin-top: 10px;
}
body.zk-new .parcing-data .parcing-data { background: var(--zk-surface); }

/* 6.5 фоновые подсветки старого вида — в спокойные токены */
body.zk-new .bgc-light-red { background-color: var(--zk-err-bg) !important; }
body.zk-new .bgc-light-yellow { background-color: var(--zk-warn-bg) !important; }
body.zk-new .bgc-light-green { background-color: var(--zk-ok-bg) !important; }
body.zk-new .light-grey-bg { background-color: var(--zk-surface-2) !important; }
body.zk-new .bg-263D66 { background-color: var(--zk-surface) !important; }

/* 6.6 плавающая кнопка «Сохранить XML» — единственное оранжевое действие */
body.zk-new .right-bottom-float { bottom: 18px; }
body.zk-new .right-bottom-float .btn {
  background: var(--zk-brand); border-color: var(--zk-brand); color: #fff;
  box-shadow: 0 6px 20px rgba(234, 89, 33, .35);
  font-weight: 600; height: 42px; padding: 0 18px;
  display: inline-flex; align-items: center; justify-content: center;
}
body.zk-new .right-bottom-float .btn:hover { background: var(--zk-brand-hover); border-color: var(--zk-brand-hover); color: #fff; }
body.zk-new .right-bottom-float .btn:disabled { background: var(--zk-surface-3); border-color: var(--zk-line-strong); color: var(--zk-muted); box-shadow: none; }

/* 6.7 таблицы документов (1.3, ТЭП, авторы) — компактные, с фиксированной шапкой и зеброй.
   Списки модалок лежат в прокручиваемых обёртках (max-height + overflow-y) — шапка липнет к ним. */
body.zk-new .modal-body table.table thead th {
  position: sticky; top: 0; z-index: 2;
  box-shadow: inset 0 -1px 0 var(--zk-line-strong);
}
body.zk-new .modal-body table.table.table-sm th,
body.zk-new .modal-body table.table.table-sm td { padding: 4px 6px; }
body.zk-new .modal-body table.table tbody tr:hover > td { background: var(--zk-ink-soft); }
body.zk-new .zk-table-wrap { max-height: 60vh; overflow: auto; border: 1px solid var(--zk-line); border-radius: var(--zk-radius); }
body.zk-new .zk-table-wrap thead th { position: sticky; top: 0; z-index: 2; }

/* список документов раздела 1.3: строки-карточки вместо голых рамок */
body.zk-new .zk-sec + div .border {
  border-color: var(--zk-line) !important; border-radius: 6px; margin-bottom: 4px; background: var(--zk-surface);
}
body.zk-new .zk-sec + div .border > .row { margin-left: 0; margin-right: 0; align-items: center; }
body.zk-new .zk-sec + div .border > .row > [class*="col-"] > p.div-text-vert-center {
  margin: 0; padding: 5px 0; font-size: 13px; position: static; transform: none;
}
body.zk-new .zk-sec + div .border:hover { border-color: var(--zk-line-strong) !important; }

/* 6.8 счётчик ошибок на вкладке раздела */
body.zk-new .zk-tabcnt {
  margin-left: 6px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 9px; font-size: 11px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--zk-err); color: #fff; border: 0;
  font-variant-numeric: tabular-nums;
}
body.zk-new .nav-link.active .zk-tabcnt { background: #fff; color: var(--zk-err); }

/* 6.9 подсветка поля, к которому перешли из окна проверки */
body.zk-new .zk-flash, .zk-flash {
  animation: zk-flash 2.2s ease-out 1;
  border-radius: var(--zk-radius);
}
@keyframes zk-flash {
  0% { box-shadow: 0 0 0 3px rgba(234, 89, 33, .55); background-color: rgba(234, 89, 33, .10); }
  70% { box-shadow: 0 0 0 3px rgba(234, 89, 33, .35); background-color: rgba(234, 89, 33, .06); }
  100% { box-shadow: 0 0 0 0 rgba(234, 89, 33, 0); background-color: transparent; }
}

/* 6.10 выбор черновика анкеты — сегментная группа в одном стиле с панелью действий.
   Разметка не менялась: кнопкам добавлены только классы zk-db-*, подписи — родные title. */
body.zk-new .zk-drafts {
  background: var(--zk-surface);
  border: 1px solid var(--zk-line);
  border-radius: var(--zk-radius-lg);
  padding: 8px 10px 10px;
  margin-bottom: 12px;
  max-width: none;
}
body.zk-new .zk-drafts .zk-drafts-title {
  font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  color: var(--zk-muted); text-align: left !important; padding: 0 0 6px;
}
body.zk-new .zk-drafts > .row > .col-12 { text-align: left !important; padding: 0; }
body.zk-new .zk-drafts .zk-drafts-row { margin-top: 6px !important; }
body.zk-new .zk-drafts .btn {
  background: var(--zk-surface) !important;
  border-color: var(--zk-line-strong) !important;
  color: var(--zk-muted) !important;
  box-shadow: none !important;
  font-size: 12px; font-weight: 500;
  padding: 4px 9px;
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
}
body.zk-new .zk-drafts .btn:hover { background: var(--zk-surface-2) !important; color: var(--zk-text) !important; border-color: var(--zk-muted) !important; }
body.zk-new .zk-drafts .btn svg { width: 15px; height: 15px; }
/* сам черновик — широкая кнопка с двумя строками; выбранный подсвечен */
body.zk-new .zk-drafts .zk-db-pick {
  flex-direction: column; align-items: flex-start; gap: 0;
  min-width: 320px; text-align: left; padding: 4px 12px;
  color: var(--zk-text) !important;
}
body.zk-new .zk-drafts .zk-db-pick > div:first-child { font-variant-numeric: tabular-nums; }
body.zk-new .zk-drafts .zk-db-pick > div:last-child:empty { display: none; }
body.zk-new .zk-drafts .zk-db-pick.btn-success {
  background: var(--zk-ink-soft) !important; border-color: var(--zk-ink) !important; color: var(--zk-ink) !important; font-weight: 600;
}
body.zk-new .zk-drafts .zk-db-del:hover { background: var(--zk-err-bg) !important; color: var(--zk-err) !important; border-color: var(--zk-err-line) !important; }
body.zk-new .zk-drafts .zk-db-no { color: var(--zk-err) !important; font-weight: 600; }
body.zk-new .zk-drafts .badge { margin-left: 4px; }
@media (max-width: 767.98px) {
  body.zk-new .zk-drafts .zk-db-pick { min-width: 0; }
}

/* --------------------------- 7. мини-навигация по разделам и уведомления */
body.zk-new .zk-minimap {
  position: fixed;
  left: 10px;
  top: calc(var(--zk-navbar-h) + 70px);
  width: 176px;
  max-height: calc(100vh - var(--zk-navbar-h) - 120px);
  overflow: auto;
  z-index: 1010;
  padding: 8px 6px;
  background: var(--zk-surface);
  border: 1px solid var(--zk-line);
  border-radius: var(--zk-radius-lg);
  box-shadow: var(--zk-shadow);
  font-size: 12px;
}
body.zk-new .zk-minimap .zk-mm-title {
  font-size: 10px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--zk-muted); padding: 0 6px 6px;
}
body.zk-new .zk-minimap a {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 6px; border-radius: 6px;
  color: var(--zk-text); text-decoration: none; cursor: pointer;
}
body.zk-new .zk-minimap a:hover { background: var(--zk-surface-2); }
body.zk-new .zk-minimap a.zk-mm-cur { background: var(--zk-ink-soft); color: var(--zk-ink); font-weight: 600; }
body.zk-new .zk-minimap a .zk-mm-n { font-variant-numeric: tabular-nums; min-width: 26px; color: var(--zk-muted); flex: none; }
body.zk-new .zk-minimap a .zk-mm-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.zk-new .zk-minimap a.zk-mm-top { font-weight: 600; margin-top: 4px; }
body.zk-new .zk-minimap a.zk-mm-cur .zk-mm-n { color: var(--zk-ink); }
body.zk-new .zk-minimap a .zk-mm-c {
  margin-left: auto; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 8px; background: var(--zk-err); color: #fff;
  font-size: 10px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center;
}
body.zk-new .zk-minimap a.zk-mm-ok .zk-mm-c { background: var(--zk-ok-bg); color: var(--zk-ok); }
body.zk-new .zk-minimap a.zk-mm-off { color: var(--zk-muted); }
/* колонка разделов показывается с 1280 px (решение пользователя 25.09.2026);
   на более узких экранах её заменяет выпадающий список «Разделы» в панели действий */
@media (max-width: 1279.98px) { body.zk-new .zk-minimap { display: none; } }
@media (min-width: 1280px) {
  body.zk-new.zk-map main[role="main"] { padding-left: 196px; transition: padding-left .15s; }
  body.zk-new .zk-secdd { display: none !important; }
}
/* выпадающий список разделов: тот же перечень, что в колонке */
body.zk-new .zk-secdd .dropdown-menu { max-height: 70vh; overflow: auto; padding: 4px; font-size: 12px; min-width: 260px; }
body.zk-new .zk-secdd .dropdown-item { display: flex; align-items: center; gap: 8px; border-radius: 6px; padding: 4px 8px; }
body.zk-new .zk-secdd .dropdown-item .zk-mm-n { font-variant-numeric: tabular-nums; min-width: 28px; color: var(--zk-muted); }
body.zk-new .zk-secdd .dropdown-item .zk-mm-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.zk-new .zk-secdd .dropdown-item .zk-mm-c {
  margin-left: auto; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: var(--zk-err); color: #fff; font-size: 10px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
}

/* плашки-уведомления: снизу справа, не перекрывают панель действий */
body.zk-new .zk-toast-box {
  position: fixed; right: 16px; bottom: 78px; z-index: 1040;
  display: flex; flex-direction: column; gap: 8px; max-width: 340px;
}
body.zk-new .zk-toast {
  padding: 9px 12px; border-radius: var(--zk-radius);
  background: var(--zk-surface); color: var(--zk-text);
  border: 1px solid var(--zk-line); border-left: 3px solid var(--zk-ink);
  box-shadow: var(--zk-shadow); font-size: 13px;
}
body.zk-new .zk-toast.zk-t-ok { border-left-color: var(--zk-ok); }
body.zk-new .zk-toast.zk-t-err { border-left-color: var(--zk-err); }
body.zk-new .zk-toast.zk-t-warn { border-left-color: var(--zk-warn); }

/* подсказка о горячих клавишах */
body.zk-new .zk-keys { font-size: 11px; color: var(--zk-muted); }
body.zk-new kbd, body.zk-new .zk-kbd {
  display: inline-block; padding: 1px 5px; border-radius: 4px;
  border: 1px solid var(--zk-line-strong); background: var(--zk-surface-2);
  color: var(--zk-muted); font-size: 11px; font-family: var(--zk-font);
}

/* =========================== 9. страницы портала (этап 2, 25.09.2026) ========================
   Список проектов, карточка проекта, финкнига, ФОТ, дашборд, списки, СМЗ, отчёты, кабинет.
   Логика страниц не менялась: здесь только вид. Классы zk-* расставлены в шаблонах,
   служебные метки старого вида (div-status-*, rem-res-*, doc-to-del) перекрашены на месте. */

/* 9.1 ширина содержимого: на 2560 px таблицы не растягиваются бесконечно */
body.zk-new .zk-page { max-width: 1760px; margin-left: auto; margin-right: auto; }
body.zk-new .zk-h {
  font-size: 18px; font-weight: 600; letter-spacing: .01em;
  text-align: left !important; margin: 4px 0 10px;
}

/* 9.2 липкая строка действий и фильтров над таблицей */
body.zk-new .zk-actionbar {
  position: sticky;
  top: calc(var(--zk-navbar-h) + 2px);
  z-index: 1019;
  margin: 0 0 10px !important;
  padding: 8px 10px;
  background: var(--zk-surface);
  border: 1px solid var(--zk-line);
  border-radius: var(--zk-radius-lg);
  box-shadow: var(--zk-shadow);
}
body.zk-new .zk-actionbar > .row {
  margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
}
body.zk-new .zk-actionbar > .row > [class*="col-"] {
  flex: 0 0 auto; max-width: none; width: auto; padding: 0;
}
body.zk-new .zk-actionbar .float-left,
body.zk-new .zk-actionbar .float-right { float: none !important; }
body.zk-new .zk-actionbar .btn { margin: 0; }
body.zk-new .zk-q { width: 150px; height: 30px; font-size: 12px; }
body.zk-new .zk-q-wide { width: 300px; }
body.zk-new .zk-q-reset { margin-left: 2px !important; }
body.zk-new .zk-qlabel { font-size: 11px; color: var(--zk-muted); margin-left: 6px; }
body.zk-new .zk-found { margin-left: auto; font-size: 12px; color: var(--zk-muted); white-space: nowrap; }

/* 9.3 компактные таблицы с фиксированной шапкой и зеброй.
   Внимание: класс, написанный на <b-table responsive>, достаётся ОБЁРТКЕ .table-responsive,
   а без responsive — самой <table>. Поэтому правила пишутся «потомок или сам». */
body.zk-new .zk-ptable, body.zk-new .zk-dtable { font-size: 12.5px; }
body.zk-new .zk-ptable table.table, body.zk-new .zk-dtable table.table { margin-bottom: 0; font-size: 12.5px; }
body.zk-new .zk-ptable th, body.zk-new .zk-ptable td,
body.zk-new .zk-dtable th, body.zk-new .zk-dtable td { padding: 5px 8px; vertical-align: middle; }
body.zk-new .zk-ptable thead th,
body.zk-new .zk-dtable thead th {
  position: sticky; top: 0; z-index: 3;
  /* именно background-color: b-table рисует стрелки сортировки background-image */
  background-color: var(--zk-surface-3) !important; color: var(--zk-muted);
  box-shadow: inset 0 -1px 0 var(--zk-line-strong);
  white-space: nowrap; font-size: 10.5px;
}
body.zk-new .zk-ptable tbody tr:nth-child(even) > td,
body.zk-new .zk-dtable tbody tr:nth-child(even) > td { background: var(--zk-surface-2); }
body.zk-new .zk-ptable tbody tr:hover > td,
body.zk-new .zk-dtable tbody tr:hover > td { background: var(--zk-ink-soft); }
body.zk-new .zk-ptable tbody a { font-weight: 600; }
/* прокручиваемая область: шапка остаётся на месте (обёртке нужна высота) */
body.zk-new .zk-ptable.table-responsive,
body.zk-new .zk-dtable.table-responsive {
  max-height: calc(100vh - 250px); overflow-y: auto;
  border: 1px solid var(--zk-line); border-radius: var(--zk-radius-lg); background: var(--zk-surface);
}

/* 9.4 цветные метки статусов */
body.zk-new .zk-chip {
  display: inline-block; padding: 2px 9px; border-radius: 11px;
  font-size: 11.5px; font-weight: 600; line-height: 16px; white-space: nowrap;
  border: 1px solid transparent;
}
body.zk-new .zk-st-plain { background: var(--zk-surface-3); color: var(--zk-muted); border-color: var(--zk-line); }
body.zk-new .zk-st-wait { background: var(--zk-surface-3); color: var(--zk-muted); border-color: var(--zk-line-strong); }
body.zk-new .zk-st-work { background: var(--zk-info-bg); color: var(--zk-info); border-color: var(--zk-info-line); }
body.zk-new .zk-st-expert { background: var(--zk-info-bg); color: var(--zk-info); border-color: var(--zk-info-line); }
body.zk-new .zk-st-manager { background: #ede9fb; color: #5b45b0; border-color: #d6ccf5; }
body.zk-new .zk-st-customer { background: var(--zk-warn-bg); color: var(--zk-warn); border-color: var(--zk-warn-line); }
body.zk-new .zk-st-almost { background: var(--zk-ok-bg); color: var(--zk-ok); border-color: var(--zk-ok-line); }
body.zk-new .zk-st-done { background: var(--zk-ok-bg); color: var(--zk-ok); border-color: var(--zk-ok-line); }
html[data-theme="dark"] body.zk-new .zk-st-manager { background: #2a2440; color: #b9a8f0; border-color: #3d3560; }

/* метки состояния раздела из styles-блоков страницы (портал красит их заливкой строки) —
   в новом облике это спокойные «чипы» тех же цветов */
body.zk-new [class*="div-status-"] {
  display: inline-block; padding: 2px 9px; border-radius: 11px;
  font-size: 11.5px; font-weight: 600; line-height: 16px;
  border: 1px solid transparent; background: var(--zk-surface-3) !important; color: var(--zk-muted);
}
body.zk-new .div-status-waiting_for_check { background: var(--zk-surface-3) !important; color: var(--zk-muted); border-color: var(--zk-line-strong); }
body.zk-new .div-status-proceed_initial { background: var(--zk-info-bg) !important; color: var(--zk-info); border-color: var(--zk-info-line); }
body.zk-new .div-status-waiting_for_remark_approved { background: #ede9fb !important; color: #5b45b0; border-color: #d6ccf5; }
body.zk-new .div-status-waiting_for_response { background: var(--zk-warn-bg) !important; color: var(--zk-warn); border-color: var(--zk-warn-line); }
body.zk-new .div-status-waiting_for_response_approved { background: #ede9fb !important; color: #5b45b0; border-color: #d6ccf5; }
body.zk-new .div-status-proceed_subsequent { background: #fde8d8 !important; color: #a4541a; border-color: #f4c9a5; }
body.zk-new .div-status-waiting_for_local_report { background: var(--zk-ok-bg) !important; color: var(--zk-ok); border-color: var(--zk-ok-line); }
body.zk-new .div-status-complete { background: var(--zk-ok-bg) !important; color: var(--zk-ok); border-color: var(--zk-ok-line); }

/* 9.5 счётчик на вкладке страницы портала — спокойный, не тревожный */
body.zk-new .zk-tabcnt-n { background: var(--zk-line); color: var(--zk-text); }
body.zk-new .nav-link.active .zk-tabcnt-n { background: rgba(255, 255, 255, .25); color: #fff; }

/* 9.6 кнопки-иконки в таблицах (заявление, копия проекта, действия над документом) */
body.zk-new .zk-appbtn {
  margin-top: 0 !important; width: 28px; height: 28px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; border-radius: 6px;
}
body.zk-new .zk-appbtn svg { width: 14px; height: 14px; }
body.zk-new .zk-appbtn-add { background: var(--zk-surface) !important; border-color: var(--zk-line-strong) !important; color: var(--zk-muted) !important; }
body.zk-new .zk-appbtn-add:hover { background: var(--zk-info-bg) !important; color: var(--zk-info) !important; border-color: var(--zk-info-line) !important; }
body.zk-new .zk-appbtn-edit.btn-success { background: var(--zk-ok-bg) !important; border-color: var(--zk-ok-line) !important; color: var(--zk-ok) !important; }
body.zk-new .zk-appbtn-edit.btn-warning { background: var(--zk-warn-bg) !important; border-color: var(--zk-warn-line) !important; color: var(--zk-warn) !important; }
body.zk-new .zk-appbtn-copy { background: var(--zk-surface) !important; border-color: var(--zk-line-strong) !important; color: var(--zk-muted) !important; }
body.zk-new .zk-appbtn-copy:hover { background: var(--zk-warn-bg) !important; color: var(--zk-warn) !important; border-color: var(--zk-warn-line) !important; }

/* 9.7 пустое состояние — «нет проектов» с подсказкой, что делать */
body.zk-new .zk-empty {
  margin: 18px auto; padding: 26px 20px; max-width: 560px; text-align: center;
  background: var(--zk-surface); border: 1px dashed var(--zk-line-strong); border-radius: var(--zk-radius-lg);
}
body.zk-new .zk-empty-t { font-size: 15px; font-weight: 600; color: var(--zk-text); margin-bottom: 6px; }
body.zk-new .zk-empty-h { font-size: 12.5px; color: var(--zk-muted); line-height: 1.5; }

/* 9.8 окна портала (фильтры, заявление) — в стиле анкеты */
body.zk-new #my-modal .modal-dialog,
body.zk-new #my-modal-filter-complete .modal-dialog { max-width: 520px; }
body.zk-new #my-modal .input-group,
body.zk-new #my-modal-filter-complete .input-group { margin-bottom: 8px !important; }
body.zk-new #my-modal .input-group-text,
body.zk-new #my-modal-filter-complete .input-group-text {
  min-width: 170px; justify-content: flex-start; background: var(--zk-surface-2); border-color: var(--zk-line-strong);
}
body.zk-new #my-modal .col-10,
body.zk-new #my-modal-filter-complete .col-10 { flex: 0 0 100%; max-width: 100%; }
body.zk-new #my-modal .d-block.text-center,
body.zk-new #my-modal-filter-complete .d-block.text-center { text-align: left !important; }

/* заявление на экспертизу: «метка — поле», ошибка под полем, красная «*» */
body.zk-new #my-modal-application .modal-body > .container { max-width: none; }
body.zk-new #my-modal-application .row {
  margin-left: 0; margin-right: 0; padding: 4px 0; border-top: 1px dashed var(--zk-line);
}
body.zk-new #my-modal-application .row.justify-content-center {
  border-top: 0; margin-top: 14px; font-weight: 600; font-size: 13px; color: var(--zk-ink);
  background: var(--zk-ink-soft); border-radius: var(--zk-radius); padding: 6px 10px;
}
body.zk-new #my-modal-application .row > [class*="col-"] { padding-left: 0; padding-right: 8px; }
body.zk-new #my-modal-application p.div-text-vert-center {
  position: static; transform: none; top: auto; margin: 0; padding: 5px 0 0;
  font-size: 12.5px; line-height: 1.35; color: var(--zk-text);
}
body.zk-new #my-modal-application p.zk-req::after { content: " *"; color: var(--zk-err); font-weight: 700; }
body.zk-new #my-modal-application .text-danger { font-size: 11.5px; display: block; padding-top: 2px; }
body.zk-new #my-modal-application .form-control,
body.zk-new #my-modal-application .custom-select { height: 30px; font-size: 12.5px; }
body.zk-new #my-modal-application textarea.form-control { height: auto; }

/* 9.9 «метка — поле» для страниц портала (тот же ритм, что в анкете) */
body.zk-new .zk-field {
  margin-left: 0; margin-right: 0; padding: 5px 0; margin-bottom: 0;
  border-top: 1px dashed var(--zk-line);
}
body.zk-new .zk-field > [class*="col-"] { padding-left: 0; padding-right: 8px; }
body.zk-new .zk-field p.div-text-vert-center {
  position: static; transform: none; top: auto; margin: 0; padding: 5px 0 0; font-size: 13px;
}

/* 9.10 карточка проекта (portal_project.html) */
body.zk-new .zk-project.container { max-width: 1600px; }
body.zk-new .zk-h-prj { font-size: 17px; }
/* 21 вкладка: список переносится строками и не расползается */
body.zk-new .zk-project .card > .card-header .nav-pills .nav-link { padding: 6px 10px; font-size: 12.5px; }
body.zk-new .zk-project .card > .card-header { padding: 6px; }
body.zk-new .zk-project .nav-pills .nav-item { flex: 0 1 auto; }
/* липкая полоса действий ВНУТРИ вкладки — под полосой вкладок */
body.zk-new .zk-actionbar-tab {
  position: sticky; top: calc(var(--zk-navbar-h) + 2px); z-index: 1018;
  background: var(--zk-surface); border: 1px solid var(--zk-line);
  border-radius: var(--zk-radius-lg); box-shadow: var(--zk-shadow);
  padding: 6px 10px; margin: 0 0 10px !important;
  max-width: none;
}
body.zk-new .zk-actionbar-tab .btn { margin: 2px !important; }
/* длинные таблицы (слежение) — своя прокрутка с закреплённой шапкой */
body.zk-new .zk-dtall.table-responsive { max-height: calc(100vh - 230px); }

/* поля карточки объекта: слева, без пустой полосы на широком экране */
body.zk-new .zk-project .tab-content .container { margin-left: 0; margin-right: 0; max-width: 1080px; }
body.zk-new .zk-project .tab-content .form-group.row.justify-content-center { justify-content: flex-start !important; }
body.zk-new .zk-project .tab-content p.div-text-vert-center {
  position: static; transform: none; top: auto; margin: 0; padding: 5px 0 0; font-size: 13px;
}

/* подсветки старого вида в карточке проекта — в спокойные токены */
body.zk-new .doc-to-be-approved { background-color: var(--zk-warn-bg) !important; color: var(--zk-warn); font-style: normal; }
body.zk-new .doc-to-del { background-color: var(--zk-err-bg) !important; color: var(--zk-err); font-style: normal; }
body.zk-new .rem-res-to-be-approved-manager,
body.zk-new .rem-res-to-be-approved-expert,
body.zk-new .rem-res-to-be-approved-customer {
  background-color: var(--zk-warn-bg) !important; font-style: normal;
  border-radius: var(--zk-radius); padding: 2px 6px;
}
body.zk-new .no-doc_bound { background-color: var(--zk-err) !important; color: #fff; border-radius: 4px; padding: 0 4px; }
body.zk-new .parent-div { color: var(--zk-ink); font-style: normal; font-weight: 600; }
body.zk-new .bgc-div-review-1 { background-color: var(--zk-info-bg) !important; }
body.zk-new .bgc-div-review-2 { background-color: var(--zk-ok-bg) !important; }
body.zk-new .bgc-div-review-3 { background-color: var(--zk-ok-bg) !important; }
body.zk-new .bgc-div-review-4 { background-color: var(--zk-warn-bg) !important; }
body.zk-new .bgc-div-review-5 { background-color: var(--zk-warn-bg) !important; }
/* 9.11 переписка «замечание ↔ ответ» — пузырьки, как в чате.
   Классы старые (remark-content*, response-content*), перекрашены на месте:
   замечание эксперта слева, ответ заявителя справа, черновик — пунктиром,
   утверждённое — плотным фоном. Ядовитая зелёная рамка #48ff00 убрана. */
body.zk-new .remark-body {
  border: 0 !important; border-radius: 0;
  border-left: 2px solid var(--zk-line) !important;
  margin-left: 12px; padding-left: 6px;
}
body.zk-new .remark-content,
body.zk-new .remark-content-draft,
body.zk-new .remark-content-approved,
body.zk-new .response-content,
body.zk-new .response-content-draft,
body.zk-new .response-content-approved {
  opacity: 1; border-radius: 12px; border-width: 1px; border-style: solid;
  padding: 10px 12px !important; font-size: 13px; line-height: 1.45;
  box-shadow: 0 1px 2px rgba(31, 41, 51, .05);
  max-width: 100%;
}
body.zk-new .remark-content,
body.zk-new .remark-content-draft,
body.zk-new .remark-content-approved {
  background: var(--zk-surface) !important; border-color: var(--zk-line-strong) !important;
  border-bottom-left-radius: 4px;
}
body.zk-new .response-content,
body.zk-new .response-content-draft,
body.zk-new .response-content-approved {
  background: var(--zk-info-bg) !important; border-color: var(--zk-info-line) !important;
  border-bottom-right-radius: 4px;
}
body.zk-new .remark-content-draft,
body.zk-new .response-content-draft { border-style: dashed !important; }
body.zk-new .remark-content-approved { background: var(--zk-surface-2) !important; }
body.zk-new .response-content-approved { background: #dbe9f8 !important; }
body.zk-new .remark-content .form-text,
body.zk-new .remark-content-draft .form-text,
body.zk-new .remark-content-approved .form-text,
body.zk-new .response-content .form-text,
body.zk-new .response-content-draft .form-text,
body.zk-new .response-content-approved .form-text { font-size: 11px; color: var(--zk-muted); margin-top: 4px; }
body.zk-new .remark-header-done { background: var(--zk-ok-bg) !important; border-radius: var(--zk-radius); padding: 2px 6px; }
body.zk-new .remark-header-heatmap,
body.zk-new .remark-header-heatmap-done { background: var(--zk-surface-2) !important; border-radius: var(--zk-radius); }
html[data-theme="dark"] body.zk-new .response-content-approved { background: #22303f !important; }

/* заголовок раздела в «Замечаниях» — карточка с полосой слева */
body.zk-new .remark-div-header {
  background: var(--zk-surface) !important;
  margin: 12px 0 0 !important; padding: 8px 10px;
  background: var(--zk-surface); border: 1px solid var(--zk-line);
  border-left: 3px solid var(--zk-ink); border-radius: var(--zk-radius-lg);
}
body.zk-new .remark-div-header > [class*="col-"] { padding: 0; }
body.zk-new .remark-div-header h6 { margin: 0; font-size: 13.5px; }

/* 9.12 тёмная тема: на тёмном фоне фирменный синий становится светлым, поэтому текст
   на «синих» элементах (активная вкладка, главная кнопка, страница пагинации) делаем тёмным —
   иначе белое по светло-голубому не читается */
html[data-theme="dark"] body.zk-new .nav-pills .nav-link.active,
html[data-theme="dark"] body.zk-new .btn-primary,
html[data-theme="dark"] body.zk-new .btn-primary:hover,
html[data-theme="dark"] body.zk-new .page-item.active .page-link,
html[data-theme="dark"] body.zk-new .zk-switch button[aria-pressed="true"] { color: #14181d; }
html[data-theme="dark"] body.zk-new .nav-link.active .zk-tabcnt-n { background: rgba(0, 0, 0, .28); color: #14181d; }
html[data-theme="dark"] body.zk-new .nav-link.active .zk-tabcnt { background: #14181d; color: var(--zk-err); }

/* ---------------------------------------------------- 8. телефон и печать */
@media (max-width: 767.98px) {
  body.zk-new .zk-toolbar {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto;
    margin: 0; border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0;
    box-shadow: var(--zk-shadow-up); overflow-x: auto; flex-wrap: nowrap;
    padding: 6px 8px;
  }
  body.zk-new .zk-toolbar .zk-status { margin-left: 8px !important; }
  body.zk-new .tab-content { padding-bottom: 76px; }
  /* метка над полем */
  body.zk-new .tab-content .form-group.row > [class*="col-md-"] > p.div-text-vert-center {
    padding: 0 0 2px; font-size: 12px; color: var(--zk-muted);
  }
  body.zk-new .right-bottom-float { bottom: 62px; }
  body.zk-new .zk-toast-box { right: 8px; left: 8px; bottom: 64px; max-width: none; }
  body.zk-new .zk-switch-fixed { bottom: 118px; }
}
@media print {
  body.zk-new .zk-toolbar, body.zk-new .zk-minimap, body.zk-new .zk-toast-box,
  body.zk-new .zk-switch, body.zk-new .right-bottom-float, body.zk-new .telegram,
  body.zk-new .zk-actionbar, body.zk-new .site-header, body.zk-new .footer,
  body.zk-new .bottom-float, body.zk-new .zk-secdd,
  body.zk-new .nav-pills .nav-link:not(.active) { display: none !important; }
  body.zk-new { background: #fff !important; }
  body.zk-new .zk-page { max-width: none; }
  body.zk-new .card, body.zk-new .content-section { border: 0 !important; box-shadow: none !important; }
  body.zk-new .zk-ptable.table-responsive,
  body.zk-new .table-responsive { max-height: none !important; overflow: visible !important; border: 0 !important; }
  body.zk-new .zk-ptable.table thead th,
  body.zk-new .zk-dtable.table thead th { position: static !important; }
  body.zk-new main[role="main"] { padding-left: 0 !important; padding-top: 0 !important; }
  body.zk-new a[href]::after { content: ""; }
}

/* =================================================================================================
   Ввод даты с клавиатуры — компонент <zk-date> (26.09.2026, zakl-date-1-00.js).
   Работает в ОБОИХ обликах, поэтому основные правила без body.zk-new; ниже — доводка нового вида.
   ================================================================================================= */
.zk-date { position: relative; }
.zk-date .input-group { flex-wrap: nowrap; }
.zk-date__inp { min-width: 7.5em; }
.zk-date__inp::placeholder { color: #adb5bd; }
.zk-date__btns { flex: 0 0 auto; }
.zk-date__clear {
  border: 1px solid #ced4da;
  border-left: 0;
  background: #fff;
  color: #868e96;
  font-size: 1.1rem;
  line-height: 1;
  padding: 0 .45rem;
  border-radius: 0;
}
.zk-date__clear:hover { color: #dc3545; background: #f8f9fa; }
.zk-date__cal .btn { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.zk-date--err .zk-date__inp { border-color: #dc3545; }
.zk-date--err .zk-date__clear { border-color: #dc3545; }
.zk-date__msg { color: #dc3545; font-size: .8rem; line-height: 1.15; margin-top: 2px; }
.zk-date__raw { color: #856404; background: #fff8e1; border: 1px solid #ffe8a1;
  border-radius: 3px; font-size: .78rem; line-height: 1.2; margin-top: 2px; padding: 2px 5px; }
.zk-date--disabled .zk-date__clear { display: none; }
/* поле в таблице «Слежение»: подсветка срока приходит классом на сам input (input-class) */
.zk-date--sm .zk-date__clear { font-size: 1rem; padding: 0 .35rem; }
/* b-form-datepicker в режиме button-only не должен растягивать строку таблицы */
.zk-date .b-form-datepicker.btn-group { align-self: stretch; }
.zk-date .b-form-datepicker .dropdown-menu { z-index: 1060; }

body.zk-new .zk-date__clear {
  border-color: var(--zk-border, #d7dce3);
  background: var(--zk-surface, #fff);
  border-radius: 0;
}
body.zk-new .zk-date__msg { color: var(--zk-danger, #d64545); font-size: .78rem; }
body.zk-new .zk-field .zk-date { width: 100%; }
@media print {
  .zk-date__btns, .zk-date__msg { display: none !important; }
  .zk-date__inp { border: 0 !important; padding-left: 0 !important; }
}

/* ───────────────────────── страница «Пользователи» (26.09.2026) ─────────────────────────
   Новый облик: липкая строка фильтров, отключённые учётки бледнее, щелчок по шапке сортирует.
   Старый облик страницу видит как обычную таблицу bootstrap — правил вне body.zk-new нет. */
body.zk-new .zk-page-users { max-width: var(--zk-page-max, 1760px); margin: 0 auto; }
body.zk-new .zk-page-users h5 { font-weight: 700; letter-spacing: -.01em; }
body.zk-new .zk-page-users .zk-filterbar {
  position: sticky;
  top: var(--zk-nav-h, 56px);
  z-index: 3;
  background: var(--zk-surface, #fff);
  border: 1px solid var(--zk-border, #d7dce3);
  border-radius: var(--zk-radius, 8px);
  padding: 8px 8px 0;
  margin: 0 0 10px;
}
body.zk-new .zk-page-users .zk-ptable thead th { cursor: pointer; user-select: none; }
body.zk-new .zk-page-users .zk-ptable thead th:hover { color: var(--zk-accent, #2f6fd0); }
body.zk-new .zk-page-users tbody tr.zk-off > td { opacity: .65; }
body.zk-new .zk-page-users .badge { font-weight: 600; }
body.zk-new .zk-page-users .custom-checkbox { margin: 0; min-height: 0; }