/* Furnitage — mobile-first поверх Bootstrap 5 */

body { -webkit-tap-highlight-color: transparent; }

:root { --topbar-h: 54px; --side-w: 62px; --side-w-open: 236px; }

/* ── Верхняя панель: логотип слева + бургер (моб.) ── */
.topbar {
  position: sticky; top: 0; z-index: 1040; height: var(--topbar-h);
  display: flex; align-items: center; gap: .5rem;
  padding: .4rem .75rem; padding-top: calc(.4rem + env(safe-area-inset-top));
  background: rgba(255,255,255,.6);
  -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%);
  border-bottom: 1px solid rgba(255,255,255,.5);
  box-shadow: 0 2px 14px rgba(31,38,135,.06);
}
.topbar .burger { font-size: 1.5rem; line-height: 1; padding: .1rem .5rem; color: #0d6efd; border: none; }
.topbar-logo img { height: 34px; display: block; }
.topbar-title { font-weight: 600; color: #3a4250; font-size: 1.02rem; white-space: nowrap; margin-left: 1.5rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; flex-shrink: 1; }
@media (max-width: 480px) { .topbar-title { font-size: .92rem; margin-left: .75rem; } }

/* Подразделы в верхней плашке (справа) */
.top-subtabs { display: flex; gap: .35rem; margin-left: auto; overflow-x: auto; min-width: 0; flex-shrink: 1; -webkit-overflow-scrolling: touch; -ms-overflow-style: none; scrollbar-width: none; }
.top-subtabs a { flex-shrink: 0; }
.top-subtabs::-webkit-scrollbar { display: none; }
.top-subtabs a {
  padding: .3rem .8rem; border-radius: 2rem; font-size: .85rem; white-space: nowrap;
  background: #f1f3f5; color: #495057; text-decoration: none;
}
.top-subtabs a:hover { background: #e2e6ea; }
.top-subtabs a.active { background: #0d6efd; color: #fff; font-weight: 600; }
@media (max-width: 767.98px) { .top-subtabs a { padding: .28rem .65rem; font-size: .8rem; } }

/* ── Боковая панель: свёрнута (значки) → разворачивается при наведении ── */
.sidebar {
  position: fixed; top: var(--topbar-h); left: 0; bottom: 0; z-index: 1035;
  width: var(--side-w); overflow: hidden;
  display: flex; flex-direction: column;
  background: rgba(255,255,255,.42);
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  backdrop-filter: blur(26px) saturate(180%);
  border-right: 1px solid rgba(255,255,255,.55);
  transition: width .18s ease, box-shadow .18s ease;
  padding: .5rem;
}
.side-nav { display: flex; flex-direction: column; gap: 2px; flex-grow: 1; }
.side-item {
  display: flex; align-items: center; gap: .8rem;
  padding: .7rem .6rem; border-radius: .55rem; white-space: nowrap;
  color: #333; text-decoration: none; font-weight: 500;
}
.side-item i { font-size: 1.3rem; min-width: 1.6rem; text-align: center; color: #6c757d; flex-shrink: 0; }
.side-item span { opacity: 0; transition: opacity .15s; }
.side-item:hover { background: rgba(13,110,253,.08); }
.side-item.active { background: #0d6efd; color: #fff; }
.side-item.active i { color: #fff; }
.side-bottom { margin-top: auto; }
.side-sub { display: none; flex-direction: column; margin: 2px 0 6px 2.6rem; }
.side-sub a { padding: .4rem .6rem; border-radius: .4rem; font-size: .9rem; color: #555; text-decoration: none; white-space: nowrap; }
.side-sub a:hover { background: rgba(0,0,0,.05); }
.side-sub a.active { color: #0d6efd; font-weight: 600; background: rgba(13,110,253,.1); }
.sidebar-overlay { display: none; position: fixed; inset: var(--topbar-h) 0 0 0; background: rgba(0,0,0,.35); z-index: 1034; }

/* Развёрнутое состояние (desktop — по наведению; mobile — по классу .open) */
.sidebar.open, .sidebar:hover { width: var(--side-w-open); box-shadow: 4px 0 18px rgba(0,0,0,.12); }
.sidebar.open .side-item span, .sidebar:hover .side-item span { opacity: 1; }
/* Подпункты стадий — только в мобильном меню (по бургеру): на десктопе навигация по стадиям в шапке (top-subtabs),
   в боковом меню остаются только сами разделы. */
.sidebar.open .side-sub { display: flex; }

/* ── Контент: на всю ширину (с учётом свёрнутой панели) ── */
.content { padding: 1rem; width: 100%; }
@media (min-width: 768px) {
  .content { padding: 1.25rem 1.75rem 1.5rem calc(var(--side-w) + 1.5rem); }
}
@media (max-width: 767.98px) {
  :root { --side-w-open: 240px; }
  .sidebar { width: var(--side-w-open); transform: translateX(-100%); box-shadow: none; }
  .sidebar .side-item span { opacity: 1; }
  .sidebar:hover { box-shadow: none; }
  .sidebar.open { transform: translateX(0); box-shadow: 4px 0 18px rgba(0,0,0,.2); }
  .sidebar-overlay.show { display: block; }
}

/* Карточки-строки (мобильное представление таблиц) */
.data-card { background:#fff; border:1px solid #e9ecef; border-radius:.6rem; padding:.7rem .85rem; margin-bottom:.6rem; }
.data-card .dc-title { font-weight: 600; }
.data-card .dc-row { display: flex; justify-content: space-between; gap: .5rem; font-size: .85rem; }
.data-card .dc-row .k { color: #6c757d; }

/* Компактные таблицы */
.table-compact td, .table-compact th { padding: .4rem .55rem; font-size: .875rem; vertical-align: middle; }

/* Экран входа */
.login-wrap { min-height: 100dvh; display: flex; align-items: center; justify-content: center; padding: 1rem;
  background-image:
    url("wm-bg.png"),
    radial-gradient(1100px 760px at 8% -5%, rgba(99,102,241,.20), transparent 60%),
    radial-gradient(900px 700px at 105% 110%, rgba(168,85,247,.18), transparent 55%),
    linear-gradient(160deg, #eef1f8 0%, #e6ebf5 100%);
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
  background-position: center center, center, center, center;
  background-size: cover, auto, auto, auto; }
.login-card { width: 100%; max-width: 360px; padding: 1.6rem; border-radius: 18px;
  background: rgba(255,255,255,.55); -webkit-backdrop-filter: blur(20px) saturate(160%); backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid rgba(255,255,255,.6); box-shadow: 0 8px 32px rgba(31,38,135,.15); }

/* Оранжевая кнопка «Добавить» */
.btn-add { background:#f59e0b; border-color:#f59e0b; color:#fff; font-weight:600; }
.btn-add:hover, .btn-add:focus { background:#d97706; border-color:#d97706; color:#fff; }

/* Денежные значения */
.money { font-variant-numeric: tabular-nums; white-space: nowrap; }
.pos { color: #198754; }
.neg { color: #dc3545; }

/* Статусные бейджи */
.badge-soft-green { background:#d1e7dd; color:#0f5132; }
.badge-soft-red   { background:#f8d7da; color:#842029; }
.badge-soft-gray  { background:#e9ecef; color:#495057; }
.badge-soft-yellow{ background:#fff3cd; color:#664d03; }

/* Плитки KPI */
.kpi { background:#fff; border:1px solid #e9ecef; border-radius:.6rem; padding:.7rem .85rem; }
.kpi .kpi-label { color:#6c757d; font-size:.75rem; }
.kpi .kpi-value { font-size:1.35rem; font-weight:700; font-variant-numeric: tabular-nums; }

/* Подвкладки внутри раздела (дублируют боковое меню на самом экране) */
.subtabs { display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1rem; }
.subtabs a { padding:.35rem .8rem; border-radius:2rem; font-size:.875rem; text-decoration:none;
  background:#fff; border:1px solid #dee2e6; color:#495057; }
.subtabs a.active { background:#0d6efd; border-color:#0d6efd; color:#fff; font-weight:600; }

/* ── Glassmorphism (в духе bxapp) ─────────────────────────────── */
:root {
  --glass-bg:     rgba(255, 255, 255, 0.60);
  --glass-border: rgba(255, 255, 255, 0.65);
  --glass-shadow: 0 8px 32px rgba(31, 38, 135, 0.10);
  --glass-blur:   16px;
}

/* Подложка-градиент (фиксированная) — чтобы стеклу было что размывать */
body {
  background-color: transparent !important;
  background-image:
    radial-gradient(1100px 760px at 8% -5%,   rgba(99, 102, 241, 0.16), transparent 60%),
    radial-gradient(900px 700px at 105% 110%, rgba(168, 85, 247, 0.14), transparent 55%),
    linear-gradient(160deg, #eef1f8 0%, #e6ebf5 100%) !important;
  background-attachment: fixed !important;
}

/* Стеклянные поверхности (без backdrop-filter на .card — не ломаем вложенные меню) */
.card         { --bs-card-bg: var(--glass-bg); border-color: var(--glass-border); }
.kpi, .data-card {
  background: var(--glass-bg); border-color: var(--glass-border);
  box-shadow: 0 4px 20px rgba(31, 38, 135, .06);
}
.accordion-item {
  background: var(--glass-bg); border: 1px solid var(--glass-border) !important;
  border-radius: 12px !important; box-shadow: var(--glass-shadow); margin-bottom: .5rem;
}
.accordion { --bs-accordion-bg: transparent; --bs-accordion-border-color: var(--glass-border); }
.accordion-button { border-radius: 12px !important; background: transparent; }
.accordion-button:not(.collapsed) { background: rgba(99,102,241,.10); }

.modal-content {
  --bs-modal-bg: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(var(--glass-blur)) saturate(155%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(155%);
  box-shadow: var(--glass-shadow);
}

/* Скролл в модалке, обёрнутой в <form>.
   modal-dialog-scrollable держится на цепочке flex-высот:
   .modal-content (flex-column, max-height:100%, overflow:hidden) → .modal-body (overflow-y:auto).
   Когда между ними стоит <form> (модалка «Новая заявка на замер»), цепочка рвётся:
   форма — обычный блок высотой по содержимому, тело не ограничено и потому не скроллится,
   а всё, что ниже, срезает overflow:hidden у .modal-content — включая кнопку отправки.
   Возвращаем форму в цепочку: сама флекс-колонка, тело внутри — растяжимое и скроллящееся. */
.modal-dialog-scrollable .modal-content > form {
  display: flex;
  flex-direction: column;
  min-height: 0;   /* иначе flex-элемент не сожмётся ниже высоты содержимого */
}
.modal-dialog-scrollable .modal-content > form > .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

/* ── Календарь (раздел «Календарь») ── */
/* Календарь занимает всю свободную высоту экрана: карточка — колонка, сетка внутри
   растягивается, строки делят остаток поровну. --cal-chrome — то, что съедают
   верхняя панель, отступы страницы и панель инструментов; 100dvh, а не 100vh,
   чтобы на телефоне не мешала съезжающая адресная строка. */
/* --cal-chrome — это ровно вертикальные отступы .content (сверху 1.25rem, снизу 1.5rem
   на десктопе; по 1rem на телефоне). Больше вычитать нечего: панель инструментов
   и подпись лежат ВНУТРИ карточки и уже входят в её высоту. */
.cal-shell { --cal-chrome: 2.75rem; display: flex; gap: .75rem; align-items: stretch;
             height: calc(100dvh - var(--topbar-h) - var(--cal-chrome)); min-height: 24rem; }
.cal-main  { flex: 1 1 auto; min-width: 0; margin: 0; }
.cal-body  { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.cal-toolbar, .cal-note { flex: 0 0 auto; }
.cal-side  { flex: 0 0 20rem; max-width: 20rem; margin: 0; }
.cal-side-body { height: 100%; overflow-y: auto; }

/* ── Месяц ── */
.cal-grid { flex: 1 1 auto; min-height: 0; display: grid;
            grid-template-columns: repeat(7, minmax(0, 1fr));
            grid-template-rows: auto repeat(var(--cal-weeks, 6), minmax(0, 1fr));
            gap: 4px; }
.cal-wd { text-align: center; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
          color: var(--bs-secondary-color); padding-bottom: .2rem; }
.cal-cell { display: flex; flex-direction: column; gap: 2px; padding: 4px; min-width: 0; min-height: 0;
            border: 1px solid var(--bs-border-color); border-radius: 8px;
            background: var(--bs-body-bg); color: inherit; text-decoration: none; overflow: hidden; }
.cal-cell:hover { border-color: var(--bs-primary); }
.cal-evs { display: flex; flex-direction: column; gap: 2px; min-height: 0; overflow: hidden; }
.cal-off { border: none; background: transparent; }
.cal-weekend { background: var(--bs-tertiary-bg); }
.cal-today { border-color: var(--bs-primary); box-shadow: inset 0 0 0 1px var(--bs-primary); }
.cal-sel { background: rgba(99,102,241,.10); border-color: var(--bs-primary); }
.cal-num { font-weight: 600; font-size: .8rem; line-height: 1; flex: 0 0 auto; }
/* minmax(0,1fr) у колонок + обрезка многоточием здесь — вместе не дают сетке
   распереться на узком экране, даже если текст события длинный. */
.cal-ev { font-size: .7rem; line-height: 1.15; padding: 1px 3px; border-left: 3px solid #6b7280;
          border-radius: 3px; background: var(--bs-tertiary-bg); flex: 0 0 auto;
          white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-busy { font-size: .65rem; color: var(--bs-secondary-color); font-style: italic; flex: 0 0 auto; }

/* ── Неделя ── */
/* Колонки дней — позиционируемые контейнеры: события и занятость расставлены
   в процентах от рабочего диапазона, поэтому сетка тянется под любую высоту. */
.cal-week { flex: 1 1 auto; min-height: 0; display: grid;
            grid-template-columns: 3.2rem repeat(7, minmax(0, 1fr));
            grid-template-rows: auto minmax(0, 1fr); gap: 2px; }
.cal-wk-corner { }
.cal-wk-head { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 2px 0;
               border-radius: 6px; text-decoration: none; color: inherit; font-size: .72rem; }
.cal-wk-head:hover { background: var(--bs-tertiary-bg); }
.cal-wk-wd { text-transform: uppercase; letter-spacing: .05em; color: var(--bs-secondary-color); }
.cal-wk-dt { font-weight: 600; }
.cal-wk-gutter { position: relative; }
.cal-wk-hr { position: absolute; right: .35rem; transform: translateY(-50%);
             font-size: .65rem; color: var(--bs-secondary-color); white-space: nowrap;
             font-variant-numeric: tabular-nums; }
.cal-wk-col { position: relative; min-width: 0; border: 1px solid var(--bs-border-color);
              border-radius: 6px; background: var(--bs-body-bg); overflow: hidden; }
.cal-wk-col.cal-weekend { background: var(--bs-tertiary-bg); }
.cal-wk-col.cal-today-col { box-shadow: inset 0 0 0 1px var(--bs-primary); }
.cal-wk-line { position: absolute; left: 0; right: 0; height: 0;
               border-top: 1px dashed var(--bs-border-color); }
/* Получасовая линия — бледнее часовой, иначе сетка рябит. */
.cal-wk-line-half { border-top-style: dotted; opacity: .45; }
/* Черта текущего московского времени. z-index выше событий: она должна быть видна
   поверх блока замера, внутри которого сейчас находимся. */
.cal-now { position: absolute; left: 0; right: 0; height: 0; z-index: 4;
           border-top: 2px solid #e11d48; pointer-events: none;
           /* Тонкая белая обводка: у замерщика цвет может оказаться близким к красному,
              и без неё черта тонула бы в его же блоке. */
           box-shadow: 0 1px 0 rgba(255,255,255,.7), 0 -3px 0 rgba(255,255,255,.7); }
.cal-now::before { content: ''; position: absolute; left: -3px; top: -4px;
                   width: 8px; height: 8px; border-radius: 50%; background: #e11d48; }
.cal-now-label { position: absolute; right: .2rem; transform: translateY(-50%); z-index: 4;
                 padding: 0 .2rem; border-radius: 3px; font-size: .62rem; font-weight: 600;
                 color: #fff; background: #e11d48; white-space: nowrap;
                 font-variant-numeric: tabular-nums; }

.cal-wk-busy { position: absolute; left: 0; right: 0; background: rgba(107,114,128,.16);
               border-top: 1px solid rgba(107,114,128,.35); border-bottom: 1px solid rgba(107,114,128,.35); }
.cal-wk-ev { position: absolute; left: 2px; right: 2px; overflow: hidden; padding: 1px 4px;
             border-radius: 5px; color: #fff; text-decoration: none; font-size: .68rem; line-height: 1.2; }
.cal-wk-ev:hover { filter: brightness(1.08); color: #fff; }
/* touch-action: иначе палец скроллит страницу вместо переноса.
   user-drag/user-select: событие — ссылка, и без запрета браузер начинает
   тащить саму ссылку и выделять текст, перехватывая жест. */
.cal-wk-ev { -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }
.cal-wk-ev.cal-drag { cursor: grab; touch-action: none; }
.cal-wk-ev.cal-dragging { cursor: grabbing; opacity: .85; z-index: 3;
                          box-shadow: 0 4px 14px rgba(0,0,0,.35); }
.cal-wk-ev.cal-saving { opacity: .6; }
/* Ручка растягивания — полоса по низу блока. */
.cal-wk-grip { position: absolute; left: 0; right: 0; bottom: 0; height: 8px;
               cursor: ns-resize; touch-action: none; }
.cal-wk-grip::after { content: ''; position: absolute; left: 50%; bottom: 2px;
                      width: 18px; height: 2px; margin-left: -9px; border-radius: 2px;
                      background: rgba(255,255,255,.65); }

/* Всплывающее подтверждение переноса */
.cal-toast { position: fixed; left: 50%; bottom: 1.25rem; transform: translateX(-50%);
             z-index: 1080; max-width: min(90vw, 30rem);
             padding: .5rem .85rem; border-radius: 8px; font-size: .85rem;
             color: #fff; background: #2e9e5b; box-shadow: 0 6px 20px rgba(0,0,0,.25); }
.cal-toast-bad { background: #b45309; }
.cal-wk-ev b { font-variant-numeric: tabular-nums; }
.cal-wk-sub { display: block; opacity: .85; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Адрес и замерщик — третьей и четвёртой строкой. В коротком блоке их срежет
   overflow:hidden у события, и это нормально: полные данные — в панели дня. */
.cal-wk-addr { opacity: .75; }
.cal-wk-who  { opacity: .75; font-style: italic; }
/* Поле выбора цвета в справочнике замерщиков — квадратное, по высоте строки. */
.form-control-color { width: 2.4rem; padding: .15rem; }

@media (max-width: 991.98px) {
  /* Панель дня уходит под календарь: рядом ей уже не хватает ширины. */
  .cal-shell { flex-direction: column; height: auto; }
  .cal-main  { min-height: calc(100dvh - var(--topbar-h) - var(--cal-chrome)); }
  .cal-side  { flex: 1 1 auto; max-width: none; }
  .cal-side-body { height: auto; }
}
/* ── Телефон: один день на экран, листание свайпом (как в мобильном канбане) ── */
/* Базовое скрытие объявляем ДО медиазапроса: иначе оно перебьёт display:flex внутри него. */
.cal-daynav { display: none; }

@media (max-width: 767.98px) {
  /* Колонка дня занимает всю ширину минус шкала часов; scroll-snap ловит её край,
     scroll-padding — чтобы день не заезжал под липкую шкалу. */
  .cal-week { overflow-x: auto; overflow-y: hidden;
              scroll-snap-type: x mandatory; scroll-padding-left: 2.6rem;
              grid-template-columns: 2.6rem repeat(7, calc(100% - 2.6rem));
              -webkit-overflow-scrolling: touch; }
  .cal-week::-webkit-scrollbar { display: none; }
  /* Шкала часов и угол остаются на месте, дни проезжают под ними. */
  .cal-wk-gutter, .cal-wk-corner { position: sticky; left: 0; z-index: 5;
                                   background: var(--bs-body-bg); }
  .cal-wk-head, .cal-wk-col { scroll-snap-align: start; }
  .cal-wk-head { font-size: .8rem; }

  .cal-daynav { display: flex; align-items: center; justify-content: center; gap: .5rem;
                margin-bottom: .35rem; }
  .cal-daynav-cur { font-weight: 600; min-width: 7.5rem; text-align: center;
                    text-transform: capitalize; font-variant-numeric: tabular-nums; }
}

@media (max-width: 576px) {
  .cal-shell { --cal-chrome: 2rem; }
  .cal-grid { gap: 2px; }
  .cal-cell { padding: 2px; border-radius: 6px; }
  .cal-ev { font-size: .6rem; padding: 0 2px; border-left-width: 2px; }
  .cal-ev b { display: block; }          /* время над номером — иначе не влезает */
  .cal-busy { font-size: .58rem; }
  /* Колонка дня на телефоне ~44px: номер заказа туда не влезает и рвёт время
     посередине («11:3 / 0»). Оставляем только время одной строкой, остальное —
     в панели дня по нажатию. */
  /* Колонка дня теперь во весь экран, а не ~44px: подписи снова помещаются. */
  .cal-wk-ev { font-size: .72rem; padding: 1px 4px; white-space: normal; }
  .cal-wk-num, .cal-wk-sub { display: inline; }
  .cal-wk-sub { display: block; }
}

/* Шапки таблиц под стекло */
.table-light { --bs-table-bg: rgba(255,255,255,.45) !important; }

/* Поля ввода — чуть прозрачные, читаемые */
.form-control, .form-select {
  background-color: color-mix(in srgb, #ffffff 82%, transparent);
}

/* Неактивные подвкладки — полупрозрачные */
.top-subtabs a { background: rgba(255,255,255,.5); }
.top-subtabs a:hover { background: rgba(255,255,255,.75); }

/* Старые браузеры без backdrop-filter — непрозрачный фолбэк */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .topbar  { background: #fff; }
  .sidebar { background: #fff; }
  .card    { --bs-card-bg: #fff; }
}

/* ── Фирменная палитра: зелёный / жёлтый / графит / красный ── */
:root {
  --brand-green:   #6aa84f;
  --brand-green-d: #55893f;
  --brand-yellow:  #f2c200;
  --brand-graphite:#2f3437;
  --brand-red:     #e23b3b;
  --bs-primary: #6aa84f;
  --bs-primary-rgb: 106,168,79;
  --bs-link-color: #55893f;
  --bs-link-hover-color: #3f6e2e;
}
.btn-primary {
  --bs-btn-bg: var(--brand-green); --bs-btn-border-color: var(--brand-green);
  --bs-btn-hover-bg: var(--brand-green-d); --bs-btn-hover-border-color: var(--brand-green-d);
  --bs-btn-active-bg: var(--brand-green-d); --bs-btn-active-border-color: var(--brand-green-d);
}
.btn-outline-primary {
  --bs-btn-color: var(--brand-green); --bs-btn-border-color: var(--brand-green);
  --bs-btn-hover-bg: var(--brand-green); --bs-btn-hover-border-color: var(--brand-green);
  --bs-btn-active-bg: var(--brand-green-d); --bs-btn-active-border-color: var(--brand-green-d);
}
.text-primary { color: var(--brand-green) !important; }
.topbar .burger { color: var(--brand-green); }
.topbar-title { color: var(--brand-graphite); }
.side-item.active { background: var(--brand-green); color: #fff; }
.side-sub a.active { color: var(--brand-green-d); background: rgba(106,168,79,.12); }
.side-item:hover { background: rgba(106,168,79,.10); }
/* Наведение на активный пункт не должно гасить его фон (иначе белый текст сливается) */
.side-item.active:hover { background: var(--brand-green-d); color: #fff; }
.side-item.active:hover i { color: #fff; }
.top-subtabs a.active { background: var(--brand-green); }

/* Статусные бейджи (фирменные) */
.badge-soft-amber { background:#ffe6a8; color:#7a4f00; }   /* жёлтый тёплый */
.badge-soft-lime  { background:#d8f0bf; color:#3c6b1c; }   /* салатовый */
.badge-soft-lilac { background:#e6dcf6; color:#5a3d8f; }   /* лиловый */

/* Подвкладки «Заказы» в цветах статусов (перекрывают glass/brand-правила выше) */
.top-subtabs a.st-gray  { background:#e9ecef; color:#495057; }
.top-subtabs a.st-amber { background:#ffe6a8; color:#7a4f00; }
.top-subtabs a.st-lime  { background:#d8f0bf; color:#3c6b1c; }
.top-subtabs a.st-lilac { background:#e6dcf6; color:#5a3d8f; }
.top-subtabs a.st-green { background:#d1e7dd; color:#0f5132; }
.top-subtabs a.st-gray.active  { background:#adb5bd; color:#fff; }
.top-subtabs a.st-amber.active { background:#e0a100; color:#fff; }
.top-subtabs a.st-lime.active  { background:#6aa84f; color:#fff; }
.top-subtabs a.st-lilac.active { background:#8a5cd0; color:#fff; }
.top-subtabs a.st-green.active { background:#198754; color:#fff; }
/* Корзина — всегда красноватая, активная (открыта Корзина) — насыщенно-красная */
.top-subtabs a[data-tab="trash"] { background:#f8d7da; color:#842029; }
.top-subtabs a[data-tab="trash"].active { background:#dc3545; color:#fff; }
.top-subtabs a[data-tab="trash"].active .st-cnt { background:rgba(255,255,255,.35); }
.top-subtabs a .st-cnt {
  display:inline-block; min-width:1.15rem; padding:0 .3rem; margin-left:.3rem;
  border-radius:1rem; font-size:.72rem; font-weight:700; line-height:1.25rem;
  background:rgba(0,0,0,.12); text-align:center;
}
.top-subtabs a.active .st-cnt { background:rgba(255,255,255,.35); }

/* Подсветка подвкладок при наведении (через filter — работает при любом фоне, включая цветные статусы) */
.top-subtabs a { transition: filter .12s ease, box-shadow .12s ease, transform .12s ease; }
.top-subtabs a:hover { filter: brightness(.93); box-shadow: 0 2px 8px rgba(31,38,135,.18); transform: translateY(-1px); cursor: pointer; }
.top-subtabs a.active:hover { filter: brightness(1.08); }

/* ═══════════ Канбан раздела «Заказы» ═══════════ */
/* Карточка заказа — общая для десктоп-доски и мобильной палубы */
.kb-card { display:block; text-decoration:none; color:inherit; background:#fff;
  border:1px solid rgba(0,0,0,.08); border-radius:10px; padding:.5rem .6rem;
  box-shadow:0 1px 3px rgba(0,0,0,.05); transition:transform .1s ease, box-shadow .1s ease; }
.kb-card:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.10); }
.kb-card-top { display:flex; justify-content:space-between; align-items:center; gap:.5rem; margin-bottom:.15rem; }
.kb-num { font-weight:700; font-size:.85rem; color:#3a4250; }
.kb-cost { font-size:.8rem; color:#198754; white-space:nowrap; font-variant-numeric:tabular-nums; }
.kb-company { font-weight:600; font-size:.9rem; line-height:1.25; }
.kb-addr { font-size:.8rem; color:#6c757d; margin-top:.1rem; overflow:hidden;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.kb-foot { display:flex; justify-content:space-between; align-items:center; gap:.5rem; margin-top:.35rem; font-size:.78rem; color:#6c757d; }
.kb-meas { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kb-meas .bi { margin-right:.2rem; }
.kb-date { flex:0 0 auto; }
.kb-empty { text-align:center; color:#adb5bd; padding:.6rem 0; font-size:.85rem; }

/* Десктоп-доска: колонки рядом */
.kb-board { gap:.6rem; align-items:stretch; overflow-x:auto; padding-bottom:.4rem; }
.kb-col { flex:1 1 0; min-width:210px; display:flex; flex-direction:column;
  background:rgba(255,255,255,.5); border:1px solid rgba(0,0,0,.06); border-radius:12px; overflow:hidden; }
.kb-col-active { outline:2px solid var(--brand-green, #6aa84f); outline-offset:-1px; }
/* Колонка под перетаскиваемой карточкой — цель переноса */
.kb-col-over { outline:2px dashed var(--brand-green, #6aa84f); outline-offset:-1px; background:rgba(106,168,79,.12); }
.kb-col-head { display:flex; align-items:center; gap:.35rem; white-space:nowrap;
  padding:.5rem .6rem; font-weight:600; font-size:.88rem; }
.kb-head-name { flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; }
.kb-cnt { background:rgba(255,255,255,.6); border-radius:10px; padding:0 .45rem; font-size:.8rem; flex-shrink:0; }
.kb-sum { font-size:.78rem; font-weight:700; opacity:.85; flex-shrink:0; }
.kb-col-body { flex:1 1 auto; overflow-y:auto; padding:.5rem; display:flex; flex-direction:column; gap:.5rem;
  max-height:calc(100vh - var(--topbar-h) - 140px); }
.kb-col-head.st-gray  { background:#e9ecef; color:#495057; }
.kb-col-head.st-amber { background:#ffe6a8; color:#7a4f00; }
.kb-col-head.st-lime  { background:#d8f0bf; color:#3c6b1c; }
.kb-col-head.st-lilac { background:#e6dcf6; color:#5a3d8f; }
.kb-col-head.st-green { background:#d1e7dd; color:#0f5132; }

/* Мобильный канбан: одна колонка на экран, свайп вбок (scroll-snap) */
.mk { display:flex; flex-direction:column; }
/* position:relative обязателен — соседние бейджи позиционируются абсолютно относительно этой полоски */
.mk-nav { position:relative; display:flex; align-items:center; justify-content:center; min-height:46px; overflow:hidden; padding:2px 0 8px; }
.mk-navbadge { padding:6px 16px; border-radius:20px; font-weight:600; font-size:13px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; color:#2f3437;
  background:rgba(var(--kbh,108,117,125),.20); border:1px solid rgba(var(--kbh,108,117,125),.55);
  -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28), 0 2px 8px rgba(0,0,0,.14); }
.mk-curbadge { position:relative; z-index:2; max-width:78%; }
.mk-prevbadge, .mk-nextbadge { position:absolute; top:50%; max-width:42%; font-weight:500; opacity:.5; filter:saturate(.55) brightness(.82); }
.mk-prevbadge { left:0;  transform:translate(-52%, -50%); }
.mk-nextbadge { right:0; transform:translate(52%, -50%); }
.mk-stages { display:flex; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.mk-stages::-webkit-scrollbar { display:none; }
.mk-stage { flex:0 0 100%; max-width:100%; min-width:0; height:100%; overflow-y:auto; scroll-snap-align:start; padding:0 2px; }
.mk-cards { display:flex; flex-direction:column; gap:8px; padding-bottom:12px; }
.mk-empty { text-align:center; color:#adb5bd; padding:40px 10px; }
.kbh-gray  { --kbh:173,181,189; } .kbh-amber { --kbh:224,161,0; }  .kbh-lime  { --kbh:106,168,79; }
.kbh-lilac { --kbh:138,92,208; }  .kbh-green { --kbh:25,135,84; }

/* На мобильном подвкладки в топбаре не нужны — их заменяет бейдж колонки */
@media (max-width: 767.98px) { body[data-page="orders"] .top-subtabs { display:none; } }

/* Переключатель вида: показываем только выбранную версию. Архив — всегда список. */
.orders-desk[data-view="list"]   #ordersKanban { display:none !important; }
.orders-desk[data-view="kanban"] #ordersList   { display:none !important; }
.orders-desk[data-view="kanban"][data-tab="archive"] #ordersKanban { display:none !important; }
.orders-desk[data-view="kanban"][data-tab="archive"] #ordersList   { display:block !important; }

/* Переключатель Канбан/Список в верхней плашке */
.orders-view-switch { gap:3px; margin-left:.5rem; flex:0 0 auto; }
.ovs-btn { width:32px; height:30px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid rgba(0,0,0,.12); background:rgba(255,255,255,.6); color:#6c757d; border-radius:8px; cursor:pointer; font-size:1rem; }
.ovs-btn:hover { filter:brightness(.97); }
.ovs-btn.active { background: var(--brand-green, #6aa84f); border-color: var(--brand-green, #6aa84f); color:#fff; }

/* В режиме канбан бейджи стадий сворачиваются «под Архив» (кроме самого Архива) */
body[data-page="orders"] .top-subtabs a { max-width:220px;
  transition: max-width .32s ease, opacity .22s ease, padding .3s ease, margin .3s ease, transform .28s ease, filter .12s ease, box-shadow .12s ease; }
body[data-page="orders"] .top-subtabs.kanban-mode a:not([data-tab="archive"]):not([data-tab="trash"]) {
  max-width:0; opacity:0; padding-left:0; padding-right:0; margin-left:-.35rem;
  transform:translateX(30px); pointer-events:none; overflow:hidden; }

/* Ярлыки-цели перетаскивания (справа за краем, выезжают при перетаскивании) */
.kb-rail { position:fixed; left:0; right:0; bottom:0; z-index:1060; display:flex; gap:0;
  transform:translateY(120%); transition:transform .25s ease; pointer-events:none; }
.kb-rail.show { transform:translateY(0); pointer-events:auto; }
.kb-rail-zone { flex:1 1 0; display:flex; flex-direction:row; align-items:center; justify-content:center; gap:10px;
  height:72px; color:#fff; font-weight:700; font-size:16px;
  box-shadow:0 -6px 20px rgba(0,0,0,.25); opacity:.95; transition:opacity .12s ease, box-shadow .12s ease, filter .12s ease; }
.kb-rail-zone .bi { font-size:24px; }
.kb-rail-complete { background:#2e9e5b; order:2; }   /* правая половина */
.kb-rail-cancel   { background:#e23b3b; order:1; }   /* левая половина */
.kb-rail-zone.over { opacity:1; filter:brightness(1.12); box-shadow:0 -12px 30px rgba(0,0,0,.4); }
.kb-card[draggable="true"] { cursor:grab; }
.kb-card[draggable="true"]:active { cursor:grabbing; }

/* ── Справочник: мобильная адаптация ── */
/* Шапка аккордеона: название + бейджи переносятся на новую строку, а не уезжают за край экрана */
.cat-head { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; flex:1 1 auto; min-width:0; }

/* Строка менеджера: поля слева, кнопки (через form="…") одной группой справа */
.cat-row { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem; margin-bottom:.4rem; }
.cat-fields { display:flex; flex-wrap:wrap; gap:.35rem; flex:1 1 18rem; min-width:0; }
.cat-fields .form-control { flex:1 1 9rem; min-width:0; }
.cat-acts { display:flex; gap:.35rem; flex:0 0 auto; }

@media (max-width: 767.98px) {
  /* Шрифт полей 16px — иначе iOS Safari зумит страницу при фокусе в поле */
  body[data-page="catalog"] .form-control,
  body[data-page="catalog"] .form-select { font-size: 16px; }
  body[data-page="catalog"] .accordion-button { padding: .7rem .85rem; }
  body[data-page="catalog"] .accordion-body { padding: .85rem .75rem; }

  /* Менеджеры и замерщики: каждая запись — отдельная карточка, поля в столбик */
  .cat-row { flex-direction:column; align-items:stretch; padding:.5rem; margin-bottom:.5rem;
             border:1px solid #e9ecef; border-radius:.5rem; background:#fff; }
  .cat-fields { flex:1 1 auto; }
  .cat-fields .form-control { flex:1 1 100%; }
  .cat-acts .btn { flex:1 1 auto; }
  .cat-block { margin:0 0 .5rem; padding:.5rem; border:1px solid #e9ecef; border-radius:.5rem; background:#fff; }
  .cat-block .btn { flex:1 1 auto; }

  /* Ссылка формы заявки: поле на всю строку, кнопки — отдельным рядом */
  .cat-link { flex-wrap:wrap; gap:.35rem; }
  .cat-link > .form-control { flex:1 1 100%; border-radius:.375rem !important; }
  .cat-link > .btn, .cat-link > form > .btn { border-radius:.375rem !important; }
  /* Пальцем в btn-sm попасть трудно — поднимаем высоту кнопок до тач-размера */
  .cat-acts .btn, .cat-link > .btn, .cat-link > form > .btn, .cat-block .btn { min-height: 38px; }
  .cat-link > form { display:inline-flex; }
}