/* =======================================================================
   БАЗА + ПЕРЕМЕННЫЕ
======================================================================= */
:root{
  /* размеры */
  --header-h: 56px;
  --subbar-h: 0px;
  --sidebar-w: 250px;

  /* палитра (светлая) */
  --color-bg-body: #f8f9fa;
  --color-bg-header: #ffffff;
  --color-bg-sidebar: #ffffff;
  --color-bg-panel: #ffffff;
  --color-footer-bg: #f8f9fa;

  --color-text: #212529;
  --color-text-muted: #6c757d;
  --color-link: #0d6efd;

  --color-border: #dee2e6;
  --color-shadow: rgba(0,0,0,0.05);
  --color-shadow-2: rgba(0,0,0,0.12);
  --color-hover-bg: #f5f5f5;

  --color-alert-bg: #212529;
  --color-alert-text: #ffffff;

  --color-cookie-bg: #212529;
  --color-cookie-link: #0dcaf0;

  --color-disabled: #adb5bd;

  /* брендовые */
  --color-primary: #0d6efd;
  --color-success: #198754;
  --color-danger: #dc3545;
  --color-warning: #ffc107;
  --color-info: #0dcaf0;

  /* мобильная кнопка-меню */
  --color-menu-btn-bg: rgba(0,162,255,0.15);
  --color-menu-btn-border: rgba(0,162,255,0.5);
  --color-menu-btn-text: #007bff;

  /* всплывающая подсказка (← Навигация) */
  --color-hint-bg: rgba(255,87,51,0.7);

  /* Offcanvas */
  --color-offcanvas-bg: var(--color-bg-sidebar);
  --color-offcanvas-text: var(--color-text);
  --color-offcanvas-border: var(--color-border);
  --color-offcanvas-hover: var(--color-hover-bg);

  /* Tabs */
  --color-tab-bg: var(--color-bg-panel);
  --color-tab-active-bg: rgba(102,178,255,0.5);
  --color-tab-text: var(--color-text);
  --color-tab-active-text: var(--color-text);
  --color-tab-border: var(--color-border);

  /* Breadcrumb */
  --color-breadcrumb-bg: #dee2e6;
  --color-breadcrumb-text: var(--color-text);
  --color-breadcrumb-link: var(--color-link);
  --color-breadcrumb-divider: #6c757d;
}

/* =======================================================================
   ТЁМНАЯ ТЕМА
======================================================================= */
[data-theme="dark"]{
  --color-bg-body: #1e1f22;
  --color-bg-header: #24262a;
  --color-bg-sidebar: #1f2124;
  --color-bg-panel: #222428;
  --color-footer-bg: #1f2124;

  --color-text: #e8eaed;
  --color-text-muted: #a6a8ad;

  --color-border: #2f3338;
  --color-hover-bg: #2a2d32;
  --color-link: #66b2ff;

  --color-cookie-bg: #111214;
  --color-cookie-link: #7ad8ff;

  --color-shadow: rgba(0,0,0,0.4);
  --color-shadow-2: rgba(0,0,0,0.5);

  --color-menu-btn-bg: rgba(102,178,255,0.15);
  --color-menu-btn-border: rgba(102,178,255,0.5);
  --color-menu-btn-text: #66b2ff;

  --color-hint-bg: rgba(255,115,80,0.7);

  /* Tabs */
  --color-tab-bg: #24262a;
  --color-tab-active-bg: var(--color-menu-btn-border);
  --color-tab-text: var(--color-text);
  --color-tab-active-text: var(--color-text);
  --color-tab-border: var(--color-border);

  /* Breadcrumb */
  --color-breadcrumb-bg: #2a2d32;
  --color-breadcrumb-text: var(--color-text);
  --color-breadcrumb-link: #66b2ff;
  --color-breadcrumb-divider: #a6a8ad;
}

/* =======================================================================
   БАЗОВЫЕ СБРОСЫ/РАЗМЕТКА
======================================================================= */
html, body{
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  color: var(--color-text);
  background: var(--color-bg-body);
}

/* общий скролл отключаем, скроллится правая часть (десктоп) */
body{
  height: 100vh;
  overflow: hidden;
}

main{ padding-top: 0; }
footer{ background-color: var(--color-footer-bg); }

.highlight-link{
  font-weight: 600;
  color: var(--color-link) !important;
  text-decoration: underline;
}

/* =======================================================================
   ХЕДЕР + SUBBAR
======================================================================= */
header{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1020;
  background: var(--color-bg-header);
  color: var(--color-text);
  border-bottom: 1px solid var(--color-border);
  box-shadow: 0 2px 4px var(--color-shadow);
  height: var(--header-h);
  padding: .5rem .75rem;
}

.subbar{
  position: sticky;
  top: var(--header-h);
  z-index: 1015;
  background: var(--color-bg-header);
  border-bottom: 1px solid var(--color-border);
  padding: .5rem .75rem;
}

/* шапка: внутренний флекс */
.topbar{
  display: flex; align-items: center; justify-content: space-between;
  gap: .5rem; min-width: 0;
}
.topbar .brand{ display: flex; align-items: center; gap: .5rem; min-width: 0; flex: 1 1 auto; }
.brand-logo{ height: 32px; }
.topbar .title{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--color-text); }
.topbar .logout{ flex: 0 0 auto; }
.topbar .logout .btn{ flex-shrink: 0; }

/* кнопка с подсказкой */
.btn-hint{
  background-color: var(--color-menu-btn-bg);
  border: 1px solid var(--color-menu-btn-border);
  color: var(--color-menu-btn-text);
}
.btn-hint:hover{ background-color: rgba(0,162,255,0.25); color: #0056b3; }
#menuHint{
  background-color: var(--color-hint-bg);
  color: #fff; border-radius: .4rem; box-shadow: 0 4px 14px var(--color-shadow-2);
}

/* =======================================================================
   САЙДБАР (фикс) + МЕНЮ
======================================================================= */
#sidebar{
  position: fixed;
  top: calc(var(--header-h) + var(--subbar-h));
  left: 0;
  width: var(--sidebar-w);
  height: calc(100vh - (var(--header-h) + var(--subbar-h)));
  overflow-y: auto;
  background: var(--color-bg-sidebar);
  color: var(--color-text);
  border-right: 1px solid var(--color-border);
  z-index: 1010;
}
#sidebar .nav-link{ color: var(--color-text) !important; }
#sidebar .nav-link:hover{ background: var(--color-hover-bg); border-radius: .375rem; }
#sidebar .border-bottom{ border-bottom: 1px solid var(--color-border) !important; }

/* Bootstrap modal overlay must cover fixed header/sidebar. */
.modal-backdrop{
  position: fixed;
  inset: 0;
  z-index: 1040;
}
.modal{
  z-index: 1050;
}

/* если где-то используешь #sidebarMenu (моб. offcanvas-замена) */
#sidebarMenu{ width: var(--sidebar-w); }

/* пункты меню: ховер/disabled */
.nav-item.hover-bg:hover{ background-color: var(--color-bg-body); border-radius: .375rem; cursor: pointer; }
.nav-item.disabled .nav-link{ pointer-events: none; color: var(--color-disabled) !important; opacity: .6; }
.nav-item.disabled:hover{ background-color: transparent; }

/* =======================================================================
   ОСНОВНАЯ ПРАВАЯ ПАНЕЛЬ (скроллится только она)
======================================================================= */
#mainContent{
  position: fixed;
  top: calc(var(--header-h) + var(--subbar-h));
  left: var(--sidebar-w);
  width: calc(100vw - var(--sidebar-w));
  bottom: 0;
  overflow: auto;
  overflow-x: hidden;
  padding: 0;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  background: var(--color-bg-panel);
}

/* внутренности панели */
.panel-content{ flex: 1 1 auto; min-height: 0; padding: 1rem; }
.panel-footer{
  flex: 0 0 auto;
  border-top: 1px solid var(--color-border);
  background: var(--color-footer-bg);
  padding: .75rem 1rem; color: var(--color-text);
}

/* широкие дети */
#mainContent table{ max-width: 100%; }
#mainContent .text-wrap{ overflow-wrap: anywhere; }

/* =======================================================================
   FLASH / COOKIE
======================================================================= */
#flash-msg{
  position: fixed; top: 20px; left: 50%; transform: translateX(-50%);
  z-index: 1080; width: min(90vw, 640px);
  pointer-events: none;
}
#flash-msg .alert{
  pointer-events: auto; text-align: center; margin-bottom: 8px;
  box-shadow: 0 8px 24px var(--color-shadow-2);
}

#cookie-consent{
  display: none; position: fixed; bottom: 1rem; left: 1rem; right: 1rem;
  z-index: 9999; max-width: 600px; margin: auto; padding: 1rem;
  box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
  border-radius: .375rem;
  background-color: var(--color-cookie-bg);
  color: var(--color-alert-text);
}
#cookie-consent a{ color: var(--color-cookie-link); }
#cookie-consent .btn{ color: var(--color-text); background-color: var(--color-bg-body); border: none; }
.cookie-banner{ font-size: 14px; background-color: var(--color-bg-body); border:1px solid var(--color-border); border-radius:.375rem; }
.cookie-banner .highlight-link{ color: var(--color-link); font-weight: 600; text-decoration: underline; }

/* очистка файла загрузки */
.clearable{ position: relative; }
.clearable input{ padding-right: 2.2rem; }
.clearable .clear-btn{
  position: absolute; top: 50%; right: .6rem; transform: translateY(-50%);
  border: none; background: transparent; font-size: 1.2rem; line-height: 1;
  color: #999; cursor: pointer;
}

/* =======================================================================
   СПИСКИ/ТАБЛИЦЫ (адаптивные карточки)
======================================================================= */
.responsive-table{ width: 100%; box-sizing: border-box; margin-bottom: 1.5rem; }
.table-header{ font-weight: 600; border-bottom: 2px solid var(--color-border); padding: 0.75rem 0; }
.table-header .cell{ flex: 1 1 0; padding: 0 0.5rem; }

.rows-container{ display: flex; flex-wrap: wrap; gap: 0.5rem; box-sizing: border-box; }
.row-content{
  box-sizing: border-box; border-bottom: 1px solid var(--color-border);
  padding: 10px; display: flex; flex-direction: column;
  flex: 0 0 100%; max-width: 100%;
  cursor: pointer; transition: background-color .2s ease;
  background: var(--color-bg-panel);
}
.row-content:hover{ background-color: var(--color-hover-bg); }
.row-content .cell{ padding: .25rem .5rem; flex: 1 1 0; align-items: flex-start; }

.row-link{ display: block; color: inherit; transition: background-color .2s ease; }
.row-link:hover{ background-color: var(--color-hover-bg); cursor: pointer; }

.table td, .table th{ padding: .4rem .6rem; }

/* =======================================================================
   ТАБЫ (универсальные) + ТАБЫ АКТОВ
======================================================================= */
.nav-tabs{
  border-bottom: 1px solid var(--color-tab-border) !important;
}
.nav-tabs .nav-link{
  color: var(--color-tab-text) !important;
  background: var(--color-tab-bg) !important;
  border: 1px solid var(--color-tab-border) !important;
  border-bottom-color: transparent !important;
  margin-right: .25rem;
}
.nav-tabs .nav-link:hover{
  background: var(--color-hover-bg) !important;
  color: var(--color-tab-active-text) !important;
}
.nav-tabs .nav-link.active{
  color: var(--color-tab-active-text) !important;
  background: var(--color-tab-active-bg) !important;
  border-color: var(--color-tab-border) !important;
  border-bottom-color: var(--color-tab-active-bg) !important;
}
.tab-content{
  background: var(--color-bg-panel);
  color: var(--color-text);
  border: 1px solid var(--color-tab-border);
  border-top: none;
  border-radius: 0 0 .375rem .375rem;
  padding: 1rem;
}
/* склейка конкретно для вкладок актов */
#actTabs.nav-tabs{ border-bottom: 1px solid var(--color-border); margin-bottom: 0 !important; }
#actTabs .nav-link{
  color: var(--color-text); background: var(--color-bg-panel);
  border: 1px solid transparent; border-radius: .375rem .375rem 0 0; margin-bottom: -1px;
}
#actTabs .nav-link:hover{ background: var(--color-hover-bg); border-color: var(--color-border) var(--color-border) transparent; }
#actTabs .nav-link.active,
#actTabs .nav-item.show .nav-link{
  color: var(--color-text); background: var(--color-bg-panel);
  border-color: var(--color-border) var(--color-border) transparent;
}
#actTabContent.tab-content{
  background: var(--color-bg-panel);
  border: 1px solid var(--color-border);
  border-top: none;
  border-radius: 0 0 .375rem .375rem;
  padding: 1rem;
}

/* =======================================================================
   BREADCRUMB (крошки)
======================================================================= */
.crumbs{
  background: var(--color-breadcrumb-bg);
  color: var(--color-breadcrumb-text);
  border: 1px solid var(--color-border);
  border-radius: .375rem;
}
.crumbs .breadcrumb{ margin: 0; }
.crumbs .breadcrumb .breadcrumb-item a{ color: var(--color-breadcrumb-link); }
.crumbs .breadcrumb .breadcrumb-item + .breadcrumb-item::before{ color: var(--color-breadcrumb-divider); }

/* альтернативный контейнер-крошки */
.breadcrumb-container{
  background-color: var(--color-breadcrumb-bg);
  color: var(--color-breadcrumb-text);
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  margin-bottom: 1rem;
}
.breadcrumb-container .breadcrumb-item a{ color: var(--color-breadcrumb-link); text-decoration: none; }
.breadcrumb-container .breadcrumb-item a:hover{ text-decoration: underline; }
.breadcrumb-container .breadcrumb-item.active{ color: var(--color-breadcrumb-text); }
.breadcrumb-item + .breadcrumb-item::before{ color: var(--color-breadcrumb-divider) !important; }

/* =======================================================================
   ТАБЛИЦЫ (привязка к палитре)
======================================================================= */
.table,
.table-responsive{
  background: var(--color-bg-panel) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}
.table thead{
  background: var(--color-bg-header) !important;
  color: var(--color-text) !important;
  border-bottom: 1px solid var(--color-border) !important;
}
.table-bordered th, .table-bordered td{ border-color: var(--color-border) !important; }
.table-hover tbody tr:hover{ background-color: var(--color-hover-bg) !important; }

/* через BS-переменные */
.table{
  --bs-table-bg: var(--color-bg-panel) !important;
  --bs-table-color: var(--color-text) !important;
  --bs-table-border-color: var(--color-border) !important;
  --bs-table-striped-bg: var(--color-hover-bg) !important;
  --bs-table-hover-bg: var(--color-hover-bg) !important;
  --bs-table-striped-color: var(--color-text) !important;
  --bs-table-hover-color: var(--color-text) !important;
}
.table-responsive{
  border: 1px solid var(--color-border);
  border-radius: .375rem;
}
.table > :not(caption) > * > *{
  background-color: var(--bs-table-bg) !important;
  color: var(--bs-table-color) !important;
  border-color: var(--bs-table-border-color) !important;
}

/* =======================================================================
   ALERTS
======================================================================= */
.alert{
  background-color: var(--color-bg-panel) !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: 0 4px 14px var(--color-shadow);
}

.alert-warning { background-color: color-mix(in srgb, var(--color-warning) 20%, white) !important; }
.alert-danger  { background-color: color-mix(in srgb, var(--color-danger) 20%, white) !important; }
.alert-info    { background-color: color-mix(in srgb, var(--color-info) 20%, white) !important; }
.alert-success { background-color: color-mix(in srgb, var(--color-success) 20%, white) !important; }

[data-theme="dark"] .alert-warning { background-color: color-mix(in srgb, var(--color-warning) 40%, black) !important; }
[data-theme="dark"] .alert-danger  { background-color: color-mix(in srgb, var(--color-danger) 40%, black) !important; }
[data-theme="dark"] .alert-info    { background-color: color-mix(in srgb, var(--color-info) 40%, black) !important; }
[data-theme="dark"] .alert-success { background-color: color-mix(in srgb, var(--color-success) 40%, black) !important; }

/* иконки внутри alert */
.alert i{ color: var(--color-warning); }
[data-theme="dark"] .alert i{ color: var(--color-info); }

/* =======================================================================
   КАРТОЧКИ
======================================================================= */
.card{
  background-color: var(--color-bg-panel);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  box-shadow: 0 4px 12px var(--color-shadow);
}
.card-body{ background-color: #f1f3f5; }
[data-theme="dark"] .card-body{ background-color: #2a2d32; color: var(--color-text); }

/* бейдж «светлый» — не выбиваться в тёмной */
.badge.bg-light.text-dark{
  background-color: var(--color-hover-bg) !important;
  color: var(--color-text) !important;
}

/* =======================================================================
   ФОРМЫ / КНОПКИ
======================================================================= */
.form-select,
.form-control{
  background-color: #f3f4f6;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  transition: background-color .2s, border-color .2s;
}
.form-select:focus,
.form-control:focus{
  background-color: #fff;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, .25);
  color: var(--color-text);
}
.btn-primary{
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn-primary:hover{ background-color: #0b5ed7; border-color: #0a58ca; }

/* тёмная тема форм */
[data-theme="dark"] .form-select,
[data-theme="dark"] .form-control{
  background-color: #2a2d32;
  color: var(--color-text);
  border-color: var(--color-border);
  color-scheme: dark;
}
[data-theme="dark"] .form-select:focus,
[data-theme="dark"] .form-control:focus{
  background-color: #1f2124;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 0.15rem rgba(102,178,255,.25);
  color: var(--color-text);
}
[data-theme="dark"] .btn-primary:hover{
  background-color: #1b6ef3; border-color: #1b6ef3;
}
[data-theme="dark"] select option,
[data-theme="dark"] select optgroup {
  background-color: #1f2124;
  color: #e8eaed;
}

/* Единый стиль плейсхолдеров */
input::placeholder,
textarea::placeholder {
  color: var(--color-text-muted) !important;
  opacity: 1; /* Safari/Firefox по умолчанию бледнят */
}

/* Тёмная тема: используем тёмный-muted из переменных */
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--color-text-muted) !important;
  opacity: 1;
}

/* (Опционально) старые Edge/IE — если вдруг нужно */
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: var(--color-text-muted) !important;
}
input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: var(--color-text-muted) !important;
}

/* =======================================================================
   УТИЛИТЫ / ХАКИ
======================================================================= */
.bg-light { background-color: var(--color-bg-panel) !important; }
.bg-panel { background: var(--color-bg-panel) !important; }

[data-theme="dark"] body,
[data-theme="dark"] #mainContent {
  background: var(--color-bg-body) !important;
  color: var(--color-text) !important;
}
[data-theme="dark"] .text-dark { color: var(--color-text) !important; }
[data-theme="dark"] .text-muted { color: var(--color-text-muted) !important; }
[data-theme="dark"] .bg-white,
[data-theme="dark"] .bg-light {
  background-color: var(--color-bg-panel) !important;
}
[data-theme="dark"] .border,
[data-theme="dark"] .border-top,
[data-theme="dark"] .border-bottom,
[data-theme="dark"] .border-start,
[data-theme="dark"] .border-end {
  border-color: var(--color-border) !important;
}
[data-theme="dark"] .btn-outline-secondary {
  color: #cbd5e1;
  border-color: #475569;
}
[data-theme="dark"] .btn-outline-secondary:hover,
[data-theme="dark"] .btn-outline-secondary:focus {
  color: #f8fafc;
  background-color: #334155;
  border-color: #64748b;
}
[data-theme="dark"] .btn-outline-primary {
  color: #93c5fd;
  border-color: #2563eb;
}
[data-theme="dark"] .btn-outline-primary:hover,
[data-theme="dark"] .btn-outline-primary:focus {
  color: #ffffff;
  background-color: #2563eb;
  border-color: #3b82f6;
}
[data-theme="dark"] .btn-outline-success {
  color: #86efac;
  border-color: #16a34a;
}
[data-theme="dark"] .btn-outline-success:hover,
[data-theme="dark"] .btn-outline-success:focus {
  color: #ffffff;
  background-color: #15803d;
  border-color: #22c55e;
}
[data-theme="dark"] .card-header,
[data-theme="dark"] .card-footer {
  background-color: #24262a;
  border-color: var(--color-border);
  color: var(--color-text);
}

/* не даём Bootstrap добавлять padding-right при модалке */
body.modal-open{ padding-right: 0 !important; }

/* ДЕСKTOP: оверлей фиксирован к вьюпорту, ровно по области правой панели */
#mainContent.panel-dim::after{
  content: "";
  position: fixed;
  top: var(--header-h);
  left: var(--sidebar-w);
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,.22);
  z-index: 1049; /* ниже модалки (1050+) */
}
[data-theme="dark"] #mainContent.panel-dim::after{ background: rgba(0,0,0,.32); }

/* МОБИЛЬНЫЙ: как у тебя уже было — фикс по вьюпорту под хедером */
@media (min-width: 768px) and (max-width: 1199.98px){
  #sidebar{ display: none !important; }
  #menuHintBtn{ display: block !important; }

  #mainContent{
    left: 0;
    width: 100vw;
    flex: 0 0 100% !important;
  }

  #mainContent.panel-dim::after{ left: 0; }

  .offcanvas{
    background: var(--color-offcanvas-bg) !important;
    color: var(--color-offcanvas-text) !important;
    border-right: 1px solid var(--color-offcanvas-border);
  }
  .offcanvas .offcanvas-header{ border-bottom: 1px solid var(--color-offcanvas-border); }
  .offcanvas .offcanvas-title{ color: var(--color-offcanvas-text); }
  .offcanvas .btn-close{ filter: invert(0); }
  [data-theme="dark"] .offcanvas .btn-close{ filter: invert(1); }
  .offcanvas .nav-link{ color: var(--color-offcanvas-text) !important; }
  .offcanvas .nav-link:hover,
  .offcanvas .hover-bg:hover{
    background: var(--color-offcanvas-hover); border-radius: .375rem;
  }
  .offcanvas .border-bottom{ border-bottom: 1px solid var(--color-offcanvas-border) !important; }
}

@media (max-width: 767.98px){
  #mainContent.panel-dim{ position: static; } /* на всякий */
  #mainContent.panel-dim::after{
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    bottom: 0;
  }
}

/* =======================================================================
   АДАПТИВ
======================================================================= */

/* Десктопные дополнения */
@media (min-width: 768px){
  .row-top{ display: flex; flex-wrap: wrap; align-items: center; }
}

/* Мобильная версия */
@media (max-width: 767.98px){

  /* общий скролл возвращаем, правая панель — обычный поток */
  body{ overflow: auto; }
  #sidebar{ display: none; }

  #mainContent{
    position: static; width: 100%; height: auto; overflow: visible;
    flex: 0 0 100% !important;
  }
  #actTabContent.tab-content{ padding: .75rem; }
  .panel-content{ padding: .75rem; }

  /* карточная подача строк */
  .table-header{ display: none; }
  .rows-container{ gap: .5rem; }
  .row-content{
    border: 1px solid var(--color-border);
    border-radius: .375rem;
    padding: .75rem 1rem; flex: 0 0 100%; max-width: 100%;
  }
  .row-content .cell{
    padding: .25rem 0; position: relative; flex: none; width: 100%;
  }
  .row-content .cell::before{
    content: attr(data-label); font-weight: 600; display: block;
    margin-bottom: .25rem; color: var(--color-text-muted);
  }
  .row-content .cell.d-flex{ display: flex !important; gap: .5rem; }
  .cell-row{ display: flex; gap: 1rem; width: 100%; }
  .cell-row .cell{ flex: 1 1 0; padding: .25rem .5rem; align-items: flex-start; }
  .cell-row.divider-top{ border-top: 1px solid var(--color-border); padding-top: .75rem; margin-top: .75rem; }

  /* хотфикс для .flex-nowrap */
  .d-flex.flex-nowrap{ flex-wrap: wrap !important; }

  /* мобильные кнопки «Скачать/Загрузить» */
  .cell.upload-buttons{ flex-direction: column !important; align-items: flex-start !important; }
  .cell.upload-buttons::before{ display: block !important; margin-bottom: .25rem !important; }
  .cell.upload-buttons .btn{ width: 100%; text-align: center; }

  /* Offcanvas (мобильное меню) */
  .offcanvas{
    background: var(--color-offcanvas-bg) !important;
    color: var(--color-offcanvas-text) !important;
    border-right: 1px solid var(--color-offcanvas-border);
  }
  .offcanvas .offcanvas-header{ border-bottom: 1px solid var(--color-offcanvas-border); }
  .offcanvas .offcanvas-title{ color: var(--color-offcanvas-text); }
  .offcanvas .btn-close{ filter: invert(0); }
  [data-theme="dark"] .offcanvas .btn-close{ filter: invert(1); }
  .offcanvas .nav-link{ color: var(--color-offcanvas-text) !important; }
  .offcanvas .nav-link:hover,
  .offcanvas .hover-bg:hover{
    background: var(--color-offcanvas-hover); border-radius: .375rem;
  }
  .offcanvas .border-bottom{ border-bottom: 1px solid var(--color-offcanvas-border) !important; }

  /* sidebarMenu как выезжающее меню */
  #sidebarMenu{
    position: fixed; top: 0; left: 0;
    transform: translateX(-100%);
    background: var(--color-bg-sidebar);
    box-shadow: 2px 0 5px rgba(0,0,0,.1);
  }
  #sidebarMenu.active{ transform: translateX(0); }

  /* затемнение панели — рисуем оверлей поверх вьюпорта */
  #mainContent.panel-dim{ position: static; }
  #mainContent.panel-dim::after{
    position: fixed; top: var(--header-h); left: 0; right: 0; bottom: 0;
  }
}

/* второй уровень меню */
.submenu .nav-link {
  font-size: .95rem;
  padding-top: .25rem;
  padding-bottom: .25rem;
}

/* стрелка-каретка и вращение при раскрытии */
.submenu-toggle .caret {
  transition: transform .2s ease;
}
.submenu.show + .submenu-toggle .caret,          /* случай, если меняешь порядок */
.submenu-toggle[aria-expanded="true"] .caret {   /* основной случай */
  transform: rotate(90deg);
}

/* активный пункт */
.nav .nav-link.active {
  font-weight: 600;
  text-decoration: none;
  background: var(--color-offcanvas-hover);
  border-radius: .375rem;
}

/* тёмная тема — цвета подуровня */
[data-theme="dark"] .submenu .nav-link {
  color: var(--color-text) !important;
}

/* Гармошка */
.tax-accordion-toggle[aria-expanded="true"] .chevron {
  transform: rotate(180deg);
}
.tax-accordion-toggle .chevron {
  transition: transform .2s ease;
}

/* Flash поверх всего UI, не внутри локальных стэкинг-контекстов */
#flash-msg{
  position: fixed !important;
  top: calc(var(--header-h) + 12px) !important; /* чтобы не прятался под header */
  left: 50% !important;
  transform: translateX(-50%) !important;

  /* выше модалки (1055), поповеров (1070), тултипов (1080), тостов (1090), оффканваса (1045) */
  z-index: 2000 !important;

  width: min(90vw, 640px);
  pointer-events: none;
}
#flash-msg .alert{
  pointer-events: auto;
  margin-bottom: 8px;
  box-shadow: 0 8px 24px var(--color-shadow-2);
}

/* === Липкий заголовок таблицы === */
/* контейнер таблицы должен иметь overflow */
#tickets-list-table .table-responsive {
  max-height: calc(100vh - 200px); /* можно менять, если нужно */
  overflow-y: auto;
}

#tickets-list-table thead {
  position: sticky;
  top: 0;
  z-index: 20;
}

#tickets-list-table thead th {
  background-color: var(--bs-table-bg, #eaf4ff) !important;
  box-shadow: 0 2px 3px rgba(0,0,0,0.1); /* легкая тень — приятнее выглядит */
}

/* 🔹 Лёгкий синий hover для кнопки плана работ */
.ticket-plan-cell .btn.btn-outline-secondary:hover {
  background-color: #e8f1ff !important; /* светло-синий */
  border-color: #b5d1ff !important;
  color: #0d2a6b !important; /* тёмно-синий текст */
}

/* Чтобы текст внутри кнопки тоже оставался тёмным */
.ticket-plan-cell .btn.btn-outline-secondary:hover span,
.ticket-plan-cell .btn.btn-outline-secondary:hover small,
.ticket-plan-cell .btn.btn-outline-secondary:hover i {
  color: #0d2a6b !important;
}