/* =====================================================================
   Equipment CRM Platform — дизайн-пак оболочки сервиса.
   .plans/tz-design-pack-framework.md §12 — Фаза 4 (каркас пака).

   Источник токенов: .design/Equipment CRM Platform/«Этап 2 - Design Tokens.html»,
   раздел «09 — EXPORT». Industrial Green accent, Zinc neutral, IBM Plex.

   Стратегия каркаса: помимо собственной токен-системы пак «мостит» свои роли
   на существующие переменные --sb-* / --kp-*, которыми пользуются компоненты
   .mw-* из manager_workspace.css. Благодаря этому каждый ещё не
   реимплементированный экран, отрисованный по fallback из sterbrust,
   автоматически перекрашивается в палитру Equipment CRM. Структурная
   реимплементация экранов идёт инкрементально поверх этого каркаса.
   ===================================================================== */

/* ---------------------------------------------------------------------
   Шрифты IBM Plex — self-hosted (CSP запрещает CDN, font-src 'self').
   Файлы .woff2 кладутся в static/design_packs/equipment_crm/fonts/
   (см. fonts/README.md). До их появления стек ниже падает на system-ui —
   поэтому @font-face оставлены закомментированными, чтобы не плодить 404.

   @font-face {
       font-family: 'IBM Plex Sans';
       font-style: normal; font-weight: 400 600; font-display: swap;
       src: url('/static/design_packs/equipment_crm/fonts/ibm-plex-sans-latin.woff2') format('woff2'),
            url('/static/design_packs/equipment_crm/fonts/ibm-plex-sans-cyrillic.woff2') format('woff2');
   }
   @font-face {
       font-family: 'IBM Plex Mono';
       font-style: normal; font-weight: 400 500; font-display: swap;
       src: url('/static/design_packs/equipment_crm/fonts/ibm-plex-mono-latin.woff2') format('woff2');
   }
   --------------------------------------------------------------------- */

:root {
  /* ---------- Neutral · Zinc ---------- */
  --zinc-50:  #FAFAFA;  --zinc-100: #F4F4F5;  --zinc-200: #E4E4E7;
  --zinc-300: #D4D4D8;  --zinc-400: #A1A1AA;  --zinc-500: #71717A;
  --zinc-600: #52525B;  --zinc-700: #3F3F46;  --zinc-800: #27272A;
  --zinc-900: #18181B;  --zinc-950: #09090B;

  /* ---------- Accent · Industrial Green ---------- */
  --green-50:  #F0F8F3; --green-100: #DCEEE3; --green-200: #B5DCC5;
  --green-300: #85C29F; --green-400: #4FA77B; --green-500: #1F8A5B;
  --green-600: #176E48; --green-700: #135538; --green-800: #0E3D26;
  --green-900: #082818; --green-950: #051A0F;

  /* ---------- Semantic ---------- */
  --warn-50:   #FFFBEB; --warn-200:   #FDE68A; --warn-500:   #F59E0B; --warn-700:   #B45309;
  --danger-50: #FEF2F2; --danger-200: #FECACA; --danger-500: #DC2626; --danger-700: #B91C1C;
  --info-50:   #EFF6FF; --info-200:   #BFDBFE; --info-500:   #2563EB; --info-700:   #1D4ED8;

  /* ---------- Roles · Light theme ---------- */
  --bg:           var(--zinc-50);
  --bg-elev:      #FFFFFF;
  --bg-sunken:    var(--zinc-100);
  --ink:          var(--zinc-900);
  --ink-2:        var(--zinc-700);
  --ink-muted:    var(--zinc-500);
  --ink-faint:    var(--zinc-400);
  --line:         var(--zinc-200);
  --line-strong:  var(--zinc-300);
  --accent:       var(--green-500);
  --accent-hover: var(--green-600);
  --focus:        var(--green-500);

  /* ---------- Type ---------- */
  --font-sans: 'IBM Plex Sans', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --t-xs: 11px; --t-sm: 12px;  --t-base: 14px;
  --t-md: 16px; --t-lg: 18px;  --t-xl: 22px;
  --t-2xl: 28px; --t-3xl: 36px; --t-4xl: 48px;

  /* ---------- Spacing · 4px base ---------- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-8: 32px;  --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px; --sp-20: 80px; --sp-24: 96px;

  /* ---------- Radii / shadows ---------- */
  --r-sm: 4px; --r-md: 6px; --r-lg: 8px; --r-xl: 12px; --r-full: 9999px;
  --sh-xs: 0 1px 2px rgba(9,9,11,.04);
  --sh-sm: 0 1px 3px rgba(9,9,11,.06), 0 1px 2px rgba(9,9,11,.04);
  --sh-md: 0 4px 12px rgba(9,9,11,.08), 0 1px 3px rgba(9,9,11,.06);
  --sh-lg: 0 12px 32px rgba(9,9,11,.10), 0 4px 12px rgba(9,9,11,.06);
  --sh-xl: 0 24px 48px rgba(9,9,11,.14);

  /* ---------- Тёмный рейл — постоянен в обеих темах ----------
     Рейл всегда тёмный (макет «Блок 1 — AppShell»); токены завязаны на
     постоянные --zinc-*, поэтому в [data-theme="dark"] их не переопределяем. */
  --rail-bg:         var(--zinc-950);
  --rail-hover:      var(--zinc-900);
  --rail-active:     var(--zinc-800);
  --rail-ico:        var(--zinc-500);
  --rail-ico-active: #FAFAFA;

  /* ---------- Мост на токены sterbrust (--sb-* / --kp-*) ----------
     manager_workspace.css объявляет --kp-* как var(--sb-*); переопределяя
     --sb-* здесь, мы перекрашиваем все компоненты .mw-* fallback-экранов.
     Завязка на --accent / --ink даёт token-overlay (Фаза 3) сквозной эффект. */
  --sb-orange:       var(--accent);
  --sb-orange-hover: var(--accent-hover);
  --sb-orange-press: var(--green-700);
  --sb-orange-tint:  var(--green-50);
  --sb-green:        var(--green-500);
  --sb-green-hover:  var(--green-600);
  --sb-green-tint:   var(--green-100);
  --sb-paper:        var(--bg-elev);
  --sb-fog:          var(--bg);
  --sb-mist:         var(--bg-sunken);
  --sb-line:         var(--line);
  --sb-line-strong:  var(--line-strong);
  --sb-steel:        var(--ink-muted);
  --sb-iron:         var(--ink-2);
  --sb-graphite:     var(--ink);
  --sb-ink:          var(--zinc-950);
  --sb-error:        var(--danger-500);
  --sb-error-tint:   var(--danger-50);
  --sb-warn:         var(--warn-500);
  --sb-info:         var(--info-500);
  --sb-font-display: var(--font-sans);
  --sb-font-body:    var(--font-sans);
  --sb-font-mono:    var(--font-mono);
  --kp-shell:        var(--bg);
}

[data-theme="dark"] {
  /* ---------- Roles · Dark theme ---------- */
  --bg:          var(--zinc-950);
  --bg-elev:     var(--zinc-900);
  --bg-sunken:   var(--zinc-950);
  --ink:         var(--zinc-100);
  --ink-2:       var(--zinc-300);
  --ink-muted:   var(--zinc-500);
  --ink-faint:   var(--zinc-600);
  --line:        var(--zinc-800);
  --line-strong: var(--zinc-700);

  /* Мост на sterbrust для тёмной темы. Часть legacy-компонентов .mw-*
     зашивает #fff напрямую — на не реимплементированных экранах тёмная
     тема остаётся приблизительной; уточняется по мере реимплементации. */
  --sb-paper:       var(--bg-elev);
  --sb-fog:         var(--bg);
  --sb-mist:        var(--zinc-800);
  --sb-line:        var(--line);
  --sb-line-strong: var(--line-strong);
  --sb-steel:       var(--ink-muted);
  --sb-iron:        var(--ink-2);
  --sb-graphite:    var(--ink);
  --sb-ink:         var(--zinc-50);
  --kp-shell:       var(--bg);
}

/* Базовый фон/цвет оболочки для собственных экранов пака. */
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
}

/* =====================================================================
   КАРКАС ОБОЛОЧКИ — рейл + топбар + drawer (батч 1).
   Макет: «.design/Equipment CRM Platform/Блок 1 — AppShell & Overlays».

   Рейл и топбар — position:fixed, поэтому контракт sterbrust
   ({% include "_app_header.html" %} в начале content) сохраняется:
   реимплементированный _app_header.html отдаёт фиксированные рейл/топбар,
   а <body class="eqc-shell-body"> отступами освобождает место под них.
   ===================================================================== */

/* ---------- Глифы (inline SVG-спрайт _eqcrm_icons.html) ---------- */
.eqc-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.glyph {
  stroke: currentColor; fill: none; stroke-width: 1.6;
  stroke-linecap: round; stroke-linejoin: round;
  display: inline-block; vertical-align: middle; flex-shrink: 0;
}
.g10 { width: 10px; height: 10px; } .g12 { width: 12px; height: 12px; }
.g14 { width: 14px; height: 14px; } .g16 { width: 16px; height: 16px; }
.g18 { width: 18px; height: 18px; } .g20 { width: 20px; height: 20px; }
.g24 { width: 24px; height: 24px; }

/* ---------- Отступы body под фиксированные рейл/топбар ---------- */
.eqc-shell-body { padding-left: 56px; padding-top: 52px; }

/* ---------- Кнопки оболочки ---------- */
.eqc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  height: 32px; padding: 0 12px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  color: var(--ink); font: inherit; font-size: 13px; font-weight: 500;
  line-height: 1; white-space: nowrap; cursor: pointer; text-decoration: none;
}
.eqc-btn:hover { background: var(--bg-sunken); }
.eqc-btn--primary { background: var(--accent); color: #fff; border-color: var(--accent); }
.eqc-btn--primary:hover { background: var(--accent-hover); }
.eqc-btn--ghost { background: transparent; border-color: transparent; color: var(--ink-2); }
.eqc-btn--ghost:hover { background: var(--bg-sunken); }
.eqc-btn--lg { height: 38px; padding: 0 16px; font-size: 14px; }
.eqc-btn--full { width: 100%; }
.eqc-btn__kbd {
  background: rgba(255, 255, 255, .18); color: inherit; border: 0;
  padding: 1px 5px; border-radius: 3px; font-size: 10px;
  font-family: var(--font-mono); margin-left: 2px; line-height: 1.2;
}
.eqc-kbd {
  display: inline-block; border: 1px solid var(--line-strong);
  border-bottom-width: 2px; border-radius: 3px; padding: 1px 5px;
  font-size: 10px; font-family: var(--font-mono); background: var(--bg-elev);
  color: var(--ink-2); line-height: 1.2;
}

/* ---------- Рейл ---------- */
.eqc-rail {
  position: fixed; left: 0; top: 0; bottom: 0; width: 56px; z-index: 200;
  background: var(--rail-bg); border-right: 1px solid var(--zinc-800);
  display: flex; flex-direction: column; align-items: center;
  padding: 10px 0 12px; gap: 6px; overflow-y: auto;
}
.eqc-rail__logo {
  width: 32px; height: 32px; border-radius: 7px; background: var(--green-500);
  display: flex; align-items: center; justify-content: center; color: #fff;
  font-family: var(--font-mono); font-weight: 600; font-size: 12px;
  margin-bottom: 8px; text-decoration: none; flex-shrink: 0;
}
.eqc-rail__nv {
  position: relative; display: flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: var(--r-md); color: var(--rail-ico);
  background: transparent; border: 0; cursor: pointer; text-decoration: none;
  flex-shrink: 0;
}
.eqc-rail__nv:hover { background: var(--rail-hover); color: var(--zinc-300); }
.eqc-rail__nv.is-active { background: var(--rail-active); color: var(--rail-ico-active); }
.eqc-rail__nv.is-active::before {
  content: ''; position: absolute; left: -10px; top: 6px; bottom: 6px;
  width: 2px; border-radius: 99px; background: var(--green-500);
}
.eqc-rail__pulse {
  position: absolute; top: 6px; right: 6px; width: 6px; height: 6px;
  border-radius: 99px; background: var(--green-500); border: 1.5px solid var(--rail-bg);
}
.eqc-rail__spacer { flex: 1; }

/* Flyout-подменю «Каталог» рейла. */
.eqc-rail__cat { position: relative; display: flex; }
.eqc-rail__flyout {
  position: absolute; left: calc(100% + 8px); top: 0; min-width: 216px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); padding: 6px;
  display: flex; flex-direction: column; gap: 2px; z-index: 210;
}
.eqc-rail__flyout-h {
  padding: 6px 10px 4px; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-rail__flyout a {
  display: flex; align-items: center; gap: 9px; padding: 8px 10px;
  border-radius: var(--r-sm); font-size: 13px; color: var(--ink-2);
  text-decoration: none;
}
.eqc-rail__flyout a:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-rail__flyout a .glyph { color: var(--ink-muted); }

/* ---------- Топбар ---------- */
.eqc-topbar {
  position: fixed; top: 0; left: 56px; right: 0; height: 52px; z-index: 190;
  display: flex; align-items: center; gap: 16px; padding: 0 16px;
  background: var(--bg-elev); border-bottom: 1px solid var(--line);
}
.eqc-crumbs {
  display: flex; align-items: center; gap: 6px; font-size: 13px;
  color: var(--ink-muted); min-width: 0; flex: 1 1 auto; overflow: hidden;
}
.eqc-crumbs a {
  color: inherit; text-decoration: none; padding: 2px 4px;
  border-radius: 3px; white-space: nowrap; flex-shrink: 0;
}
.eqc-crumbs a:hover { color: var(--ink-2); background: var(--bg-sunken); }
.eqc-crumbs .sep { color: var(--ink-faint); display: inline-flex; flex-shrink: 0; }
/* Последний крошечный «current» (название текущей страницы) — единственный
   усыхает с многоточием. Промежуточные ссылки остаются читаемыми, чтобы
   пользователь видел, где находится. */
.eqc-crumbs .current {
  color: var(--ink); font-weight: 500; padding: 2px 4px; white-space: nowrap;
  min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis;
}
.eqc-cmdk {
  display: inline-flex; align-items: center; gap: 8px; height: 32px; width: 340px;
  padding: 0 10px; border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-sunken); color: var(--ink-muted); font: inherit;
  font-size: 13px; cursor: pointer; flex-shrink: 0;
}
.eqc-cmdk__ph { flex: 1; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.eqc-topbar__right { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.eqc-topbar__actions-desktop { display: flex; align-items: center; gap: 8px; }
.eqc-topbar__divider { width: 1px; height: 24px; background: var(--line); }

/* Иконочные кнопки топбара (тема / горячие / уведомления). */
.eqc-icobtn {
  position: relative; width: 32px; height: 32px; display: inline-flex;
  align-items: center; justify-content: center; border-radius: var(--r-md);
  color: var(--ink-2); background: transparent; border: 1px solid transparent;
  cursor: pointer; text-decoration: none;
}
.eqc-icobtn:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-icobtn--flame { color: var(--warn-700); }
[data-theme="dark"] .eqc-icobtn--flame { color: var(--warn-500); }
.eqc-icobtn__num {
  position: absolute; top: -2px; right: -2px; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 99px; background: var(--danger-500); color: #fff;
  font-family: var(--font-mono); font-size: 10px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  line-height: 1; white-space: nowrap; border: 1.5px solid var(--bg-elev);
}

/* Индикатор «горячих» КП — инлайн-пилюля (иконка огня + «5м: 42»).
   Содержит текстовую метку, а не короткое число, поэтому не угловой бейдж. */
.eqc-hotpill {
  display: inline-flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 10px; border-radius: var(--r-full);
  font-size: 12px; font-weight: 600; line-height: 1; white-space: nowrap;
  color: var(--warn-700); background: var(--warn-50);
  border: 1px solid var(--warn-200); text-decoration: none; cursor: pointer;
}
.eqc-hotpill:hover { background: var(--warn-200); }
.eqc-hotpill .glyph { flex: none; }
[data-theme="dark"] .eqc-hotpill {
  color: var(--warn-500); background: rgba(245,158,11,.12);
  border-color: rgba(245,158,11,.35);
}
[data-theme="dark"] .eqc-hotpill:hover { background: rgba(245,158,11,.20); }
.eqc-icobtn__unread {
  position: absolute; top: 7px; right: 7px; width: 6px; height: 6px;
  border-radius: 99px; background: var(--accent); border: 1.5px solid var(--bg-elev);
}

/* Чип пользователя + выпадающее меню. */
.eqc-pop-wrap { position: relative; display: inline-flex; }
.eqc-userchip {
  display: inline-flex; align-items: center; gap: 8px; height: 36px;
  padding: 0 8px 0 4px; border-radius: var(--r-md); border: 1px solid transparent;
  background: transparent; cursor: pointer; font: inherit;
}
.eqc-userchip:hover, .eqc-userchip.is-active { background: var(--bg-sunken); border-color: var(--line); }
.eqc-userchip__av {
  width: 28px; height: 28px; border-radius: 99px; background: var(--green-700);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600; flex-shrink: 0;
}
.eqc-userchip__meta {
  display: flex; flex-direction: column; align-items: flex-start;
  line-height: 1.1; gap: 1px; min-width: 0;
}
.eqc-userchip__name { font-size: 13px; font-weight: 500; color: var(--ink); white-space: nowrap; }
.eqc-userchip__email { font-size: 11px; color: var(--ink-muted); font-family: var(--font-mono); white-space: nowrap; }
.eqc-userchip__chev { color: var(--ink-muted); }

.eqc-usermenu {
  position: absolute; top: calc(100% + 6px); right: 0; width: 270px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); overflow: hidden; z-index: 210;
}
.eqc-usermenu__head {
  padding: 14px; display: flex; gap: 10px; align-items: center;
  border-bottom: 1px solid var(--line);
}
.eqc-usermenu__head .av {
  width: 36px; height: 36px; border-radius: 99px; background: var(--green-700);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 12px; font-weight: 600; flex-shrink: 0;
}
.eqc-usermenu__head .col { min-width: 0; }
.eqc-usermenu__head .nm { font-weight: 600; font-size: 13px; line-height: 18px; }
.eqc-usermenu__head .em {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
  margin-top: 1px; overflow: hidden; text-overflow: ellipsis;
}
.eqc-usermenu__list { padding: 6px; }
.eqc-usermenu__item {
  display: flex; align-items: center; gap: 10px; min-height: 38px;
  padding: 6px 8px; font: inherit; font-size: 13px; color: var(--ink-2);
  text-decoration: none; border-radius: var(--r-sm); background: transparent;
  border: 0; width: 100%; cursor: pointer; text-align: left;
}
.eqc-usermenu__item:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-usermenu__item .ico { color: var(--ink-muted); display: flex; flex-shrink: 0; }
.eqc-usermenu__item b { display: block; font-weight: 500; color: var(--ink); font-size: 13px; line-height: 16px; }
.eqc-usermenu__item span { display: block; font-size: 11px; color: var(--ink-muted); line-height: 14px; }
.eqc-usermenu__item--danger { color: var(--danger-700); }
.eqc-usermenu__item--danger b { color: var(--danger-700); }
.eqc-usermenu__item--danger .ico { color: var(--danger-500); }
.eqc-usermenu__item--danger:hover { background: var(--danger-50); }
[data-theme="dark"] .eqc-usermenu__item--danger:hover { background: #2A0808; }
.eqc-usermenu__sep { height: 1px; background: var(--line); margin: 4px 0; }

/* Popover уведомлений. */
.eqc-popover {
  position: absolute; top: calc(100% + 6px); right: 0; width: 360px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); overflow: hidden;
  display: flex; flex-direction: column; z-index: 210;
}
.eqc-popover__head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
}
.eqc-popover__head h5 { margin: 0; font-size: 13px; font-weight: 600; }
.eqc-popover__head button {
  font: inherit; font-size: 12px; color: var(--green-700); background: transparent;
  border: 0; cursor: pointer; font-weight: 500;
}
[data-theme="dark"] .eqc-popover__head button { color: var(--green-400); }
.eqc-popover__body { overflow-y: auto; max-height: 380px; }
.eqc-popover__state { padding: 28px 14px; text-align: center; color: var(--ink-muted); font-size: 13px; }
.eqc-nt {
  display: grid; grid-template-columns: 14px 1fr; gap: 10px; padding: 10px 14px;
  border: 0; border-bottom: 1px solid var(--line); cursor: pointer;
  background: transparent; width: 100%; text-align: left; font: inherit;
}
.eqc-nt:last-child { border-bottom: 0; }
.eqc-nt:hover { background: var(--bg-sunken); }
.eqc-nt__pip {
  grid-column: 1; width: 7px; height: 7px; border-radius: 99px;
  background: var(--green-500); margin-top: 6px; justify-self: center;
}
/* Жёстко закрепляем body за второй колонкой: иначе после «Отметить все» все
   `.eqc-nt__pip` уходят в `display:none`, grid auto-placement подтягивает
   body в 14-пиксельную колонку и текст схлопывается у правого края. */
.eqc-nt__body { grid-column: 2; min-width: 0; }
.eqc-nt__body b { display: block; font-size: 13px; font-weight: 500; line-height: 18px; color: var(--ink); }
.eqc-nt__body .msg { display: block; font-size: 12px; color: var(--ink-muted); line-height: 17px; }
.eqc-nt__body .when {
  display: block; font-family: var(--font-mono); font-size: 11px;
  color: var(--ink-faint); margin-top: 2px;
}

/* ---------- Help-кнопка и поповер «Что это за блок» ---------- */
.eqc-help-wrap { vertical-align: middle; margin-left: 6px; }
.eqc-help-btn {
  width: 22px; height: 22px; padding: 0; border-radius: 99px;
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  color: var(--ink-muted); display: inline-flex; align-items: center;
  justify-content: center; cursor: pointer; font: inherit;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}
.eqc-help-btn:hover { background: var(--bg-sunken); color: var(--ink); border-color: var(--line-strong); }
.eqc-help-btn:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }
.eqc-help-btn[aria-expanded="true"] {
  background: var(--bg-sunken); color: var(--ink); border-color: var(--line-strong);
}
.eqc-help {
  position: absolute; top: calc(100% + 8px); left: 0; width: 380px;
  max-width: calc(100vw - 32px); max-height: min(520px, calc(100vh - 120px));
  overflow-y: auto; background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); padding: 18px 18px 14px;
  z-index: 210; color: var(--ink);
  font-family: var(--font-sans); text-transform: none; letter-spacing: normal;
  font-weight: 400;
}
/* Для блоков у правого края поповер прижимается к правому краю якоря и
   раскрывается влево — иначе 380px уходят за правую границу экрана.
   Включается только пока блок реально стоит справа в многоколоночной
   раскладке; на узких ширинах блок занимает всю строку и «?» оказывается
   слева, поэтому возвращаемся к раскрытию вправо (по умолчанию .eqc-help).
   --right  — для правых KPI (сетка KPI становится одноколоночной ≤768px).
   --right-wide — для правых колонок .eqc-an-2col (становятся в одну ≤1100px). */
@media (min-width: 769px) {
  .eqc-help--right { left: auto; right: 0; }
}
@media (min-width: 1101px) {
  .eqc-help--right-wide { left: auto; right: 0; }
}
.eqc-help__title {
  margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--ink); line-height: 20px;
}
.eqc-help__h {
  margin: 14px 0 6px; font-size: 12px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ink-muted);
  font-family: var(--font-mono);
}
.eqc-help__lead {
  margin: 0; font-size: 13px; line-height: 19px; color: var(--ink-2);
}
.eqc-help__lead--last { margin-bottom: 14px; }
.eqc-help__list { margin: 0; padding: 0 0 0 18px; font-size: 13px; line-height: 19px; color: var(--ink-2); }
.eqc-help__list li { margin-bottom: 4px; }
.eqc-help__list li:last-child { margin-bottom: 0; }
.eqc-help__list--seg { list-style: none; padding-left: 0; }
.eqc-help__list--seg li { display: flex; align-items: flex-start; gap: 8px; }
.eqc-help__seg-dot {
  flex-shrink: 0; width: 8px; height: 8px; border-radius: 99px; margin-top: 6px;
  background: var(--ink-muted);
}
.eqc-help__seg-dot--online { background: #2BA84A; box-shadow: 0 0 0 2px rgba(43, 168, 74, .25); }
.eqc-help__seg-dot--hot { background: #E04E2E; }
.eqc-help__seg-dot--today { background: #F0A000; }
.eqc-help__seg-dot--stale { background: #6B7280; }
.eqc-help__seg-dot--not-opened { background: transparent; border: 1.5px solid var(--ink-muted); }
.eqc-help__seg-name { font-weight: 600; color: var(--ink); }
.eqc-help__close {
  margin-top: 14px; width: 100%; height: 32px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: var(--bg-sunken);
  color: var(--ink); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer;
}
.eqc-help__close:hover { background: var(--bg-elev); border-color: var(--ink-muted); }
.eqc-help__close:focus-visible { outline: 2px solid var(--green-500); outline-offset: 2px; }

/* ---------- Обучающий тур (spotlight + tooltip + welcome + toast) ----------
   Реимплементация под визуальный язык пака. Используем те же токены, что
   .eqc-help / .eqc-modal — отдельных цветов и теней не вводим. Координаты
   позиционируются в product_tour.js с учётом zoom .eqc-shell-body. */

/* Welcome-модалка поверх стандартного .eqc-modal--sm: иконка-«ракета» в шапке,
   две кнопки выровнены вправо в подвале. */
.eqc-tour-welcome { z-index: 9997; align-items: center; }
.eqc-tour-welcome__head {
  display: flex; align-items: center; gap: 14px;
  padding: 22px 22px 8px;
}
.eqc-tour-welcome__icon {
  flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--r-lg);
  background: var(--bg-sunken); color: var(--accent);
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line);
}
.eqc-tour-welcome__lead {
  margin: 0; font-size: 14px; line-height: 21px; color: var(--ink-2);
}
.eqc-tour-welcome__foot { background: transparent; border-top: 0; padding-top: 4px; }

/* Spotlight: «дыра» в скриме той же интенсивности, что .eqc-modal-scrim. */
.eqc-tour-spot {
  position: fixed; z-index: 9998; pointer-events: none;
  border-radius: var(--r-lg);
  border: 1.5px solid var(--accent);
  box-shadow: 0 0 0 9999px rgba(9, 9, 11, .55);
  transition: top .3s ease, left .3s ease, width .3s ease, height .3s ease;
}
[data-theme="dark"] .eqc-tour-spot { box-shadow: 0 0 0 9999px rgba(0, 0, 0, .72); }

/* Tooltip-карточка: визуальный язык .eqc-help, фикс-позиционирование. */
.eqc-tour-tip {
  position: fixed; z-index: 9999;
  width: 380px; max-width: calc(100vw - 32px);
  padding: 16px 20px 14px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg);
  color: var(--ink); font-family: var(--font-sans);
}
.eqc-tour-tip__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 8px;
}
.eqc-tour-tip__step {
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  color: var(--ink-muted); letter-spacing: .04em;
}
.eqc-tour-tip__step-sep { margin: 0 2px; color: var(--ink-faint); }
.eqc-tour-tip__close {
  width: 24px; height: 24px; padding: 0; border-radius: var(--r-sm);
  border: 0; background: transparent; color: var(--ink-muted);
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.eqc-tour-tip__close:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-tour-tip__close:focus-visible { outline: 2px solid var(--green-500); outline-offset: 1px; }
.eqc-tour-tip__title {
  margin: 0 0 6px; font-size: 14px; font-weight: 600;
  line-height: 20px; color: var(--ink);
}
.eqc-tour-tip__lead {
  margin: 0 0 14px; font-size: 13px; line-height: 19px; color: var(--ink-2);
}
.eqc-tour-tip__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.eqc-tour-tip__foot .eqc-btn--primary { margin-left: auto; }

/* Стрелка-указатель. Один элемент 12×12, повёрнут на 45°. Бортик рисуется
   двумя соседними границами — в зависимости от [data-pos] показываем
   соответствующую пару. */
.eqc-tour-tip__arrow {
  position: absolute; width: 12px; height: 12px;
  background: var(--bg-elev); transform: rotate(45deg);
}
.eqc-tour-tip[data-pos="bottom"] .eqc-tour-tip__arrow {
  top: -7px; left: 50%; margin-left: -6px;
  border-top: 1px solid var(--line); border-left: 1px solid var(--line);
}
.eqc-tour-tip[data-pos="top"] .eqc-tour-tip__arrow {
  bottom: -7px; left: 50%; margin-left: -6px;
  border-bottom: 1px solid var(--line); border-right: 1px solid var(--line);
}
.eqc-tour-tip[data-pos="left"] .eqc-tour-tip__arrow {
  right: -7px; top: 50%; margin-top: -6px;
  border-top: 1px solid var(--line); border-right: 1px solid var(--line);
}
.eqc-tour-tip[data-pos="right"] .eqc-tour-tip__arrow {
  left: -7px; top: 50%; margin-top: -6px;
  border-bottom: 1px solid var(--line); border-left: 1px solid var(--line);
}

/* Completion-toast: маленькая карточка по центру сверху, иконка-чек слева. */
.eqc-tour-toast {
  position: fixed; top: 24px; left: 50%; transform: translateX(-50%);
  z-index: 9999; min-width: 300px; max-width: calc(100vw - 32px);
  padding: 12px 16px; display: flex; align-items: center; gap: 12px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); color: var(--ink);
}
.eqc-tour-toast__icon {
  flex-shrink: 0; width: 28px; height: 28px; border-radius: 99px;
  background: var(--green-50); color: var(--green-700);
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line);
}
[data-theme="dark"] .eqc-tour-toast__icon {
  background: var(--green-900); color: var(--green-300);
}
.eqc-tour-toast__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eqc-tour-toast__body b { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 18px; }
.eqc-tour-toast__body span { font-size: 12px; color: var(--ink-muted); line-height: 17px; }

/* Мобильный fallback: тултип превращается в bottom-sheet, стрелка скрыта.
   Welcome- и completion-карточки сужаются под viewport автоматически
   через max-width: calc(100vw - 32px). */
@media (max-width: 640px) {
  .eqc-tour-tip {
    position: fixed !important;
    left: 0 !important; right: 0 !important;
    bottom: 0 !important; top: auto !important;
    width: 100%; max-width: none;
    border-radius: 16px 16px 0 0;
    padding: 18px 18px calc(env(safe-area-inset-bottom, 0px) + 18px);
  }
  .eqc-tour-tip__arrow { display: none; }
}

/* Когортный виджет: ряд «заголовок + help-кнопка» */
.eqc-funnel__title-row { display: flex; align-items: center; gap: 0; }

@media (max-width: 480px) {
  .eqc-help { width: calc(100vw - 32px); left: auto; right: 0; }
}

/* ---------- Мобильная навигация ---------- */
.eqc-topbar__brand { display: none; align-items: center; gap: 10px; text-decoration: none; min-width: 0; }
.eqc-topbar__brand-logo {
  width: 30px; height: 30px; border-radius: 7px; background: var(--green-500);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600; flex-shrink: 0;
}
.eqc-topbar__brand-title {
  font-weight: 600; font-size: 15px; letter-spacing: -0.005em; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.eqc-burger { display: none; }
.eqc-drawer-scrim { position: fixed; inset: 0; background: rgba(9, 9, 11, .55); z-index: 300; }
[data-theme="dark"] .eqc-drawer-scrim { background: rgba(0, 0, 0, .7); }
.eqc-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 308px; z-index: 301;
  background: var(--bg-elev); border-left: 1px solid var(--line);
  display: flex; flex-direction: column; overflow-y: auto;
}
.eqc-drawer__head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 16px; border-bottom: 1px solid var(--line);
}
.eqc-drawer__head .lbl {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-drawer__x {
  width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;
  color: var(--ink-muted); border-radius: var(--r-sm); border: 0;
  background: transparent; cursor: pointer;
}
.eqc-drawer__x:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-drawer__ucard {
  display: flex; align-items: center; gap: 10px; padding: 14px 16px;
  border-bottom: 1px solid var(--line); text-decoration: none;
}
.eqc-drawer__ucard .av {
  width: 40px; height: 40px; border-radius: 99px; background: var(--green-700);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 13px; font-weight: 600; flex-shrink: 0;
}
.eqc-drawer__ucard .nm { font-weight: 500; font-size: 14px; line-height: 18px; color: var(--ink); }
.eqc-drawer__ucard .em {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); margin-top: 2px;
}
.eqc-drawer__quick { padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; border-bottom: 1px solid var(--line); }
.eqc-drawer__quick .eqc-btn { height: 40px; justify-content: flex-start; padding: 0 14px; font-size: 14px; }
.eqc-drawer__nav { padding: 6px 8px; border-bottom: 1px solid var(--line); flex: 1; }
.eqc-drawer__nv {
  display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 10px;
  border-radius: var(--r-md); font-size: 14px; color: var(--ink-2);
  text-decoration: none; background: transparent; border: 0; width: 100%;
  cursor: pointer; text-align: left; font: inherit;
}
.eqc-drawer__nv:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-drawer__nv.is-active { background: var(--green-50); color: var(--green-700); }
[data-theme="dark"] .eqc-drawer__nv.is-active { background: var(--green-900); color: var(--green-300); }
.eqc-drawer__nv .glyph { color: var(--ink-muted); }
.eqc-drawer__nv--danger { color: var(--danger-700); }
[data-theme="dark"] .eqc-drawer__nv--danger { color: #FCA5A5; }

/* На «ноутбучных» ширинах сжимаем строку поиска, чтобы хлебные крошки не
   утыкались в неё (главная проблема: 340px-поле + длинный путь не помещаются
   рядом с действиями справа). Сначала режем плейсхолдер «Поиск…», потом
   сворачиваем поле в иконку. */
@media (max-width: 1280px) {
  .eqc-cmdk { width: 220px; }
}
@media (max-width: 1100px) {
  .eqc-cmdk { width: auto; padding: 0 8px; gap: 0; }
  .eqc-cmdk__ph, .eqc-kbd { display: none; }
}

@media (max-width: 768px) {
  .eqc-shell-body { padding-left: 0; }
  .eqc-rail { display: none; }
  .eqc-topbar { left: 0; gap: 10px; }
  .eqc-crumbs, .eqc-cmdk, .eqc-topbar__actions-desktop { display: none; }
  .eqc-topbar__brand { display: flex; }
  .eqc-burger { display: inline-flex; }
}

/* =====================================================================
   ДАШБОРД — менеджер + админ (батч 1).
   Макет: «.design/Equipment CRM Platform/Блок 3 — Dashboards».

   Реимплементация поверх Alpine-компонентов dashboardPage /
   dashboardCohortWidget — те же /api/dashboard/*, другая разметка/классы.
   ===================================================================== */

/* ---------- Состояния страницы ---------- */
.eqc-pagestate {
  padding: 48px 32px; text-align: center; color: var(--ink-muted); font-size: 14px;
}
.eqc-pagestate--err { color: var(--danger-700); }
.eqc-pagestate--err a { color: var(--accent); margin-left: 8px; }

/* ---------- Page header ---------- */
.eqc-pgh {
  padding: 22px 32px 18px; border-bottom: 1px solid var(--line); background: var(--bg);
}
.eqc-pgh__eyebrow {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-pgh__row {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 24px; margin-top: 4px;
}
.eqc-pgh h1 {
  margin: 0; font-size: 26px; line-height: 32px; font-weight: 600;
  letter-spacing: -0.014em; color: var(--ink);
}
.eqc-pgh__sub { margin: 6px 0 0; font-size: 13px; color: var(--ink-muted); }

/* ---------- Контейнер контента дашборда ---------- */
.eqc-page {
  padding: 24px 32px 40px; display: flex; flex-direction: column; gap: 28px;
}

/* ---------- Hero «Создать новое КП» ---------- */
.eqc-hero {
  display: grid; grid-template-columns: 1fr auto; gap: 32px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 24px 28px; align-items: center;
  position: relative; overflow: hidden; text-decoration: none; color: inherit;
}
.eqc-hero::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--green-500);
}
.eqc-hero:hover { border-color: var(--line-strong); }
.eqc-hero__lab {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted); margin-bottom: 8px;
}
.eqc-hero h2 {
  margin: 0 0 6px; font-size: 22px; line-height: 28px; letter-spacing: -0.01em;
  font-weight: 600; color: var(--ink);
}
.eqc-hero p { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 20px; max-width: 64ch; }
.eqc-hero__mini {
  display: flex; flex-wrap: wrap; gap: 18px; margin-top: 14px;
  font-size: 12px; color: var(--ink-muted);
}
.eqc-hero__mini b { color: var(--ink-2); font-weight: 600; }
.eqc-hero__cta { display: flex; flex-direction: column; gap: 8px; min-width: 220px; }

/* ---------- KPI / OP плитки ---------- */
.eqc-kpi-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.eqc-kpi-grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.eqc-kpi {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 16px 18px;
  display: flex; flex-direction: column; gap: 8px; min-height: 96px;
}
.eqc-kpi__lab {
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
  color: var(--ink-muted); display: flex; align-items: center; gap: 6px;
}
.eqc-kpi__lab .glyph { color: var(--ink-faint); }
.eqc-kpi__num {
  font-size: 32px; line-height: 38px; font-weight: 600; letter-spacing: -0.018em;
  font-variant-numeric: tabular-nums; color: var(--ink); margin-top: auto;
}
.eqc-kpi__num .unit { font-size: 14px; color: var(--ink-muted); font-weight: 400; margin-left: 4px; }
.eqc-kpi--op { padding: 14px 16px; min-height: 84px; }
.eqc-kpi--op .eqc-kpi__num { font-size: 26px; line-height: 32px; }

/* ---------- Заголовок секции ---------- */
.eqc-sect { display: flex; flex-direction: column; gap: 12px; }
.eqc-sect-head {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
}
.eqc-sect-head__title {
  margin: 0; font-size: 13px; font-family: var(--font-mono); text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted); font-weight: 500;
}
.eqc-sect-head__title b { color: var(--ink); font-weight: 600; }
.eqc-sect-head__eyebrow {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-link {
  font-size: 12px; color: var(--green-700); text-decoration: none; font-weight: 500;
  display: inline-flex; align-items: center; gap: 4px; white-space: nowrap;
}
[data-theme="dark"] .eqc-link { color: var(--green-400); }
.eqc-link:hover { text-decoration: underline; }

/* Сегментный переключатель «Мои / Вся компания». */
.eqc-sw {
  display: inline-flex; border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); padding: 2px; font-size: 12px; line-height: 1;
}
.eqc-sw button {
  height: 24px; padding: 0 10px; border-radius: 4px; background: transparent;
  border: 0; color: var(--ink-muted); font: inherit; font-weight: 500; cursor: pointer;
}
.eqc-sw button.is-active { background: var(--bg-sunken); color: var(--ink); box-shadow: var(--sh-xs); }
[data-theme="dark"] .eqc-sw button.is-active { background: var(--zinc-800); color: #fff; }

/* ---------- Виджет «Горячие КП» ---------- */
.eqc-segs { display: flex; gap: 8px; flex-wrap: wrap; }
.eqc-seg {
  display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px;
  border-radius: var(--r-full); border: 1px solid var(--line-strong);
  background: var(--bg-elev); color: var(--ink-2); font: inherit; font-size: 12px;
  cursor: pointer; line-height: 1;
}
.eqc-seg:hover { background: var(--bg-sunken); }
.eqc-seg.is-active { background: var(--zinc-900); color: #fff; border-color: var(--zinc-900); }
[data-theme="dark"] .eqc-seg.is-active { background: #fff; color: var(--zinc-900); border-color: #fff; }
.eqc-seg__count {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
  background: var(--bg-sunken); padding: 1px 6px; border-radius: 99px;
}
.eqc-seg.is-active .eqc-seg__count { color: #fff; background: rgba(255, 255, 255, .16); }
[data-theme="dark"] .eqc-seg.is-active .eqc-seg__count { color: var(--zinc-900); background: rgba(0, 0, 0, .12); }
/* Цветная точка сегмента — класс отдаёт компонент dashboardPage. */
.mw-chip__dot { width: 7px; height: 7px; border-radius: 99px; background: var(--ink-faint); }
.mw-chip__dot--online { background: var(--green-500); }
.mw-chip__dot--hot { background: var(--danger-500); }
.mw-chip__dot--today { background: var(--warn-500); }
.mw-chip__dot--stale, .mw-chip__dot--not-opened { background: var(--zinc-400); }

.eqc-hot-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.eqc-hotc {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 14px; display: flex; flex-direction: column; gap: 10px; position: relative;
}
.eqc-hotc::before {
  content: ''; position: absolute; left: -1px; top: 14px; bottom: 14px; width: 3px;
  border-radius: 99px; background: var(--line-strong);
}
.eqc-hotc:has(.mw-hot__tag--online)::before { background: var(--green-500); }
.eqc-hotc:has(.mw-hot__tag--hot)::before { background: var(--danger-500); }
.eqc-hotc:has(.mw-hot__tag--today)::before { background: var(--warn-500); }
.eqc-hotc__head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.eqc-hotc__kp { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }
/* Бейдж сегмента — класс mw-hot__tag--* отдаёт компонент. */
.eqc-hotc__tag {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; line-height: 1;
  background: var(--bg-sunken); color: var(--ink-2); border: 1px solid var(--line-strong);
}
.mw-hot__tag--online { background: var(--green-50); color: var(--green-700); border-color: var(--green-200); }
.mw-hot__tag--hot { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
.mw-hot__tag--today { background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200); }
[data-theme="dark"] .mw-hot__tag--online { background: #082818; color: #85C29F; border-color: #13633F; }
[data-theme="dark"] .mw-hot__tag--hot { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
[data-theme="dark"] .mw-hot__tag--today { background: #2A1D05; color: #FCD34D; border-color: #624017; }
/* Бейдж вероятности сделки — класс mw-hot__pp--* отдаёт компонент. */
.eqc-hotc__pp {
  display: inline-flex; align-items: center; gap: 4px; font-family: var(--font-mono);
  font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: var(--r-sm);
  background: var(--bg-sunken); color: var(--ink-muted);
}
.mw-hot__pp--hot { background: var(--green-50); color: var(--green-700); }
.mw-hot__pp--warm { background: var(--warn-50); color: var(--warn-700); }
.mw-hot__pp--cold, .mw-hot__pp--null { background: var(--bg-sunken); color: var(--ink-muted); }
[data-theme="dark"] .mw-hot__pp--hot { background: #082818; color: #85C29F; }
[data-theme="dark"] .mw-hot__pp--warm { background: #2A1D05; color: #FCD34D; }
.eqc-hotc__pp-trend { font-size: 10px; }
.mw-hot__pp-trend--up { color: var(--green-600); }
.mw-hot__pp-trend--down { color: var(--danger-500); }
.mw-hot__pp-trend--flat { color: var(--ink-muted); }
.eqc-hotc__client { font-size: 14px; font-weight: 600; line-height: 18px; color: var(--ink); }
.eqc-hotc__author { font-size: 12px; color: var(--ink-muted); margin-top: -4px; }
.eqc-hotc__meta {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; padding: 8px 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  font-size: 11px; font-family: var(--font-mono);
}
.eqc-hotc__meta span { color: var(--ink-2); }
.eqc-hotc__meta b { color: var(--ink); font-weight: 600; }
.eqc-hotc__pause {
  font-size: 10px; color: var(--green-700); font-family: var(--font-mono);
  text-transform: uppercase; letter-spacing: .04em;
}
[data-theme="dark"] .eqc-hotc__pause { color: var(--green-400); }
.eqc-hotc__price {
  font-family: var(--font-mono); font-size: 15px; font-variant-numeric: tabular-nums;
  font-weight: 600; color: var(--ink);
}
.eqc-hotc__actions { display: flex; gap: 6px; flex-wrap: wrap; }
.eqc-hotc__actions .eqc-btn { flex: 1; height: 30px; font-size: 12px; }
.eqc-hotc__lastcall { font-size: 10px; color: var(--ink-muted); font-family: var(--font-mono); }
.eqc-hot-state {
  background: var(--bg-elev); border: 1px dashed var(--line-strong);
  border-radius: var(--r-lg); padding: 28px 24px; text-align: center;
  color: var(--ink-muted); font-size: 13px;
}
.eqc-hot-state button {
  margin-left: 8px; background: transparent; border: 0; color: var(--accent);
  font: inherit; cursor: pointer; text-decoration: underline;
}
.eqc-hot-more { display: flex; justify-content: center; }

/* ---------- Когортная воронка ---------- */
.eqc-funnel {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 18px;
}
.eqc-funnel__head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px; margin-bottom: 14px;
}
.eqc-funnel__title { font-size: 14px; font-weight: 600; line-height: 20px; color: var(--ink); }
.eqc-funnel__sub { font-size: 12px; color: var(--ink-muted); margin-top: 2px; }
.eqc-funnel__right { display: flex; align-items: center; gap: 10px; }
.eqc-heat { display: grid; grid-template-columns: repeat(12, 1fr); gap: 6px; }
.eqc-cell {
  aspect-ratio: 1 / 1; border-radius: 6px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; position: relative;
  border: 1px solid var(--line); background: var(--bg-sunken);
  color: var(--ink-2); font-family: var(--font-mono); text-decoration: none;
}
.eqc-cell__pct { font-size: 14px; font-weight: 600; line-height: 1; color: var(--ink); }
.eqc-cell__n { font-size: 10px; color: var(--ink-muted); margin-top: 3px; }
.eqc-cell__wk {
  position: absolute; top: 5px; left: 6px; font-size: 9px; color: var(--ink-faint);
}
.eqc-cell.mw-cell--imm { background: var(--bg-sunken); }
.eqc-cell.mw-cell--low { background: var(--danger-50); border-color: var(--danger-200); }
.eqc-cell.mw-cell--low .eqc-cell__pct { color: var(--danger-700); }
.eqc-cell.mw-cell--mid { background: var(--warn-50); border-color: var(--warn-200); }
.eqc-cell.mw-cell--mid .eqc-cell__pct { color: var(--warn-700); }
.eqc-cell.mw-cell--high { background: var(--green-500); border-color: var(--green-600); }
.eqc-cell.mw-cell--high .eqc-cell__pct,
.eqc-cell.mw-cell--high .eqc-cell__n,
.eqc-cell.mw-cell--high .eqc-cell__wk { color: #fff; }
[data-theme="dark"] .eqc-cell.mw-cell--low { background: #2A0808; border-color: #7F1D1D; }
[data-theme="dark"] .eqc-cell.mw-cell--low .eqc-cell__pct { color: #FCA5A5; }
[data-theme="dark"] .eqc-cell.mw-cell--mid { background: #3F2A0A; border-color: #92400E; }
[data-theme="dark"] .eqc-cell.mw-cell--mid .eqc-cell__pct { color: #FBBF24; }
[data-theme="dark"] .eqc-cell.mw-cell--high { background: #176E48; border-color: #0E3D26; }
.eqc-funnel__foot {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
  border-top: 1px solid var(--line); margin-top: 16px; padding-top: 14px;
}
.eqc-funnel__k {
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
  color: var(--ink-muted); margin-bottom: 4px; font-family: var(--font-mono);
}
.eqc-funnel__v {
  font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em; color: var(--ink);
}
.eqc-funnel__state { padding: 24px; text-align: center; color: var(--ink-muted); font-size: 13px; }

/* ---------- Карточка-таблица ---------- */
.eqc-card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden;
}
.eqc-card__h {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-bottom: 1px solid var(--line);
}
.eqc-card__h h4 { margin: 0; font-size: 14px; font-weight: 600; color: var(--ink); }
.eqc-tbl { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; }
.eqc-tbl thead th {
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 500;
  color: var(--ink-muted); text-align: left; padding: 10px 16px;
  background: var(--bg-sunken); border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
}
.eqc-tbl thead th.r { text-align: right; }
.eqc-tbl tbody td {
  padding: 10px 16px; border-bottom: 1px solid var(--line);
  vertical-align: middle; line-height: 20px; color: var(--ink-2);
}
.eqc-tbl tbody tr:last-child td { border-bottom: 0; }
.eqc-tbl tbody tr.is-link { cursor: pointer; }
.eqc-tbl tbody tr:hover { background: var(--bg-sunken); }
.eqc-tbl td.r { text-align: right; }
.eqc-tbl .id { font-family: var(--font-mono); color: var(--ink-muted); font-size: 12px; }
.eqc-tbl .sum { font-family: var(--font-mono); font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; }
.eqc-tbl .nm { font-weight: 500; color: var(--ink); }
.eqc-tbl .muted { color: var(--ink-muted); }
.eqc-card-empty {
  padding: 32px 24px; text-align: center; color: var(--ink-muted); font-size: 13px;
}
.eqc-card-empty a { color: var(--accent); }

/* ---------- Статус-плашка (класс mw-pill--* отдаёт компонент) ---------- */
.mw-pill {
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; border: 1px solid var(--line-strong);
  background: var(--bg-elev); color: var(--ink-2); line-height: 1; white-space: nowrap;
}
.mw-pill__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ink-muted); }
.mw-pill--sent, .mw-pill--accepted { background: var(--green-50); color: var(--green-700); border-color: var(--green-200); }
.mw-pill--sent .mw-pill__dot, .mw-pill--accepted .mw-pill__dot { background: var(--green-500); }
.mw-pill--in_progress { background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200); }
.mw-pill--in_progress .mw-pill__dot { background: var(--warn-500); }
.mw-pill--rejected { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
.mw-pill--rejected .mw-pill__dot { background: var(--danger-500); }
.mw-pill--draft { background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line-strong); }
[data-theme="dark"] .mw-pill--sent, [data-theme="dark"] .mw-pill--accepted { background: #082818; color: #85C29F; border-color: #13633F; }
[data-theme="dark"] .mw-pill--in_progress { background: #2A1D05; color: #FCD34D; border-color: #624017; }
[data-theme="dark"] .mw-pill--rejected { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }

/* ---------- Быстрые действия (админ) ---------- */
.eqc-qa-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.eqc-qa {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 16px; display: flex; flex-direction: column; gap: 8px;
  text-decoration: none; color: inherit; min-height: 116px; position: relative;
}
.eqc-qa:hover { border-color: var(--line-strong); background: var(--bg-sunken); }
.eqc-qa__ico {
  width: 32px; height: 32px; border-radius: 8px; background: var(--bg-sunken);
  color: var(--ink-2); display: flex; align-items: center; justify-content: center;
}
.eqc-qa--primary { background: var(--green-50); border-color: var(--green-200); }
[data-theme="dark"] .eqc-qa--primary { background: #082818; border-color: #13633F; }
.eqc-qa--primary .eqc-qa__ico { background: var(--green-500); color: #fff; }
.eqc-qa__ttl { font-size: 14px; font-weight: 600; color: var(--ink); margin-top: 2px; }
.eqc-qa__sub { font-size: 12px; color: var(--ink-muted); line-height: 17px; }

/* ---------- Алерты безопасности ---------- */
.eqc-alerts {
  display: flex; flex-direction: column; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden;
}
.eqc-alert-row {
  display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center;
  padding: 12px 16px; border-bottom: 1px solid var(--line);
  text-decoration: none; color: inherit;
}
.eqc-alert-row:last-child { border-bottom: 0; }
.eqc-alert-row:hover { background: var(--bg-sunken); }
.eqc-alert__tag {
  display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .06em; padding: 3px 7px;
  border-radius: var(--r-sm); background: var(--bg-sunken); color: var(--ink-2);
  border: 1px solid var(--line-strong); white-space: nowrap;
}
.mw-alert__tag--sec { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
.mw-alert__tag--ai { background: var(--info-50); color: var(--info-700); border-color: var(--info-200); }
[data-theme="dark"] .mw-alert__tag--sec { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
[data-theme="dark"] .mw-alert__tag--ai { background: #0F1F3A; color: #BFDBFE; border-color: #1D4ED8; }
.eqc-alert__ttl { font-weight: 500; color: var(--ink); font-size: 13px; line-height: 18px; }
.eqc-alert__msg { font-size: 12px; color: var(--ink-muted); line-height: 18px; margin-top: 1px; }
.eqc-alert__when {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
  text-align: right; white-space: nowrap;
}
.eqc-alerts-empty {
  padding: 20px 24px; display: flex; align-items: center; gap: 12px;
  background: var(--green-50); color: var(--green-700); font-size: 13px;
}
[data-theme="dark"] .eqc-alerts-empty { background: #082818; color: #85C29F; }

@media (max-width: 1024px) {
  .eqc-kpi-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .eqc-kpi-grid-6 { grid-template-columns: repeat(3, 1fr); }
  .eqc-hot-grid { grid-template-columns: repeat(2, 1fr); }
  .eqc-qa-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .eqc-pgh { padding: 16px 16px 14px; }
  .eqc-page { padding: 16px 16px 32px; gap: 22px; }
  .eqc-hero { grid-template-columns: 1fr; gap: 18px; }
  .eqc-hero__cta { min-width: 0; }
  .eqc-kpi-grid-4, .eqc-kpi-grid-6, .eqc-hot-grid, .eqc-qa-grid { grid-template-columns: 1fr; }
  .eqc-heat { grid-template-columns: repeat(6, 1fr); }
  .eqc-pgh__row { flex-direction: column; gap: 12px; }
}

/* =====================================================================
   СПИСКИ — История КП + Корзина (батч 2).
   Макет: «.design/Equipment CRM Platform/Блок 4 — История КП & Корзина».

   Реимплементация поверх Alpine-компонентов quotationList / quotationTrash —
   те же /api/quotations, другая разметка/классы. Часть :class-биндингов
   отдаёт mw-*-строки (statusClass → mw-pill--*, statusTabClass → mw-fpill,
   toastClass → mw-alert--*) — их переопределяем здесь поверх manager_workspace.
   ===================================================================== */

/* ---------- Доп. модификаторы кнопок оболочки ---------- */
.eqc-btn--sm { height: 28px; padding: 0 10px; font-size: 12px; }
.eqc-btn--danger {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
.eqc-btn--danger:hover { background: #FCE7E7; }
[data-theme="dark"] .eqc-btn--danger { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
[data-theme="dark"] .eqc-btn--danger:hover { background: #3A0F0F; color: #fff; }

/* ---------- Действия в page-header ---------- */
.eqc-pgh__actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.eqc-pgh__note {
  margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: var(--ink-muted);
  max-width: 82ch;
}

/* ---------- Тулбар: фильтр-чипы + поиск ---------- */
.eqc-tbar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 10px 32px; background: var(--bg-elev); border-bottom: 1px solid var(--line);
}
.eqc-tbar__pills { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-right: auto; }
.eqc-fpill {
  display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 12px;
  border: 1px solid var(--line-strong); background: var(--bg-elev); color: var(--ink-2);
  border-radius: var(--r-full); font: inherit; font-size: 12px; font-weight: 500;
  line-height: 1; cursor: pointer; white-space: nowrap;
}
.eqc-fpill:hover { background: var(--bg-sunken); }
.eqc-fpill.is-active { background: var(--zinc-900); color: #fff; border-color: var(--zinc-900); }
[data-theme="dark"] .eqc-fpill.is-active { background: #fff; color: var(--zinc-900); border-color: #fff; }
.eqc-tbar__search {
  display: inline-flex; align-items: center; gap: 8px; height: 32px;
  width: 340px; max-width: 100%; padding: 0 10px; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg-elev);
}
.eqc-tbar__search .glyph { color: var(--ink-muted); }
.eqc-tbar__search input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
  font: inherit; font-size: 13px; color: var(--ink);
}
.eqc-tbar__search input::placeholder { color: var(--ink-faint); }

/* Фильтр КП по менеджеру-автору (admin/commercial_director/sales_lead). */
.eqc-tbar__select { display: inline-flex; align-items: center; }
.eqc-tbar__select > select {
  height: 32px; padding: 0 28px 0 10px; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg-elev); color: var(--ink);
  font: inherit; font-size: 13px; line-height: 1; cursor: pointer; max-width: 220px;
}
.eqc-tbar__select > select:focus { outline: 2px solid var(--accent); outline-offset: 1px; }

/* ---------- Тёмный bulk-бар ---------- */
.eqc-bulkbar {
  position: sticky; top: 52px; z-index: 30;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 10px 32px; background: var(--zinc-900); color: var(--zinc-100);
  border-bottom: 1px solid var(--zinc-800);
}
[data-theme="dark"] .eqc-bulkbar { background: #000; }
.eqc-bulkbar__l { display: flex; align-items: center; gap: 14px; font-size: 13px; }
.eqc-bulkbar__l b { font-weight: 600; font-variant-numeric: tabular-nums; }
.eqc-bulkbar__clear {
  background: transparent; border: 0; color: var(--zinc-400); cursor: pointer;
  font: inherit; font-size: 12px; text-decoration: underline; text-underline-offset: 2px;
}
.eqc-bulkbar__clear:hover { color: #fff; }
.eqc-bulkbar__r { display: flex; align-items: center; gap: 8px; }
.eqc-bulkbar__btn {
  display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px;
  border-radius: var(--r-md); border: 1px solid var(--zinc-700); background: transparent;
  color: var(--zinc-300); font: inherit; font-size: 12px; font-weight: 500; cursor: pointer;
}
.eqc-bulkbar__btn:hover { background: var(--zinc-800); color: #fff; }
.eqc-bulkbar__btn:disabled { opacity: .5; cursor: not-allowed; }
.eqc-bulkbar__btn--danger { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
.eqc-bulkbar__btn--danger:hover { background: #3A0F0F; color: #fff; }

/* ---------- Таблица данных ---------- */
.eqc-dtbl-wrap { background: var(--bg-elev); overflow-x: auto; }
.eqc-dtbl { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
.eqc-dtbl thead th {
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em; font-weight: 500;
  color: var(--ink-muted); text-align: left; padding: 9px 14px; height: 36px;
  background: var(--bg); border-bottom: 1px solid var(--line); white-space: nowrap;
  font-family: var(--font-mono); vertical-align: middle;
}
.eqc-dtbl thead th.r { text-align: right; }
.eqc-dtbl tbody td {
  padding: 0 14px; height: 48px; border-bottom: 1px solid var(--line);
  vertical-align: middle; color: var(--ink-2);
}
.eqc-dtbl tbody td.r { text-align: right; }
.eqc-dtbl tbody tr:last-child td { border-bottom: 0; }
.eqc-dtbl tbody tr.eqc-drow { cursor: pointer; }
.eqc-dtbl tbody tr:hover { background: var(--bg-sunken); }
.eqc-dtbl__cb { width: 48px; }
.eqc-dtbl input[type="checkbox"] {
  width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer;
  vertical-align: middle;
}
/* Акцент дочернего варианта КП (parentRowClass → has-variants). */
.eqc-dtbl tbody tr.has-variants td:first-child { box-shadow: inset 3px 0 0 var(--accent); }

/* ---------- Типографика ячеек ---------- */
.eqc-tnum {
  display: inline-flex; align-items: center; gap: 5px; font-family: var(--font-mono);
  font-size: 13px; font-weight: 500; color: var(--ink); text-decoration: none;
}
a.eqc-tnum:hover { color: var(--accent-hover); }
.eqc-tnum__branch { color: var(--ink-faint); }
.eqc-tnum__var {
  display: inline-block; margin-top: 2px; font-size: 10px; text-transform: uppercase;
  letter-spacing: .05em; color: var(--ink-muted); font-weight: 500; padding: 1px 6px;
  border-radius: 3px; background: var(--bg-sunken); border: 1px solid var(--line);
}
.eqc-tcli, .eqc-teq { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eqc-tcli__n { font-size: 13px; font-weight: 500; color: var(--ink); line-height: 18px; }
.eqc-tcli__s { font-size: 12px; color: var(--ink-muted); line-height: 16px; }
.eqc-teq__n { font-size: 13px; font-weight: 500; color: var(--ink-2); line-height: 18px; }
.eqc-teq__s { font-size: 12px; color: var(--ink-muted); line-height: 16px; }
.eqc-teq__preview { font-size: 12px; color: var(--ink-muted); font-style: italic; line-height: 18px; }
.eqc-teq__photos {
  display: inline-flex; align-items: center; gap: 5px; margin-top: 3px; height: 20px;
  padding: 0 7px; width: fit-content; border: 1px dashed var(--line-strong);
  border-radius: var(--r-sm); font-size: 11px; color: var(--ink-muted);
  font-family: var(--font-mono);
}
.eqc-tsum {
  font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 14px;
  font-weight: 600; color: var(--ink);
}
.eqc-tmgr { font-size: 13px; color: var(--ink-2); }
.eqc-tdate {
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.eqc-tdel { font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted); white-space: nowrap; }

/* ---------- Триггер меню строки ---------- */
.eqc-rowmore {
  width: 28px; height: 28px; display: inline-flex; align-items: center;
  justify-content: center; border-radius: var(--r-sm); color: var(--ink-muted);
  background: transparent; border: 1px solid transparent; cursor: pointer;
}
.eqc-rowmore:hover { background: var(--bg-sunken); color: var(--ink); border-color: var(--line-strong); }
.eqc-rowact { display: inline-flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }

/* Пульсация статус-плашки «Генерация…» (statusClass → mw-pill is-pulsing). */
.mw-pill.is-pulsing { animation: eqc-pulse 1.6s ease-in-out infinite; }
@keyframes eqc-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }

/* ---------- Пагинация ---------- */
.eqc-pager {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  padding: 12px 32px; border-top: 1px solid var(--line); background: var(--bg-elev);
  font-size: 13px; color: var(--ink-muted); flex-wrap: wrap;
}
.eqc-pager__info b { color: var(--ink-2); font-weight: 600; font-family: var(--font-mono); }
.eqc-pager__btns { display: inline-flex; gap: 8px; }
.eqc-pager__step {
  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px;
  border: 1px solid var(--line-strong); background: var(--bg-elev); border-radius: var(--r-md);
  font: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer;
}
.eqc-pager__step:hover:not(:disabled) { background: var(--bg-sunken); }
.eqc-pager__step:disabled { opacity: .4; cursor: not-allowed; }

/* ---------- Empty-state ---------- */
.eqc-empty {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 12px; padding: 56px 24px; background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); margin: 24px 32px;
}
.eqc-empty__ico {
  width: 60px; height: 60px; border: 1.5px dashed var(--line-strong); border-radius: 14px;
  display: flex; align-items: center; justify-content: center; color: var(--ink-faint);
}
.eqc-empty h4 { margin: 0; font-size: 17px; font-weight: 600; color: var(--ink); }
.eqc-empty p { margin: 0; font-size: 13px; color: var(--ink-muted); max-width: 48ch; line-height: 20px; }

/* ---------- Toast корзины (toastClass → mw-alert mw-alert--*) ---------- */
.mw-alert {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 14px 32px 0; padding: 10px 14px; border-radius: var(--r-md); font-size: 13px;
  border: 1px solid var(--line);
}
.mw-alert--ok {
  background: var(--green-50); color: var(--green-700);
  border-color: var(--green-200); border-left: 3px solid var(--green-500);
}
.mw-alert--error {
  background: var(--danger-50); color: var(--danger-700);
  border-color: var(--danger-200); border-left: 3px solid var(--danger-500);
}
[data-theme="dark"] .mw-alert--ok { background: #082818; color: #85C29F; border-color: #13633F; }
[data-theme="dark"] .mw-alert--error { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
.eqc-alert__x {
  background: transparent; border: 0; color: inherit; cursor: pointer; opacity: .7;
  display: inline-flex; padding: 4px;
}
.eqc-alert__x:hover { opacity: 1; }

/* ---------- Мобильные карточки списка ---------- */
.eqc-list-mobile { display: none; }
.eqc-mcard {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 12px 14px; margin-bottom: 10px; display: flex; flex-direction: column;
  gap: 8px; cursor: pointer;
}
.eqc-mcard.has-variants { border-left: 3px solid var(--accent); }
.eqc-mcard__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.eqc-mcard__lf { display: flex; align-items: center; gap: 8px; min-width: 0; }
.eqc-mcard__lf input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); }
.eqc-mcard__num {
  font-family: var(--font-mono); font-size: 13px; font-weight: 500; color: var(--ink);
  text-decoration: none;
}
.eqc-mcard__rf { display: flex; align-items: center; gap: 6px; }
.eqc-mcard__nm { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 18px; }
.eqc-mcard__sub { font-size: 12px; color: var(--ink-muted); margin-top: 1px; }
.eqc-mcard__eq { font-size: 13px; color: var(--ink-2); line-height: 18px; }
.eqc-mcard__eq--preview { color: var(--ink-muted); font-style: italic; }
.eqc-mcard__mgr { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }
.eqc-mcard__foot {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-top: 8px; border-top: 1px solid var(--line);
}
.eqc-mcard__foot span { font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted); }
.eqc-mcard__foot b {
  font-family: var(--font-mono); font-size: 15px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 767px) {
  .eqc-list-desktop { display: none !important; }
  .eqc-list-mobile { display: block; padding: 14px 16px; }
  .eqc-tbar { padding: 10px 16px; }
  .eqc-tbar__search { width: 100%; }
  .eqc-bulkbar { padding: 10px 16px; }
  .eqc-empty { margin: 16px; }
  .mw-alert { margin: 14px 16px 0; }
}

/* =====================================================================
   КЛИЕНТЫ — список + карточка (батч 2).
   Макет: «.design/Equipment CRM Platform/Блок 8 — Клиенты».

   Реимплементация поверх Alpine-компонентов clientsListPage /
   clientDetailPage — те же /api/clients. sourceClass отдаёт cl-src-строки —
   переопределяем их здесь поверх manager_workspace.
   ===================================================================== */

/* ---------- Счётчик в тулбаре ---------- */
.eqc-tbar__counter { margin-left: auto; font-size: 12px; color: var(--ink-muted); }
.eqc-tbar__counter b { font-family: var(--font-mono); color: var(--ink-2); font-weight: 600; }

/* ---------- Аватар-буква ---------- */
.eqc-avl {
  width: 30px; height: 30px; border-radius: var(--r-md); background: var(--zinc-700);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-weight: 600; font-size: 12px; flex-shrink: 0;
}
.eqc-avl--lg { width: 48px; height: 48px; font-size: 18px; border-radius: var(--r-lg); }
.eqc-avl--xl { width: 64px; height: 64px; font-size: 24px; border-radius: var(--r-xl); }

/* ---------- Ячейка клиента в таблице ---------- */
.eqc-cl { display: flex; align-items: center; gap: 10px; min-width: 0; }
.eqc-cl__n { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-dtbl tbody tr:hover .eqc-cl__n { color: var(--accent-hover); }
.eqc-rowgo { color: var(--ink-faint); }
.eqc-dtbl tbody tr:hover .eqc-rowgo { color: var(--ink-muted); }

/* ---------- Бейдж источника (sourceClass → cl-src cl-src--*) ---------- */
.cl-src {
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; line-height: 1; white-space: nowrap;
  border: 1px solid var(--line-strong); background: var(--bg-sunken); color: var(--ink-2);
}
.cl-src::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--ink-muted);
}
.cl-src--bitrix { background: var(--info-50); color: var(--info-700); border-color: var(--info-200); }
.cl-src--bitrix::before { background: var(--info-500); }
.cl-src--manual { background: var(--bg-sunken); color: var(--ink-2); border-color: var(--line); }
.cl-src--quotation { background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line-strong); }
.cl-src--quotation::before { background: var(--ink-faint); }
[data-theme="dark"] .cl-src--bitrix { background: #0F1F3A; color: #BFDBFE; border-color: #1D4ED8; }
[data-theme="dark"] .cl-src--bitrix::before { background: #60A5FA; }

/* ---------- Карточка клиента — контейнер ---------- */
.eqc-detail { padding: 24px 32px 40px; display: flex; flex-direction: column; gap: 24px; }

/* ---------- Hero ---------- */
.eqc-clhero {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-xl);
  padding: 22px; display: grid; grid-template-columns: auto 1fr auto; gap: 22px;
  align-items: center;
}
.eqc-clhero__id { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.eqc-clhero__row1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.eqc-clhero__name {
  margin: 0; font-size: 22px; line-height: 28px; font-weight: 600; letter-spacing: -0.012em;
  color: var(--ink);
}
.eqc-clhero__meta {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted);
}
.eqc-clhero__k {
  color: var(--ink-faint); text-transform: uppercase; letter-spacing: .06em;
  font-size: 10px; margin-right: 5px;
}
.eqc-clhero__v { color: var(--ink-2); }
.eqc-clhero__sync { display: inline-flex; align-items: center; gap: 6px; color: var(--green-700); }
[data-theme="dark"] .eqc-clhero__sync { color: var(--green-400); }
.eqc-clhero__syncdot {
  width: 6px; height: 6px; border-radius: 99px; background: var(--green-500);
}
.eqc-clhero__kpis { display: flex; gap: 0; border-left: 1px solid var(--line); }
.eqc-clhero__kpi {
  padding: 0 22px; display: flex; flex-direction: column; gap: 6px;
  border-right: 1px solid var(--line);
}
.eqc-clhero__kpi:last-child { border-right: 0; padding-right: 4px; }
.eqc-clhero__kpi-k {
  font-size: 10px; color: var(--ink-muted); text-transform: uppercase;
  letter-spacing: .08em; font-family: var(--font-mono);
}
.eqc-clhero__kpi-v {
  font-size: 24px; font-weight: 600; font-variant-numeric: tabular-nums;
  letter-spacing: -0.014em; line-height: 1; color: var(--ink);
}

/* ---------- Секция ---------- */
.eqc-sec { display: flex; flex-direction: column; gap: 14px; }
.eqc-sec__h { display: flex; align-items: center; gap: 10px; }
.eqc-sec__num {
  width: 22px; height: 22px; border-radius: var(--r-sm); background: var(--bg-sunken);
  color: var(--ink-2); font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line);
}
.eqc-sec__title { margin: 0; font-size: 15px; font-weight: 600; color: var(--ink); }
.eqc-sec__cnt { font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted); }
.eqc-sec__add { margin-left: auto; }

/* ---------- Карточки контактов ---------- */
.eqc-cc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.eqc-cc {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 14px 16px; display: flex; flex-direction: column; gap: 10px;
}
/* Карточка основного контакта — зелёный акцент (badge есть только у is_primary). */
.eqc-cc:has(.eqc-cc__badge) {
  border-color: var(--green-200);
  background: linear-gradient(180deg, var(--green-50) 0, var(--bg-elev) 60px);
}
[data-theme="dark"] .eqc-cc:has(.eqc-cc__badge) {
  border-color: #13633F;
  background: linear-gradient(180deg, #0E3D26 0, var(--bg-elev) 60px);
}
.eqc-cc__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.eqc-cc__who { min-width: 0; }
.eqc-cc__name {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 14px; font-weight: 600; color: var(--ink);
}
.eqc-cc__badge {
  display: inline-flex; align-items: center; padding: 2px 8px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 500; text-transform: uppercase; letter-spacing: .04em;
  background: var(--green-50); color: var(--green-700); border: 1px solid var(--green-200);
}
[data-theme="dark"] .eqc-cc__badge { background: #082818; color: #85C29F; border-color: #13633F; }
.eqc-cc__pos { margin-top: 3px; font-size: 12px; color: var(--ink-muted); line-height: 1.4; }
.eqc-cc__actions { display: flex; gap: 2px; flex-shrink: 0; }
.eqc-cc__act {
  width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 0; border-radius: var(--r-sm); color: var(--ink-muted);
  cursor: pointer;
}
.eqc-cc__act:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-cc__act--danger:hover { background: var(--danger-50); color: var(--danger-700); }
[data-theme="dark"] .eqc-cc__act--danger:hover { background: #2A0808; color: #FCA5A5; }
.eqc-cc__rows {
  display: flex; flex-direction: column; gap: 0; border-top: 1px solid var(--line);
  padding-top: 4px;
}
.eqc-cc__rr {
  display: grid; grid-template-columns: 84px 1fr; gap: 12px; align-items: center;
  padding: 6px 0; font-size: 13px;
}
.eqc-cc__k {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-cc__v { color: var(--ink-2); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.eqc-cc__v.mono { font-family: var(--font-mono); font-size: 12px; }

/* Пустое состояние / плитка «добавить» контакта. */
.eqc-cc-empty {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px;
  padding: 40px 24px; border: 1.5px dashed var(--line-strong); border-radius: var(--r-lg);
  color: var(--ink-muted); background: var(--bg-elev);
}
.eqc-cc-empty__ico {
  width: 40px; height: 40px; border-radius: 10px; background: var(--bg-sunken);
  display: flex; align-items: center; justify-content: center; color: var(--ink-faint);
}
.eqc-cc-empty h5 { margin: 0; font-size: 14px; font-weight: 600; color: var(--ink-2); }
.eqc-cc-empty p { margin: 0; font-size: 12px; }
.eqc-cc-add {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 8px; padding: 24px; min-height: 140px;
  border: 1.5px dashed var(--line-strong); border-radius: var(--r-lg);
  background: transparent; color: var(--ink-muted); cursor: pointer; font: inherit;
}
.eqc-cc-add:hover { border-color: var(--accent); background: var(--green-50); }
[data-theme="dark"] .eqc-cc-add:hover { background: rgba(31, 138, 91, .1); }
.eqc-cc-add__ico {
  width: 36px; height: 36px; border-radius: 9px; background: var(--bg-sunken);
  display: flex; align-items: center; justify-content: center; color: var(--ink-muted);
}
.eqc-cc-add h5 { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.eqc-cc-add p { margin: 0; font-size: 11px; max-width: 30ch; line-height: 1.4; }

/* ---------- Модальное окно ---------- */
.eqc-modal-scrim {
  position: fixed; inset: 0; z-index: 400; display: flex; align-items: flex-start;
  justify-content: center; padding: 56px 16px; overflow-y: auto;
  background: rgba(9, 9, 11, .55);
}
[data-theme="dark"] .eqc-modal-scrim { background: rgba(0, 0, 0, .72); }
.eqc-modal {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-xl);
  box-shadow: var(--sh-lg); width: 100%; display: flex; flex-direction: column;
}
.eqc-modal--sm { max-width: 440px; }
.eqc-modal--md { max-width: 620px; }
.eqc-modal--lg { max-width: 960px; }
.eqc-modal__head {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 18px 22px 14px; gap: 18px;
}
.eqc-modal__title { margin: 0; font-size: 18px; font-weight: 600; color: var(--ink); }
.eqc-modal__close {
  flex-shrink: 0; width: 30px; height: 30px; display: flex; align-items: center;
  justify-content: center; border-radius: var(--r-sm); color: var(--ink-muted);
  background: transparent; border: 0; cursor: pointer;
}
.eqc-modal__close:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-modal__body {
  padding: 0 22px 18px; display: flex; flex-direction: column; gap: 14px;
}
.eqc-modal__foot {
  display: flex; justify-content: flex-end; gap: 8px; padding: 14px 22px;
  border-top: 1px solid var(--line); background: var(--bg-sunken);
}

/* ---------- Поля формы ---------- */
.eqc-field { display: flex; flex-direction: column; gap: 6px; }
.eqc-field__lbl { font-size: 12px; font-weight: 500; color: var(--ink-2); }
.eqc-field__lblrow { display: flex; align-items: center; }
.eqc-field__req { color: var(--danger-700); }
.eqc-field__err { font-size: 11px; color: var(--danger-700); }
[data-theme="dark"] .eqc-field__err { color: #FCA5A5; }
.eqc-input {
  height: 34px; padding: 0 10px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: var(--bg-elev); font: inherit;
  font-size: 14px; color: var(--ink); width: 100%;
}
select.eqc-input { padding: 0 6px; }
.eqc-input:focus {
  outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(31, 138, 91, .12);
}
.eqc-input::placeholder { color: var(--ink-faint); }
.eqc-input.is-err { border-color: var(--danger-200); background: var(--danger-50); }
[data-theme="dark"] .eqc-input.is-err { background: #2A0808; border-color: #7F1D1D; }

/* ---------- Редактор массивов (телефоны / email / мессенджеры) ---------- */
.eqc-arr { display: flex; flex-direction: column; gap: 8px; }
.eqc-arr__h { display: flex; align-items: center; justify-content: space-between; }
.eqc-arr__add {
  display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px;
  border: 1px dashed var(--line-strong); border-radius: var(--r-md); background: transparent;
  color: var(--ink-2); font: inherit; font-size: 12px; font-weight: 500; cursor: pointer;
}
.eqc-arr__add:hover { border-color: var(--accent); color: var(--accent-hover); background: var(--green-50); }
[data-theme="dark"] .eqc-arr__add:hover { background: rgba(31, 138, 91, .1); color: var(--green-300); }
.eqc-arr__item { display: flex; flex-direction: column; gap: 4px; }
.eqc-arr__row { display: grid; gap: 8px; align-items: center; }
.eqc-arr__row--phone { grid-template-columns: 92px 1fr 80px 36px; }
.eqc-arr__row--email { grid-template-columns: 1fr 36px; }
.eqc-arr__row--msg { grid-template-columns: 128px 1fr 36px; }
.eqc-arr__rm {
  width: 36px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
  background: transparent; border: 1px solid transparent; border-radius: var(--r-md);
  color: var(--ink-muted); cursor: pointer;
}
.eqc-arr__rm:hover { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
[data-theme="dark"] .eqc-arr__rm:hover { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }

@media (max-width: 1024px) {
  .eqc-cc-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .eqc-detail { padding: 16px; gap: 18px; }
  .eqc-clhero { grid-template-columns: 1fr; gap: 16px; }
  .eqc-clhero__kpis { border-left: 0; border-top: 1px solid var(--line); padding-top: 14px; }
  .eqc-clhero__kpi:first-child { padding-left: 0; }
  .eqc-arr__row--phone { grid-template-columns: 1fr 1fr; }
}

/* =====================================================================
   ЛИЧНЫЙ КАБИНЕТ — хаб (батч 3).
   Макет: «.design/Equipment CRM Platform/Блок 9 — Личный кабинет», 9.1.

   Реимплементация поверх Alpine-компонента profileHub — те же
   /api/users/me, другая разметка/классы.
   ===================================================================== */

/* ---------- Hero хаба ---------- */
.eqc-prof-hero {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 22px 24px;
  display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: center;
}
.eqc-prof-hero__id { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.eqc-prof-hero__row1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.eqc-prof-hero__name {
  margin: 0; font-size: 22px; line-height: 28px; font-weight: 600;
  letter-spacing: -0.012em; color: var(--ink);
}
.eqc-prof-hero__meta {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-2);
}
.eqc-prof-hero__row { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.eqc-prof-hero__row .glyph { color: var(--ink-muted); flex-shrink: 0; }
.eqc-prof-hero__sep {
  width: 3px; height: 3px; border-radius: 99px; background: var(--ink-faint);
}

/* ---------- Бейдж (роль и пр.) ---------- */
.eqc-tag {
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; line-height: 1; white-space: nowrap;
  border: 1px solid var(--line-strong); background: var(--bg-sunken); color: var(--ink-2);
}
.eqc-tag::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--ink-muted);
}
.eqc-tag--ok { background: var(--green-50); color: var(--green-700); border-color: var(--green-200); }
.eqc-tag--ok::before { background: var(--green-500); }
[data-theme="dark"] .eqc-tag--ok { background: #082818; color: #85C29F; border-color: #13633F; }
[data-theme="dark"] .eqc-tag--ok::before { background: var(--green-400); }

/* ---------- Сетка тайлов-разделов ---------- */
.eqc-tilegrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.eqc-tile {
  display: flex; align-items: center; gap: 14px; padding: 16px 18px;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
  text-decoration: none; color: inherit; position: relative;
  transition: border-color .12s;
}
.eqc-tile:hover { border-color: var(--green-300); }
[data-theme="dark"] .eqc-tile:hover { border-color: var(--green-700); }
.eqc-tile__ico {
  width: 40px; height: 40px; border-radius: var(--r-md); flex-shrink: 0;
  background: var(--bg-sunken); border: 1px solid var(--line);
  display: inline-flex; align-items: center; justify-content: center; color: var(--ink-2);
}
.eqc-tile:hover .eqc-tile__ico {
  color: var(--green-700); border-color: var(--green-200); background: var(--green-50);
}
[data-theme="dark"] .eqc-tile:hover .eqc-tile__ico {
  color: var(--green-300); border-color: var(--green-700); background: rgba(31, 138, 91, .12);
}
.eqc-tile__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.eqc-tile__t { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 18px; }
.eqc-tile__d { font-size: 12px; color: var(--ink-muted); line-height: 16px; }
.eqc-tile__arr { color: var(--ink-faint); flex-shrink: 0; }
.eqc-tile:hover .eqc-tile__arr { color: var(--green-700); }
[data-theme="dark"] .eqc-tile:hover .eqc-tile__arr { color: var(--green-300); }
.eqc-tile__pip {
  position: absolute; top: 10px; right: 12px; display: inline-flex; align-items: center;
  gap: 5px; font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-faint);
}
.eqc-tile__pip::before {
  content: ''; width: 5px; height: 5px; border-radius: 99px; background: var(--green-500);
}

@media (max-width: 1024px) {
  .eqc-tilegrid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .eqc-tilegrid { grid-template-columns: 1fr; }
}

/* =====================================================================
   ЛИЧНЫЙ КАБИНЕТ — формы (батч 3).
   Макет: «Блок 9», 9.2 (контакты) + 9.3 (смена пароля).

   Реимплементация поверх Alpine-компонентов profileContactsForm /
   changePasswordForm. profileContactsForm.toastClass отдаёт строки
   Tailwind-утилит — переопределяем их составными селекторами
   .eqc-banner.bg-* (специфичность 0,2,0 бьёт утилиту, pack.css в каскаде
   после Tailwind).
   ===================================================================== */

/* ---------- Центрированная обёртка формы ---------- */
.eqc-prof-wrap { padding: 32px; display: flex; justify-content: center; }
.eqc-prof-wrap__inner {
  width: 100%; display: flex; flex-direction: column; gap: 14px;
}
.eqc-prof-wrap__inner--2xl { max-width: 680px; }
.eqc-prof-wrap__inner--md { max-width: 460px; }

/* ---------- Карточка-форма ---------- */
.eqc-formcard {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 24px;
}
.eqc-formcard__eyebrow {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted); margin-bottom: 8px;
}
.eqc-formcard__title {
  margin: 0 0 4px; font-size: 18px; font-weight: 600; line-height: 24px;
  letter-spacing: -0.005em; color: var(--ink);
}
.eqc-formcard__lede {
  margin: 0 0 18px; font-size: 13px; color: var(--ink-muted); line-height: 18px;
}
.eqc-formcard__grid { display: flex; flex-direction: column; gap: 16px; }
.eqc-formcard > .eqc-banner { margin-top: 16px; }
.eqc-formcard__foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-top: 20px; padding-top: 18px;
  border-top: 1px solid var(--line);
}

/* Городской телефон + добавочный — две колонки. */
.eqc-field-row { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; }

/* ---------- Подсказка под полем ---------- */
.eqc-formhint {
  display: flex; align-items: flex-start; gap: 6px; margin: 0;
  font-size: 11px; line-height: 15px; color: var(--ink-muted); min-width: 0;
}
.eqc-formhint .glyph { flex-shrink: 0; margin-top: 1px; color: var(--ink-faint); }
.eqc-formhint b {
  font-family: var(--font-mono); font-weight: 500; color: var(--ink-2);
}

/* ---------- Баннер (тост / ошибка / успех / предупреждение) ---------- */
.eqc-banner {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; border-radius: var(--r-md);
  font-size: 13px; line-height: 18px; border: 1px solid;
}
.eqc-banner .glyph { flex-shrink: 0; margin-top: 1px; }
.eqc-banner b { display: block; font-weight: 600; margin-bottom: 2px; }
.eqc-banner--ok,
.eqc-banner.bg-primary-fixed {
  background: var(--green-50); border-color: var(--green-200); color: var(--green-700);
}
.eqc-banner--err,
.eqc-banner.bg-error-container {
  background: var(--danger-50); border-color: var(--danger-200); color: var(--danger-700);
}
.eqc-banner--warn {
  background: var(--warn-50); border-color: var(--warn-200); color: var(--warn-700);
}
.eqc-banner--info {
  background: var(--info-50); border-color: var(--info-200); color: var(--info-700);
}
/* Антидубль-панель (.plans/tz-equipment-dedup-merge.md §5): колонка вместо
   flex-строки базового .eqc-banner. */
.eqc-dup-warn { flex-direction: column; gap: 10px; }
.eqc-dup-warn__head { display: flex; align-items: flex-start; gap: 10px; font-weight: 600; }
.eqc-dup-warn__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.eqc-dup-warn__item {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 10px; background: var(--bg-elev);
  border: 1px solid var(--warn-200); border-radius: var(--r-sm);
}
.eqc-dup-warn__link {
  display: flex; flex-direction: column; gap: 2px;
  text-decoration: none; color: var(--ink); font-weight: 500;
}
.eqc-dup-warn__link:hover { text-decoration: underline; }
.eqc-dup-warn__sub { font-size: 12px; color: var(--ink-muted); font-weight: 400; }
.eqc-dup-warn__foot { display: flex; justify-content: flex-end; }
[data-theme="dark"] .eqc-banner--ok,
[data-theme="dark"] .eqc-banner.bg-primary-fixed {
  background: var(--green-900); border-color: #13633F; color: #85C29F;
}
[data-theme="dark"] .eqc-banner--err,
[data-theme="dark"] .eqc-banner.bg-error-container {
  background: #2A0808; border-color: #7F1D1D; color: #FCA5A5;
}
[data-theme="dark"] .eqc-banner--warn {
  background: #2A1D05; border-color: #624017; color: #FCD34D;
}
[data-theme="dark"] .eqc-banner--info {
  background: #0F1F3A; border-color: #1D4ED8; color: #BFDBFE;
}

/* Состояние disabled у кнопок пака (submit формы личного кабинета). */
.eqc-btn:disabled { opacity: .55; cursor: not-allowed; }

/* Поле, занимающее всю ширину formcard-grid (юр.адрес, банк, основание полномочий). */
.eqc-field--wide { width: 100%; }

/* Загрузка ассета (факсимиле / печать) на /settings/company.
   .plans/vectorized-riding-wind.md Фаза 4. Двухколоночная карточка:
   слева — превью изображения с прозрачным шахматным фоном, справа —
   управляющие кнопки. На узких экранах схлопывается в стек. */
.eqc-asset-upload {
  display: grid; gap: 12px; align-items: start;
  grid-template-columns: 140px 1fr;
}
.eqc-asset-upload__preview {
  width: 140px; height: 140px; border: 1px solid var(--line);
  border-radius: var(--r-md); overflow: hidden;
  /* Шахматный паттерн на фоне — чтобы было видно прозрачные PNG факсимиле. */
  background-color: var(--bg-elev);
  background-image:
    linear-gradient(45deg, var(--line) 25%, transparent 25%),
    linear-gradient(-45deg, var(--line) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, var(--line) 75%),
    linear-gradient(-45deg, transparent 75%, var(--line) 75%);
  background-size: 14px 14px;
  background-position: 0 0, 0 7px, 7px -7px, -7px 0;
  display: flex; align-items: center; justify-content: center;
}
.eqc-asset-upload__preview--empty {
  background-image: none; color: var(--ink-faint);
}
.eqc-asset-upload__placeholder {
  font-size: 11px; line-height: 14px; text-align: center; padding: 8px;
}
.eqc-asset-upload__img {
  max-width: 100%; max-height: 100%; object-fit: contain;
}
.eqc-asset-upload__img--stamp {
  /* Печать на превью без угла-rotate: понятнее, как загруженный PNG выглядит
     в исходном виде. Поворот применяется только на обложке КП. */
  filter: drop-shadow(0 0 1px rgba(0,0,0,0.08));
}
.eqc-asset-upload__controls {
  display: flex; flex-wrap: wrap; gap: 8px;
}

@media (max-width: 767px) {
  .eqc-prof-wrap { padding: 16px; }
  .eqc-asset-upload { grid-template-columns: 1fr; }
  .eqc-asset-upload__preview { width: 100%; height: 200px; }
}
@media (max-width: 480px) {
  .eqc-field-row { grid-template-columns: 1fr; }
}

/* =====================================================================
   ФОРМА СОЗДАНИЯ КП (батч 4a).
   Макет: «.design/Equipment CRM Platform/Блок 5 — Форма создания КП».

   Реимплементация поверх Alpine-компонентов quotationForm / tipBox — те же
   /api/*, другая разметка/классы. JS-возвращаемые модификаторы
   (drop-zone-active, is-on, is-active, text-error/text-secondary,
   nk-sect__opt--required) перекрываются составными селекторами ниже.
   ===================================================================== */

/* ---------- Двухколоночная раскладка ---------- */
.eqc-qf {
  display: grid; grid-template-columns: minmax(0, 1fr) 316px; align-items: start;
}
.eqc-qf__main { min-width: 0; padding: 24px 28px 40px; }
.eqc-qf__form { display: flex; flex-direction: column; gap: 18px; }

/* ---------- Кнопка-«small» (используется в карточках CRM/каталога) ---------- */
.eqc-btn--sm { height: 28px; padding: 0 10px; font-size: 12px; gap: 5px; }

/* ---------- Карточка-секция ---------- */
.eqc-qf-card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-xs); overflow: visible;
}
.eqc-qf-card__h {
  display: flex; align-items: center; gap: 10px;
  padding: 13px 18px 12px; border-bottom: 1px solid var(--line);
}
.eqc-qf-card__num {
  width: 22px; height: 22px; flex-shrink: 0; border-radius: 99px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--green-50); color: var(--green-700);
  border: 1px solid var(--green-200);
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
}
[data-theme="dark"] .eqc-qf-card__num {
  background: var(--green-900); color: var(--green-300); border-color: #13633F;
}
.eqc-qf-card__title {
  font-size: 15px; font-weight: 600; letter-spacing: -0.005em; color: var(--ink);
}
.eqc-qf-card__opt {
  margin-left: auto; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ink-faint);
}
/* JS дописывает nk-sect__opt--required, когда CRM-привязка обязательна. */
.eqc-qf-card__opt.nk-sect__opt--required {
  color: var(--danger-700); letter-spacing: .04em;
}
[data-theme="dark"] .eqc-qf-card__opt.nk-sect__opt--required { color: #FCA5A5; }
.eqc-qf-card__b {
  padding: 18px; display: flex; flex-direction: column; gap: 14px;
}

/* ---------- Подсказки / текстовые строки ---------- */
.eqc-qf-hint {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0;
  font-size: 12px; line-height: 17px; color: var(--ink-muted);
}
.eqc-qf-error {
  margin: 0; font-size: 12px; line-height: 17px; color: var(--danger-700);
  font-weight: 500;
}
[data-theme="dark"] .eqc-qf-error { color: #FCA5A5; }
.eqc-qf-errt { color: var(--danger-700); }
[data-theme="dark"] .eqc-qf-errt { color: #FCA5A5; }
.eqc-qf-errmsg {
  margin: 0; font-size: 13px; line-height: 20px; color: var(--ink-2);
  white-space: pre-wrap; word-break: break-word;
}

/* ---------- Поле + ссылка в строке метки ---------- */
.eqc-qf-lblrow { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.eqc-qf-link {
  background: transparent; border: 0; padding: 0; cursor: pointer;
  font: inherit; font-size: 12px; font-weight: 500; color: var(--green-700);
}
[data-theme="dark"] .eqc-qf-link { color: var(--green-400); }
.eqc-qf-link:hover { text-decoration: underline; }

/* ---------- Autocomplete-выпадашка ---------- */
.eqc-qf-field--ac { position: relative; }
.eqc-qf-ac {
  position: absolute; left: 0; right: 0; top: 100%; margin-top: 4px; z-index: 50;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--sh-lg);
  max-height: 280px; overflow-y: auto; padding: 4px;
}
.eqc-qf-ac__h {
  padding: 7px 9px; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .07em; color: var(--ink-muted);
  border-bottom: 1px solid var(--line); margin-bottom: 4px;
}
.eqc-qf-ac__it {
  width: 100%; text-align: left; background: transparent; border: 0;
  padding: 8px 9px; border-radius: var(--r-sm); cursor: pointer;
  display: flex; flex-direction: column; gap: 2px; font: inherit;
}
.eqc-qf-ac__it:hover, .eqc-qf-ac__it.is-active { background: var(--bg-sunken); }
.eqc-qf-ac__it b { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-qf-ac__it span { font-size: 11px; color: var(--ink-muted); font-family: var(--font-mono); }
.eqc-qf-ac__primary { padding: 0 6px; margin-left: 4px; }
.eqc-qf-ac__primary::before { display: none; }

/* ---------- Карточка прикреплённой CRM-записи / карточки каталога ---------- */
.eqc-qf-crm {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 14px; border: 1px solid var(--info-200);
  background: var(--info-50); border-radius: var(--r-md);
}
[data-theme="dark"] .eqc-qf-crm { background: #0F1F3A; border-color: #1D4ED8; }
.eqc-qf-crm + .eqc-qf-mode { margin-top: 8px; }
.eqc-qf-crm__body { min-width: 0; flex: 1; }
.eqc-qf-crm__kind {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .07em; color: var(--info-700);
}
[data-theme="dark"] .eqc-qf-crm__kind { color: #BFDBFE; }
.eqc-qf-crm__title {
  display: block; margin-top: 2px; font-size: 13px; font-weight: 600;
  color: var(--ink); line-height: 18px;
}
.eqc-qf-crm__meta {
  margin-top: 2px; font-size: 12px; color: var(--ink-muted); line-height: 16px;
}
.eqc-qf-crm__acts { display: flex; gap: 6px; flex-shrink: 0; }
.eqc-qf-crm-add { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- Режим сборки текста КП (радио из каталога) ---------- */
.eqc-qf-mode {
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 12px 14px; display: flex; flex-direction: column; gap: 10px;
  background: var(--bg-sunken);
}
.eqc-qf-mode__h { font-size: 12px; font-weight: 600; color: var(--ink); }
.eqc-qf-mode__opt {
  display: flex; gap: 8px; align-items: flex-start; cursor: pointer;
}
.eqc-qf-mode__opt input { margin-top: 3px; accent-color: var(--accent); }
.eqc-qf-mode__opt b {
  display: block; font-size: 13px; font-weight: 600; color: var(--ink); line-height: 18px;
}
.eqc-qf-mode__opt span span {
  display: block; font-size: 12px; color: var(--ink-muted); line-height: 16px;
}

/* ---------- Drop-zone (файл / фото) ---------- */
.eqc-qf-dz {
  position: relative; display: flex; align-items: center; gap: 14px;
  padding: 16px 18px; border: 1.5px dashed var(--line-strong);
  border-radius: var(--r-md); background: var(--bg); cursor: pointer;
}
.eqc-qf-dz:hover { border-color: var(--green-300); background: var(--green-50); }
[data-theme="dark"] .eqc-qf-dz:hover { background: rgba(31, 138, 91, .1); }
.eqc-qf-dz.drop-zone-active {
  border-color: var(--accent); background: var(--green-50);
}
[data-theme="dark"] .eqc-qf-dz.drop-zone-active { background: rgba(31, 138, 91, .12); }
.eqc-qf-dz--lg { padding: 30px 22px; }
.eqc-qf-dz__ico {
  width: 42px; height: 42px; flex-shrink: 0; border-radius: var(--r-md);
  background: var(--bg-sunken); display: flex; align-items: center;
  justify-content: center; color: var(--ink-muted);
}
.eqc-qf-dz__body { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eqc-qf-dz__t { font-size: 14px; font-weight: 500; color: var(--ink); }
.eqc-qf-dz__t b { color: var(--green-700); font-weight: 600; }
[data-theme="dark"] .eqc-qf-dz__t b { color: var(--green-300); }
.eqc-qf-dz__s { font-size: 12px; color: var(--ink-muted); font-family: var(--font-mono); }
.eqc-qf-dz__busy { display: inline-flex; align-items: center; gap: 8px; }
.eqc-qf-dz__busyover {
  position: absolute; inset: 0; display: flex; align-items: center;
  justify-content: center; gap: 10px; border-radius: var(--r-md);
  background: rgba(255, 255, 255, .9); color: var(--ink-2);
  font-size: 13px; font-weight: 500;
}
[data-theme="dark"] .eqc-qf-dz__busyover { background: rgba(24, 24, 27, .9); }

/* ---------- Textarea ---------- */
.eqc-qf-txt {
  width: 100%; padding: 10px 12px; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg-elev); font: inherit;
  font-size: 14px; line-height: 20px; color: var(--ink);
  resize: vertical; min-height: 96px;
}
.eqc-qf-txt:focus {
  outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(31, 138, 91, .12);
}
.eqc-qf-txt::placeholder { color: var(--ink-faint); }
.eqc-qf-txt--lg { min-height: 220px; line-height: 22px; }

/* ---------- Счётчик символов ---------- */
.eqc-qf-cnt {
  display: flex; justify-content: space-between; gap: 8px;
  font-size: 11px; color: var(--ink-muted); font-family: var(--font-mono);
}
.eqc-qf-cnt__v { font-weight: 500; }
.eqc-qf-cnt__v.text-secondary { color: var(--ink-muted); }
.eqc-qf-cnt__v.text-error { color: var(--danger-700); }
[data-theme="dark"] .eqc-qf-cnt__v.text-error { color: #FCA5A5; }

/* ---------- Сетка цена/кол-во/валюта/срок ---------- */
.eqc-qf-grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.eqc-qf-num { font-variant-numeric: tabular-nums; }

/* ---------- Грид пресетов оформления ---------- */
.eqc-qf-preset-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px;
}
.eqc-qf-preset {
  display: flex; flex-direction: column; padding: 0; overflow: hidden;
  text-align: left; cursor: pointer; background: var(--bg-elev);
  border: 1.5px solid var(--line); border-radius: var(--r-lg);
}
.eqc-qf-preset:hover { border-color: var(--green-300); }
.eqc-qf-preset[data-selected="true"] {
  border-color: var(--accent); box-shadow: 0 0 0 2px var(--green-200);
}
[data-theme="dark"] .eqc-qf-preset[data-selected="true"] {
  box-shadow: 0 0 0 2px rgba(31, 138, 91, .35);
}
.eqc-qf-preset--auto { border-style: dashed; }
.eqc-qf-preset__thumb {
  position: relative; height: 104px; overflow: hidden; background: var(--bg-sunken);
}
.eqc-qf-preset__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eqc-qf-preset__thumb--auto {
  display: flex; align-items: center; justify-content: center; color: var(--ink-faint);
}
.eqc-qf-preset__badge {
  position: absolute; top: 8px; left: 8px; padding: 2px 6px; border-radius: 3px;
  background: var(--zinc-900); color: #fff; font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .05em;
}
.eqc-qf-preset__check {
  position: absolute; top: 8px; right: 8px; width: 20px; height: 20px;
  border-radius: 99px; background: var(--accent); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 3px var(--bg-elev);
}
.eqc-qf-preset__body {
  padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 4px;
}
.eqc-qf-preset__name { font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-qf-preset__meta {
  font-size: 11px; color: var(--ink-muted); font-family: var(--font-mono);
}
.eqc-qf-preset__tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.eqc-qf-preset__tag {
  font-family: var(--font-mono); font-size: 10px; color: var(--ink-2);
  background: var(--bg-sunken); border: 1px solid var(--line);
  padding: 1px 6px; border-radius: 3px;
}

/* ---------- Грид фото ---------- */
.eqc-qf-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.eqc-qf-photo { display: flex; flex-direction: column; gap: 6px; }
.eqc-qf-photo__img {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.eqc-qf-photo__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eqc-qf-photo__rm {
  position: absolute; top: 6px; right: 6px; width: 24px; height: 24px;
  border-radius: 99px; border: 0; cursor: pointer;
  background: rgba(9, 9, 11, .68); color: #fff;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .12s ease;
}
.eqc-qf-photo:hover .eqc-qf-photo__rm { opacity: 1; }
.eqc-qf-photo__rm:hover { background: var(--danger-500); }
.eqc-qf-photo__cap {
  width: 100%; min-height: 52px; padding: 6px 8px; resize: vertical;
  border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  background: var(--bg-elev); font: inherit; font-size: 12px;
  line-height: 16px; color: var(--ink-2); outline: none;
}
.eqc-qf-photo__cap:focus { border-color: var(--accent); }
.eqc-qf-photo__counter {
  text-align: right; font-family: var(--font-mono); font-size: 10px;
  color: var(--ink-faint); font-variant-numeric: tabular-nums;
}

/* ---------- Группа toggle-плиток содержания ---------- */
.eqc-qf-tg-grp__bar { display: flex; align-items: center; gap: 12px; }
.eqc-qf-tg-grp__lbl {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-qf-tg-grp__line { flex: 1; height: 1px; background: var(--line); }
.eqc-qf-togs { display: flex; flex-wrap: wrap; gap: 8px; }
.eqc-qf-tog {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 12px 6px 8px; border-radius: var(--r-full);
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  font-size: 13px; color: var(--ink-2); cursor: pointer;
}
.eqc-qf-tog:hover { border-color: var(--green-300); }
.eqc-qf-tog__box {
  width: 16px; height: 16px; flex-shrink: 0; border-radius: 4px;
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  display: inline-flex; align-items: center; justify-content: center;
  color: transparent;
}
.eqc-qf-tog.is-on {
  background: var(--green-50); border-color: var(--green-300); color: var(--green-800);
}
.eqc-qf-tog.is-on .eqc-qf-tog__box {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
[data-theme="dark"] .eqc-qf-tog.is-on {
  background: var(--green-900); border-color: #13633F; color: var(--green-300);
}
/* .plans/tz-sections-config-admin.md Фаза 4: 3-state requirement.
   Hard — чекбокс заблокирован (курсор `not-allowed`), пометка справа.
   Soft — `cursor: help`, лёгкая жёлтая подсказка. */
.eqc-qf-tog:has(input:disabled) { cursor: not-allowed; opacity: 0.85; }
.eqc-qf-tog__req {
  margin-left: 6px; padding: 1px 6px; border-radius: var(--r-sm);
  font-size: 10px; line-height: 14px; font-weight: 500;
  background: var(--bg-elev); color: var(--ink-muted);
}
.eqc-qf-tog:has(input:disabled) .eqc-qf-tog__req {
  background: var(--accent); color: #fff;
}

/* ---------- Суб-формы включённых галочек ---------- */
.eqc-qf-subs { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.eqc-qf-sub {
  display: flex; flex-direction: column; gap: 10px;
  padding: 14px 16px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-md);
}
.eqc-qf-sub__h { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-qf-radios, .eqc-qf-checks { display: flex; flex-wrap: wrap; gap: 12px; }
.eqc-qf-radio {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--ink-2); cursor: pointer;
}
.eqc-qf-radio input { accent-color: var(--accent); }
.eqc-qf-radio--block { display: flex; }

/* ---------- Модалка-пикер (CRM-запись / карточка каталога) ---------- */
.eqc-qf-pick { max-height: 80vh; }
.eqc-qf-pick .eqc-modal__head { align-items: flex-start; }
.eqc-qf-pick__hd { flex: 1; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.eqc-qf-pick__filters { display: flex; gap: 6px; flex-wrap: wrap; }
.eqc-qf-pick__filters .eqc-input { flex: 1; min-width: 130px; }
.eqc-qf-pick__tabs { display: flex; gap: 6px; }
.eqc-qf-pick__tab {
  height: 28px; padding: 0 12px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  font: inherit; font-size: 12px; font-weight: 500; color: var(--ink-muted);
  cursor: pointer;
}
.eqc-qf-pick__tab.is-active {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
.eqc-qf-pick__list {
  padding: 4px 6px 8px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px;
}
.eqc-qf-pick__note {
  padding: 12px; margin: 0; font-size: 13px; line-height: 18px; color: var(--ink-muted);
}
.eqc-qf-pick__it {
  width: 100%; text-align: left; background: transparent; border: 0;
  padding: 9px 10px; border-radius: var(--r-sm); cursor: pointer;
  display: flex; flex-direction: column; gap: 2px; font: inherit;
}
.eqc-qf-pick__it:hover { background: var(--bg-sunken); }
.eqc-qf-pick__it b { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-qf-pick__it span { font-size: 12px; color: var(--ink-muted); }

/* ---------- Итоговая строка (CTA) ---------- */
.eqc-qf-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px; flex-wrap: wrap; padding: 16px 18px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-xs);
}
.eqc-qf-foot__hint { font-size: 12px; color: var(--ink-muted); max-width: 52ch; }
.eqc-qf-gen { min-width: 220px; }
.eqc-qf-gen > span { display: inline-flex; align-items: center; gap: 8px; }
.eqc-qf-gen__busy { display: inline-flex; align-items: center; gap: 8px; }

/* ---------- Контекстная подсказка (tipBox) ---------- */
.eqc-qf-tip {
  display: flex; gap: 10px; padding: 10px 12px;
  background: var(--info-50); border: 1px solid var(--info-200);
  border-radius: var(--r-md);
}
[data-theme="dark"] .eqc-qf-tip { background: #0F1F3A; border-color: #1D4ED8; }
.eqc-qf-tip__ico { flex-shrink: 0; color: var(--info-700); margin-top: 1px; }
[data-theme="dark"] .eqc-qf-tip__ico { color: #BFDBFE; }
.eqc-qf-tip__body { flex: 1; min-width: 0; }
.eqc-qf-tip__toggle {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  gap: 8px; background: transparent; border: 0; padding: 0; cursor: pointer;
  font: inherit; text-align: left; color: var(--info-700);
}
[data-theme="dark"] .eqc-qf-tip__toggle { color: #BFDBFE; }
.eqc-qf-tip__toggle b { font-size: 13px; font-weight: 600; }
.eqc-qf-tip__chev { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }
.eqc-qf-tip__text {
  margin-top: 6px; font-size: 12px; line-height: 18px; color: var(--info-700);
  white-space: pre-line;
}
[data-theme="dark"] .eqc-qf-tip__text { color: #BFDBFE; }

/* ---------- Боковая панель советов (SPIN) ---------- */
.eqc-qf-rail {
  display: flex; flex-direction: column; gap: 12px;
  align-self: start; position: sticky; top: 68px;
  padding: 24px 24px 40px 8px; max-height: calc(100vh - 68px); overflow-y: auto;
}
.eqc-qf-adv {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 14px;
  display: flex; flex-direction: column; gap: 8px;
}
.eqc-qf-adv--feat { border-left: 3px solid var(--accent); }
.eqc-qf-adv__h { display: flex; align-items: center; gap: 8px; }
.eqc-qf-adv__ico {
  width: 24px; height: 24px; flex-shrink: 0; border-radius: var(--r-sm);
  background: var(--green-50); color: var(--green-700);
  display: flex; align-items: center; justify-content: center;
}
[data-theme="dark"] .eqc-qf-adv__ico { background: var(--green-900); color: var(--green-300); }
.eqc-qf-adv__t { font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-qf-adv__toggle {
  margin-left: auto; background: transparent; border: 0; cursor: pointer;
  font: inherit; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .07em; color: var(--ink-muted);
}
.eqc-qf-adv__toggle:hover { color: var(--ink-2); }
.eqc-qf-adv__lede { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-qf-adv__note { margin: 0; font-size: 12px; line-height: 17px; color: var(--ink-muted); }
.eqc-qf-adv__foot {
  margin: 6px 0 0; padding-top: 8px; border-top: 1px solid var(--line);
  font-size: 11px; line-height: 15px; color: var(--ink-muted);
}
.eqc-qf-adv__foot a { color: var(--green-700); font-weight: 600; text-decoration: none; }
[data-theme="dark"] .eqc-qf-adv__foot a { color: var(--green-400); }
.eqc-qf-spin-dot { width: 9px; height: 9px; border-radius: 99px; flex-shrink: 0; }
.eqc-qf-spin-dot--s { background: var(--info-500); }
.eqc-qf-spin-dot--p { background: var(--warn-500); }
.eqc-qf-spin-dot--i { background: var(--green-400); }
.eqc-qf-spin-dot--n { background: var(--green-700); }
.eqc-qf-spin-list {
  margin: 0; padding-left: 16px; font-size: 12px; line-height: 17px; color: var(--ink-2);
}
.eqc-qf-spin-list li { margin: 2px 0; }
.eqc-qf-spin-check { margin: 0; padding: 0; list-style: none; }
.eqc-qf-spin-check li {
  display: flex; gap: 8px; padding: 4px 0; font-size: 12px;
  line-height: 17px; color: var(--ink-2);
}
.eqc-qf-spin-check li::before {
  content: ''; flex-shrink: 0; width: 13px; height: 13px; margin-top: 2px;
  border: 1px solid var(--line-strong); border-radius: 3px; background: var(--bg-sunken);
}

/* ---------- Адаптив ---------- */
@media (max-width: 1080px) {
  .eqc-qf { grid-template-columns: 1fr; }
  .eqc-qf-rail { display: none; }
}
@media (max-width: 767px) {
  .eqc-qf__main { padding: 16px; }
  .eqc-qf-grid4 { grid-template-columns: 1fr 1fr; }
  .eqc-qf-photos { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .eqc-qf-grid4 { grid-template-columns: 1fr; }
  .eqc-qf-photos { grid-template-columns: 1fr; }
  .eqc-qf-foot { flex-direction: column; align-items: stretch; }
  .eqc-qf-gen { min-width: 0; width: 100%; }
}

/* =====================================================================
   РАБОЧЕЕ МЕСТО КП (батч 4b).
   Макет: «.design/Equipment CRM Platform/Блок 6 — Рабочее место КП».

   Реимплементация поверх Alpine-компонента quotationPreview — те же
   /api/*, другая разметка/классы. JS-возвращаемые классы (statusPillClass,
   statusOptDotClass, toastSterbrustClass, reactionWidgetClass,
   deliveryTimeBadgeClass) перекрываются составными селекторами ниже.
   ===================================================================== */

/* ---------- Состояния страницы ---------- */
.eqc-wb-state {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding: 64px 24px; color: var(--ink-muted); font-size: 14px; text-align: center;
}
.eqc-wb-state--gen { padding-top: 80px; }
.eqc-wb-state__spin { width: 36px; height: 36px; border-width: 3px; }
.eqc-wb-state__col { max-width: 480px; }
.eqc-wb-state__col h2 {
  margin: 0 0 6px; font-size: 22px; font-weight: 600; color: var(--ink);
  letter-spacing: -0.01em;
}
.eqc-wb-state__col p { margin: 0; font-size: 13px; line-height: 20px; }
.eqc-wb-state__note { margin-top: 8px !important; color: var(--ink-faint); }
.eqc-wb-progress {
  width: 320px; max-width: 80vw; height: 6px; border-radius: 99px;
  background: var(--bg-sunken); overflow: hidden;
}
.eqc-wb-progress__fill { height: 100%; background: var(--accent); border-radius: 99px; }
.eqc-wb-state__pct {
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted);
}
.eqc-wb-state__err { max-width: 480px; text-align: left; }
.eqc-wb-state__errbtns { display: flex; gap: 8px; margin-top: 8px; }
.eqc-wb-genbanner { max-width: 1024px; margin: 16px auto 0; padding: 0 16px; }
.eqc-wb-genbanner__inner { align-items: center; }
.eqc-wb-genbanner__body { flex: 1; min-width: 0; }
.eqc-wb-genbanner__sub {
  display: block; margin-top: 6px; font-size: 12px; line-height: 17px;
  color: var(--ink-muted);
}

/* ---------- Админский журнал генерации (виден только админу) ----------
   Бэкенд отдаёт debug-payload в /status и сохраняет generation_error_detail
   только для роли admin (app/quotations/router.py), поэтому x-show по
   pollDebug / hasGenerationErrorDetail сам по себе прячет панель и
   копируемую ошибку у менеджера. Визуально — производная от .gen-steps
   мокапа «Блок 6 — Рабочее место КП» (.design/Equipment CRM Platform/). */
.eqc-wb-genlog {
  width: 100%; max-width: 520px;
  margin-top: 18px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-md);
  text-align: left; overflow: hidden;
}
.eqc-wb-genlog__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; padding: 10px 14px;
  background: var(--bg-sunken); border-bottom: 1px solid var(--line);
}
.eqc-wb-genlog__title { font-size: 12px; font-weight: 600; color: var(--ink); }
.eqc-wb-genlog__meta {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-wb-genlog__list {
  max-height: 220px; overflow-y: auto; padding: 4px 14px;
  display: flex; flex-direction: column;
}
.eqc-wb-genlog__row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 6px 0; border-bottom: 1px dashed var(--line);
  font-size: 13px; line-height: 18px; color: var(--ink-2);
}
.eqc-wb-genlog__row:last-child { border-bottom: 0; }
.eqc-wb-genlog__row--error { color: var(--danger-700); font-weight: 600; }
.eqc-wb-genlog__row--empty { color: var(--ink-muted); font-style: italic; }
.eqc-wb-genlog__time {
  flex: none; min-width: 56px;
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-faint);
}
.eqc-wb-genlog__msg { flex: 1; word-break: break-word; }
.eqc-wb-genlog__warn {
  display: flex; align-items: flex-start; gap: 8px;
  padding: 10px 14px; border-top: 1px solid var(--line);
  background: var(--warn-50); color: var(--warn-700);
  font-size: 12px; line-height: 17px;
}
.eqc-wb-genlog__warn .glyph { flex: none; margin-top: 1px; color: var(--warn-700); }
[data-theme="dark"] .eqc-wb-genlog__warn {
  background: #2A1D05; color: #FCD34D;
}
[data-theme="dark"] .eqc-wb-genlog__warn .glyph { color: #FCD34D; }

/* Копируемый блок с техническим текстом ошибки. Используется и в processing-
   блоке (pollErrorDetail), и в баннере «Генерация не завершилась»
   (q.generation_error_detail). */
.eqc-wb-genlog__errbox {
  margin-top: 10px; width: 100%;
  display: flex; flex-direction: column; gap: 6px; align-items: flex-start;
}
.eqc-wb-genlog__pre {
  margin: 0; padding: 8px 10px; width: 100%; max-height: 160px;
  overflow: auto; white-space: pre-wrap; word-break: break-word;
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-sm);
  font-family: var(--font-mono); font-size: 11px; line-height: 16px;
  color: var(--ink-2);
}
.eqc-wb-genlog__copybtn { align-self: flex-start; }

.eqc-wb-fbwrap { max-width: 1180px; margin: 0 auto; padding: 0 28px 28px; }

/* =====================================================================
   ТОПБАР — степпер + статус-бар + тулбар действий.
   ===================================================================== */
.eqc-wb {
  position: sticky; top: 52px; z-index: 50;
  background: var(--bg-elev); border-bottom: 1px solid var(--line);
  box-shadow: 0 8px 16px -14px rgba(9, 9, 11, .25);
}

/* ---------- Ряд 1: степпер ---------- */
.eqc-wb-step {
  display: flex; align-items: center; gap: 4px;
  padding: 12px 28px 10px; border-bottom: 1px solid var(--line);
}
.eqc-wb-stp {
  display: inline-flex; align-items: center; gap: 8px; flex: none;
  padding: 6px 12px; border-radius: var(--r-md); border: 0;
  background: transparent; cursor: pointer; font: inherit;
  color: var(--ink-muted); text-decoration: none;
}
.eqc-wb-stp:hover { background: var(--bg-sunken); }
.eqc-wb-stp__n {
  width: 22px; height: 22px; flex-shrink: 0; border-radius: 99px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--line-strong); background: var(--bg-elev);
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
}
.eqc-wb-stp__lb { font-size: 13px; font-weight: 500; line-height: 1; }
.eqc-wb-stp.is-cur { color: var(--ink); }
.eqc-wb-stp.is-cur .eqc-wb-stp__n {
  background: var(--ink); color: var(--bg-elev); border-color: var(--ink);
}
.eqc-wb-stp.is-done { color: var(--green-700); }
[data-theme="dark"] .eqc-wb-stp.is-done { color: var(--green-300); }
.eqc-wb-stp.is-done .eqc-wb-stp__n {
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.eqc-wb-stp--link .eqc-wb-stp__n { border-style: dashed; }
.eqc-wb-rule {
  flex: 1; min-width: 24px; height: 1px; background: var(--line);
}
.eqc-wb-rule.is-done { background: var(--accent); }

/* ---------- Ряд 2: статус-бар ---------- */
.eqc-wb-status {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  padding: 8px 28px; background: var(--bg-sunken);
  border-bottom: 1px solid var(--line);
  font-size: 12px; color: var(--ink-muted);
}
.eqc-wb-status__item { display: inline-flex; align-items: center; gap: 7px; }
.eqc-wb-status__item .glyph { color: var(--ink-faint); }
.eqc-wb-pip { width: 7px; height: 7px; border-radius: 99px; background: var(--ink-faint); }
.eqc-wb-pip--ok { background: var(--green-500); }
.eqc-wb-pip--warn { background: var(--warn-500); }
.eqc-wb-status__meta {
  margin-left: auto; display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .04em;
}
.eqc-wb-status__meta a { color: var(--green-700); text-decoration: none; }
[data-theme="dark"] .eqc-wb-status__meta a { color: var(--green-400); }
.eqc-wb-status__meta a:hover { text-decoration: underline; }
.eqc-wb-status__sep { color: var(--ink-faint); }

/* ---------- Ряд 3: тулбар действий ---------- */
.eqc-wb-acts {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 28px;
}
.eqc-wb-acts__menu { position: relative; }
.eqc-wb-acts__pillwrap { display: inline-flex; align-items: center; }
.eqc-wb-acts__spacer { flex: 1; min-width: 8px; }

/* Статус-pill. statusPillClass дописывает mw-pill--<status>. */
.eqc-wb-pill {
  display: inline-flex; align-items: center; gap: 8px; height: 32px;
  padding: 0 12px; border-radius: var(--r-full); cursor: pointer;
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  font: inherit; font-size: 13px; font-weight: 500; color: var(--ink-2);
}
.eqc-wb-pill__dot {
  width: 7px; height: 7px; border-radius: 99px; background: var(--ink-faint);
}
.eqc-wb-pill.mw-pill--draft { background: var(--bg-sunken); color: var(--ink-2); border-color: var(--line-strong); }
.eqc-wb-pill.mw-pill--draft .eqc-wb-pill__dot { background: var(--ink-muted); }
.eqc-wb-pill.mw-pill--processing { background: var(--info-50); color: var(--info-700); border-color: var(--info-200); }
.eqc-wb-pill.mw-pill--processing .eqc-wb-pill__dot { background: var(--info-500); }
.eqc-wb-pill.mw-pill--sent { background: var(--green-50); color: var(--green-700); border-color: var(--green-200); }
.eqc-wb-pill.mw-pill--sent .eqc-wb-pill__dot { background: var(--green-500); }
.eqc-wb-pill.mw-pill--in_progress { background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200); }
.eqc-wb-pill.mw-pill--in_progress .eqc-wb-pill__dot { background: var(--warn-500); }
.eqc-wb-pill.mw-pill--accepted { background: var(--green-700); color: #fff; border-color: var(--green-700); }
.eqc-wb-pill.mw-pill--accepted .eqc-wb-pill__dot { background: #fff; }
.eqc-wb-pill.mw-pill--rejected { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
.eqc-wb-pill.mw-pill--rejected .eqc-wb-pill__dot { background: var(--danger-500); }

/* Меню статусов. */
.eqc-wb-menu {
  position: absolute; top: calc(100% + 6px); left: 0; min-width: 220px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); padding: 6px; z-index: 60;
}
.eqc-wb-menu__it {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 10px; border: 0; background: transparent; cursor: pointer;
  font: inherit; font-size: 13px; color: var(--ink-2); border-radius: var(--r-sm);
  text-align: left;
}
.eqc-wb-menu__it:hover { background: var(--bg-sunken); }
.eqc-wb-menu__cur {
  margin-left: auto; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ink-faint);
}
.eqc-wb-optdot { width: 8px; height: 8px; border-radius: 99px; background: var(--ink-faint); flex-shrink: 0; }
.eqc-wb-optdot.mw-pill--draft { background: var(--ink-muted); }
.eqc-wb-optdot.mw-pill--sent { background: var(--green-500); }
.eqc-wb-optdot.mw-pill--in_progress { background: var(--warn-500); }
.eqc-wb-optdot.mw-pill--accepted { background: var(--green-700); }
.eqc-wb-optdot.mw-pill--rejected { background: var(--danger-500); }
.eqc-wb-optdot.mw-pill--processing { background: var(--info-500); }

/* Чип варианта. */
.eqc-wb-chip {
  display: inline-flex; align-items: center; gap: 6px; height: 28px;
  padding: 0 10px; border-radius: var(--r-full); background: var(--bg-sunken);
  border: 1px solid var(--line); font-size: 12px; font-weight: 500; color: var(--ink-2);
}
.eqc-wb-chip__k {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}

/* Pill привязки CRM (лид/сделка). */
.eqc-wb-attach {
  display: inline-flex; align-items: center; gap: 7px; height: 28px;
  padding: 0 10px; border-radius: var(--r-full); cursor: pointer; font: inherit;
  background: var(--bg-elev); border: 1px solid var(--line-strong);
  font-size: 12px; font-weight: 500; color: var(--ink-2); max-width: 280px;
}
.eqc-wb-attach > * { min-width: 0; }
.eqc-wb-attach:hover { background: var(--bg-sunken); }
.eqc-wb-attach .glyph { color: var(--ink-muted); flex-shrink: 0; }
.eqc-wb-attach__t {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 0 1 auto;
}
.eqc-wb-attach__stage {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 0 1 auto;
  font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted);
  text-transform: uppercase; letter-spacing: .04em;
}
.eqc-wb-attach--empty { border-style: dashed; color: var(--ink-muted); }

/* Реакция на открытие — reactionWidgetClass → mw-ed-tb__hint[--warn]. */
.mw-ed-tb__hint {
  display: inline-flex; align-items: center; height: 28px; padding: 0 10px;
  border-radius: var(--r-full); background: var(--green-50);
  border: 1px solid var(--green-200); font-size: 12px; font-weight: 500;
  color: var(--green-700); white-space: nowrap;
}
.mw-ed-tb__hint--warn {
  background: var(--warn-50); border-color: var(--warn-200); color: var(--warn-700);
}
[data-theme="dark"] .mw-ed-tb__hint { background: var(--green-900); color: var(--green-300); border-color: #13633F; }
[data-theme="dark"] .mw-ed-tb__hint--warn { background: #2A1D05; color: #FCD34D; border-color: #624017; }

.eqc-wb-sep { width: 1px; height: 22px; background: var(--line); }

/* Иконочные кнопки тулбара. */
.eqc-wb-ibtn {
  position: relative; width: 32px; height: 32px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-md); border: 1px solid var(--line-strong);
  background: var(--bg-elev); color: var(--ink-2); cursor: pointer;
  text-decoration: none;
}
.eqc-wb-ibtn:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-wb-ibtn:disabled { opacity: .55; cursor: not-allowed; }
.eqc-wb-ibtn__badge {
  position: absolute; top: -5px; right: -5px; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 99px; background: var(--danger-500); color: #fff;
  font-family: var(--font-mono); font-size: 10px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--bg-elev);
}
.eqc-wb-pdfbtn { position: relative; }
.eqc-wb-pdfbtn__dot {
  position: absolute; top: -3px; right: -3px; width: 8px; height: 8px;
  border-radius: 99px; background: var(--warn-500);
  box-shadow: 0 0 0 2px var(--bg-elev);
}

/* =====================================================================
   ТАБ «ТЕКСТ» — поток блок-карточек + rail-навигатор.
   ===================================================================== */
.eqc-tx {
  display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start;
}
.eqc-tx-main {
  min-width: 0; padding: 24px 28px 32px;
  display: flex; flex-direction: column; gap: 18px;
}

.eqc-tx-catnote {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 14px; border: 1px solid var(--info-200); background: var(--info-50);
  border-radius: var(--r-md); font-size: 13px; color: var(--info-700);
}
[data-theme="dark"] .eqc-tx-catnote { background: #0F1F3A; border-color: #1D4ED8; color: #BFDBFE; }
.eqc-tx-catnote__link { font-weight: 600; color: inherit; }

/* Группа блоков. */
.eqc-tx-grp {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden;
}
.eqc-tx-grp__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 12px 16px; background: var(--bg-sunken); border-bottom: 1px solid var(--line);
}
.eqc-tx-grp__head h2 {
  margin: 0; font-size: 14px; font-weight: 600; letter-spacing: -0.005em; color: var(--ink);
}
.eqc-tx-grp__meta {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}

/* Блок-карточка. */
.eqc-tx-blk {
  padding: 16px 18px; display: flex; flex-direction: column; gap: 10px;
  border-bottom: 1px solid var(--line); scroll-margin-top: 200px;
}
.eqc-tx-grp .eqc-tx-blk:last-child { border-bottom: 0; }
.eqc-tx-blk__head { display: flex; align-items: center; gap: 8px; }
.eqc-tx-blk__lbl {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-tx-blk__id {
  font-family: var(--font-mono); font-size: 10px; color: var(--ink-faint);
  background: var(--bg-sunken); border: 1px solid var(--line);
  padding: 1px 5px; border-radius: 3px;
}
.eqc-tx-blk__acts { margin-left: auto; display: flex; gap: 4px; }
.eqc-tx-blk__act {
  width: 28px; height: 28px; display: inline-flex; align-items: center;
  justify-content: center; border-radius: var(--r-sm); border: 1px solid transparent;
  background: transparent; color: var(--ink-faint); cursor: pointer;
}
.eqc-tx-blk__act:hover { background: var(--bg-sunken); color: var(--ink-2); border-color: var(--line); }
.eqc-tx-blk__act--del:hover { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
[data-theme="dark"] .eqc-tx-blk__act--del:hover { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
.eqc-tx-blk__hint {
  display: flex; align-items: flex-start; gap: 7px; padding: 8px 10px;
  background: var(--info-50); border: 1px solid var(--info-200);
  border-radius: var(--r-md); font-size: 12px; line-height: 17px; color: var(--info-700);
}
.eqc-tx-blk__hint .glyph { flex-shrink: 0; margin-top: 1px; }
[data-theme="dark"] .eqc-tx-blk__hint { background: #0F1F3A; border-color: #1D4ED8; color: #BFDBFE; }
.eqc-tx-blk__note { margin: 0; font-size: 12px; color: var(--ink-muted); }

/* Contenteditable-блок. */
.eqc-tx-edit {
  border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px 14px;
  background: var(--bg); font-size: 14px; line-height: 22px; color: var(--ink);
  min-height: 44px; outline: none;
}
.eqc-tx-edit:hover { border-color: var(--line-strong); }
.eqc-tx-edit:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(31, 138, 91, .12); }
.eqc-tx-edit:empty::before { content: attr(data-placeholder); color: var(--ink-faint); }
.eqc-tx-edit--title { font-size: 16px; font-weight: 600; letter-spacing: -0.005em; }
.eqc-tx-edit--lead { background: var(--green-50); border-color: var(--green-200); }
[data-theme="dark"] .eqc-tx-edit--lead { background: var(--green-900); border-color: #13633F; }
.eqc-tx-edit--field { min-height: 38px; }
.eqc-tx-edit--summary { font-style: italic; }

/* Contenteditable-ячейка (таблицы spec/list/price). */
.eqc-tx-cell {
  outline: none; border-radius: 3px; padding: 1px 3px;
  border-bottom: 1px dashed transparent;
}
.eqc-tx-cell:hover { border-bottom-color: var(--line-strong); }
.eqc-tx-cell:focus {
  border-bottom-color: var(--accent); background: var(--green-50);
}
[data-theme="dark"] .eqc-tx-cell:focus { background: rgba(31, 138, 91, .12); }
.eqc-tx-cell:empty::before { content: attr(data-placeholder); color: var(--ink-faint); }
.eqc-tx-cell--price { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.eqc-tx-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.eqc-tx-eyebrow {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .07em; color: var(--ink-muted); margin-bottom: 4px;
}

/* Таблица характеристик. */
.eqc-tx-spec {
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
}
.eqc-tx-spec__row {
  display: grid; grid-template-columns: 42% 1fr 64px 32px; align-items: center;
  border-bottom: 1px solid var(--line); font-size: 13px;
}
.eqc-tx-spec__row:last-child { border-bottom: 0; }
.eqc-tx-spec__row:hover { background: var(--bg-sunken); }
.eqc-tx-spec__k { padding: 8px 12px; color: var(--ink-2); font-weight: 500; }
.eqc-tx-spec__v {
  padding: 8px 12px; font-family: var(--font-mono); color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.eqc-tx-spec__u {
  padding: 8px 12px; font-family: var(--font-mono); font-size: 11px;
  color: var(--ink-muted); text-align: right;
}

.eqc-tx-rowdel {
  width: 26px; height: 26px; display: inline-flex; align-items: center;
  justify-content: center; border: 0; background: transparent;
  color: var(--ink-faint); cursor: pointer; border-radius: var(--r-sm);
}
.eqc-tx-rowdel:hover { background: var(--danger-50); color: var(--danger-700); }
[data-theme="dark"] .eqc-tx-rowdel:hover { background: #2A0808; color: #FCA5A5; }

.eqc-tx-add {
  display: inline-flex; align-items: center; gap: 6px; width: fit-content;
  padding: 7px 12px; border: 1px dashed var(--line-strong);
  border-radius: var(--r-md); background: transparent; color: var(--ink-muted);
  font: inherit; font-size: 12px; cursor: pointer;
}
.eqc-tx-add:hover { border-color: var(--accent); color: var(--accent-hover); }

/* Список (комплектация / оснастка). */
.eqc-tx-list { border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.eqc-tx-list__row {
  display: grid; grid-template-columns: 1fr auto 32px; gap: 12px; align-items: start;
  padding: 9px 12px; border-bottom: 1px solid var(--line); font-size: 13px;
}
.eqc-tx-list__row:last-child { border-bottom: 0; }
.eqc-tx-list__row:hover { background: var(--bg-sunken); }
.eqc-tx-list__name { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.eqc-tx-list__name b { font-weight: 600; color: var(--ink); }
.eqc-tx-list__name > span { color: var(--ink-muted); font-size: 12px; }
.eqc-tx-list__extras {
  display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 4px;
  font-size: 11px; color: var(--ink-muted);
}
.eqc-tx-list__exlbl {
  font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .04em;
  margin-right: 4px;
}
.eqc-tx-list__qty {
  text-align: right; font-family: var(--font-mono); color: var(--ink);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.eqc-tx-list__price { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.eqc-tx-list__byrequest { font-family: var(--font-sans); font-size: 11px; color: var(--ink-muted); }
.eqc-tx-cur {
  height: 26px; padding: 0 4px; border: 1px solid var(--line-strong);
  border-radius: var(--r-sm); background: var(--bg-elev); font: inherit;
  font-size: 12px; color: var(--ink-2);
}

/* Настройки таблицы тех. характеристик: лимит строк на страницу PDF
   (.plans/tz-specifications-rows-per-page.md). Sub-секция внутри блока
   `#block-specs_table`, визуально отделена от самой таблицы. */
.eqc-tx-specopts {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 10px 12px; margin-bottom: 10px;
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md); font-size: 12px;
}
.eqc-tx-specopts__field { display: inline-flex; align-items: center; gap: 8px; }
.eqc-tx-specopts__lbl { font-weight: 500; color: var(--ink-2); white-space: nowrap; }
.eqc-tx-specopts__inp { width: 72px; }
.eqc-tx-specopts__help { font-size: 11px; line-height: 15px; color: var(--ink-muted); flex: 1 1 200px; }

/* Настройки оснастки. */
.eqc-tx-accopts {
  padding: 14px 18px; display: flex; flex-direction: column; gap: 12px;
  border-bottom: 1px solid var(--line);
}
.eqc-tx-grp .eqc-tx-accopts:last-child { border-bottom: 0; }
.eqc-tx-accopts__row { display: grid; grid-template-columns: 1fr 180px; gap: 14px; }
.eqc-tx-accopts__field { display: flex; flex-direction: column; gap: 6px; }
.eqc-tx-accopts__lbl { font-size: 12px; font-weight: 500; color: var(--ink-2); }
.eqc-tx-accopts__help { font-size: 11px; line-height: 15px; color: var(--ink-muted); }

/* Блок «Стоимость + срок поставки». */
.eqc-tx-price { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.eqc-tx-price__col {
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 12px 14px; background: var(--bg);
}
.eqc-tx-price__k {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
  font-family: var(--font-mono); color: var(--ink-muted);
}
.eqc-tx-price__kright { display: inline-flex; align-items: center; gap: 8px; }
.eqc-tx-price__v {
  display: flex; align-items: center; gap: 8px; margin-top: 6px;
  font-size: 20px; font-weight: 600; color: var(--ink);
  font-family: var(--font-mono); font-variant-numeric: tabular-nums;
}
.eqc-tx-price__breakdown,
.eqc-tx-price__help {
  margin-top: 6px; font-size: 12px; color: var(--ink-muted);
  display: flex; gap: 6px; flex-wrap: wrap;
}
.eqc-tx-qty { display: inline-flex; align-items: center; gap: 3px; }
.eqc-tx-qty__lbl { color: var(--ink-faint); }
.eqc-tx-dtbadge {
  display: inline-flex; align-items: center; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; font-weight: 500;
}

/* ROI-плитки. */
.eqc-tx-roi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.eqc-tx-roi__cell {
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 14px; background: var(--bg);
}
.eqc-tx-roi__v {
  font-size: 22px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums; letter-spacing: -0.014em;
}
.eqc-tx-roi__k {
  margin-top: 4px; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .07em; color: var(--ink-muted);
}

/* Таблица сравнения. */
.eqc-tx-cmp { width: 100%; border-collapse: collapse; font-size: 12px; }
.eqc-tx-cmp thead th {
  padding: 8px 10px; text-align: left; background: var(--bg-sunken);
  border-bottom: 1px solid var(--line); font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .07em;
  color: var(--ink-muted); font-weight: 500;
}
.eqc-tx-cmp tbody td {
  padding: 8px 10px; border-bottom: 1px solid var(--line);
  vertical-align: top; color: var(--ink-2); line-height: 17px;
}
.eqc-tx-cmp tbody tr:hover { background: var(--bg-sunken); }
.eqc-tx-cmp__nm { font-weight: 600; color: var(--ink); }
.eqc-tx-cmp__pos { color: var(--green-700); }
.eqc-tx-cmp__neg { color: var(--danger-700); }
[data-theme="dark"] .eqc-tx-cmp__pos { color: var(--green-300); }
[data-theme="dark"] .eqc-tx-cmp__neg { color: #FCA5A5; }
.eqc-tx-cmp__r {
  text-align: right; font-family: var(--font-mono);
  font-variant-numeric: tabular-nums; color: var(--ink);
}

/* Галерея фото. */
.eqc-tx-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.eqc-tx-photo { display: flex; flex-direction: column; gap: 6px; }
.eqc-tx-photo__img {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
  border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg-sunken);
}
.eqc-tx-photo__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eqc-tx-photo__del {
  position: absolute; top: 6px; right: 6px; width: 24px; height: 24px;
  border: 0; border-radius: 99px; cursor: pointer; opacity: 0;
  background: rgba(9, 9, 11, .68); color: #fff;
  display: flex; align-items: center; justify-content: center; transition: opacity .12s;
}
.eqc-tx-photo:hover .eqc-tx-photo__del { opacity: 1; }
.eqc-tx-photo__del:hover { background: var(--danger-500); }
.eqc-tx-photo__capinput {
  width: 100%; min-height: 52px; padding: 6px 8px; resize: vertical;
  border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  background: var(--bg-elev); font: inherit; font-size: 12px;
  line-height: 16px; color: var(--ink-2); outline: none;
}
.eqc-tx-photo__capinput:focus { border-color: var(--accent); }
.eqc-tx-photo__capcount {
  text-align: right; font-family: var(--font-mono); font-size: 10px;
  color: var(--ink-faint);
}
.eqc-tx-photos-empty {
  padding: 16px; text-align: center; font-size: 13px; color: var(--ink-muted);
  border: 1px dashed var(--line-strong); border-radius: var(--r-md);
}

/* Чекбокс CTA-демонстрации. */
.eqc-tx-check {
  display: flex; align-items: center; gap: 8px; font-size: 13px;
  color: var(--ink-2); cursor: pointer;
}
.eqc-tx-check input { accent-color: var(--accent); }

/* Rail-навигатор. */
.eqc-tx-nav {
  align-self: start; position: sticky; top: 200px;
  padding: 24px 24px 32px 8px;
}
.eqc-tx-nav__card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 16px;
}
.eqc-tx-nav__h {
  display: flex; align-items: baseline; justify-content: space-between;
  padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid var(--line);
}
.eqc-tx-nav__h h3 { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-tx-nav__count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }
.eqc-tx-nav__count b { color: var(--ink-2); }
.eqc-tx-navgrp { margin-top: 12px; }
.eqc-tx-navgrp:first-of-type { margin-top: 0; }
.eqc-tx-navgrp__h {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .07em; color: var(--ink-muted);
  padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px dashed var(--line);
}
.eqc-tx-navitem {
  display: flex; align-items: center; gap: 8px; padding: 5px 6px;
  border-radius: var(--r-sm); font-size: 12px; color: var(--ink-2);
  text-decoration: none; cursor: pointer;
}
.eqc-tx-navitem:hover { background: var(--bg-sunken); }
.eqc-tx-navitem__pip {
  width: 6px; height: 6px; flex-shrink: 0; border-radius: 99px;
  background: var(--ink-faint);
}
.eqc-tx-navitem[data-status="filled"] .eqc-tx-navitem__pip { background: var(--green-500); }
.eqc-tx-navitem[data-status="warn"] .eqc-tx-navitem__pip { background: var(--warn-500); }
.eqc-tx-navitem__lbl {
  flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eqc-tx-navitem__eye { display: inline-flex; color: var(--ink-faint); }
.eqc-tx-navitem[data-hidden="true"] { color: var(--ink-faint); }
.eqc-tx-navitem[data-hidden="true"] .eqc-tx-navitem__lbl {
  text-decoration: line-through; text-decoration-color: var(--ink-faint);
}

/* Виджет качества генерации. */
.eqc-tx-fb {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 16px 18px; background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); margin-top: 18px;
}
.eqc-tx-fb--col { flex-direction: column; align-items: stretch; }
.eqc-tx-fb__lf { display: flex; align-items: center; gap: 12px; }
.eqc-tx-fb__ico {
  width: 36px; height: 36px; flex-shrink: 0; border-radius: var(--r-md);
  background: var(--bg-sunken); display: flex; align-items: center;
  justify-content: center; color: var(--ink-2);
}
.eqc-tx-fb__ico--ok { background: var(--green-50); color: var(--green-700); }
[data-theme="dark"] .eqc-tx-fb__ico--ok { background: var(--green-900); color: var(--green-300); }
.eqc-tx-fb__t { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 18px; }
.eqc-tx-fb__s { font-size: 12px; color: var(--ink-muted); margin-top: 2px; line-height: 16px; }
.eqc-tx-fb__btns { display: flex; gap: 8px; flex-shrink: 0; }
.eqc-tx-fb__btns--end { margin-left: auto; }
.eqc-tx-fb__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.eqc-tx-fb__tag {
  display: inline-flex; align-items: center; padding: 5px 10px;
  border-radius: var(--r-full); background: var(--bg); cursor: pointer;
  border: 1px solid var(--line-strong); font-size: 12px; color: var(--ink-2);
}
.eqc-tx-fb__tag.is-active {
  background: var(--green-50); border-color: var(--green-300); color: var(--green-800);
}
[data-theme="dark"] .eqc-tx-fb__tag.is-active {
  background: var(--green-900); border-color: #13633F; color: var(--green-300);
}

/* =====================================================================
   ТАБ «ОФОРМЛЕНИЕ».
   ===================================================================== */
.eqc-st {
  padding: 24px 28px 32px; display: flex; flex-direction: column; gap: 24px;
  /* Сумма sticky-элементов над табом для расчёта высоты live-превью:
     .eqc-topbar (52px, position: fixed) + .eqc-wb (~120px, sticky-степпер
     + статус-бар) + ~8px визуального запаса = 180px. Если кто-то меняет
     геометрию любого из этих баров — править здесь, а не в .eqc-st-lp. */
  --qd-lp-offset: 180px;
}
.eqc-st__head { display: flex; flex-direction: column; gap: 4px; }
.eqc-st__eyebrow {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-st__head h2 {
  margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.012em; color: var(--ink);
}
.eqc-st__head p { margin: 0; font-size: 13px; color: var(--ink-muted); max-width: 74ch; }
.eqc-st__state {
  display: flex; align-items: center; gap: 10px; padding: 14px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-elev); font-size: 13px; color: var(--ink-muted);
}
.eqc-st-presets {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px;
}
.eqc-st-preset {
  position: relative; display: flex; flex-direction: column; padding: 0;
  text-align: left; cursor: pointer; overflow: hidden;
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
}
.eqc-st-preset:hover { border-color: var(--line-strong); box-shadow: var(--sh-sm); }
.eqc-st-preset[data-selected="true"] {
  border-color: var(--accent); box-shadow: 0 0 0 2px var(--green-200);
}
[data-theme="dark"] .eqc-st-preset[data-selected="true"] {
  box-shadow: 0 0 0 2px rgba(31, 138, 91, .35);
}
.eqc-st-preset__thumb {
  position: relative; height: 140px; background: var(--bg-sunken);
  border-bottom: 1px solid var(--line); overflow: hidden;
}
.eqc-st-preset__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eqc-st-preset__def {
  position: absolute; top: 10px; left: 10px; padding: 2px 6px; border-radius: 3px;
  background: var(--zinc-900); color: #fff; font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .05em;
}
.eqc-st-preset__check {
  position: absolute; top: 10px; right: 10px; width: 20px; height: 20px;
  border-radius: 99px; background: var(--accent); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 3px var(--bg-elev);
}
.eqc-st-preset__body { padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
.eqc-st-preset__name { font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-st-preset__cat {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .05em; color: var(--ink-muted);
}
.eqc-st-preset__tags { display: flex; flex-wrap: wrap; gap: 4px; }
.eqc-st-preset__tag {
  font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted);
  background: var(--bg-sunken); border: 1px solid var(--line);
  padding: 1px 6px; border-radius: 3px;
}
.eqc-st-preset__shots { display: flex; gap: 4px; padding: 0 14px 12px; }
.eqc-st-preset__shot {
  width: 44px; height: 32px; object-fit: cover; border-radius: 3px;
  border: 1px solid var(--line);
}
.eqc-st-apply {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 16px; border: 1px solid var(--green-200);
  background: var(--green-50); border-radius: var(--r-md);
}
[data-theme="dark"] .eqc-st-apply { background: var(--green-900); border-color: #13633F; }
.eqc-st-apply__info { flex: 1; font-size: 13px; color: var(--green-800); min-width: 200px; }
[data-theme="dark"] .eqc-st-apply__info { color: var(--green-300); }
.eqc-st-brand__desc { margin: 0; font-size: 12px; color: var(--ink-muted); }
.eqc-st-brand__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.eqc-st-brand__actions { display: flex; justify-content: flex-end; gap: 8px; }
.eqc-st-tint { display: flex; flex-direction: column; gap: 6px; }
.eqc-st-tint > span { font-size: 12px; font-weight: 500; color: var(--ink-2); }
.eqc-st-tint input[type="color"] {
  width: 100%; height: 34px; padding: 2px; cursor: pointer;
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev);
}
.eqc-st-lp {
  border: 1px solid var(--line); border-radius: var(--r-lg);
  overflow: hidden; background: var(--bg-elev);
  /* Высота — viewport минус все sticky-бары сверху (см. --qd-lp-offset
     на .eqc-st). */
  height: calc(100vh - var(--qd-lp-offset));
  min-height: 480px;
  display: flex; flex-direction: column;
}
.eqc-st-lp__bar {
  display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px;
  background: var(--bg-sunken); border-bottom: 1px solid var(--line);
  flex: 0 0 auto;
}
.eqc-st-lp__dots { display: flex; gap: 5px; }
.eqc-st-lp__dots span { width: 10px; height: 10px; border-radius: 99px; }
.eqc-st-lp__dots span:nth-child(1) { background: #FF5F57; }
.eqc-st-lp__dots span:nth-child(2) { background: #FEBC2E; }
.eqc-st-lp__dots span:nth-child(3) { background: #28C840; }
.eqc-st-lp__url {
  flex: 1; height: 22px; display: flex; align-items: center; padding: 0 10px;
  border-radius: 99px; background: var(--bg-elev); border: 1px solid var(--line);
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eqc-st-lp__vp {
  position: relative; padding: 24px; background: var(--bg-sunken);
  flex: 1 1 auto; min-height: 0;
}
.eqc-st-lp__vp iframe {
  width: 100%; height: 100%; min-height: 0; border: 0; background: #fff;
  border-radius: 4px; box-shadow: var(--sh-md);
}
.eqc-st-lp__spinner {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
}

/* =====================================================================
   ТАБ «ПУБЛИКАЦИЯ».
   ===================================================================== */
.eqc-pb { display: grid; grid-template-columns: minmax(0, 1fr) 360px; align-items: start; }
.eqc-pb__main {
  min-width: 0; padding: 24px 28px 32px;
  display: flex; flex-direction: column; gap: 16px;
}
.eqc-pb__rail {
  align-self: start; border-left: 1px solid var(--line);
  padding: 24px; background: var(--bg-elev);
}
.eqc-pb-card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 18px;
}
.eqc-pb-card__head { display: flex; align-items: flex-start; gap: 12px; }
.eqc-pb-card__ico {
  width: 40px; height: 40px; flex-shrink: 0; border-radius: var(--r-md);
  background: var(--bg-sunken); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center; color: var(--ink-2);
}
.eqc-pb-card__ico--link { background: var(--info-50); color: var(--info-700); border-color: var(--info-200); }
[data-theme="dark"] .eqc-pb-card__ico--link { background: #0F1F3A; color: #BFDBFE; border-color: #1D4ED8; }
.eqc-pb-card__title { flex: 1; min-width: 0; }
.eqc-pb-card__title h3 { margin: 0; font-size: 15px; font-weight: 600; color: var(--ink); }
.eqc-pb-card__title p { margin: 2px 0 0; font-size: 12px; line-height: 17px; color: var(--ink-muted); }
.eqc-pb-card__badge { flex-shrink: 0; }
.eqc-pb-feats {
  margin: 12px 0 0; padding: 0; list-style: none;
  display: flex; flex-direction: column; gap: 6px;
}
.eqc-pb-feats li {
  display: flex; align-items: flex-start; gap: 8px; font-size: 12px;
  line-height: 18px; color: var(--ink-2);
}
.eqc-pb-feats li::before {
  content: ''; flex-shrink: 0; width: 5px; height: 5px; margin-top: 6px;
  border-radius: 99px; background: var(--accent);
}
.eqc-pb-card__acts { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.eqc-pb-url {
  display: flex; align-items: center; gap: 8px; margin-top: 12px;
  padding: 8px 10px; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg);
}
.eqc-pb-url__v {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-2);
  overflow: hidden;
}
.eqc-pb-url__v span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eqc-pb-url__copy {
  width: 28px; height: 28px; flex-shrink: 0; display: inline-flex;
  align-items: center; justify-content: center; border-radius: var(--r-sm);
  border: 1px solid var(--line-strong); background: var(--bg-elev);
  color: var(--ink-2); cursor: pointer;
}
.eqc-pb-url__copy:hover { background: var(--bg-sunken); }
.eqc-pb-empty {
  margin-top: 12px; padding: 16px; text-align: center;
  border: 1.5px dashed var(--line-strong); border-radius: var(--r-md);
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.eqc-pb-empty p { margin: 0; font-size: 12px; color: var(--ink-muted); max-width: 36ch; }
.eqc-pb-altnote {
  display: flex; align-items: flex-start; gap: 8px; margin-top: 12px;
  padding: 10px 12px; background: var(--bg-sunken); border-radius: var(--r-md);
  font-size: 12px; line-height: 17px; color: var(--ink-muted);
}
.eqc-pb-altnote__ico { flex-shrink: 0; color: var(--ink-faint); margin-top: 1px; }
.eqc-pb-cta {
  background: var(--zinc-950); color: #FAFAFA; border-radius: var(--r-lg);
  padding: 22px; border: 1px solid var(--zinc-800);
  display: flex; flex-direction: column; gap: 12px;
}
.eqc-pb-cta__eyebrow {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--green-300);
}
.eqc-pb-cta h3 {
  margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.014em;
  line-height: 26px;
}
.eqc-pb-cta p { margin: 0; font-size: 13px; line-height: 19px; color: var(--zinc-400); }
.eqc-pb-cta__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 44px; padding: 0 18px; margin-top: 4px; border-radius: var(--r-md);
  background: var(--accent); color: #fff; font-size: 14px; font-weight: 600;
  text-decoration: none;
}
.eqc-pb-cta__btn:hover { background: var(--accent-hover); }
.eqc-pb-precheck__hd { display: flex; gap: 12px; align-items: flex-start; }
.eqc-pb-precheck__ico {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: var(--r-md);
  background: var(--info-50); color: var(--info-700);
  display: flex; align-items: center; justify-content: center;
}
[data-theme="dark"] .eqc-pb-precheck__ico { background: #0F1F3A; color: #BFDBFE; }
.eqc-pb-precheck__sub { margin: 2px 0 0; font-size: 13px; color: var(--ink-muted); }
.eqc-pb-precheck__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.eqc-pb-precheck__item {
  padding: 10px 12px; border-radius: var(--r-md); font-size: 12px; line-height: 17px;
  background: var(--warn-50); border: 1px solid var(--warn-200); color: var(--warn-700);
}
[data-theme="dark"] .eqc-pb-precheck__item { background: #2A1D05; border-color: #624017; color: #FCD34D; }

/* =====================================================================
   МОДАЛКИ рабочего места.
   ===================================================================== */
.eqc-wb-modal__sub { margin: 4px 0 0; font-size: 13px; line-height: 19px; color: var(--ink-muted); }
.eqc-wb-mtabs {
  display: flex; gap: 0; padding: 0 22px; border-bottom: 1px solid var(--line);
}
.eqc-wb-mtab {
  padding: 10px 0; margin-right: 22px; border: 0; background: transparent;
  cursor: pointer; font: inherit; font-size: 13px; font-weight: 500;
  color: var(--ink-muted); border-bottom: 2px solid transparent;
}
.eqc-wb-mtab.is-active { color: var(--ink); border-bottom-color: var(--accent); }
.eqc-wb-mfield {
  display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  padding: 8px 0; border-bottom: 1px solid var(--line);
}
.eqc-wb-mfield__k {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .05em; color: var(--ink-muted); flex-shrink: 0;
}
.eqc-wb-mfield__v { font-size: 13px; color: var(--ink); text-align: right; }
.eqc-wb-mactions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.eqc-wb-mnote { padding: 8px 2px; font-size: 13px; color: var(--ink-muted); }
.eqc-wb-mlist {
  margin: 0; padding: 0; list-style: none;
  display: flex; flex-direction: column; gap: 2px; max-height: 320px; overflow-y: auto;
}
.eqc-wb-mitem {
  width: 100%; text-align: left; padding: 9px 10px; border: 0; cursor: pointer;
  background: transparent; border-radius: var(--r-sm); font: inherit;
  display: flex; flex-direction: column; gap: 2px;
}
.eqc-wb-mitem:hover { background: var(--bg-sunken); }
.eqc-wb-mitem__t { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-wb-mitem__m {
  display: flex; gap: 10px; font-family: var(--font-mono); font-size: 11px;
  color: var(--ink-muted);
}
.eqc-wb-checkrow { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.eqc-wb-checkrow input { margin-top: 2px; accent-color: var(--accent); }
.eqc-wb-checkrow__t { font-size: 14px; font-weight: 600; color: var(--ink); }
.eqc-wb-checkrow__s { font-size: 12px; line-height: 17px; color: var(--ink-muted); margin-top: 2px; }
.eqc-wb-crmbanner { max-width: 1024px; margin: 16px auto 0; padding: 0 16px; }
.eqc-wb-crmbanner__inner { align-items: center; }
.eqc-wb-crmbanner__msg { flex: 1; min-width: 0; }

/* --- Модалка «История версий» (открывается из топбара рабочего места). --- */
.eqc-vers-sub {
  margin: 4px 0 0; font-size: 12px; line-height: 17px; color: var(--ink-muted);
}
.eqc-vers-state {
  padding: 8px 2px; font-size: 13px; color: var(--ink-muted);
}
.eqc-vers-state--empty { text-align: center; padding: 20px 0; }
.eqc-vers-list {
  display: flex; flex-direction: column; gap: 8px;
  max-height: 420px; overflow-y: auto;
}
.eqc-vers-row {
  display: grid; grid-template-columns: 44px 1fr auto; gap: 12px;
  align-items: center; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-elev);
}
.eqc-vers-row__num {
  font-family: var(--font-mono); font-size: 12px; font-weight: 600;
  color: var(--ink-2); text-align: center;
}
.eqc-vers-row__main { min-width: 0; }
.eqc-vers-row__act { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-vers-row__meta {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
  margin-top: 2px; font-family: var(--font-mono); font-size: 11px;
  color: var(--ink-muted);
}
.eqc-vers-row__sep { color: var(--ink-faint); }
.eqc-vers-row__btns { display: flex; gap: 6px; flex-shrink: 0; }

@media (max-width: 600px) {
  .eqc-vers-row {
    grid-template-columns: 44px 1fr; row-gap: 8px;
  }
  .eqc-vers-row__btns { grid-column: 1 / -1; justify-content: flex-end; }
}

/* =====================================================================
   ТОСТЫ — toastSterbrustClass() → mw-toast mw-toast--<type>.
   ===================================================================== */
.mw-toasts {
  position: fixed; right: 20px; bottom: 20px; z-index: 500;
  display: flex; flex-direction: column; gap: 8px; max-width: 360px;
}
.mw-toast {
  display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px;
  border-radius: var(--r-md); border: 1px solid var(--line);
  background: var(--bg-elev); box-shadow: var(--sh-lg);
  font-size: 13px; color: var(--ink); line-height: 18px;
}
.mw-toast__icon { flex-shrink: 0; font-size: 14px; line-height: 18px; }
.mw-toast__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.mw-toast__action {
  align-self: flex-start; background: transparent; border: 0; padding: 0;
  cursor: pointer; font: inherit; font-size: 12px; font-weight: 600;
  color: var(--green-700);
}
[data-theme="dark"] .mw-toast__action { color: var(--green-400); }
.mw-toast__close {
  flex-shrink: 0; background: transparent; border: 0; cursor: pointer;
  color: var(--ink-faint); font-size: 16px; line-height: 1; padding: 0;
}
.mw-toast--success { border-color: var(--green-200); }
.mw-toast--success .mw-toast__icon { color: var(--green-600); }
.mw-toast--error { border-color: var(--danger-200); }
.mw-toast--error .mw-toast__icon { color: var(--danger-500); }
.mw-toast--warn { border-color: var(--warn-200); }
.mw-toast--warn .mw-toast__icon { color: var(--warn-700); }
.mw-toast--info .mw-toast__icon { color: var(--info-500); }

/* ---------- Адаптив рабочего места ---------- */
@media (max-width: 1080px) {
  .eqc-tx { grid-template-columns: 1fr; }
  .eqc-tx-nav { display: none; }
  .eqc-pb { grid-template-columns: 1fr; }
  .eqc-pb__rail { border-left: 0; border-top: 1px solid var(--line); }
  /* На планшетах/маленьких ноутбуках и в мобильном режиме (динамическая
     address bar Safari) 100vh ведёт себя нестабильно — отдаём высоту
     контейнера на откуп детям: 34px bar + 480px viewport + рамка. */
  .eqc-st-lp { height: auto; min-height: 0; }
  .eqc-st-lp__vp { flex: initial; min-height: 480px; }
  .eqc-st-lp__vp iframe { height: auto; min-height: 460px; }
}
@media (max-width: 767px) {
  .eqc-wb-step, .eqc-wb-status, .eqc-wb-acts { padding-left: 16px; padding-right: 16px; }
  .eqc-wb-step { overflow-x: auto; }
  .eqc-tx-main, .eqc-st, .eqc-pb__main { padding: 16px; }
  .eqc-tx-pair { grid-template-columns: 1fr; }
  .eqc-tx-price { grid-template-columns: 1fr; }
  .eqc-tx-roi { grid-template-columns: 1fr; }
  .eqc-tx-gallery { grid-template-columns: 1fr 1fr; }
  .eqc-tx-accopts__row { grid-template-columns: 1fr; }
  .eqc-st-brand__grid { grid-template-columns: 1fr; }
  .eqc-wb-fbwrap { padding: 0 16px 20px; }
}

/* =====================================================================
   РЕАКЦИЯ КЛИЕНТА (батч 5).
   Макет: «.design/Equipment CRM Platform/Блок 7 — Реакция клиента
   & Версии», 7.1. Страница /quotations/{id}/reaction поверх Alpine-
   компонента quotationReaction. JS-возвращаемые классы (ppCardClass,
   ppBarFillClass, ppConfidenceBadgeClass, ppTrendChipClass,
   sparklineClass, closedPpCardClass → mw-rx-pp__*; heatmapLevelClass →
   is-high/is-med/is-low) перекрыты составными правилами ниже.
   ===================================================================== */

/* ---------- Кнопка primary-outline (общая для реакции и версии) ---------- */
.eqc-btn--primary-outline {
  background: var(--bg-elev); color: var(--accent-hover); border-color: var(--green-300);
}
.eqc-btn--primary-outline:hover { background: var(--green-50); }
[data-theme="dark"] .eqc-btn--primary-outline {
  background: transparent; color: var(--green-300); border-color: var(--green-700);
}
[data-theme="dark"] .eqc-btn--primary-outline:hover { background: rgba(31, 138, 91, .12); }

/* ---------- Шапка страницы ---------- */
.eqc-rx-head {
  padding: 24px 32px 22px; border-bottom: 1px solid var(--line); background: var(--bg);
}
.eqc-rx-head__back {
  display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px;
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted); text-decoration: none;
}
.eqc-rx-head__back:hover { color: var(--ink-2); }
.eqc-rx-head__back-sep { color: var(--ink-faint); }
.eqc-rx-head__row {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 32px;
}
.eqc-rx-head__main { min-width: 0; }
.eqc-rx-head__title {
  margin: 0; font-size: 28px; line-height: 34px; font-weight: 600;
  letter-spacing: -0.014em; color: var(--ink);
}
.eqc-rx-head__meta {
  display: flex; align-items: center; gap: 14px; margin-top: 10px; flex-wrap: wrap;
}
.eqc-rx-head__line { font-size: 13px; color: var(--ink-muted); }
.eqc-rx-head__price {
  font-family: var(--font-mono); font-size: 18px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.eqc-rx-head__actions { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }

/* ---------- Тело: grid из 12 колонок ---------- */
.eqc-rx-body { padding: 22px 32px 32px; background: var(--bg); }
.eqc-rx-grid {
  display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; align-items: start;
}
.eqc-rx-span-12 { grid-column: span 12; }
.eqc-rx-span-8 { grid-column: span 8; }
.eqc-rx-span-6 { grid-column: span 6; }
.eqc-rx-span-4 { grid-column: span 4; }

/* ---------- Базовая панель ---------- */
.eqc-rx-panel {
  background: var(--bg-elev); border: 1px solid var(--line); border-radius: var(--r-lg);
  overflow: hidden; display: flex; flex-direction: column; min-width: 0;
}
.eqc-rx-panel__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line);
}
.eqc-rx-panel__head h3 {
  margin: 0; font-size: 13px; font-weight: 600; color: var(--ink);
  display: inline-flex; align-items: center; gap: 8px; min-width: 0;
}
.eqc-rx-panel__ico { color: var(--ink-muted); display: inline-flex; flex-shrink: 0; }
.eqc-rx-panel__meta {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted); white-space: nowrap;
}
.eqc-rx-panel__head-right { display: flex; align-items: center; gap: 8px; }
.eqc-rx-panel__body { padding: 18px; flex: 1; }
.eqc-rx-panel__body--flush { padding: 0; }

/* ---------- Загрузка / пустые состояния панелей ---------- */
.eqc-rx-loading {
  padding: 24px 18px; text-align: center; font-size: 13px; color: var(--ink-muted);
}
.eqc-rx-empty {
  padding: 32px 18px; min-height: 180px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; gap: 10px;
}
.eqc-rx-empty__ico {
  width: 44px; height: 44px; border: 1.5px dashed var(--line-strong);
  border-radius: 10px; display: flex; align-items: center; justify-content: center;
  color: var(--ink-faint);
}
.eqc-rx-empty h4 {
  margin: 0; font-size: 14px; font-weight: 600; color: var(--ink-2);
}
.eqc-rx-empty p {
  margin: 0; font-size: 12.5px; color: var(--ink-muted); max-width: 38ch; line-height: 18px;
}

/* ---------- Бейджи реакции ---------- */
.eqc-rx-badge {
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; line-height: 1; white-space: nowrap;
  border: 1px solid var(--line-strong); background: var(--bg-elev); color: var(--ink-2);
}
.eqc-rx-badge__dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--ink-muted); flex-shrink: 0;
}
.eqc-rx-badge__dot--pulse { animation: eqc-pulse 1.6s ease-in-out infinite; }
.eqc-rx-badge--ok { background: var(--green-50); color: var(--green-700); border-color: var(--green-200); }
.eqc-rx-badge--ok .eqc-rx-badge__dot { background: var(--green-500); }
.eqc-rx-badge--info { background: var(--info-50); color: var(--info-700); border-color: var(--info-200); }
.eqc-rx-badge--info .eqc-rx-badge__dot { background: var(--info-500); }
.eqc-rx-badge--warn { background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200); }
.eqc-rx-badge--warn .eqc-rx-badge__dot { background: var(--warn-500); }
.eqc-rx-badge--err { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
.eqc-rx-badge--err .eqc-rx-badge__dot { background: var(--danger-500); }
.eqc-rx-badge--draft,
.eqc-rx-badge--mute { background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line-strong); }
[data-theme="dark"] .eqc-rx-badge--ok { background: #082818; color: #85C29F; border-color: #13633F; }
[data-theme="dark"] .eqc-rx-badge--info { background: #0F1F3A; color: #BFDBFE; border-color: #1D4ED8; }
[data-theme="dark"] .eqc-rx-badge--warn { background: #2A1D05; color: #FCD34D; border-color: #624017; }
[data-theme="dark"] .eqc-rx-badge--err { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }

/* JS-классы уверенности (ppConfidenceBadgeClass). */
.eqc-rx-badge.mw-rx-pp__confidence--high {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-rx-badge.mw-rx-pp__confidence--high .eqc-rx-badge__dot { background: var(--green-500); }
.eqc-rx-badge.mw-rx-pp__confidence--medium {
  background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200);
}
.eqc-rx-badge.mw-rx-pp__confidence--medium .eqc-rx-badge__dot { background: var(--warn-500); }
.eqc-rx-badge.mw-rx-pp__confidence--low {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line-strong);
}
[data-theme="dark"] .eqc-rx-badge.mw-rx-pp__confidence--high {
  background: #082818; color: #85C29F; border-color: #13633F;
}
[data-theme="dark"] .eqc-rx-badge.mw-rx-pp__confidence--medium {
  background: #2A1D05; color: #FCD34D; border-color: #624017;
}

/* ---------- Панель «Вероятность сделки» ---------- */
.eqc-rx-prob__loading {
  padding: 40px 18px; display: flex; flex-direction: column; align-items: center;
  gap: 12px; font-size: 13px; color: var(--ink-muted);
}

/* cold-start */
.eqc-rx-prob__cold {
  display: grid; grid-template-columns: auto 1fr auto; gap: 16px;
  align-items: center; padding: 22px;
}
.eqc-rx-prob__cold-num {
  font-size: 56px; line-height: 1; font-weight: 600; color: var(--ink-faint);
  letter-spacing: -0.04em;
}
.eqc-rx-prob__cold-unit { font-size: 26px; font-weight: 500; }
.eqc-rx-prob__cold-title {
  font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 4px;
}
.eqc-rx-prob__cold-text { font-size: 13px; color: var(--ink-2); line-height: 19px; }
.eqc-rx-prob__cold-ico {
  width: 44px; height: 44px; border-radius: var(--r-md); flex-shrink: 0;
  background: var(--bg-sunken); border: 1px dashed var(--line-strong);
  display: flex; align-items: center; justify-content: center; color: var(--ink-muted);
}

/* closed-won / closed-lost */
.eqc-rx-prob__closed { display: flex; flex-direction: column; }
.eqc-rx-prob__closed.mw-rx-pp__card--won { background: var(--green-50); }
.eqc-rx-prob__closed.mw-rx-pp__card--won .eqc-rx-panel__head { border-bottom-color: var(--green-200); }
.eqc-rx-prob__closed.mw-rx-pp__card--lost { background: var(--danger-50); }
.eqc-rx-prob__closed.mw-rx-pp__card--lost .eqc-rx-panel__head { border-bottom-color: var(--danger-200); }
[data-theme="dark"] .eqc-rx-prob__closed.mw-rx-pp__card--won { background: #082818; }
[data-theme="dark"] .eqc-rx-prob__closed.mw-rx-pp__card--lost { background: #2A0808; }
.eqc-rx-prob__closed-meta {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}

/* ok-state body */
.eqc-rx-prob__body {
  display: grid; grid-template-columns: 320px 1fr; gap: 28px; padding: 22px;
}
.eqc-rx-prob__left { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.eqc-rx-prob__pct { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.eqc-rx-prob__pct-num {
  font-size: 68px; line-height: 1; font-weight: 600; color: var(--ink);
  letter-spacing: -0.04em; font-variant-numeric: tabular-nums;
}
.eqc-rx-prob__pct-unit { font-size: 30px; font-weight: 500; color: var(--ink-muted); }
.eqc-rx-prob__trend {
  display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
  border-radius: var(--r-full); font-family: var(--font-mono); font-size: 12px;
  font-weight: 500; border: 1px solid var(--line-strong);
  background: var(--bg-sunken); color: var(--ink-2);
}
.eqc-rx-prob__trend.mw-rx-pp__trend--up {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-rx-prob__trend.mw-rx-pp__trend--down {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
[data-theme="dark"] .eqc-rx-prob__trend.mw-rx-pp__trend--up {
  background: #082818; color: #85C29F; border-color: #13633F;
}
[data-theme="dark"] .eqc-rx-prob__trend.mw-rx-pp__trend--down {
  background: #2A0808; color: #FCA5A5; border-color: #7F1D1D;
}
.eqc-rx-prob__bar {
  position: relative; height: 8px; border-radius: var(--r-full);
  background: var(--bg-sunken); border: 1px solid var(--line);
}
.eqc-rx-prob__bar-fill {
  position: absolute; top: 0; left: 0; height: 100%; border-radius: var(--r-full);
  background: var(--accent); transition: width .3s ease;
}
.eqc-rx-prob__bar-fill.mw-rx-pp__bar-fill--hot { background: var(--green-500); }
.eqc-rx-prob__bar-fill.mw-rx-pp__bar-fill--warm { background: var(--warn-500); }
.eqc-rx-prob__bar-fill.mw-rx-pp__bar-fill--cold { background: var(--ink-faint); }
.eqc-rx-prob__bar-bl {
  position: absolute; top: -3px; bottom: -3px; width: 2px;
  background: var(--ink-faint); border-radius: var(--r-full);
}
.eqc-rx-prob__scale {
  display: flex; justify-content: space-between; font-family: var(--font-mono);
  font-size: 10px; color: var(--ink-faint); letter-spacing: .04em;
}
.eqc-rx-prob__spark {
  display: flex; align-items: center; gap: 8px; height: 32px; color: var(--ink-muted);
}
.eqc-rx-prob__spark.mw-rx-pp__spark--up { color: var(--green-500); }
.eqc-rx-prob__spark.mw-rx-pp__spark--down { color: var(--danger-500); }
.eqc-rx-prob__spark-svg { width: 80px; height: 24px; flex-shrink: 0; }
.eqc-rx-prob__spark-label {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--ink-muted);
}
.eqc-rx-prob__hint { font-size: 12.5px; color: var(--ink-muted); line-height: 18px; }
.eqc-rx-prob__foot {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--ink-faint);
}

/* drivers — «что повышает» / «что снижает» */
.eqc-rx-prob__right,
.eqc-rx-prob__drivers { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.eqc-rx-prob__drivers { padding: 0 22px 22px; }
.eqc-rx-prob__drv {
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 14px;
}
.eqc-rx-prob__drv-ti {
  display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-rx-prob__drv--up .eqc-rx-prob__drv-ti { color: var(--green-700); }
.eqc-rx-prob__drv--dn .eqc-rx-prob__drv-ti { color: var(--danger-700); }
[data-theme="dark"] .eqc-rx-prob__drv--up .eqc-rx-prob__drv-ti { color: var(--green-400); }
[data-theme="dark"] .eqc-rx-prob__drv--dn .eqc-rx-prob__drv-ti { color: #FCA5A5; }
.eqc-rx-prob__drv-ar {
  width: 16px; height: 16px; border-radius: 3px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.eqc-rx-prob__drv--up .eqc-rx-prob__drv-ar { background: var(--green-100); color: var(--green-700); }
.eqc-rx-prob__drv--dn .eqc-rx-prob__drv-ar { background: var(--danger-50); color: var(--danger-700); }
[data-theme="dark"] .eqc-rx-prob__drv--up .eqc-rx-prob__drv-ar { background: #0E3D26; color: var(--green-400); }
[data-theme="dark"] .eqc-rx-prob__drv--dn .eqc-rx-prob__drv-ar { background: #2A0808; color: #FCA5A5; }
.eqc-rx-prob__drv-list {
  margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px;
}
.eqc-rx-prob__drv-list li {
  display: grid; grid-template-columns: 14px 1fr; gap: 8px; align-items: start;
  font-size: 13px; line-height: 18px; color: var(--ink-2);
}
.eqc-rx-prob__drv-li-ar { margin-top: 2px; }
.eqc-rx-prob__drv--up .eqc-rx-prob__drv-li-ar { color: var(--green-500); }
.eqc-rx-prob__drv--dn .eqc-rx-prob__drv-li-ar { color: var(--danger-500); }

/* поповер «Как рассчитано?» */
/* Базовый .eqc-rx-panel ставит overflow:hidden ради скруглённых углов,
   из-за чего абсолютно позиционированный поповер обрезается и следующие
   блоки реакции рисуются поверх. Для панели вероятности — снимаем клиппинг
   и поднимаем стек-уровень поповера выше соседних панелей. */
.eqc-rx-prob { overflow: visible; }
.eqc-rx-prob__help-wrap { position: relative; z-index: 220; }
.eqc-rx-prob__help {
  position: absolute; right: 0; top: calc(100% + 8px); width: 360px; z-index: 220;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); padding: 16px;
  max-height: 70vh; overflow-y: auto;
}
.eqc-rx-prob__help-title {
  margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--ink);
}
.eqc-rx-prob__help-h {
  margin: 14px 0 4px; font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-rx-prob__help-lead {
  margin: 0; font-size: 12.5px; line-height: 18px; color: var(--ink-2);
}
.eqc-rx-prob__help-lead--last { margin-bottom: 4px; }
.eqc-rx-prob__help-list {
  margin: 4px 0 0; padding-left: 18px; font-size: 12.5px; line-height: 18px;
  color: var(--ink-2); display: flex; flex-direction: column; gap: 6px;
}
.eqc-rx-prob__help-list--seg { list-style: none; padding-left: 0; }
.eqc-rx-prob__help-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 4px; vertical-align: middle;
}
.eqc-rx-prob__help-dot--low { background: var(--ink-faint); }
.eqc-rx-prob__help-dot--med { background: var(--warn-500); }
.eqc-rx-prob__help-dot--high { background: var(--green-500); }
.eqc-rx-prob__help-seg { font-weight: 600; color: var(--ink); }
.eqc-rx-prob__help-close { margin-top: 14px; width: 100%; }

/* ---------- Подготовка к звонку ---------- */
.eqc-rx-tips { display: flex; flex-direction: column; gap: 10px; }
.eqc-rx-tip {
  display: grid; grid-template-columns: 28px 1fr; gap: 10px; padding: 12px;
  background: var(--bg-sunken); border: 1px solid var(--line); border-radius: var(--r-md);
}
.eqc-rx-tip__ico {
  width: 28px; height: 28px; border-radius: var(--r-sm); flex-shrink: 0;
  background: var(--bg-elev); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center; color: var(--ink-muted);
}
.eqc-rx-tip__t { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 18px; }
.eqc-rx-tip__x { font-size: 12.5px; color: var(--ink-2); line-height: 18px; margin-top: 2px; }

/* ---------- Тумблер «включая мои тестовые просмотры» ---------- */
.eqc-rx-hm__toggle { display: inline-flex; }
.eqc-rx-toggle {
  display: inline-flex; align-items: center; gap: 8px; padding: 0;
  background: transparent; border: 0; cursor: pointer; color: var(--ink-2);
  font: inherit; font-size: 12px;
}
.eqc-rx-toggle__sw {
  position: relative; width: 28px; height: 16px; border-radius: var(--r-full);
  background: var(--line-strong); flex-shrink: 0; transition: background .15s;
}
.eqc-rx-toggle__sw::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px;
  border-radius: 50%; background: #fff; transition: left .15s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.eqc-rx-toggle.is-on .eqc-rx-toggle__sw { background: var(--accent); }
.eqc-rx-toggle.is-on .eqc-rx-toggle__sw::after { left: 14px; }
.eqc-rx-toggle__count {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}

/* ---------- Heat map ---------- */
.eqc-rx-hm { list-style: none; margin: 0; padding: 0; }
.eqc-rx-hm__row {
  display: grid; grid-template-columns: minmax(0, 1.4fr) 56px minmax(0, 1fr) auto;
  gap: 6px 14px; align-items: center; padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}
.eqc-rx-hm__row:last-child { border-bottom: 0; }
.eqc-rx-hm__row[data-level="none"] { background: var(--bg-sunken); }
.eqc-rx-hm__name {
  font-size: 13px; color: var(--ink); font-weight: 500; min-width: 0;
}
.eqc-rx-hm__row[data-level="none"] .eqc-rx-hm__name { color: var(--ink-muted); }
.eqc-rx-hm__time {
  font-family: var(--font-mono); font-size: 13px; color: var(--ink);
  font-variant-numeric: tabular-nums; text-align: right;
}
.eqc-rx-hm__track {
  height: 10px; border-radius: var(--r-full); background: var(--bg-sunken);
  border: 1px solid var(--line); position: relative; overflow: hidden;
}
.eqc-rx-hm__bar {
  position: absolute; top: 0; left: 0; height: 100%; border-radius: var(--r-full);
}
.eqc-rx-hm__bar.is-high { background: linear-gradient(90deg, #FCA5A5, var(--danger-500)); }
.eqc-rx-hm__bar.is-med { background: linear-gradient(90deg, #FCD34D, var(--warn-500)); }
.eqc-rx-hm__bar.is-low { background: linear-gradient(90deg, var(--info-200), var(--info-500)); }
.eqc-rx-hm__pill {
  justify-self: end; display: inline-flex; align-items: center; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 11px; line-height: 1; white-space: nowrap;
  border: 1px solid var(--line-strong); background: var(--bg-sunken); color: var(--ink-muted);
}
.eqc-rx-hm__pill.is-high { background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200); }
.eqc-rx-hm__pill.is-med { background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200); }
.eqc-rx-hm__pill.is-low { background: var(--info-50); color: var(--info-700); border-color: var(--info-200); }
[data-theme="dark"] .eqc-rx-hm__pill.is-high { background: #2A0808; color: #FCA5A5; border-color: #7F1D1D; }
[data-theme="dark"] .eqc-rx-hm__pill.is-med { background: #2A1D05; color: #FCD34D; border-color: #624017; }
[data-theme="dark"] .eqc-rx-hm__pill.is-low { background: #0F1F3A; color: #BFDBFE; border-color: #1D4ED8; }
.eqc-rx-hm__meta {
  grid-column: 1 / -1; display: flex; gap: 10px; font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-muted);
}
.eqc-rx-hm__meta:empty { display: none; }

/* ---------- Вопросы клиента ---------- */
.eqc-rx-qs { display: flex; flex-direction: column; }
.eqc-rx-q {
  display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}
.eqc-rx-q:last-child { border-bottom: 0; }
.eqc-rx-q.is-new { background: var(--info-50); }
[data-theme="dark"] .eqc-rx-q.is-new { background: #0F1F3A; }
.eqc-rx-q__av {
  width: 32px; height: 32px; border-radius: var(--r-sm); flex-shrink: 0;
  background: var(--bg-sunken); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center; color: var(--ink-muted);
}
.eqc-rx-q__body { min-width: 0; }
.eqc-rx-q__head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 4px;
}
.eqc-rx-q__name { font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-rx-q__new {
  display: inline-flex; align-items: center; padding: 1px 7px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
  background: var(--info-50); color: var(--info-700); border: 1px solid var(--info-200);
}
[data-theme="dark"] .eqc-rx-q__new { background: #0F1F3A; color: #BFDBFE; border-color: #1D4ED8; }
.eqc-rx-q__time {
  margin-left: auto; font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-rx-q__text { font-size: 13.5px; line-height: 20px; color: var(--ink-2); }
.eqc-rx-q__phone {
  display: inline-flex; align-items: center; gap: 5px; margin-top: 6px;
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}

/* ---------- Админский блок «Метрики генерации» ---------- */
.eqc-rx-admin { margin-top: 24px; }
.eqc-rx-admin__divider { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.eqc-rx-admin__line {
  flex: 1; height: 1px;
  background: repeating-linear-gradient(90deg, var(--line-strong) 0 4px, transparent 4px 8px);
}
.eqc-rx-admin__label {
  display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-rx-admin__dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--ink-faint);
}
.eqc-rx-kpis {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px;
}
.eqc-rx-kpi {
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 12px 14px;
}
.eqc-rx-kpi__k {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted); margin-bottom: 4px;
}
.eqc-rx-kpi__v {
  font-family: var(--font-mono); font-size: 18px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums; line-height: 1.2;
}
.eqc-rx-kpi__sep { color: var(--ink-faint); margin: 0 2px; }
.eqc-rx-tblwrap {
  border: 1px solid var(--line); border-radius: var(--r-md); overflow-x: auto;
}
.eqc-rx-tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.eqc-rx-tbl thead th {
  background: var(--bg-sunken); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted); font-weight: 500;
  padding: 8px 14px; border-bottom: 1px solid var(--line); text-align: left;
  white-space: nowrap;
}
.eqc-rx-tbl tbody td {
  padding: 10px 14px; border-bottom: 1px solid var(--line); color: var(--ink-2);
  white-space: nowrap;
}
.eqc-rx-tbl tbody tr:last-child td { border-bottom: 0; }
.eqc-rx-tbl tbody td b { font-weight: 600; color: var(--ink); }
.eqc-rx-tbl__r { text-align: right; }
.eqc-rx-tbl tbody td.eqc-rx-tbl__r { font-variant-numeric: tabular-nums; }
.eqc-rx-tbl__mono { font-family: var(--font-mono); }
.eqc-rx-tbl__sep { color: var(--ink-faint); margin: 0 2px; }

/* ---------- Адаптив ---------- */
@media (max-width: 1100px) {
  .eqc-rx-grid > .eqc-rx-span-12,
  .eqc-rx-grid > .eqc-rx-span-8,
  .eqc-rx-grid > .eqc-rx-span-6,
  .eqc-rx-grid > .eqc-rx-span-4 { grid-column: span 12; }
  .eqc-rx-prob__body { grid-template-columns: 1fr; gap: 18px; }
  .eqc-rx-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .eqc-rx-head { padding: 16px; }
  .eqc-rx-head__row { flex-direction: column; gap: 14px; }
  .eqc-rx-head__actions { width: 100%; }
  .eqc-rx-head__actions .eqc-btn { flex: 1; }
  .eqc-rx-head__title { font-size: 22px; line-height: 28px; }
  .eqc-rx-body { padding: 16px; }
  .eqc-rx-prob__right,
  .eqc-rx-prob__drivers { grid-template-columns: 1fr; }
  .eqc-rx-kpis { grid-template-columns: 1fr 1fr; }
  .eqc-rx-prob__help { width: min(360px, calc(100vw - 48px)); }
}

/* =====================================================================
   ПРОСМОТР ВЕРСИИ КП (батч 5).
   Макет: «.design/Equipment CRM Platform/Блок 7 — Реакция клиента
   & Версии», 7.2. Страница /quotations/{id}/versions/{n} поверх
   Alpine-компонента versionView. JS-возвращаемый toastClass отдаёт
   Tailwind-утилиты — перекрыты компаунд-правилами .eqc-vsn-toast.bg-*.
   ===================================================================== */

/* ---------- Шапка версии ---------- */
.eqc-vsn-head {
  padding: 22px 32px 18px; border-bottom: 1px solid var(--line); background: var(--bg);
}
.eqc-vsn-head__crumb {
  display: flex; align-items: center; gap: 6px; margin-bottom: 8px;
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-vsn-head__row {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px;
}
.eqc-vsn-head__main { min-width: 0; }
.eqc-vsn-head__title {
  margin: 0; font-size: 26px; line-height: 32px; font-weight: 600;
  letter-spacing: -0.014em; color: var(--ink);
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.eqc-vsn-head__vn { color: var(--ink-muted); font-weight: 500; }
.eqc-vsn-head__sub {
  margin-top: 6px; font-family: var(--font-mono); font-size: 13px; color: var(--ink-muted);
}
.eqc-vsn-head__sub b { color: var(--ink-2); font-weight: 500; }
.eqc-vsn-head__sep { color: var(--ink-faint); margin: 0 8px; }
.eqc-vsn-head__actions { display: flex; gap: 8px; flex-shrink: 0; }

/* ---------- Тост (toastClass → Tailwind-утилиты) ---------- */
.eqc-vsn-toast {
  position: fixed; top: 64px; right: 24px; z-index: 300; max-width: 360px;
  display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px;
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); border: 1px solid var(--line);
  font-size: 13px;
}
.eqc-vsn-toast.bg-surface-container-high {
  background: var(--bg-elev); color: var(--ink);
}
.eqc-vsn-toast.bg-error-container {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
[data-theme="dark"] .eqc-vsn-toast.bg-error-container {
  background: #2A0808; color: #FCA5A5; border-color: #7F1D1D;
}
.eqc-vsn-toast__msg { flex: 1; line-height: 18px; }
.eqc-vsn-toast__close {
  background: transparent; border: 0; color: inherit; cursor: pointer;
  display: inline-flex; opacity: .7; padding: 0;
}
.eqc-vsn-toast__close:hover { opacity: 1; }

/* ---------- Баннер read-only ---------- */
.eqc-vsn-banner {
  display: flex; align-items: center; gap: 10px; margin: 18px 32px 0;
  padding: 12px 16px; border-radius: var(--r-md); font-size: 13px;
  background: var(--warn-50); border: 1px solid var(--warn-200); color: var(--warn-700);
}
[data-theme="dark"] .eqc-vsn-banner {
  background: #2A1D05; border-color: #624017; color: #FCD34D;
}
.eqc-vsn-banner__ico { flex-shrink: 0; display: inline-flex; }
.eqc-vsn-banner b { font-weight: 600; }

/* ---------- Документ-снимок ---------- */
.eqc-vsn-doc {
  margin: 24px 32px 40px; padding: 48px 64px 56px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--sh-sm); color: var(--ink);
}
.eqc-vsn-doc__hdr {
  display: flex; justify-content: space-between; align-items: flex-end;
  gap: 24px; padding-bottom: 18px; border-bottom: 2px solid var(--ink);
}
.eqc-vsn-doc__title {
  margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -0.006em; color: var(--ink);
}
.eqc-vsn-doc__num {
  margin-top: 6px; font-family: var(--font-mono); font-size: 13px; color: var(--ink-muted);
}
.eqc-vsn-doc__date {
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted);
  text-align: right; flex-shrink: 0;
}
.eqc-vsn-doc__sec { margin-top: 28px; }
.eqc-vsn-doc__sec h3 {
  margin: 0 0 12px; font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .12em; color: var(--ink-muted);
}
.eqc-vsn-doc__client { display: flex; flex-direction: column; gap: 3px; }
.eqc-vsn-doc__client-co { font-size: 18px; font-weight: 600; color: var(--ink); }
.eqc-vsn-doc__client-nm { font-size: 14px; color: var(--ink-2); }
.eqc-vsn-doc__client-ct { font-size: 13px; color: var(--ink-muted); }
.eqc-vsn-doc__prose {
  font-size: 14px; line-height: 22px; color: var(--ink-2); white-space: pre-line;
}
.eqc-vsn-doc__prose--lead { font-size: 15px; color: var(--ink); }
.eqc-vsn-doc__spec { width: 100%; border-collapse: collapse; font-size: 13px; }
.eqc-vsn-doc__spec td {
  padding: 8px 12px; border-bottom: 1px solid var(--line); vertical-align: top;
}
.eqc-vsn-doc__spec tr:last-child td { border-bottom: 0; }
.eqc-vsn-doc__spec-k { color: var(--ink-muted); width: 42%; }
.eqc-vsn-doc__spec-v { color: var(--ink); font-weight: 500; }
.eqc-vsn-doc__total {
  display: flex; justify-content: space-between; align-items: flex-end; gap: 24px;
  padding: 20px 24px; background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.eqc-vsn-doc__total-k {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .1em; color: var(--ink-muted);
}
.eqc-vsn-doc__total-v {
  font-family: var(--font-mono); font-size: 32px; font-weight: 600; color: var(--ink);
  letter-spacing: -0.02em; line-height: 1; font-variant-numeric: tabular-nums;
}
.eqc-vsn-doc__total-cur { color: var(--ink-muted); font-weight: 500; font-size: 20px; }
.eqc-vsn-doc__reco {
  padding: 18px 22px; background: var(--green-50);
  border-left: 3px solid var(--green-500); border-radius: 0 var(--r-md) var(--r-md) 0;
}
[data-theme="dark"] .eqc-vsn-doc__reco { background: #082818; }
.eqc-vsn-doc__reco-k {
  margin-bottom: 6px; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .08em; color: var(--green-700);
}
[data-theme="dark"] .eqc-vsn-doc__reco-k { color: var(--green-300); }
.eqc-vsn-doc__reco-t { font-size: 14px; line-height: 22px; color: var(--green-800); }
[data-theme="dark"] .eqc-vsn-doc__reco-t { color: var(--green-100); }

/* ---------- Адаптив ---------- */
@media (max-width: 720px) {
  .eqc-vsn-head { padding: 16px; }
  .eqc-vsn-head__row { flex-direction: column; align-items: stretch; gap: 14px; }
  .eqc-vsn-head__actions { flex-wrap: wrap; }
  .eqc-vsn-head__actions .eqc-btn { flex: 1; }
  .eqc-vsn-head__title { font-size: 21px; line-height: 27px; }
  .eqc-vsn-banner { margin: 14px 16px 0; }
  .eqc-vsn-doc { margin: 16px; padding: 22px 18px 28px; }
  .eqc-vsn-doc__hdr { flex-direction: column; align-items: flex-start; gap: 8px; }
  .eqc-vsn-doc__date { text-align: left; }
  .eqc-vsn-doc__total { flex-direction: column; align-items: stretch; gap: 10px; }
  .eqc-vsn-toast { left: 16px; right: 16px; max-width: none; }
}

/* =====================================================================
   БАЗА ЗНАНИЙ — список + статья (батч 6).
   Макет: «.design/Equipment CRM Platform/Блок 10 — База знаний…», 10.1–10.2.

   Реимплементация поверх Alpine-компонентов knowledgeBase и
   knowledgeBaseArticle. Структурные узлы — .eqc-kb-*; классы из JS-getter'ов
   (mw-kb-hero/col/chip/tag/art/grid/sort__item/suggest-kind/reader__react)
   перекрашиваются здесь поверх manager_workspace.css — JS не трогаем.
   ===================================================================== */

/* ---------- Шапка: stat-line ---------- */
.eqc-kb-stats {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin-top: 8px; font-size: 13px; color: var(--ink-2);
}
.eqc-kb-stats b { color: var(--ink); font-weight: 600; font-family: var(--font-mono); }
.eqc-kb-stats__sep { width: 3px; height: 3px; border-radius: 50%; background: var(--ink-faint); }

/* ---------- Hero: поиск + закреплённая статья ---------- */
.mw-kb-hero {
  display: grid; grid-template-columns: 1.15fr 1fr; gap: 18px; align-items: stretch;
}
.mw-kb-hero--solo { grid-template-columns: 1fr; }

.eqc-kb-search-card {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 24px 26px;
  display: flex; flex-direction: column; gap: 14px;
}
.eqc-kb-search-card__h { margin: 0; font-size: 18px; font-weight: 600; color: var(--ink); }
.eqc-kb-search-card__lede {
  margin: 4px 0 0; font-size: 13px; line-height: 18px; color: var(--ink-muted);
}
.eqc-kb-search {
  display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 16px;
  border-radius: var(--r-md); background: var(--bg-elev);
  border: 1px solid var(--line-strong);
}
.eqc-kb-search:focus-within {
  border-color: var(--accent); box-shadow: 0 0 0 3px rgba(31, 138, 91, .12);
}
.eqc-kb-search .glyph { color: var(--ink-muted); flex-shrink: 0; }
.eqc-kb-search input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
  font: inherit; font-size: 15px; color: var(--ink); padding: 0;
}
.eqc-kb-search input::placeholder { color: var(--ink-faint); }
.eqc-kb-kbd {
  flex-shrink: 0; border: 1px solid var(--line-strong); border-bottom-width: 2px;
  border-radius: 3px; padding: 1px 5px; font-family: var(--font-mono);
  font-size: 10px; color: var(--ink-2); background: var(--bg-sunken); line-height: 1.3;
}
.eqc-kb-hints {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  font-size: 12px; color: var(--ink-muted);
}
.eqc-kb-hints__lbl {
  font-family: var(--font-mono); font-size: 10px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted); margin-right: 2px;
}
.eqc-kb-hint {
  display: inline-flex; align-items: center; padding: 5px 10px;
  border: 1px solid var(--line-strong); border-radius: var(--r-full);
  background: var(--bg-elev); font: inherit; font-size: 12px; color: var(--ink-2);
  cursor: pointer; line-height: 1;
}
.eqc-kb-hint:hover { background: var(--bg-sunken); border-color: var(--ink-faint); }

.eqc-kb-pin {
  background: linear-gradient(180deg, var(--green-50) 0, var(--bg-elev) 60%);
  border: 1px solid var(--green-200); border-radius: var(--r-xl);
  padding: 22px 24px; display: flex; flex-direction: column; gap: 10px;
  text-decoration: none; color: inherit;
}
.eqc-kb-pin:hover { border-color: var(--green-300); }
.eqc-kb-pin__eb {
  display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono);
  font-size: 10px; text-transform: uppercase; letter-spacing: .08em;
  color: var(--green-700);
}
.eqc-kb-pin__t {
  margin: 0; font-size: 19px; line-height: 24px; font-weight: 600;
  letter-spacing: -.008em; color: var(--ink);
}
.eqc-kb-pin__e { margin: 0; font-size: 13px; line-height: 19px; color: var(--ink-2); }
.eqc-kb-pin__meta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: auto;
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-kb-pin__meta .glyph { color: var(--ink-faint); }
.eqc-kb-pin__dot { width: 3px; height: 3px; border-radius: 50%; background: var(--ink-faint); }
.eqc-kb-pin__cta {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 2px;
  font-size: 13px; font-weight: 500; color: var(--green-700);
}

/* ---------- Полоса секции (Коллекции / Результаты) ---------- */
.eqc-kb-secbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
}
.eqc-kb-secbar h2 {
  margin: 0; font-size: 15px; font-weight: 600; color: var(--ink-2);
}
.eqc-kb-secbar h2 span {
  font-family: var(--font-mono); color: var(--ink); font-weight: 500;
}

/* ---------- Коллекции ---------- */
.eqc-kb-collgrid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 12px;
}
.mw-kb-col {
  display: flex; flex-direction: column; gap: 10px; text-align: left;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 18px 18px 16px; cursor: pointer;
  font: inherit; color: inherit; transition: border-color .12s, background .12s;
}
.mw-kb-col:hover {
  border-color: var(--green-300);
  background: linear-gradient(180deg, var(--green-50) 0, var(--bg-elev) 80%);
}
.mw-kb-col.is-active {
  border-color: var(--accent);
  background: linear-gradient(180deg, var(--green-50) 0, var(--bg-elev) 80%);
}
.mw-kb-col__ico {
  width: 36px; height: 36px; border-radius: var(--r-md); background: var(--bg-sunken);
  border: 1px solid var(--line); display: inline-flex; align-items: center;
  justify-content: center; font-size: 18px; color: var(--ink-2);
}
.mw-kb-col__t {
  font-size: 14px; font-weight: 600; line-height: 18px; color: var(--ink);
}
.mw-kb-col__d { font-size: 12px; line-height: 16px; color: var(--ink-muted); }
.mw-kb-col__meta {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: auto; padding-top: 6px; border-top: 1px dashed var(--line);
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.mw-kb-col__new { color: var(--green-700); font-weight: 500; }

/* ---------- Фильтр-стек ---------- */
.eqc-kb-filters {
  display: flex; flex-direction: column; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-lg); overflow: visible;
}
.eqc-kb-filt-row {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px;
  border-bottom: 1px solid var(--line); flex-wrap: wrap;
}
.eqc-kb-filt-row:last-child { border-bottom: 0; }
.eqc-kb-filt-row__lbl {
  width: 78px; flex-shrink: 0; font-family: var(--font-mono); font-size: 10px;
  text-transform: uppercase; letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-kb-filt-row__chips { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; }

.mw-kb-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px;
  border: 1px solid var(--line-strong); border-radius: var(--r-full);
  background: var(--bg-elev); font: inherit; font-size: 12px; color: var(--ink-2);
  cursor: pointer; white-space: nowrap; line-height: 1;
}
.mw-kb-chip:hover { background: var(--bg-sunken); }
.mw-kb-chip.is-active {
  background: var(--zinc-900); color: #FAFAFA; border-color: var(--zinc-900);
}
.mw-kb-chip.is-active.is-accent {
  background: var(--accent); color: #fff; border-color: var(--accent);
}
.mw-kb-chip__n { font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted); }
.mw-kb-chip.is-active .mw-kb-chip__n { color: var(--zinc-400); }
.mw-kb-chip.is-active.is-accent .mw-kb-chip__n { color: rgba(255, 255, 255, .72); }

/* ---------- Сортировка ---------- */
.eqc-kb-sort { position: relative; margin-left: auto; }
.eqc-kb-sort__btn {
  display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px;
  border-radius: var(--r-md); background: var(--bg-elev);
  border: 1px solid var(--line-strong); font: inherit; font-size: 13px;
  color: var(--ink); cursor: pointer;
}
.eqc-kb-sort__btn:hover { background: var(--bg-sunken); }
.eqc-kb-sort__btn .glyph { color: var(--ink-muted); }
.eqc-kb-sort__lbl { color: var(--ink-muted); font-size: 12px; }
.eqc-kb-sort__menu {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 20; min-width: 200px;
  display: flex; flex-direction: column; padding: 4px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--sh-md);
}
.mw-kb-sort__item {
  display: flex; align-items: center; padding: 7px 10px; border: 0; border-radius: var(--r-sm);
  background: transparent; font: inherit; font-size: 13px; color: var(--ink-2);
  cursor: pointer; text-align: left;
}
.mw-kb-sort__item:hover { background: var(--bg-sunken); }
.mw-kb-sort__item.is-active { background: var(--green-50); color: var(--green-700); font-weight: 500; }

/* ---------- Переключатель вида ---------- */
.eqc-kb-seg {
  display: inline-flex; height: 30px; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg-elev); overflow: hidden;
}
.eqc-kb-seg__btn {
  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px;
  border: 0; border-right: 1px solid var(--line); background: transparent;
  font: inherit; font-size: 12px; font-weight: 500; color: var(--ink-2); cursor: pointer;
}
.eqc-kb-seg__btn:last-child { border-right: 0; }
.eqc-kb-seg__btn:hover { background: var(--bg-sunken); }
.eqc-kb-seg__btn.is-active { background: var(--zinc-900); color: #FAFAFA; }

/* ---------- Сетка статей ---------- */
.mw-kb-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
}
.mw-kb-grid--list { grid-template-columns: 1fr; }
.mw-kb-art {
  position: relative; display: flex; flex-direction: column; gap: 10px;
  min-height: 184px; padding: 18px 18px 16px; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-lg);
  text-decoration: none; color: inherit; transition: border-color .12s, box-shadow .12s;
}
.mw-kb-art:hover { border-color: var(--line-strong); box-shadow: var(--sh-sm); }
.mw-kb-art.is-read { opacity: .78; }
.mw-kb-art.is-read .mw-kb-art__t { color: var(--ink-2); }
.mw-kb-grid--list .mw-kb-art { min-height: auto; }
.mw-kb-art--related { min-height: auto; }
.mw-kb-art__tags { display: flex; flex-wrap: wrap; gap: 5px; }
.mw-kb-art__t {
  margin: 0; font-size: 15px; font-weight: 600; line-height: 20px;
  letter-spacing: -.005em; color: var(--ink);
}
.mw-kb-art__e { margin: 0; font-size: 12.5px; line-height: 17px; color: var(--ink-muted); }
.mw-kb-art__foot {
  display: flex; align-items: center; gap: 10px; margin-top: auto;
  padding-top: 10px; border-top: 1px dashed var(--line);
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.mw-kb-art__time, .mw-kb-art__author, .mw-kb-art__helpful {
  display: inline-flex; align-items: center; gap: 5px;
}
.mw-kb-art__helpful { margin-left: auto; }
.mw-kb-art__foot .glyph { color: var(--ink-faint); }
.mw-kb-art__ai {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 5px; background: var(--zinc-600);
  color: #fff; font-size: 9px; font-weight: 600;
}
.mw-kb-art__check {
  position: absolute; top: 14px; right: 14px; width: 20px; height: 20px;
  border-radius: 50%; background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center;
}

/* ---------- Теги статьи ---------- */
.mw-kb-tag {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px;
  border-radius: var(--r-full); border: 1px solid var(--line-strong);
  background: var(--bg-sunken); font-size: 10px; color: var(--ink-2);
  line-height: 1.4; white-space: nowrap;
}
.mw-kb-tag--cat::before,
.mw-kb-tag--new::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: var(--ink-muted); flex-shrink: 0;
}
.mw-kb-tag--new {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.mw-kb-tag--new::before { background: var(--green-500); }
.mw-kb-tag--aud-all,
.mw-kb-tag--aud-manager,
.mw-kb-tag--aud-lead,
.mw-kb-tag--aud-cd,
.mw-kb-tag--aud-admin {
  background: var(--bg-sunken); color: var(--ink-2); border-color: var(--line);
}

/* ---------- CTA «Не нашли статью?» ---------- */
.eqc-kb-ask {
  display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center;
  padding: 26px 28px; border: 1px solid var(--line); border-radius: var(--r-xl);
  background: linear-gradient(180deg, var(--bg-elev) 0, var(--bg-sunken) 100%);
}
.eqc-kb-ask__main h3 {
  margin: 0 0 6px; font-size: 17px; font-weight: 600; color: var(--ink);
}
.eqc-kb-ask__main p {
  margin: 0; font-size: 13px; line-height: 18px; color: var(--ink-muted); max-width: 62ch;
}
.eqc-kb-ask__acts { display: flex; gap: 8px; flex-shrink: 0; }

/* ---------- Тост ---------- */
.eqc-kb-toast {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
  z-index: 500; padding: 10px 18px; border-radius: var(--r-md);
  background: var(--green-600); color: #fff; font-size: 13px; font-weight: 500;
  box-shadow: var(--sh-lg);
}

/* ---------- Модалка «Предложить статью» ---------- */
.eqc-kb-modal__sub { margin: 4px 0 0; font-size: 12px; color: var(--ink-muted); }
.eqc-kb-kinds { display: flex; gap: 8px; }
.mw-kb-suggest-kind {
  flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  height: 38px; padding: 0 12px; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg-elev); font: inherit;
  font-size: 13px; font-weight: 500; color: var(--ink-2); cursor: pointer;
}
.mw-kb-suggest-kind:hover { background: var(--bg-sunken); }
.mw-kb-suggest-kind.is-active {
  background: var(--green-50); color: var(--green-700); border-color: var(--accent);
}
.mw-kb-suggest-kind .glyph { color: currentColor; }
.eqc-textarea {
  width: 100%; min-height: 128px; padding: 10px 12px; border-radius: var(--r-md);
  background: var(--bg-elev); border: 1px solid var(--line-strong);
  font-family: var(--font-sans); font-size: 14px; line-height: 20px;
  color: var(--ink); resize: vertical;
}
.eqc-textarea:focus {
  outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(31, 138, 91, .12);
}
.eqc-textarea::placeholder { color: var(--ink-faint); }

/* =====================================================================
   БАЗА ЗНАНИЙ — ридер статьи (10.2).
   ===================================================================== */
.eqc-kb-readerbar { padding: 13px 32px; }
.eqc-kb-back {
  display: inline-flex; align-items: center; gap: 6px; font-size: 13px;
  font-weight: 500; color: var(--ink-muted); text-decoration: none;
}
.eqc-kb-back:hover { color: var(--ink-2); }

.eqc-kb-404 {
  max-width: 520px; margin: 48px auto; display: flex; flex-direction: column;
  align-items: center; text-align: center; gap: 14px;
}
.eqc-kb-404__ico {
  width: 80px; height: 80px; border-radius: 20px; background: var(--bg-sunken);
  border: 1px dashed var(--line-strong); display: flex; align-items: center;
  justify-content: center; color: var(--ink-faint);
}
.eqc-kb-404__eb {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-kb-404 h2 {
  margin: 0; font-size: 26px; line-height: 32px; font-weight: 600;
  letter-spacing: -.014em; color: var(--ink);
}
.eqc-kb-404 p {
  margin: 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); max-width: 44ch;
}

.eqc-kb-reader {
  max-width: 760px; width: 100%; margin: 0 auto;
  display: flex; flex-direction: column; gap: 18px;
}
.eqc-kb-reader__title {
  margin: 2px 0 0; font-size: 32px; line-height: 38px; font-weight: 600;
  letter-spacing: -.018em; color: var(--ink);
}
.eqc-kb-reader__meta {
  display: flex; flex-wrap: wrap; gap: 14px; align-items: center;
  padding: 14px 0 16px; border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line); font-family: var(--font-mono);
  font-size: 11px; color: var(--ink-muted); text-transform: uppercase;
  letter-spacing: .06em;
}
.eqc-kb-reader__mrow { display: inline-flex; align-items: center; gap: 6px; }
.eqc-kb-reader__mrow .glyph { color: var(--ink-faint); }
.eqc-kb-reader__mrow strong { color: var(--ink-2); font-weight: 600; }
.eqc-kb-reader__sep { width: 3px; height: 3px; border-radius: 50%; background: var(--ink-faint); }
.eqc-kb-reader__author {
  display: inline-flex; align-items: center; gap: 6px; text-transform: none;
  letter-spacing: 0; font-family: var(--font-sans); font-size: 12px; color: var(--ink-2);
}
.eqc-kb-reader__ai {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 5px; background: var(--zinc-600);
  color: #fff; font-family: var(--font-mono); font-size: 9px; font-weight: 600;
}

/* ---------- Типографика тела статьи (x-html) ---------- */
.eqc-kb-prose { font-size: 15px; line-height: 26px; color: var(--ink-2); }
.eqc-kb-prose h2 {
  margin: 32px 0 12px; font-size: 24px; line-height: 30px; font-weight: 600;
  letter-spacing: -.012em; color: var(--ink);
}
.eqc-kb-prose h3 {
  margin: 24px 0 8px; font-size: 18px; line-height: 24px; font-weight: 600;
  letter-spacing: -.005em; color: var(--ink);
}
.eqc-kb-prose p { margin: 0 0 14px; }
.eqc-kb-prose ul, .eqc-kb-prose ol { margin: 0 0 14px; padding-left: 22px; }
.eqc-kb-prose li { margin: 0 0 6px; }
.eqc-kb-prose a {
  color: var(--green-700); text-decoration: underline; text-underline-offset: 2px;
}
.eqc-kb-prose code {
  font-family: var(--font-mono); font-size: 13px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: 4px; padding: 1px 6px; color: var(--ink);
}
.eqc-kb-prose pre {
  margin: 0 0 16px; padding: 14px 16px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-md);
  font-family: var(--font-mono); font-size: 13px; line-height: 20px;
  color: var(--ink); overflow-x: auto;
}
.eqc-kb-prose pre code { background: transparent; border: 0; padding: 0; }
.eqc-kb-prose blockquote {
  margin: 0 0 16px; padding: 12px 16px; border-left: 3px solid var(--green-500);
  background: var(--green-50); border-radius: 0 var(--r-md) var(--r-md) 0;
  color: var(--ink-2); font-size: 14px; line-height: 22px;
}
.eqc-kb-prose blockquote p { margin: 0; }
.eqc-kb-prose table {
  width: 100%; border-collapse: separate; border-spacing: 0; margin: 0 0 16px;
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
  font-size: 13px;
}
.eqc-kb-prose th, .eqc-kb-prose td {
  padding: 9px 12px; text-align: left; border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.eqc-kb-prose thead th {
  background: var(--bg-sunken); font-family: var(--font-mono); font-size: 11px;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ink-muted);
  font-weight: 500;
}
.eqc-kb-prose tbody tr:last-child td { border-bottom: 0; }

/* ---------- Голосование «Полезна ли статья?» ---------- */
.eqc-kb-feedback {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  flex-wrap: wrap; padding: 22px 24px; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-lg);
}
.eqc-kb-feedback__lbl { font-size: 14px; font-weight: 500; color: var(--ink); }
.eqc-kb-feedback__d {
  display: block; margin-top: 2px; font-family: var(--font-mono); font-size: 12px;
  font-weight: 400; color: var(--ink-muted);
}
.eqc-kb-feedback__acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.eqc-kb-feedback__n {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-kb-feedback__toast { font-size: 12px; color: var(--ink-2); margin-left: 4px; }
.mw-kb-reader__react {
  display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px;
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); font: inherit; font-size: 13px; font-weight: 500;
  color: var(--ink); cursor: pointer;
}
.mw-kb-reader__react:hover { background: var(--bg-sunken); }
.mw-kb-reader__react:disabled { opacity: .6; cursor: progress; }
.mw-kb-reader__react.is-active {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-300);
}

/* ---------- Похожие статьи ---------- */
.eqc-kb-related { margin-top: 4px; }
.eqc-kb-related__h {
  margin: 0 0 14px; font-size: 18px; font-weight: 600; letter-spacing: -.005em;
  color: var(--ink);
}
.eqc-kb-related__empty { font-size: 13px; line-height: 20px; color: var(--ink-muted); }

/* ---------- Тёмная тема ---------- */
[data-theme="dark"] .eqc-kb-pin {
  background: linear-gradient(180deg, rgba(31, 138, 91, .10) 0, var(--bg-elev) 60%);
  border-color: var(--green-700);
}
[data-theme="dark"] .eqc-kb-pin__eb,
[data-theme="dark"] .eqc-kb-pin__cta { color: var(--green-300); }
[data-theme="dark"] .mw-kb-col:hover,
[data-theme="dark"] .mw-kb-col.is-active {
  border-color: var(--green-700);
  background: linear-gradient(180deg, rgba(31, 138, 91, .08) 0, var(--bg-elev) 80%);
}
[data-theme="dark"] .mw-kb-chip.is-active {
  background: #FAFAFA; color: var(--zinc-900); border-color: #FAFAFA;
}
[data-theme="dark"] .mw-kb-chip.is-active .mw-kb-chip__n { color: var(--zinc-600); }
[data-theme="dark"] .mw-kb-chip.is-active.is-accent { background: var(--accent); color: #fff; }
[data-theme="dark"] .eqc-kb-seg__btn.is-active { background: #FAFAFA; color: var(--zinc-900); }
[data-theme="dark"] .mw-kb-sort__item.is-active,
[data-theme="dark"] .mw-kb-suggest-kind.is-active,
[data-theme="dark"] .mw-kb-reader__react.is-active {
  background: #082818; color: var(--green-300); border-color: var(--green-700);
}
[data-theme="dark"] .mw-kb-tag--new {
  background: #082818; color: var(--green-300); border-color: var(--green-700);
}
[data-theme="dark"] .eqc-kb-prose a { color: var(--green-300); }
[data-theme="dark"] .eqc-kb-prose blockquote {
  background: rgba(31, 138, 91, .08); color: var(--ink);
}
[data-theme="dark"] .eqc-kb-404__ico,
[data-theme="dark"] .mw-kb-tag,
[data-theme="dark"] .mw-kb-tag--aud-all,
[data-theme="dark"] .mw-kb-tag--aud-manager,
[data-theme="dark"] .mw-kb-tag--aud-lead,
[data-theme="dark"] .mw-kb-tag--aud-cd,
[data-theme="dark"] .mw-kb-tag--aud-admin { background: var(--bg-sunken); }

/* ---------- Адаптив ---------- */
@media (max-width: 1024px) {
  .mw-kb-hero { grid-template-columns: 1fr; }
  .eqc-kb-collgrid { grid-template-columns: repeat(2, 1fr); }
  .mw-kb-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .eqc-kb-readerbar { padding: 12px 16px; }
  .eqc-kb-collgrid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .mw-kb-grid { grid-template-columns: 1fr; }
  .eqc-kb-filt-row { flex-direction: column; align-items: flex-start; gap: 8px; }
  .eqc-kb-filt-row__lbl { width: auto; }
  .eqc-kb-sort { margin-left: 0; }
  .eqc-kb-ask { grid-template-columns: 1fr; }
  .eqc-kb-ask__acts { flex-direction: column; }
  .eqc-kb-ask__acts .eqc-btn { width: 100%; }
  .eqc-kb-reader__title { font-size: 24px; line-height: 30px; }
  .eqc-kb-feedback { flex-direction: column; align-items: stretch; }
}

/* =====================================================================
   БЫСТРЫЕ ШАБЛОНЫ (батч 6).
   Макет: «.design/Equipment CRM Platform/Блок 10 — База знаний…», 10.3.

   Реимплементация поверх Alpine-компонента quickTemplatesPage. sterbrust-
   оригинал был на Tailwind-утилитах без mw-* — все узлы здесь .eqc-qt-*.
   ===================================================================== */
.eqc-qt-tblwrap {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow-x: auto;
}
.eqc-qt-tbl {
  width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px;
}
.eqc-qt-tbl thead th {
  height: 36px; padding: 10px 14px; text-align: left; background: var(--bg-sunken);
  border-bottom: 1px solid var(--line); font-family: var(--font-mono);
  font-size: 10px; font-weight: 500; text-transform: uppercase;
  letter-spacing: .08em; color: var(--ink-muted);
}
.eqc-qt-tbl thead th.c { text-align: center; }
.eqc-qt-tbl thead th.r { text-align: right; }
.eqc-qt-tbl tbody td {
  padding: 12px 14px; border-bottom: 1px solid var(--line);
  vertical-align: middle; line-height: 18px;
}
.eqc-qt-tbl tbody td.c { text-align: center; }
.eqc-qt-tbl tbody td.r { text-align: right; }
.eqc-qt-tbl tbody tr:last-child td { border-bottom: 0; }
.eqc-qt-tbl tbody tr:hover { background: var(--bg-sunken); }
.eqc-qt-tbl__nm { font-size: 14px; font-weight: 600; color: var(--ink); }
.eqc-qt-tbl__num {
  font-family: var(--font-mono); font-variant-numeric: tabular-nums;
  color: var(--ink-2);
}
.eqc-qt-badge {
  display: inline-flex; align-items: center; padding: 1px 8px;
  border-radius: var(--r-full); border: 1px solid var(--line-strong);
  background: var(--bg-sunken); font-size: 10px; color: var(--ink-2); line-height: 1.5;
}
.eqc-qt-badge--shared {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
[data-theme="dark"] .eqc-qt-badge--shared {
  background: #082818; color: var(--green-300); border-color: var(--green-700);
}
.eqc-qt-acts {
  display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px;
}
.eqc-qt-iconbtn {
  width: 28px; height: 28px; flex-shrink: 0; display: inline-flex;
  align-items: center; justify-content: center; border: 1px solid var(--line-strong);
  border-radius: var(--r-md); background: var(--bg-elev); color: var(--ink-2);
  cursor: pointer;
}
.eqc-qt-iconbtn:hover { background: var(--bg-sunken); color: var(--ink); }
.eqc-qt-iconbtn--danger {
  color: var(--danger-700); border-color: var(--danger-200); background: var(--danger-50);
}
.eqc-qt-iconbtn--danger:hover { background: #FCE7E7; }
[data-theme="dark"] .eqc-qt-iconbtn--danger {
  color: #FCA5A5; border-color: #7F1D1D; background: #2A0808;
}
[data-theme="dark"] .eqc-qt-iconbtn--danger:hover { background: #3A0F0F; color: #fff; }
.eqc-qt-modal__sub { margin: 4px 0 0; font-size: 12px; color: var(--ink-muted); }
.eqc-qt-checkrow {
  display: flex; align-items: flex-start; gap: 8px; padding: 12px 14px;
  background: var(--green-50); border: 1px solid var(--green-200);
  border-radius: var(--r-md); font-size: 13px; color: var(--ink-2); cursor: pointer;
}
[data-theme="dark"] .eqc-qt-checkrow {
  background: rgba(31, 138, 91, .1); border-color: var(--green-700);
}
.eqc-qt-checkrow input { margin-top: 2px; flex-shrink: 0; accent-color: var(--accent); }

@media (max-width: 720px) {
  .eqc-qt-tbl { min-width: 620px; }
}

/* =====================================================================
   НАСТРОЙКИ · хаб /settings (батч 7a).
   Реимплементация sterbrust-хаба поверх Alpine-компонента settingsHubGate.
   Карточки — готовая идиома .eqc-tile; здесь только нумерованные шапки
   групп (.eqc-set-group). Дизайна отдельного экрана в макете нет —
   собрано из устоявшихся компонентов пака.
   ===================================================================== */
.eqc-set-group { display: flex; flex-direction: column; gap: 12px; }
.eqc-set-group__h { display: flex; align-items: center; gap: 10px; }
.eqc-set-group__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; flex-shrink: 0;
  border-radius: var(--r-sm); background: var(--accent); color: #fff;
  font-family: var(--font-mono); font-size: 12px; font-weight: 600;
}
.eqc-set-group__title {
  margin: 0; font-size: 15px; font-weight: 600; color: var(--ink);
  letter-spacing: -0.005em;
}
.eqc-set-group__sub {
  font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
  padding: 2px 8px; border: 1px solid var(--line); border-radius: var(--r-full);
}

/* =====================================================================
   НАСТРОЙКИ · многосекционные формы (батч 7a).
   Используется экранами /settings/template (12.1) и
   /settings/pdf-protection (12.6) поверх Alpine-компонентов
   templateSettings / pdfProtectionForm. Стек .eqc-formcard + sticky-бар.
   ===================================================================== */
.eqc-set-wrap { padding: 28px 32px 48px; display: flex; justify-content: center; }
.eqc-set-wrap__inner {
  width: 100%; max-width: 860px;
  display: flex; flex-direction: column; gap: 16px;
}
.eqc-set-form { display: flex; flex-direction: column; gap: 18px; }

/* Моноширинное поле (формат номера КП). */
.eqc-set-mono { font-family: var(--font-mono); }

/* Декоративные токен-чипы плейсхолдеров номера КП. */
.eqc-set-tokens { display: flex; flex-wrap: wrap; gap: 6px; }
.eqc-set-token {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-2);
  padding: 2px 7px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-sm);
}

/* Колоночные ряды полей. */
.eqc-set-grid2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.eqc-set-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

/* Превью загруженного баннера шапки PDF. */
.eqc-set-banner {
  padding: 10px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-md);
}
.eqc-set-banner__img {
  display: block; max-height: 128px; max-width: 100%;
  border-radius: var(--r-sm); border: 1px solid var(--line);
}

/* Текстовая кнопка-ссылка (удалить баннер). */
.eqc-set-linkbtn {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 5px;
  background: none; border: 0; padding: 0; cursor: pointer;
  font: inherit; font-size: 12px; color: var(--danger-700);
}
.eqc-set-linkbtn:hover { text-decoration: underline; }
.eqc-set-linkbtn:disabled { opacity: .5; cursor: not-allowed; text-decoration: none; }
[data-theme="dark"] .eqc-set-linkbtn { color: #FCA5A5; }

/* File-input. */
.eqc-set-file { font: inherit; font-size: 13px; color: var(--ink-2); }
.eqc-set-file::file-selector-button {
  margin-right: 12px; padding: 6px 12px; cursor: pointer;
  font: inherit; font-size: 13px; font-weight: 500;
  color: #fff; background: var(--accent); border: 0; border-radius: var(--r-md);
}
.eqc-set-file::file-selector-button:hover { background: var(--accent-hover); }
.eqc-set-file:disabled { opacity: .55; cursor: not-allowed; }

/* Чекбокс-строка и сетка чекбоксов (обязательные поля КП). */
.eqc-set-check {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13px; color: var(--ink-2); line-height: 18px; cursor: pointer;
}
.eqc-set-check input {
  margin-top: 1px; flex-shrink: 0; width: 16px; height: 16px;
  accent-color: var(--accent); cursor: pointer;
}
.eqc-set-check--tile {
  padding: 10px 12px; border: 1px solid var(--line);
  border-radius: var(--r-md); background: var(--bg);
}
.eqc-set-check--tile:hover { border-color: var(--line-strong); }
.eqc-set-checks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }

/* Sticky-бар «Сохранить». */
.eqc-set-foot {
  position: sticky; bottom: 16px; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; padding: 12px 16px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
}
[data-theme="dark"] .eqc-set-foot { box-shadow: 0 6px 20px rgba(0, 0, 0, .4); }
.eqc-set-foot__hint { margin: 0; font-size: 12px; color: var(--ink-muted); }
.eqc-set-foot__btns { display: flex; gap: 8px; flex-wrap: wrap; }

@media (max-width: 767px) {
  .eqc-set-wrap { padding: 16px 16px 40px; }
  .eqc-set-grid2,
  .eqc-set-grid3 { grid-template-columns: 1fr; }
  .eqc-set-checks { grid-template-columns: 1fr; }
  .eqc-set-foot { flex-direction: column; align-items: stretch; }
  .eqc-set-foot__btns { flex-direction: column; }
  .eqc-set-foot .eqc-btn { justify-content: center; }
}

/* ---------------------------------------------------------------------
   Блок «Секции КП» (.plans/tz-sections-config-admin.md Фаза 3).
   Каждая строка — секция с drag-handle, чекбоксом «вкл по умолчанию»,
   селектором обязательности и кнопкой accordion для дефолтов подполей.
   --------------------------------------------------------------------- */
/* settings-template-spicy-pond: двухстрочная карточка секции, читаемая
   на любом экране от 360px до десктопа. На ≥1280px разворачивается в
   одну строку (head + controls inline). */
.eqc-sectionlist {
  display: flex; flex-direction: column; gap: 8px;
}
.eqc-section-row {
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg);
  overflow: hidden;
}
.eqc-section-row.is-hard { border-color: var(--accent); }
.eqc-section-row.is-soft { border-color: var(--warning, #c98a14); }
.eqc-section-row--ghost { opacity: 0.5; background: var(--bg-elev); }

/* --- Head: handle | title (+ badges) | switch вкл/выкл --- */
.eqc-section-row__head {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px;
  min-width: 0;
}
.eqc-section-row__handle {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border: 0; padding: 0;
  background: transparent; color: var(--ink-muted);
  cursor: grab; user-select: none;
  font-size: 14px; line-height: 1;
  border-radius: var(--r-sm);
}
.eqc-section-row__handle:hover { background: var(--bg-elev); color: var(--ink-2); }
.eqc-section-row__handle:active { cursor: grabbing; }

.eqc-section-row__title {
  flex: 1 1 auto;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px;
  min-width: 0;
}
.eqc-section-row__label {
  font-size: 14px; color: var(--ink-1); font-weight: 600;
  min-width: 0; word-break: break-word;
}
.eqc-section-row__badges {
  display: inline-flex; flex-wrap: wrap; gap: 6px;
  align-items: center;
}
.eqc-section-row__group,
.eqc-section-row__usage {
  font-size: 11px; color: var(--ink-muted);
  padding: 2px 8px; border-radius: var(--r-full, 9999px);
  background: var(--bg-elev); white-space: nowrap;
  line-height: 1.6;
}

/* Switch-pill «По умолчанию вкл.»: нативный checkbox скрыт визуально,
   но остаётся доступен для скринридеров и keyboard-навигации. */
.eqc-section-row__toggle {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--ink-2); cursor: pointer;
  white-space: nowrap;
  user-select: none;
}
.eqc-section-row__toggle-input {
  /* visually-hidden: native checkbox остаётся доступен screen reader'ам и
     keyboard tab-order'у, но визуально скрыт — track/knob выше рендерят
     состояние. Стандартный паттерн (clip + margin -1px) гарантирует, что
     элемент не сдвигает layout и не виден в Safari, не учитывающем `width: 0`. */
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
}
.eqc-section-row__toggle-track {
  position: relative;
  display: inline-block;
  width: 34px; height: 20px;
  background: var(--line-strong); border-radius: var(--r-full, 9999px);
  transition: background-color 120ms ease;
}
.eqc-section-row__toggle-knob {
  position: absolute; top: 2px; left: 2px;
  width: 16px; height: 16px;
  background: #fff; border-radius: 50%;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
  transition: transform 120ms ease;
}
.eqc-section-row__toggle-input:checked + .eqc-section-row__toggle-track {
  background: var(--accent);
}
.eqc-section-row__toggle-input:checked + .eqc-section-row__toggle-track .eqc-section-row__toggle-knob {
  transform: translateX(14px);
}
.eqc-section-row__toggle-input:focus-visible + .eqc-section-row__toggle-track {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.eqc-section-row__toggle-label {
  font-size: 12px; color: var(--ink-2);
}

/* --- Controls-row: подписанные группы «Блок / Обязательность / Поля» --- */
.eqc-section-row__controls {
  display: flex; flex-wrap: wrap; align-items: end;
  gap: 12px 16px;
  padding: 0 12px 12px 48px; /* выровнено за handle (28 + 12 + 8 ≈ 48) */
}
.eqc-section-row__control {
  display: inline-flex; flex-direction: column; gap: 4px;
  min-width: 0;
  flex: 1 1 160px; max-width: 240px;
}
.eqc-section-row__control--auto { flex: 0 1 auto; }
.eqc-section-row__control-label {
  font-size: 11px; color: var(--ink-muted);
  text-transform: uppercase; letter-spacing: 0.04em;
  line-height: 1;
}
.eqc-section-row__block,
.eqc-section-row__req {
  font-size: 13px;
  height: 34px;
  width: 100%;
}
.eqc-section-row__expand {
  display: inline-flex; align-items: center; gap: 6px;
  height: 34px; padding: 0 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--bg); cursor: pointer; color: var(--ink-2);
  font-size: 13px; white-space: nowrap;
  transition: border-color 120ms ease, background-color 120ms ease;
}
.eqc-section-row__expand:hover { border-color: var(--line-strong); background: var(--bg-elev); }
.eqc-section-row.is-expanded .eqc-section-row__expand {
  background: var(--bg-elev); border-color: var(--line-strong);
}

/* --- Подписи блоков «Основные / Дополнительные» — collapsible --- */
.eqc-section-block-labels {
  margin-bottom: 12px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg);
}
.eqc-section-block-labels--collapsible.is-expanded {
  border-color: var(--line-strong);
}
.eqc-section-block-labels__summary {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  min-width: 0;
}
.eqc-section-block-labels__summary-text {
  display: flex; flex-wrap: wrap; gap: 4px 8px;
  min-width: 0;
  font-size: 12px; color: var(--ink-2);
}
.eqc-section-block-labels__summary-title {
  color: var(--ink-muted);
}
.eqc-section-block-labels__summary-values {
  color: var(--ink-1); font-weight: 500;
  overflow-wrap: anywhere;
}
.eqc-section-block-labels__toggle {
  flex: 0 0 auto;
  font-size: 12px; padding: 6px 10px;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  background: var(--bg); color: var(--ink-2); cursor: pointer;
  white-space: nowrap;
}
.eqc-section-block-labels__toggle:hover { border-color: var(--line-strong); }
.eqc-section-block-labels__editor {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  padding: 0 12px 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.eqc-section-block-labels__row {
  display: flex; flex-direction: column; gap: 4px;
  font-size: 12px; color: var(--ink-2);
}

/* --- Раскрывающаяся секция подполей --- */
.eqc-section-row__body {
  padding: 12px 12px 14px 48px;
  border-top: 1px solid var(--line);
  background: var(--bg-elev);
  display: flex; flex-direction: column; gap: 12px;
}
.eqc-section-row__body-hint {
  margin: 0; font-size: 12px; color: var(--ink-muted);
  line-height: 1.4;
}
.eqc-section-row__subfields {
  display: flex; flex-direction: column; gap: 10px;
}
.eqc-section-row__subfield {
  display: block;
}
.eqc-section-row__subfield-row {
  display: grid; grid-template-columns: 220px 1fr; gap: 10px 16px;
  align-items: start;
}
.eqc-section-row__subfield-row--inline {
  display: inline-flex; align-items: center; gap: 8px;
  grid-template-columns: none;
}
.eqc-section-row__subfield-row--multiset {
  grid-template-columns: 220px 1fr;
  border: 0; padding: 0; margin: 0;
}
.eqc-section-row__subfield-label {
  font-size: 13px; color: var(--ink-1); font-weight: 500;
  padding-top: 8px;          /* выровнено с центром инпута высоты 34 */
  line-height: 1.3;
}
.eqc-section-row__subfield-label--inline {
  padding-top: 0;
}
.eqc-section-row__subfield-row--multiset .eqc-section-row__subfield-label {
  padding-top: 0;            /* legend сам по себе вверху, без визуального сдвига */
}
.eqc-section-row__subfield-control {
  display: flex; align-items: center; gap: 8px;
  min-width: 0;
}
.eqc-section-row__subfield-control--number .eqc-input {
  max-width: 160px;
}
.eqc-section-row__subfield-unit {
  font-size: 13px; color: var(--ink-muted);
  white-space: nowrap;
}
.eqc-section-row__subfield-textarea {
  min-height: 60px;
  resize: vertical;
  font-family: inherit;
  line-height: 1.4;
  padding: 8px 10px;
}
.eqc-section-row__subfield-check {
  width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer;
}
.eqc-section-row__subfield-pills {
  display: flex; flex-wrap: wrap; gap: 6px;
}
.eqc-section-row__subfield-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--line); border-radius: var(--r-full, 9999px);
  background: var(--bg); color: var(--ink-2);
  font-size: 12px; cursor: pointer;
  transition: border-color 120ms ease, background-color 120ms ease;
}
.eqc-section-row__subfield-pill:hover { border-color: var(--line-strong); }
.eqc-section-row__subfield-pill input {
  margin: 0;
  width: 14px; height: 14px;
  accent-color: var(--accent);
}

/* --- Брейкпоинты --- */

/* ≥1280px: head + controls в одну строку (компактный single-row layout). */
@media (min-width: 1280px) {
  .eqc-section-row__head {
    padding-bottom: 12px;
  }
  .eqc-section-row__controls {
    padding-left: 12px;                 /* без отступа за handle */
    padding-top: 0;
    margin-top: -10px;                  /* подтягиваем под head */
  }
  .eqc-section-row__control {
    flex: 0 1 auto;
    min-width: 160px;
  }
}

/* 768–1023px: badges переносятся под title (head становится двухстрочным). */
@media (max-width: 1023px) {
  .eqc-section-row__title { gap: 4px 8px; }
}

/* <768px: subfield-row становится одноколоночным (label сверху, control снизу). */
@media (max-width: 767px) {
  .eqc-section-row__subfield-row,
  .eqc-section-row__subfield-row--multiset {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .eqc-section-row__subfield-label {
    padding-top: 0;
  }
  .eqc-section-block-labels__editor {
    grid-template-columns: 1fr;
  }
}

/* <640px: head в стек (handle сверху отдельной строкой не нужен, остаётся
   inline, но title переносится под него; switch уходит вниз отдельной
   строкой). Controls — стек, padding выравниваем с body. */
@media (max-width: 639px) {
  .eqc-section-row__head {
    flex-wrap: wrap;
    gap: 8px 10px;
  }
  .eqc-section-row__toggle {
    width: 100%;
    justify-content: flex-start;
  }
  .eqc-section-row__controls {
    padding-left: 12px;
    flex-direction: column;
    align-items: stretch;
  }
  .eqc-section-row__control,
  .eqc-section-row__control--auto {
    flex: 1 1 auto; max-width: none;
  }
  .eqc-section-row__expand {
    width: 100%; justify-content: center;
  }
  .eqc-section-row__body {
    padding-left: 12px;
  }
  .eqc-section-block-labels__summary {
    flex-wrap: wrap;
  }
}

/* ---------------------------------------------------------------------
   Защита PDF (12.6): водяной знак с range-слайдером и SVG-превью A4.
   --------------------------------------------------------------------- */
.eqc-set-wm {
  display: grid; grid-template-columns: 1fr 248px; gap: 24px;
  align-items: start;
}
.eqc-set-wm__fields { display: flex; flex-direction: column; gap: 16px; }

/* Range-слайдер прозрачности — стилизация native input[type=range]. */
.eqc-set-range { width: 100%; height: 20px; cursor: pointer; appearance: none; background: none; }
.eqc-set-range::-webkit-slider-runnable-track {
  height: 5px; border-radius: var(--r-full); background: var(--bg-sunken);
  border: 1px solid var(--line);
}
.eqc-set-range::-moz-range-track {
  height: 5px; border-radius: var(--r-full); background: var(--bg-sunken);
  border: 1px solid var(--line);
}
.eqc-set-range::-webkit-slider-thumb {
  appearance: none; margin-top: -7px;
  width: 18px; height: 18px; border-radius: var(--r-full);
  background: var(--accent); border: 2px solid var(--bg-elev);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
}
.eqc-set-range::-moz-range-thumb {
  width: 16px; height: 16px; border-radius: var(--r-full);
  background: var(--accent); border: 2px solid var(--bg-elev);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
}
.eqc-set-range:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

/* SVG-превью страницы A4. */
.eqc-set-a4 { display: flex; flex-direction: column; gap: 8px; }
.eqc-set-a4__frame {
  display: flex; justify-content: center; padding: 14px;
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.eqc-set-a4__svg {
  width: 100%; max-width: 200px; background: #fff;
  border-radius: var(--r-sm);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06), 0 1px 4px rgba(0, 0, 0, .12);
}

@media (max-width: 767px) {
  .eqc-set-wm { grid-template-columns: 1fr; gap: 16px; }
}

/* ---------------------------------------------------------------------
   Кэш AI (12.5): широкая обёртка, тумблеры, таблица записей.
   --------------------------------------------------------------------- */
.eqc-set-wrap__inner--wide { max-width: 1100px; }

/* Тумблер (native checkbox, скрытый input + дорожка). */
.eqc-tgl { position: relative; display: inline-flex; flex-shrink: 0; cursor: pointer; }
.eqc-tgl__inp { position: absolute; width: 0; height: 0; opacity: 0; }
.eqc-tgl__track {
  width: 40px; height: 22px; border-radius: var(--r-full);
  background: var(--line-strong); transition: background .15s ease;
}
.eqc-tgl__track::after {
  content: ""; position: absolute; top: 2px; left: 2px;
  width: 18px; height: 18px; border-radius: var(--r-full); background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: transform .15s ease;
}
.eqc-tgl__inp:checked + .eqc-tgl__track { background: var(--accent); }
.eqc-tgl__inp:checked + .eqc-tgl__track::after { transform: translateX(18px); }
.eqc-tgl__inp:focus-visible + .eqc-tgl__track {
  outline: 2px solid var(--accent); outline-offset: 2px;
}

/* Строка «описание ↔ контрол». */
.eqc-set-tglrow {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.eqc-set-tglrow + .eqc-set-tglrow {
  border-top: 1px solid var(--line); padding-top: 16px;
}
.eqc-set-tglrow__main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.eqc-set-tglrow__t { font-size: 14px; font-weight: 500; color: var(--ink); }
.eqc-set-tglrow__d { font-size: 12px; color: var(--ink-muted); line-height: 16px; }

/* Компактное числовое поле. */
.eqc-set-num-sm { width: 96px; flex-shrink: 0; }

/* Шапка карточки с инструментами (заголовок + поиск + кнопка). */
.eqc-set-cardbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap; margin-bottom: 16px;
}
.eqc-set-cardbar__tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Таблица внутри формкарты. */
.eqc-set-tblcard {
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
}

/* Текстовые кнопки в ячейке таблицы. */
.eqc-set-rowacts { display: inline-flex; gap: 12px; }
.eqc-set-tbtn {
  background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  font-size: 12px; color: var(--accent);
}
.eqc-set-tbtn:hover { text-decoration: underline; }
.eqc-set-tbtn--danger { color: var(--danger-700); }
[data-theme="dark"] .eqc-set-tbtn--danger { color: #FCA5A5; }

/* «Показать ещё». */
.eqc-set-loadmore { margin-top: 14px; text-align: center; }

@media (max-width: 767px) {
  .eqc-set-tglrow { flex-direction: column; align-items: stretch; }
  .eqc-set-num-sm { width: 100%; }
  .eqc-set-cardbar__tools { width: 100%; }
  .eqc-set-cardbar__tools .eqc-tbar__search { width: 100%; }
}

/* ---------------------------------------------------------------------
   Лимиты (12.4): ячейка менеджера и бейджи override.
   --------------------------------------------------------------------- */
.eqc-set-mgr { display: flex; flex-direction: column; gap: 1px; }
.eqc-set-mgr__n { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-set-mgr__e { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }

.eqc-set-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 9px; border-radius: var(--r-full);
  font-size: 11px; font-weight: 500; white-space: nowrap; border: 1px solid;
}
.eqc-set-badge--on {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-set-badge--mute {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line);
}
[data-theme="dark"] .eqc-set-badge--on {
  background: rgba(31, 138, 91, .12); border-color: var(--green-700); color: #85C29F;
}

/* =====================================================================
   ПРОМПТЫ AI (12.3): двухколоночный редактор версий.
   Реимплементация sterbrust-экрана поверх Alpine-компонента
   settingsPromptsPage. JS-геттеры versionItemClass / statusBadgeClass /
   tabClass отдают Tailwind-строки — перекрываются составными селекторами
   (.eqc-pr-* в каскаде после tailwind.css).
   ===================================================================== */
.eqc-set-wrap__inner--xwide { max-width: 1240px; }

.eqc-pr {
  display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 18px;
  align-items: start;
}

/* ---------- Сайдбар версий ---------- */
.eqc-pr-side {
  position: sticky; top: 68px; align-self: start;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 14px;
}
.eqc-pr-side__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 12px; padding: 0 2px;
}
.eqc-pr-side__title { margin: 0; font-size: 15px; font-weight: 600; color: var(--ink); }
.eqc-pr-vers { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.eqc-pr-vers__empty { font-size: 13px; color: var(--ink-muted); padding: 14px 6px; }

.eqc-pr-ver {
  width: 100%; text-align: left; cursor: pointer; font: inherit;
  display: flex; flex-direction: column; gap: 4px;
  padding: 9px 10px; border-radius: var(--r-md);
  background: transparent; border: 1px solid transparent;
}
.eqc-pr-ver:hover { background: var(--bg-sunken); }
.eqc-pr-ver.bg-surface-container-high {
  background: var(--green-50); border-color: var(--green-200);
}
[data-theme="dark"] .eqc-pr-ver.bg-surface-container-high {
  background: rgba(31, 138, 91, .12); border-color: var(--green-700);
}
.eqc-pr-ver__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.eqc-pr-ver__v { font-size: 13px; font-weight: 600; color: var(--ink); min-width: 0; }
.eqc-pr-ver__nm { font-weight: 400; color: var(--ink-muted); }
.eqc-pr-ver__date { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }

/* ---------- Бейдж статуса версии ---------- */
.eqc-pr-badge {
  display: inline-flex; align-items: center; flex-shrink: 0;
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em; border: 1px solid transparent;
}
.eqc-pr-badge.bg-primary-container {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-pr-badge.bg-tertiary-container {
  background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200);
}
.eqc-pr-badge.bg-secondary-container {
  background: var(--info-50); color: var(--info-700); border-color: var(--info-200);
}
.eqc-pr-badge.bg-surface-container-high {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line);
}
.eqc-pr-badge.bg-error-container {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
[data-theme="dark"] .eqc-pr-badge.bg-primary-container {
  background: rgba(31, 138, 91, .14); color: #85C29F; border-color: var(--green-700);
}
[data-theme="dark"] .eqc-pr-badge.bg-error-container {
  background: #2A0808; color: #FCA5A5; border-color: #7F1D1D;
}

/* ---------- Редактор ---------- */
.eqc-pr-main {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 24px; min-width: 0;
}
.eqc-pr-ed__head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 18px;
}
.eqc-pr-ed__lhs { min-width: 0; }
.eqc-pr-ed__titlerow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.eqc-pr-ed__title { margin: 0; font-size: 18px; font-weight: 600; color: var(--ink); }
.eqc-pr-ed__name { font-weight: 400; color: var(--ink-muted); }
.eqc-pr-ed__dirty { font-size: 11px; font-style: italic; color: var(--ink-muted); }
.eqc-pr-ed__stamps { margin: 6px 0 0; font-size: 11px; color: var(--ink-muted); }
.eqc-pr-ed__stamps span { font-variant-numeric: tabular-nums; }
.eqc-pr-ed__acts { display: flex; gap: 6px; flex-wrap: wrap; }
.eqc-pr-pulse {
  width: 8px; height: 8px; flex-shrink: 0; margin-top: 5px;
  border-radius: var(--r-full); background: currentColor;
  animation: eqc-pr-pulse 1.4s ease-in-out infinite;
}
@keyframes eqc-pr-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }

/* ---------- Табы ---------- */
.eqc-pr-tabs {
  display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 18px;
}
.eqc-pr-tab {
  padding: 8px 14px; font: inherit; font-size: 13px; font-weight: 500;
  background: none; border: 0; border-bottom: 2px solid transparent;
  color: var(--ink-muted); cursor: pointer; margin-bottom: -1px;
}
.eqc-pr-tab:hover { color: var(--ink); }
.eqc-pr-tab.border-primary { color: var(--ink); border-bottom-color: var(--accent); }

.eqc-pr-namefield { margin-bottom: 16px; }
.eqc-pr-fieldhead {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 6px;
}
.eqc-pr-resetlink {
  background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  font-size: 12px; color: var(--accent);
}
.eqc-pr-resetlink:hover { text-decoration: underline; }
.eqc-pr-code {
  font-family: var(--font-mono); font-size: 12.5px; line-height: 18px;
  min-height: 340px;
}
.eqc-pr-count {
  margin-top: 6px; text-align: right; font-size: 11px; color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}

/* ---------- Аккордеон per-блок инструкций ---------- */
.eqc-pr-groups { display: flex; flex-direction: column; gap: 10px; }
.eqc-pr-grp {
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg); overflow: hidden;
}
.eqc-pr-grp__head {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 11px 14px; font: inherit; cursor: pointer;
  background: var(--bg-sunken); border: 0;
}
.eqc-pr-grp__head:hover { background: var(--line); }
.eqc-pr-grp__title { font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-pr-grp__count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }
.eqc-pr-grp__body {
  display: flex; flex-direction: column; gap: 14px;
  padding: 14px; border-top: 1px solid var(--line);
}
.eqc-pr-grp__bk { font-family: var(--font-mono); font-size: 11px; color: var(--ink-faint); }

/* ---------- Результат тестового прогона ---------- */
.eqc-pr-result {
  margin: 0; background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 12px; color: var(--ink-2);
  font-family: var(--font-mono); font-size: 12px; line-height: 17px;
  white-space: pre-wrap; word-break: break-word; max-height: 260px; overflow: auto;
}

@media (max-width: 900px) {
  .eqc-pr { grid-template-columns: 1fr; }
  .eqc-pr-side { position: static; }
}

/* =====================================================================
   CRM-ИНТЕГРАЦИЯ (12.10): многосекционный конфиг.
   Реимплементация sterbrust-экрана поверх Alpine-компонента crmSettings.
   ===================================================================== */
/* Боксовый чекбокс с заголовком и описанием. */
.eqc-crm-chk {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-md); cursor: pointer;
}
.eqc-crm-chk:hover { border-color: var(--line-strong); }
.eqc-crm-chk input[type="checkbox"] {
  margin-top: 1px; flex-shrink: 0; width: 17px; height: 17px;
  accent-color: var(--accent); cursor: pointer;
}
.eqc-crm-chk__b { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eqc-crm-chk__t { font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-crm-chk__d { font-size: 12px; color: var(--ink-muted); line-height: 16px; }

/* Health-блоки синхронизации: сетка из трёх ячеек. */
.eqc-crm-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.eqc-crm-stat {
  display: flex; flex-direction: column; gap: 6px;
  padding: 12px 14px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-md);
}
.eqc-crm-stat__k {
  font-size: 11px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--ink-muted);
}
.eqc-crm-stat__v {
  font-size: 24px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.eqc-crm-stat__v--sm { font-size: 14px; font-weight: 500; }
.eqc-crm-stat__v.text-error { color: var(--danger-700); }
[data-theme="dark"] .eqc-crm-stat__v.text-error { color: #FCA5A5; }

/* Чипы плейсхолдеров шаблона комментария. */
.eqc-crm-phs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.eqc-crm-ph {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-2);
  padding: 3px 8px; background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-sm); cursor: pointer;
}
.eqc-crm-ph:hover {
  background: var(--green-50); border-color: var(--green-200); color: var(--green-700);
}
[data-theme="dark"] .eqc-crm-ph:hover {
  background: rgba(31, 138, 91, .12); border-color: var(--green-700); color: #85C29F;
}

/* Вложенный (под чекбоксом) блок. */
.eqc-crm-nested {
  display: flex; flex-direction: column; gap: 10px; padding-left: 27px;
}
.eqc-crm-nested--row {
  flex-direction: row; align-items: center; gap: 10px; flex-wrap: wrap;
}

/* Шаг мастера настройки webhook'а. */
.eqc-crm-wizbox {
  display: flex; flex-direction: column; gap: 12px;
  padding: 14px 16px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-md);
}
.eqc-crm-wizbox--ok { background: var(--green-50); border-color: var(--green-200); }
[data-theme="dark"] .eqc-crm-wizbox--ok {
  background: rgba(31, 138, 91, .1); border-color: var(--green-700);
}
.eqc-crm-wiz__line { margin: 0; font-size: 13px; color: var(--ink); }
.eqc-crm-wiz__muted { color: var(--ink-muted); }
.eqc-crm-wiz__url {
  margin: 0; font-family: var(--font-mono); font-size: 11px; color: var(--ink-2);
  word-break: break-all; background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-sm); padding: 8px 10px;
}
.eqc-crm-wiz__lbl {
  margin: 0 0 4px; font-size: 11px; text-transform: uppercase;
  letter-spacing: .05em; color: var(--ink-muted);
}
.eqc-crm-wiz__steps {
  margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px;
  font-size: 13px; color: var(--ink-2); line-height: 18px;
}
.eqc-crm-wiz__steps code,
.eqc-crm-chk code {
  font-family: var(--font-mono); font-size: 12px; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: 3px; padding: 1px 5px;
}

@media (max-width: 767px) {
  .eqc-crm-stats { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------
   Соответствие стадий лидов/сделок (12.11).
   --------------------------------------------------------------------- */
.eqc-crm-maphead {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.eqc-crm-maphead__provider { margin: 0; font-size: 13px; color: var(--ink-muted); }
.eqc-crm-maphead__provider b { color: var(--ink); font-weight: 600; }

/* Tabs по направлениям сделок (JS-геттер tabClass → .bg-primary активна). */
.eqc-crm-tabs {
  display: flex; flex-wrap: wrap; gap: 6px;
  border-bottom: 1px solid var(--line); padding-bottom: 10px;
}
.eqc-crm-tab {
  padding: 6px 12px; font: inherit; font-size: 13px; font-weight: 500;
  border-radius: var(--r-md); border: 1px solid var(--line);
  background: var(--bg-elev); color: var(--ink-2); cursor: pointer;
}
.eqc-crm-tab:hover { background: var(--bg-sunken); }
.eqc-crm-tab.bg-primary {
  background: var(--accent); color: #fff; border-color: var(--accent);
}

/* Список соответствий «стадия CRM → статус КП». */
.eqc-crm-map { padding: 0; }
.eqc-crm-maprow {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 18px; border-bottom: 1px solid var(--line);
}
.eqc-crm-maprow:last-child { border-bottom: 0; }
.eqc-crm-maprow__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.eqc-crm-maprow__nm { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-crm-maprow__id {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-crm-maprow__arr { color: var(--ink-faint); flex-shrink: 0; }
.eqc-crm-maprow__sel { width: 240px; flex-shrink: 0; }

@media (max-width: 600px) {
  .eqc-crm-maprow { flex-wrap: wrap; }
  .eqc-crm-maprow__arr { display: none; }
  .eqc-crm-maprow__sel { width: 100%; }
}

/* =====================================================================
   ПОДСКАЗКИ ДЛЯ ЗВОНКОВ (12.8): карточки правил.
   Реимплементация sterbrust-экрана поверх Alpine-компонента settingsCoaching.
   ===================================================================== */
.eqc-cch-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 16px;
}
.eqc-cch-head__main { min-width: 0; }
.eqc-cch-head__d {
  margin: 4px 0 0; font-size: 13px; color: var(--ink-muted); line-height: 18px;
}
.eqc-cch-toggle {
  display: flex; align-items: center; gap: 8px; flex-shrink: 0; cursor: pointer;
  font-size: 13px; color: var(--ink-2);
}
.eqc-cch-toggle input {
  width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer;
}
.eqc-cch-edited { margin-left: 6px; font-size: 11px; color: var(--accent); font-weight: 500; }
.eqc-cch-thresholds {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 14px;
}
.eqc-cch-default { color: var(--ink-faint); font-weight: 400; }
.eqc-cch-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }

/* =====================================================================
   ВЕРОЯТНОСТЬ СДЕЛКИ (12.9): карточка версии + таблицы scorecard'а.
   JS-геттеры signClass / statusClass отдают Tailwind-строки — перекрыты
   составными селекторами .eqc-pp-badge.* (pack.css после tailwind.css).
   ===================================================================== */
.eqc-pp-vhead {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
}
.eqc-pp-vhead__v { font-size: 24px; font-weight: 600; color: var(--ink); margin-top: 2px; }
.eqc-pp-vhead__scope {
  font-size: 14px; font-weight: 400; color: var(--ink-muted); margin-left: 6px;
}
.eqc-pp-vhead__trained { margin-top: 4px; font-size: 13px; color: var(--ink-muted); }
.eqc-pp-metrics {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
  margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line);
}
.eqc-pp-metric { display: flex; flex-direction: column; gap: 4px; }
.eqc-pp-metric__k {
  font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-muted);
}
.eqc-pp-metric__v {
  font-size: 16px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums;
}
.eqc-pp-badge {
  display: inline-flex; align-items: center; padding: 2px 9px;
  border-radius: var(--r-full); font-size: 11px; font-weight: 600;
  border: 1px solid transparent;
}
.eqc-pp-badge.bg-tertiary-container {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-pp-badge.bg-error-container {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
.eqc-pp-badge.bg-surface-container {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line);
}
[data-theme="dark"] .eqc-pp-badge.bg-tertiary-container {
  background: rgba(31, 138, 91, .14); color: #85C29F; border-color: var(--green-700);
}
[data-theme="dark"] .eqc-pp-badge.bg-error-container {
  background: #2A0808; color: #FCA5A5; border-color: #7F1D1D;
}
.eqc-pp-code,
.eqc-pp-mono { font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); }
.eqc-pp-winput {
  width: 92px; height: 30px; text-align: right; font-family: var(--font-mono);
}
.eqc-pp-notes {
  display: block; font-size: 12px; color: var(--ink-muted); max-width: 360px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

@media (max-width: 767px) {
  .eqc-cch-head { flex-direction: column; gap: 10px; }
  .eqc-cch-thresholds { grid-template-columns: 1fr; }
  .eqc-pp-metrics { grid-template-columns: repeat(2, 1fr); }
}

/* =====================================================================
   НАСТРОЙКИ · команда и доступ (батч 7e).
   Экраны /settings/{users,sessions,company,audit,notifications} поверх
   Alpine-компонентов usersPage / sessionsAdmin / settingsCompanyForm /
   auditLog / settingsNotificationsForm. JS-геттеры, отдающие Tailwind-
   строки (roleClass/activeDotClass/tabClass/userTabClass/
   importItemBadgeClass), перекрыты составными селекторами .eqc-…​.bg-*
   (pack.css в каскаде после tailwind.css).
   ===================================================================== */

/* Подзаголовок модалки (Admin Pack использует и в простых, и в
   составных модалках — выносим в общий компонент). */
.eqc-modal__sub {
  margin: 4px 0 0; font-size: 13px; line-height: 19px; color: var(--ink-muted);
}

/* ---------------------------------------------------------------------
   Пользователи (Admin Pack 2 · 10/10b).
   --------------------------------------------------------------------- */

/* Бокс временного пароля после create/reset. */
.eqc-set-usr-temp {
  display: flex; flex-direction: column; gap: 8px; align-items: flex-start;
  padding: 16px 18px; background: var(--green-50);
  border: 1px solid var(--green-200); border-radius: var(--r-lg);
}
[data-theme="dark"] .eqc-set-usr-temp {
  background: var(--green-900); border-color: #13633F;
}
.eqc-set-usr-temp__h { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
.eqc-set-usr-temp__val {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 10px 14px; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-md);
  font-family: var(--font-mono); font-size: 16px; color: var(--ink);
}
.eqc-set-usr-temp__val > span:first-child { word-break: break-all; }
.eqc-set-usr-temp__val .eqc-set-tbtn { margin-left: auto; flex-shrink: 0; }
.eqc-set-usr-temp__d { margin: 0; font-size: 12px; color: var(--ink-muted); line-height: 16px; }

/* Табы Active/Pending и табы детальной панели — единый underline-стиль. */
.eqc-set-usr-tabs {
  display: flex; gap: 4px; flex-wrap: wrap;
  border-bottom: 1px solid var(--line);
}
.eqc-set-usr-tabs--detail { padding: 0 18px; }
.eqc-set-usr-tab {
  position: relative; display: inline-flex; align-items: center; gap: 7px;
  padding: 10px 12px; font: inherit; font-size: 13px; font-weight: 500;
  background: none; border: 0; border-bottom: 2px solid transparent;
  color: var(--ink-muted); cursor: pointer; margin-bottom: -1px;
}
.eqc-set-usr-tab:hover { color: var(--ink-2); }
.eqc-set-usr-tab.border-primary-container {
  color: var(--ink); border-bottom-color: var(--accent);
}
.eqc-set-usr-tab__count {
  display: inline-flex; align-items: center; padding: 1px 7px;
  border-radius: var(--r-full); background: var(--bg-sunken);
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-set-usr-tab__count--warn {
  background: var(--warn-50); color: var(--warn-700); font-weight: 600;
}
[data-theme="dark"] .eqc-set-usr-tab__count--warn {
  background: #2A1D05; color: #FCD34D;
}

/* Ячейки таблицы пользователей. */
.eqc-set-usr-name { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-set-usr-mail {
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-muted);
}

/* Бейдж роли (JS-геттер roleClass → .bg-* активирует палитру). */
.eqc-set-usr-role {
  display: inline-flex; align-items: center; padding: 2px 9px;
  border-radius: var(--r-full); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .03em; border: 1px solid transparent;
}
.eqc-set-usr-role.bg-primary-fixed {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-set-usr-role.bg-tertiary-container {
  background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200);
}
.eqc-set-usr-role.bg-surface-container-high {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line);
}
[data-theme="dark"] .eqc-set-usr-role.bg-primary-fixed {
  background: rgba(31, 138, 91, .14); color: #85C29F; border-color: var(--green-700);
}

/* Бейдж куратора каталога. */
.eqc-set-usr-curator {
  display: inline-flex; align-items: center; gap: 5px; margin-left: 6px;
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
  background: var(--green-50); color: var(--green-700); border: 1px solid var(--green-200);
}
.eqc-set-usr-curator__dot {
  width: 5px; height: 5px; border-radius: 50%; background: currentColor;
}
[data-theme="dark"] .eqc-set-usr-curator {
  background: rgba(31, 138, 91, .14); color: #85C29F; border-color: var(--green-700);
}

/* Источник: CRM-привязка / уволен в CRM / локальный. */
.eqc-set-usr-src {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
  background: var(--bg-sunken); color: var(--ink-2); border: 1px solid var(--line);
}
.eqc-set-usr-src .glyph { color: var(--ink-muted); }
.eqc-set-usr-fired {
  display: inline-flex; align-items: center; margin-left: 6px;
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
  background: var(--danger-50); color: var(--danger-700); border: 1px solid var(--danger-200);
}
[data-theme="dark"] .eqc-set-usr-fired {
  background: #2A0808; color: #FCA5A5; border-color: #7F1D1D;
}
.eqc-set-usr-local { font-size: 12px; color: var(--ink-faint); }

/* Статус: цветная точка + подпись. */
.eqc-set-usr-status {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--ink-2);
}
.eqc-set-usr-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
.eqc-set-usr-dot.bg-green-500 { background: var(--green-500); }
.eqc-set-usr-dot.bg-error { background: var(--danger-500); }
.eqc-set-usr-pwflag {
  display: inline-flex; align-items: center; margin-left: 8px;
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em;
  background: var(--warn-50); color: var(--warn-700); border: 1px solid var(--warn-200);
}
[data-theme="dark"] .eqc-set-usr-pwflag {
  background: #2A1D05; color: #FCD34D; border-color: #624017;
}

/* Пустое состояние внутри табличной карты. */
.eqc-set-usr-empty {
  padding: 40px 16px; text-align: center;
  font-size: 13px; color: var(--ink-muted);
}

/* Инлайн-панель деталей пользователя. */
.eqc-set-usr-detail {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); overflow: hidden;
}
.eqc-set-usr-dhead {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 14px; padding: 16px 18px; background: var(--bg-sunken);
  border-bottom: 1px solid var(--line);
}
.eqc-set-usr-dhead__t {
  margin: 0; font-size: 16px; font-weight: 600; color: var(--ink);
}
.eqc-set-usr-dhead__e {
  margin-left: 8px; font-size: 13px; font-weight: 400;
  font-family: var(--font-mono); color: var(--ink-muted);
}
.eqc-set-usr-dbody {
  display: flex; flex-direction: column; gap: 16px; padding: 20px 18px;
}

/* Подсекция «Учётная запись» внутри таба «Контакты». */
.eqc-set-usr-sub {
  display: flex; flex-direction: column; gap: 10px;
  padding-bottom: 16px; border-bottom: 1px solid var(--line);
}
.eqc-set-usr-sub__t { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }

/* Поле с инлайн-кнопкой (email + «Сохранить»). */
.eqc-set-usr-inline { display: flex; gap: 10px; align-items: flex-start; }
.eqc-set-usr-inline .eqc-input { flex: 1; min-width: 0; }
.eqc-set-usr-inline .eqc-btn { flex-shrink: 0; white-space: nowrap; }

/* Городской телефон + добавочный. */
.eqc-set-usr-phone { display: grid; grid-template-columns: 1fr 96px; gap: 8px; }
.eqc-set-usr-phone__ext { text-align: left; }

/* Шапка таба «Лимиты» с бейджем источника значений. */
.eqc-set-usr-limhead { margin-bottom: 14px; }

/* Действие в журнале (таб «Последние действия»). */
.eqc-set-usr-act {
  display: inline-flex; align-items: center; padding: 2px 8px;
  border-radius: var(--r-sm); background: var(--bg-sunken);
  border: 1px solid var(--line); font-family: var(--font-mono);
  font-size: 11px; color: var(--ink-2);
}

/* Строка «описание ↔ кнопка» в табе «Сессии». */
.eqc-set-usr-sessrow {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
}

/* Поиск в модалках — на всю ширину. */
.eqc-set-usr-search { width: 100%; }

/* Список результатов импорта из CRM. */
.eqc-set-usr-implist {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
}
.eqc-set-usr-improw {
  display: flex; flex-direction: column; gap: 10px;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
}
.eqc-set-usr-improw:last-child { border-bottom: 0; }
.eqc-set-usr-improw__top {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
}
.eqc-set-usr-improw__id { min-width: 0; }
.eqc-set-usr-improw__n {
  margin: 0; font-size: 13px; font-weight: 600; color: var(--ink);
}
.eqc-set-usr-improw__meta {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 2px;
  font-size: 12px; color: var(--ink-muted);
}
.eqc-set-usr-improw__badges {
  display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px;
}
.eqc-set-usr-improw__manual { display: flex; justify-content: flex-end; }
.eqc-set-usr-improw__top .eqc-btn { flex-shrink: 0; white-space: nowrap; }

/* Бейдж статуса CRM-сотрудника (JS-геттер importItemBadgeClass). */
.eqc-set-usr-impbadge {
  display: inline-flex; align-items: center; padding: 2px 8px;
  border-radius: var(--r-full); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .03em; border: 1px solid transparent;
}
.eqc-set-usr-impbadge.bg-green-500\/10 {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-set-usr-impbadge.bg-error-container {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
[data-theme="dark"] .eqc-set-usr-impbadge.bg-green-500\/10 {
  background: rgba(31, 138, 91, .14); color: #85C29F; border-color: var(--green-700);
}
[data-theme="dark"] .eqc-set-usr-impbadge.bg-error-container {
  background: #2A0808; color: #FCA5A5; border-color: #7F1D1D;
}

/* Подсказка «уже есть локально» внутри строки импорта. */
.eqc-set-usr-mergehint {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 8px 12px; border-radius: var(--r-md);
  background: var(--info-50); border: 1px solid var(--info-200);
}
.eqc-set-usr-mergehint p { margin: 0; font-size: 12px; color: var(--ink-2); min-width: 0; }
.eqc-set-usr-mergehint b { color: var(--ink); }
.eqc-set-usr-mergehint .eqc-btn { flex-shrink: 0; white-space: nowrap; }
[data-theme="dark"] .eqc-set-usr-mergehint {
  background: #0F1F3A; border-color: #1D4ED8;
}

/* Список кандидатов на слияние / ручную привязку. */
.eqc-set-usr-cands {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden;
}
.eqc-set-usr-cand {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 10px 14px; border-bottom: 1px solid var(--line);
}
.eqc-set-usr-cand:last-child { border-bottom: 0; }
.eqc-set-usr-cand__id { min-width: 0; }
.eqc-set-usr-cand__n {
  margin: 0; font-size: 13px; font-weight: 500; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eqc-set-usr-cand__e {
  margin: 0; font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eqc-set-usr-cand .eqc-btn { flex-shrink: 0; }

/* Модалка ручной привязки открывается поверх модалки импорта. */
.eqc-set-usr-scrim--top { z-index: 410; }

@media (max-width: 767px) {
  .eqc-set-usr-inline { flex-direction: column; }
  .eqc-set-usr-inline .eqc-btn { width: 100%; justify-content: center; }
  .eqc-set-usr-phone { grid-template-columns: 1fr; }
  .eqc-set-usr-dhead { flex-direction: column; }
  .eqc-set-usr-sessrow { flex-direction: column; align-items: stretch; }
}

/* ---------------------------------------------------------------------
   Двухстрочная ячейка таблицы (устройство/локация в сессиях,
   тип+id сущности в аудите).
   --------------------------------------------------------------------- */
.eqc-set-stack { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eqc-set-stack__a { font-size: 13px; color: var(--ink-2); }
.eqc-set-stack__b { font-size: 11px; color: var(--ink-muted); }
.eqc-set-stack__mono { font-family: var(--font-mono); }
.eqc-set-stack__mono.eqc-set-stack__a { font-size: 12px; color: var(--ink); }

/* ---------------------------------------------------------------------
   Журнал аудита (/settings/audit): фильтр-бар + таблица + пагинация.
   --------------------------------------------------------------------- */
.eqc-set-filterbar {
  display: grid; grid-template-columns: repeat(4, 1fr) auto; gap: 12px;
  align-items: end; padding: 16px; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-xl);
}
.eqc-set-filterbar__acts { display: flex; gap: 8px; }
.eqc-set-pager {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; padding: 12px 16px;
  border-top: 1px solid var(--line);
}
.eqc-set-pager__info { font-size: 12px; color: var(--ink-muted); }
.eqc-set-pager__info b {
  font-family: var(--font-mono); color: var(--ink-2); font-weight: 600;
}
.eqc-set-pager__btns { display: inline-flex; gap: 8px; }

/* Усечённая ячейка деталей JSON в журнале аудита. */
.eqc-set-audit-details {
  display: block; max-width: 320px; font-size: 12px; color: var(--ink-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

@media (max-width: 900px) {
  .eqc-set-filterbar { grid-template-columns: 1fr 1fr; }
  .eqc-set-filterbar__acts { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .eqc-set-filterbar { grid-template-columns: 1fr; }
}

/* =====================================================================
   МАСШТАБ ИНТЕРФЕЙСА (per-device · .plans/eqcrm-ui-scale.md).
   Переключатель в топбаре (компонент eqcrmScale) пишет data-ui-scale
   на <html>; CSS zoom масштабирует всю оболочку пака целиком — рейл,
   топбар и контент, поэтому фиксированная вёрстка остаётся согласованной.
   md (100%) — дефолт, без правил. min-height переопределяется, чтобы
   100vh × zoom не давал лишнего вертикального скролла.
   ===================================================================== */
[data-ui-scale="lg"] .eqc-shell-body {
  zoom: 1.12;
  min-height: calc(100vh / 1.12);
}
[data-ui-scale="xl"] .eqc-shell-body {
  zoom: 1.25;
  min-height: calc(100vh / 1.25);
}

/* Кнопка-цикл «Aa»: топбар (.eqc-icobtn) и пункт мобильного drawer. */
.eqc-scalebtn__pair { display: inline-flex; align-items: baseline; gap: 1px; }
.eqc-scalebtn__a { font-weight: 700; line-height: 1; }
.eqc-scalebtn__a--sm { font-size: 10px; }
.eqc-scalebtn__a--lg { font-size: 15px; }
.eqc-drawer__nv .eqc-scalebtn__pair {
  width: 16px; justify-content: center; flex-shrink: 0;
}

/* =====================================================================
   БЛОК 13 · ОФОРМЛЕНИЕ КП — галерея / импорт / ревью (батч 8a).
   .plans/eqcrm-pack-batch-8-block13.md, макет 13.1 / 13.3 / 13.4.
   Реимплем поверх Alpine-компонентов layoutsList / layoutsImport /
   layoutsReview — бэкенд и JS не трогаются.
   ===================================================================== */

/* ---- Счётчик заявок в кнопке «На ревью» ---- */
.eqc-lay-revct {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; margin-left: 2px;
  border-radius: var(--r-full); background: var(--danger-500); color: #fff;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600;
}

/* ---- Фильтр-бар галереи ---- */
.eqc-lay-filter {
  display: flex; flex-wrap: wrap; align-items: end; gap: 12px;
  padding: 16px; background: var(--bg-elev);
  border: 1px solid var(--line); border-radius: var(--r-xl);
}
.eqc-lay-filter__grow { flex: 1 1 200px; min-width: 160px; }
.eqc-lay-filter__sel { flex: 0 0 168px; min-width: 140px; }
.eqc-lay-filter .eqc-btn { flex-shrink: 0; }

/* ---- Сетка карточек пресетов ---- */
.eqc-lay-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.eqc-lay-card {
  display: flex; flex-direction: column;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); overflow: hidden;
}
.eqc-lay-card__swatch {
  position: relative; height: 150px;
  background: linear-gradient(135deg, var(--green-700), var(--green-500));
}
.eqc-lay-card__badges {
  position: absolute; top: 10px; left: 10px;
  display: flex; flex-wrap: wrap; gap: 6px;
}
.eqc-lay-badge {
  display: inline-flex; align-items: center; padding: 3px 8px;
  border-radius: var(--r-sm); font-size: 11px; font-weight: 600;
  white-space: nowrap;
}
.eqc-lay-badge--sys  { background: #18181B; color: #FAFAFA; }
.eqc-lay-badge--def  { background: var(--green-500); color: #fff; }
.eqc-lay-badge--off  { background: #E4E4E7; color: #3F3F46; }
.eqc-lay-badge--draft { background: var(--warn-200); color: var(--warn-700); }

.eqc-lay-card__body {
  display: flex; flex-direction: column; gap: 8px;
  padding: 16px; flex-grow: 1;
}
.eqc-lay-card__name {
  margin: 0; font-size: 15px; font-weight: 600; color: var(--ink);
  line-height: 20px;
}
.eqc-lay-card__desc {
  margin: 0; font-size: 13px; color: var(--ink-muted);
  line-height: 18px; min-height: 36px;
}
.eqc-lay-card__attr { font-size: 12px; color: var(--ink-muted); }
.eqc-lay-card__attr-sep { margin: 0 4px; }
.eqc-lay-card__tags { display: flex; flex-wrap: wrap; gap: 4px; }
.eqc-lay-tag {
  display: inline-flex; padding: 2px 7px; border-radius: var(--r-sm);
  background: var(--bg-sunken); color: var(--ink-2); font-size: 11px;
}

/* ---- Скриншот-strip ---- */
.eqc-lay-shots { display: flex; flex-wrap: wrap; gap: 6px; }
.eqc-lay-shot {
  position: relative; width: 60px; height: 60px;
  border-radius: var(--r-md); overflow: hidden; background: var(--bg-sunken);
}
.eqc-lay-shot__del {
  position: absolute; top: 0; right: 0; width: 18px; height: 18px;
  border: 0; border-bottom-left-radius: var(--r-md);
  background: var(--danger-500); color: #fff; font-size: 11px;
  cursor: pointer; opacity: 0; transition: opacity .12s;
}
.eqc-lay-shot:hover .eqc-lay-shot__del { opacity: 1; }
.eqc-lay-shot-add {
  display: flex; align-items: center; justify-content: center;
  width: 60px; height: 60px; border-radius: var(--r-md);
  border: 2px dashed var(--line-strong); color: var(--ink-muted);
  font-size: 20px; cursor: pointer;
}
.eqc-lay-shot-add:hover { background: var(--bg-sunken); }
.eqc-lay-shot-add__file { display: none; }

.eqc-lay-card__meta {
  display: flex; align-items: center; gap: 12px;
  font-size: 12px; color: var(--ink-muted);
}
.eqc-lay-card__ft {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: auto; padding-top: 12px;
}
.eqc-lay-mono { font-family: var(--font-mono); font-size: 12px; }

@media (max-width: 1100px) {
  .eqc-lay-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .eqc-lay-grid { grid-template-columns: 1fr; }
  .eqc-lay-filter__sel { flex: 1 1 140px; }
}

/* ---- Импорт JSON: dropzone ---- */
.eqc-lay-drop {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 40px 24px; border-radius: var(--r-lg);
  border: 2px dashed var(--line-strong); cursor: pointer; text-align: center;
}
.eqc-lay-drop:hover { background: var(--bg-sunken); }
.eqc-lay-drop__file { display: none; }
.eqc-lay-drop__ico { color: var(--ink-muted); }
.eqc-lay-drop__lbl { font-size: 14px; font-weight: 500; color: var(--ink); }
.eqc-lay-drop__hint { font-size: 12px; color: var(--ink-muted); }

.eqc-lay-imp__file {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-top: 16px;
  padding-top: 16px; border-top: 1px solid var(--line);
}
.eqc-lay-imp__file-name { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-lay-imp__file-size { font-size: 12px; color: var(--ink-muted); }
.eqc-lay-imp__file-acts { display: flex; gap: 8px; }

.eqc-lay-imp__checks-h {
  margin: 0 0 10px; font-size: 13px; font-weight: 600; color: var(--ink-2);
}
.eqc-lay-imp__checks-list {
  margin: 0; padding-left: 18px; display: flex; flex-direction: column;
  gap: 4px; font-size: 13px; color: var(--ink-muted); line-height: 18px;
}

/* ---- Ревью: тумблер «показывать отклонённые» ---- */
.eqc-lay-rev-toggle {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--ink-muted); cursor: pointer;
}

/* ---- Ревью: карточки заявок ---- */
.eqc-lay-rev-list { display: flex; flex-direction: column; gap: 14px; }
.eqc-lay-rev {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 18px;
}
.eqc-lay-rev[data-status="rejected"] {
  border-color: var(--warn-200); background: var(--warn-50);
}
[data-theme="dark"] .eqc-lay-rev[data-status="rejected"] {
  border-color: #5C3D08; background: #221803;
}
.eqc-lay-rev__head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;
}
.eqc-lay-rev__name {
  margin: 0; font-size: 15px; font-weight: 600; color: var(--ink);
}
.eqc-lay-rev__sub {
  margin-top: 2px; font-family: var(--font-mono); font-size: 12px;
  color: var(--ink-muted);
}
.eqc-lay-rev__chip {
  flex-shrink: 0; padding: 4px 8px; border-radius: var(--r-sm);
  font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .06em; white-space: nowrap;
}
.eqc-lay-rev__chip.is-submitted { background: var(--bg-sunken); color: var(--ink-2); }
.eqc-lay-rev__chip.is-rejected { background: var(--warn-200); color: var(--warn-700); }
.eqc-lay-rev__desc {
  margin: 0; font-size: 13px; color: var(--ink-2); line-height: 18px;
}
.eqc-lay-rev__tags { display: flex; flex-wrap: wrap; gap: 4px; }
.eqc-lay-rev__shots { display: flex; flex-wrap: wrap; gap: 6px; }
.eqc-lay-rev__shot {
  width: 140px; aspect-ratio: 4 / 3; object-fit: cover;
  border-radius: var(--r-md); border: 1px solid var(--line);
}
.eqc-lay-rev__meta { font-size: 12px; color: var(--ink-muted); }
.eqc-lay-rev__notes {
  padding: 10px 12px; border-left: 3px solid var(--warn-500);
  background: var(--warn-50); border-radius: 0 var(--r-md) var(--r-md) 0;
  font-size: 12px; color: var(--ink-2);
}
[data-theme="dark"] .eqc-lay-rev__notes { background: #221803; }
.eqc-lay-rev__notes p { margin: 4px 0 0; }
.eqc-lay-rev__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.eqc-lay-rev__modal-lede {
  margin: 0; font-size: 13px; color: var(--ink-muted); line-height: 18px;
}

/* =====================================================================
   БЛОК 13 · РЕДАКТОР ОФОРМЛЕНИЯ КП (Tilda-WYSIWYG, батч 8b).
   .plans/eqcrm-pack-batch-8-block13.md, макет 13.2.
   Реимплем поверх Alpine-компонента layoutEditor — бэкенд и JS не
   трогаются. Трёхколоночный редактор с iframe-canvas.
   ===================================================================== */

.eqc-le { display: flex; flex-direction: column; }

/* ---- Верхняя панель ---- */
.eqc-le-top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 10px 20px;
  background: var(--bg-elev); border-bottom: 1px solid var(--line);
}
.eqc-le-top__left {
  display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1;
}
.eqc-le-top__right { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.eqc-le-top__back {
  display: inline-flex; align-items: center; gap: 3px; flex-shrink: 0;
  font-size: 12px; color: var(--ink-muted); text-decoration: none;
}
.eqc-le-top__back:hover { color: var(--ink); }
.eqc-le-top__name {
  flex: 1; min-width: 0; height: 32px; padding: 0 8px;
  background: transparent; border: 1px solid transparent; border-radius: var(--r-md);
  font: inherit; font-size: 16px; font-weight: 600; color: var(--ink);
}
.eqc-le-top__name:focus { outline: 0; border-color: var(--accent); background: var(--bg); }
.eqc-le-top__sysbadge {
  flex-shrink: 0; padding: 3px 8px; border-radius: var(--r-sm);
  background: var(--green-50); color: var(--green-700);
  font-size: 11px; font-weight: 600;
}
[data-theme="dark"] .eqc-le-top__sysbadge { background: var(--green-900); color: var(--green-300); }
.eqc-le-top__status { flex-shrink: 0; font-size: 12px; color: var(--ink-muted); white-space: nowrap; }

.eqc-le-iconbtn {
  display: inline-flex; align-items: center; gap: 4px; height: 30px;
  padding: 0 8px; border: 1px solid transparent; border-radius: var(--r-md);
  background: transparent; font: inherit; font-size: 12px; color: var(--ink-2);
  cursor: pointer;
}
.eqc-le-iconbtn:hover { background: var(--bg-sunken); }
.eqc-le-iconbtn:disabled { opacity: .4; cursor: not-allowed; }

.eqc-le-revchip {
  flex-shrink: 0; padding: 4px 8px; border-radius: var(--r-sm);
  font-size: 11px; font-weight: 600; white-space: nowrap;
}
.eqc-le-revchip.bg-secondary-container { background: var(--info-50); color: var(--info-700); }
.eqc-le-revchip.bg-tertiary-container { background: var(--green-50); color: var(--green-700); }
[data-theme="dark"] .eqc-le-revchip.bg-secondary-container { background: #0C1E3A; color: #93C5FD; }
[data-theme="dark"] .eqc-le-revchip.bg-tertiary-container { background: var(--green-900); color: var(--green-300); }

.eqc-le-banner { margin: 12px 20px 0; }

.eqc-le-rejectnote {
  margin: 0; padding: 10px 20px;
  background: var(--danger-50); border-bottom: 1px solid var(--danger-200);
  color: var(--danger-700);
}
[data-theme="dark"] .eqc-le-rejectnote {
  background: #2A0808; border-bottom-color: #7F1D1D; color: #FCA5A5;
}
.eqc-le-rejectnote__h {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .05em; margin-bottom: 2px;
}
.eqc-le-rejectnote__t { margin: 0; font-size: 13px; white-space: pre-wrap; }

/* ---- Трёхколоночная сетка ---- */
.eqc-le-grid {
  display: grid; grid-template-columns: 300px 1fr 320px; flex: 1;
  min-height: calc(100vh - 52px - 53px);
}
.eqc-le-side {
  display: flex; flex-direction: column; gap: 12px;
  padding: 16px; overflow-y: auto;
  max-height: calc(100vh - 52px - 53px);
  background: var(--bg-elev);
}
.eqc-le-side--left { border-right: 1px solid var(--line); }
.eqc-le-side--right { border-left: 1px solid var(--line); }

.eqc-le-sec-h {
  margin: 0; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-le-sec-h--gap { margin-top: 8px; }

.eqc-le-field { display: flex; flex-direction: column; gap: 5px; }
.eqc-le-field__lbl { font-size: 12px; color: var(--ink-muted); }

/* ---- Раскрывающиеся секции ---- */
.eqc-le-details {
  background: var(--bg-sunken); border-radius: var(--r-md);
  border: 1px solid var(--line);
}
.eqc-le-details__sum {
  padding: 8px 12px; cursor: pointer; list-style: none;
  font-size: 12px; font-weight: 600; color: var(--ink-2);
}
.eqc-le-details__sum::-webkit-details-marker { display: none; }
.eqc-le-details__sum::before { content: "▸ "; color: var(--ink-faint); }
.eqc-le-details[open] > .eqc-le-details__sum::before { content: "▾ "; }
.eqc-le-details__body {
  padding: 0 12px 12px; display: flex; flex-direction: column; gap: 10px;
}
.eqc-le-colgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.eqc-le-color {
  width: 100%; height: 32px; padding: 2px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: var(--bg-elev); cursor: pointer;
}
.eqc-le-note {
  margin: 0; font-size: 11px; color: var(--ink-muted); line-height: 15px;
  padding-top: 6px; border-top: 1px solid var(--line);
}
.eqc-le-subgroup {
  display: flex; flex-direction: column; gap: 10px;
  padding-top: 10px; border-top: 1px solid var(--line);
}

/* ---- Каталог блоков ---- */
.eqc-le-catgroup { display: flex; flex-direction: column; gap: 6px; }
.eqc-le-catgroup__lbl { margin: 0; font-size: 11px; font-weight: 600; color: var(--ink-muted); }
.eqc-le-catgroup__items { display: flex; flex-direction: column; gap: 4px; }
.eqc-le-pickgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.eqc-le-catbtn {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 7px 10px; border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-elev); font: inherit; font-size: 13px; color: var(--ink-2);
  text-align: left; cursor: pointer;
}
.eqc-le-catbtn:hover { background: var(--bg-sunken); border-color: var(--line-strong); }
.eqc-le-catbtn__plus {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: var(--r-sm);
  background: var(--bg-sunken); color: var(--ink-muted); font-size: 12px;
}

/* ---- Центр: canvas ---- */
.eqc-le-canvas {
  position: relative; overflow-y: auto; padding: 24px;
  background: var(--bg-sunken);
  max-height: calc(100vh - 52px - 53px);
}
.eqc-le-frame {
  max-width: 820px; margin: 0 auto; background: #fff;
  border-radius: var(--r-lg); box-shadow: var(--sh-lg); overflow: hidden;
}
.eqc-le-frame__if { display: block; width: 100%; height: 1100px; border: 0; }

/* ---- Hover-toolbar (позиционируется JS-геттером hoverToolbarStyle) ---- */
.eqc-le-hovertb {
  display: flex; align-items: center; gap: 2px; padding: 3px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--sh-md);
}
.eqc-le-hovertb__btn {
  width: 26px; height: 26px; border: 0; border-radius: var(--r-sm);
  background: transparent; color: var(--ink-2); font-size: 13px; cursor: pointer;
}
.eqc-le-hovertb__btn:hover { background: var(--bg-sunken); }
.eqc-le-hovertb__btn--del:hover { background: var(--danger-50); color: var(--danger-700); }

/* ---- Список блоков (x-ref="blocksList", цель SortableJS) ---- */
.eqc-le-blocklist { list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px; }
.eqc-le-blockitem {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; border-radius: var(--r-md);
  border: 1px solid var(--line); background: var(--bg-sunken);
  font-size: 13px; color: var(--ink-2); cursor: pointer;
}
.eqc-le-blockitem:hover { border-color: var(--line-strong); }
/* JS-геттер blockItemClass(idx): выбранный блок получает .ring-2. */
.eqc-le-blockitem.ring-2 {
  border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent);
  background: var(--bg-elev);
}
.eqc-le-blockitem__handle {
  flex-shrink: 0; color: var(--ink-faint); cursor: grab; user-select: none;
  font-size: 12px;
}
.eqc-le-blockitem__name { flex-grow: 1; min-width: 0; }
.eqc-le-blockitem__idx {
  flex-shrink: 0; font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
}
.eqc-le-blockitem__del {
  flex-shrink: 0; width: 18px; height: 18px; border: 0; border-radius: var(--r-sm);
  background: transparent; color: var(--ink-faint); font-size: 11px;
  cursor: pointer; opacity: 0;
}
.eqc-le-blockitem:hover .eqc-le-blockitem__del { opacity: 1; }
.eqc-le-blockitem__del:hover { background: var(--danger-50); color: var(--danger-700); }
.eqc-le-emptyblocks {
  margin: 0; padding: 28px 8px; text-align: center;
  font-size: 13px; color: var(--ink-muted);
}

/* ---- Свойства выбранного блока ---- */
.eqc-le-props {
  display: flex; flex-direction: column; gap: 12px;
  padding-top: 14px; margin-top: 4px; border-top: 1px solid var(--line);
}
.eqc-le-props__body { display: flex; flex-direction: column; gap: 10px; }
.eqc-le-mono { font-family: var(--font-mono); font-size: 12px; }
.eqc-le-checkrow {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--ink-2); cursor: pointer;
}

@media (max-width: 1100px) {
  .eqc-le-grid { grid-template-columns: 1fr; }
  .eqc-le-side, .eqc-le-canvas { max-height: none; }
  .eqc-le-side--left { border-right: 0; border-bottom: 1px solid var(--line); }
  .eqc-le-side--right { border-left: 0; border-top: 1px solid var(--line); }
  .eqc-le-top { flex-wrap: wrap; }
}

/* =====================================================================
   БЛОК 13 · АДМИНСКАЯ БАЗА ЗНАНИЙ (батч 8c).
   .plans/eqcrm-pack-batch-8-block13.md, макет 13.5 / 13.6.
   Реимплем поверх Alpine-компонентов kbAdminPage / kbSuggestionsAdmin —
   бэкенд и JS не трогаются.
   ===================================================================== */

/* ---- Управление статьями: таблица ---- */
.eqc-kb-title { display: inline-flex; align-items: center; gap: 7px; }
.eqc-kb-title__pin { display: inline-flex; color: var(--accent); }
.eqc-kb-catbadge {
  display: inline-flex; padding: 2px 8px; border-radius: var(--r-sm);
  background: var(--bg-sunken); color: var(--ink-2);
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em;
}
.eqc-kb-status { display: inline-flex; align-items: center; gap: 7px; }
.eqc-kb-dot { width: 8px; height: 8px; border-radius: var(--r-full); flex-shrink: 0; }
/* JS-геттер statusDotClass(article) → bg-green-500 / bg-outline. */
.eqc-kb-dot.bg-green-500 { background: var(--green-500); }
.eqc-kb-dot.bg-outline { background: var(--line-strong); }

.eqc-kb-tblempty {
  padding: 40px 16px; text-align: center;
  font-size: 13px; color: var(--ink-muted);
}
.eqc-kb-mono { font-family: var(--font-mono); font-size: 13px; }
.eqc-kb-hint { margin: 0; font-size: 11px; color: var(--ink-muted); line-height: 15px; }

/* ---- Пожелания: фильтр по статусу ---- */
.eqc-kb-sug-filters {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
}
.eqc-kb-sug-filters__lbl {
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .05em; color: var(--ink-muted); margin-right: 2px;
}
/* JS-геттер statusFilterClass(code) отдаёт полную Tailwind-строку;
   статический `.eqc-kb-sug-filt`-якорь перекрывает её под пак. */
.eqc-kb-sug-filt {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 12px; border-radius: var(--r-full);
  border: 1px solid var(--line); background: var(--bg-elev);
  font: inherit; font-size: 12px; font-weight: 600; color: var(--ink-2);
  cursor: pointer;
}
.eqc-kb-sug-filt:hover { background: var(--bg-sunken); }
.eqc-kb-sug-filt.bg-primary-container {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
.eqc-kb-sug-filt__n {
  font-family: var(--font-mono); font-size: 11px; opacity: .8;
}

/* ---- Пожелания: карточки ---- */
.eqc-kb-sug-list { display: flex; flex-direction: column; gap: 10px; }
.eqc-kb-sug-card {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 16px;
}
.eqc-kb-sug-card__top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.eqc-kb-sug-card__badges { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.eqc-kb-sug-card__date { font-size: 12px; color: var(--ink-muted); }
.eqc-kb-sug-kind {
  display: inline-flex; padding: 2px 8px; border-radius: var(--r-sm);
  background: var(--bg-sunken); color: var(--ink-2);
  font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .04em;
}
/* JS-геттер statusBadgeClass(code) отдаёт Tailwind-строку с bg-*-цветом;
   статический `.eqc-kb-sug-badge`-якорь перекрывает её под пак. */
.eqc-kb-sug-badge {
  display: inline-flex; align-items: center; padding: 2px 8px;
  border-radius: var(--r-sm); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em;
}
.eqc-kb-sug-badge.bg-amber-100 { background: var(--warn-50); color: var(--warn-700); }
.eqc-kb-sug-badge.bg-sky-100 { background: var(--info-50); color: var(--info-700); }
.eqc-kb-sug-badge.bg-emerald-100 { background: var(--green-50); color: var(--green-700); }
.eqc-kb-sug-badge.bg-stone-200 { background: var(--bg-sunken); color: var(--ink-muted); }
.eqc-kb-sug-badge.bg-surface-container-high { background: var(--bg-sunken); color: var(--ink-2); }
[data-theme="dark"] .eqc-kb-sug-badge.bg-amber-100 { background: #2A1D05; color: #FCD34D; }
[data-theme="dark"] .eqc-kb-sug-badge.bg-sky-100 { background: #0C1E3A; color: #93C5FD; }
[data-theme="dark"] .eqc-kb-sug-badge.bg-emerald-100 { background: var(--green-900); color: var(--green-300); }

.eqc-kb-sug-card__text {
  font-size: 13px; color: var(--ink); line-height: 19px; white-space: pre-line;
}
.eqc-kb-sug-card__foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  padding-top: 10px; border-top: 1px solid var(--line);
}
.eqc-kb-sug-card__author { font-size: 12px; color: var(--ink-muted); }
.eqc-kb-sug-card__acts { display: flex; gap: 12px; flex-wrap: wrap; }
.eqc-kb-sug-act {
  background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  font-size: 12px; font-weight: 600; color: var(--accent);
}
.eqc-kb-sug-act:hover { text-decoration: underline; }
.eqc-kb-sug-act--danger { color: var(--danger-700); }
[data-theme="dark"] .eqc-kb-sug-act--danger { color: #FCA5A5; }

/* =====================================================================
   БЛОК 13 · АНАЛИТИЧЕСКИЙ ДАШБОРД (батч 8d).
   .plans/eqcrm-pack-batch-8-block13.md, макет 13.7.
   Реимплем поверх Alpine-компонентов analyticsDashboard /
   cohortConfigForm / cohortAnomalyForm — бэкенд и JS не трогаются.
   JS-возвращаемые Tailwind-строки перекрашиваются составными
   селекторами; на элементы добавлены статические `.eqc-an-*`-якоря.
   ===================================================================== */

.eqc-an-stack { display: flex; flex-direction: column; gap: 20px; }

/* ---- Переключатель «Таблицы / Графики» ---- */
.eqc-an-vtog-grp {
  display: inline-flex; padding: 3px; gap: 2px;
  background: var(--bg-sunken); border-radius: var(--r-md);
}
.eqc-an-vtog {
  height: 30px; padding: 0 14px; border: 0; border-radius: var(--r-sm);
  background: transparent; font: inherit; font-size: 13px; font-weight: 500;
  color: var(--ink-muted); cursor: pointer;
}
.eqc-an-vtog:hover { color: var(--ink); }
.eqc-an-vtog.bg-primary-container {
  background: var(--bg-elev); color: var(--ink); box-shadow: var(--sh-sm);
}

/* ---- Заголовок секции формкарты (заголовок + статус-пилюля) ---- */
.eqc-an-sechead {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 8px;
}
.eqc-an-statuspill {
  flex-shrink: 0; padding: 4px 12px; border-radius: var(--r-full);
  font-size: 11px; font-weight: 600;
}
.eqc-an-statuspill.bg-tertiary-container { background: var(--green-50); color: var(--green-700); }
.eqc-an-statuspill.bg-surface-container-high { background: var(--bg-sunken); color: var(--ink-muted); }
[data-theme="dark"] .eqc-an-statuspill.bg-tertiary-container {
  background: var(--green-900); color: var(--green-300);
}

.eqc-an-note { font-size: 13px; color: var(--ink-muted); }
.eqc-an-h2 { margin: 0; font-size: 16px; font-weight: 600; color: var(--ink); }
.eqc-an-h3 { margin: 0; font-size: 14px; font-weight: 600; color: var(--ink); }
.eqc-an-h4 { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink-2); }
.eqc-an-hint { margin: 0; font-size: 12px; color: var(--ink-muted); line-height: 16px; }

/* ---- Блоки внутри формкарт ---- */
.eqc-an-block { display: flex; flex-direction: column; gap: 8px; }
.eqc-an-block--top { padding-top: 16px; border-top: 1px solid var(--line); }
.eqc-an-block__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.eqc-an-tbl { font-size: 13px; }

/* ---- Чипы контрольных точек T+N ---- */
.eqc-an-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.eqc-an-chip {
  display: inline-flex; align-items: center; gap: 6px; height: 30px;
  padding: 0 6px 0 12px; border-radius: var(--r-full);
  background: var(--bg-sunken); border: 1px solid var(--line);
  font-size: 13px; font-weight: 500; color: var(--ink);
}
.eqc-an-chip__del {
  width: 18px; height: 18px; border: 0; border-radius: var(--r-full);
  background: transparent; color: var(--ink-muted); font-size: 14px; cursor: pointer;
}
.eqc-an-chip__del:hover { background: var(--danger-50); color: var(--danger-700); }
.eqc-an-chip-input { width: 84px; }

.eqc-an-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.eqc-an-actions__end { margin-left: auto; }
.eqc-an-checkrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 13px; color: var(--ink-2); cursor: pointer;
}
.eqc-an-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }

/* ---- Фильтр периода ---- */
.eqc-an-period { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px; }
.eqc-an-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.eqc-an-preset {
  height: 32px; padding: 0 14px; border: 1px solid var(--line);
  border-radius: var(--r-md); background: var(--bg-elev);
  font: inherit; font-size: 13px; font-weight: 500; color: var(--ink-2); cursor: pointer;
}
.eqc-an-preset:hover { background: var(--bg-sunken); }
.eqc-an-preset.bg-primary-container {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
.eqc-an-period__custom { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.eqc-an-period__hint { margin-left: auto; font-size: 12px; color: var(--ink-muted); }

/* ---- KPI-подпись под числом ---- */
.eqc-kpi__sub { font-size: 12px; color: var(--ink-muted); line-height: 16px; }

/* ---- Двухколоночная сетка панелей ---- */
.eqc-an-2col { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

/* ---- Полосы-индикаторы ---- */
.eqc-an-bars { display: flex; flex-direction: column; gap: 12px; }
.eqc-an-bar { display: flex; flex-direction: column; gap: 5px; }
.eqc-an-bar__top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; font-size: 13px; color: var(--ink);
}
.eqc-an-bar__val { font-variant-numeric: tabular-nums; }
.eqc-an-bar__pct { font-size: 11px; color: var(--ink-muted); margin-left: 4px; }
.eqc-an-bar__track {
  height: 8px; border-radius: var(--r-full); background: var(--bg-sunken);
  overflow: hidden;
}
.eqc-an-bar__track--tall { height: 12px; }
.eqc-an-bar__fill { height: 100%; border-radius: var(--r-full); background: var(--accent); }
.eqc-an-bar__fill--err { background: var(--danger-500); }

/* ---- Список «термин → значение» (AI-производительность) ---- */
.eqc-an-dl { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.eqc-an-dl__row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-size: 13px;
}
.eqc-an-dl__row dt { color: var(--ink-muted); }
.eqc-an-dl__row dd { margin: 0; color: var(--ink); font-variant-numeric: tabular-nums; }

/* ---- Обёртка графиков Chart.js ---- */
.eqc-an-chart { position: relative; height: 256px; }
.eqc-an-chart--tall { height: 288px; }

/* ---- Пустые состояния таба ---- */
.eqc-an-emptytab {
  padding: 48px 16px; text-align: center; font-size: 13px; color: var(--ink-muted);
}
.eqc-an-emptytab__hint { margin-top: 6px; font-size: 12px; }

/* ---- Карта с табами ---- */
.eqc-an-tabcard { padding: 0; overflow: hidden; }
.eqc-an-tabs {
  display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--line);
}
.eqc-an-tab {
  padding: 14px 20px; border: 0; border-bottom: 2px solid transparent;
  background: transparent; font: inherit; font-size: 13px; font-weight: 500;
  color: var(--ink-muted); cursor: pointer; margin-bottom: -1px;
}
.eqc-an-tab:hover { color: var(--ink); }
.eqc-an-tab.border-primary { color: var(--ink); border-bottom-color: var(--accent); }
.eqc-an-tabbody {
  padding: 20px; display: flex; flex-direction: column; gap: 20px;
}

/* Подсказки-поповеры «?» должны выходить за пределы карты табов. У табов нет
   фоновых заливок на hover, поэтому снятие clip визуально безопасно; верхние
   углы карты сохраняем скруглением полосы табов, нижние — скруглением
   таблицы, идущей от края до края (табы «По менеджерам» / «По клиентам»). */
.eqc-an-tabcard { overflow: visible; }
.eqc-an-tabs {
  border-top-left-radius: var(--r-xl); border-top-right-radius: var(--r-xl);
}
.eqc-an-tabcard .eqc-dtbl-wrap {
  border-bottom-left-radius: var(--r-xl); border-bottom-right-radius: var(--r-xl);
}
/* Слабый заголовок-подпись в табах без собственного <h*> (По менеджерам /
   По клиентам / Воронка) — даёт якорь для кнопки «?». */
.eqc-an-tabhead {
  display: flex; align-items: center; gap: 6px;
  padding: 16px 20px 0; font-size: 12px; color: var(--ink-muted);
}

/* ---- Воронка ---- */
.eqc-an-funnel { padding: 20px; display: flex; flex-direction: column; gap: 14px; }
.eqc-an-funnel__row { display: flex; flex-direction: column; gap: 5px; }
.eqc-an-funnel__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.eqc-an-funnel__name { display: flex; align-items: center; gap: 10px;
  font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-an-funnel__step {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: var(--r-full);
  background: var(--accent); color: #fff; font-size: 11px; font-weight: 600;
}
.eqc-an-funnel__nums { display: flex; align-items: center; gap: 10px; }
.eqc-an-funnel__count {
  font-size: 13px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.eqc-an-funnel__drop {
  font-size: 12px; color: var(--danger-700); font-variant-numeric: tabular-nums;
}
[data-theme="dark"] .eqc-an-funnel__drop { color: #FCA5A5; }

/* ---- Сортируемые заголовки таблиц ---- */
.eqc-an-sortth { cursor: pointer; user-select: none; }
.eqc-an-sortth:hover { color: var(--ink); }

/* ---- Ячейки таблиц с JS-классом (reactionMedianClass/OverdueClass) ---- */
.eqc-an-numcell { color: var(--ink); }
.eqc-an-numcell.text-error { color: var(--danger-700); }
.eqc-an-numcell.text-secondary { color: var(--ink-muted); }
.eqc-an-numcell.text-on-surface { color: var(--ink); }
.eqc-an-numcell.font-semibold { font-weight: 600; }
[data-theme="dark"] .eqc-an-numcell.text-error { color: #FCA5A5; }

/* ---- Карточки сводки качества AI ---- */
.eqc-an-qcards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.eqc-an-qcard {
  background: var(--bg-sunken); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.eqc-an-qcard__lab {
  font-size: 11px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--ink-muted);
}
.eqc-an-qcard__num {
  font-size: 22px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.eqc-an-qcard__note { font-size: 13px; font-weight: 400; color: var(--ink-muted); }
.eqc-an-subblock { display: flex; flex-direction: column; gap: 10px; }

/* ---- Балл в рейтинге менеджеров ---- */
.eqc-an-score {
  display: inline-flex; align-items: center; gap: 8px; justify-content: flex-end;
}
.eqc-an-score__track {
  width: 64px; height: 8px; border-radius: var(--r-full);
  background: var(--bg-sunken); overflow: hidden;
}
.eqc-an-score__fill { display: block; height: 100%; background: var(--accent); }

@media (max-width: 1100px) {
  .eqc-an-2col, .eqc-an-grid3, .eqc-an-qcards { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .eqc-an-period__hint { margin-left: 0; }
  .eqc-an-actions__end { margin-left: 0; }
}

/* =====================================================================
   БЛОК 2 · до-авторизационная страница входа (батч публичных страниц)
   .plans/eqcrm-public-pages-theming.md. Макет «Блок 2 - Auth & System Pages».
   login.html наследует base.html пака — стили живут здесь, в pack.css.
   verify.html / online_kp.html — self-contained, со своим инлайн-CSS.
   ===================================================================== */

.eqc-auth-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 20px;
  background: var(--bg-sunken);
}

.eqc-auth {
  width: 100%;
  max-width: 400px;
  background: var(--bg-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 32px;
  box-shadow: var(--sh-lg);
}

.eqc-auth__brand {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
}
.eqc-auth__mark {
  width: 32px;
  height: 32px;
  border-radius: 7px;
  background: var(--accent);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .02em;
  flex-shrink: 0;
}
.eqc-auth__wordmark {
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.005em;
  color: var(--ink);
}
.eqc-auth__wordmark-sub {
  font-weight: 400;
  color: var(--ink-muted);
  margin-left: 6px;
  font-size: 13px;
}

.eqc-auth__title {
  margin: 0 0 6px;
  font-size: 22px;
  line-height: 28px;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ink);
}
.eqc-auth__sub {
  margin: 0 0 22px;
  font-size: 13px;
  line-height: 20px;
  color: var(--ink-muted);
}

.eqc-auth__form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.eqc-authfield {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.eqc-authfield__lbl {
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-2);
}

.eqc-authinput {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border-radius: var(--r-md);
  background: var(--bg-elev);
  border: 1px solid var(--line-strong);
  transition: border-color .12s, box-shadow .12s;
}
.eqc-authinput:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(31, 138, 91, .16);
}
.eqc-authinput__pfx {
  display: inline-flex;
  align-items: center;
  color: var(--ink-muted);
  flex-shrink: 0;
}
.eqc-authinput input {
  flex: 1;
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  color: var(--ink);
}
.eqc-authinput input::placeholder { color: var(--ink-faint); }

/* Кнопка входа во всю ширину карточки — небольшой отступ от полей. */
.eqc-auth__form .eqc-btn--full { margin-top: 4px; }

.eqc-auth__foot {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  line-height: 18px;
  color: var(--ink-muted);
  text-align: center;
}

@media (max-width: 480px) {
  .eqc-auth-shell { padding: 24px 14px; }
  .eqc-auth { padding: 24px; box-shadow: none; }
}

/* =====================================================================
   БЛОК 15 · КАТАЛОГ ОБОРУДОВАНИЯ (батч 15).
   .plans/eqcrm-pack-block15-catalog.md.
   Реимплем экранов /catalog/* и /settings/catalog поверх Alpine-компонентов
   catalogPage / catalogCardPage / catalogReviewPage / catalogComparePage /
   catalogDeactivatedReportPage / catalogCategoriesPage / catalogSuppliersPage /
   catalogBrandsPage / catalogNewPage / settingsCatalog / externalApiTokens.
   Бэкенд и JS не трогаются. Часть :class-биндингов отдаёт JS-строки
   (statusClass / freshnessClass → cat-badge--*, bannerClass → cmp-banner--*,
   tok-badge--*, cc-flag--done, cat-node__name--archived) — перекрашиваем их
   здесь составными селекторами поверх токенов пака.
   ===================================================================== */

/* ---------- Таб-бар разделов каталога ---------- */
.eqc-cat-tabs {
  display: flex; gap: 0; padding: 0 32px;
  background: var(--bg); border-bottom: 1px solid var(--line);
}
.eqc-cat-tab {
  padding: 11px 0; margin-right: 22px; border-bottom: 2px solid transparent;
  font-size: 13px; font-weight: 500; color: var(--ink-muted);
  text-decoration: none; white-space: nowrap;
}
.eqc-cat-tab:hover { color: var(--ink); }
.eqc-cat-tab.is-active { color: var(--ink); border-bottom-color: var(--accent); }

/* ---------- Бейдж статуса / свежести (JS: cat-badge--ok/--warn/--muted) ---------- */
.cat-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 9px; border-radius: var(--r-full);
  font-size: 11px; font-weight: 500; line-height: 1.5;
  white-space: nowrap; border: 1px solid var(--line);
  background: var(--bg-sunken); color: var(--ink-2);
}
.cat-badge--ok {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.cat-badge--warn {
  background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200);
}
.cat-badge--muted {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line);
}
[data-theme="dark"] .cat-badge--ok {
  background: var(--green-900); color: #85C29F; border-color: #13633F;
}
[data-theme="dark"] .cat-badge--warn {
  background: #2A1D05; color: #FCD34D; border-color: #624017;
}

/* ---------- Баннер ошибки с отступом страницы ---------- */
.eqc-cat-pagebanner { margin: 14px 32px 0; }

/* ---------- Тулбар: фильтры-селекты ---------- */
.eqc-cat-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.eqc-cat-sel {
  height: 32px; padding: 0 26px 0 10px;
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg-elev); font: inherit; font-size: 13px; color: var(--ink);
  cursor: pointer;
}
.eqc-cat-sel:focus {
  outline: 0; border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(31, 138, 91, .12);
}

/* ---------- Ячейки таблицы каталога ---------- */
.eqc-cat-name {
  font-size: 13px; font-weight: 500; color: var(--ink); text-decoration: none;
}
.eqc-dtbl tbody tr:hover .eqc-cat-name { color: var(--accent-hover); }
.eqc-cat-mono { font-family: var(--font-mono); font-size: 12px; }
.eqc-cat-dash { color: var(--ink-faint); }
.eqc-cat-tblempty {
  padding: 44px 16px !important; text-align: center;
  color: var(--ink-muted); font-size: 13px;
}

/* ---------- Справочники: ячейка «название + сайт» ---------- */
.eqc-cat-cell { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eqc-cat-cell__n { font-size: 13px; font-weight: 500; color: var(--ink); }
.eqc-cat-cell__s {
  font-size: 12px; color: var(--ink-muted); text-decoration: none;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eqc-cat-cell__s:hover { color: var(--accent-hover); }

/* ---------- Справочники: предупреждение о дублях в модалке ---------- */
.eqc-cat-dup { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.eqc-cat-dup__list {
  margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 2px;
}
.eqc-cat-mergerow {
  margin-top: 2px; padding-top: 12px; border-top: 1px solid var(--line);
}

/* ---------- Дерево категорий ---------- */
.eqc-cat-treewrap { padding: 20px 32px 40px; }
.eqc-cat-treeempty {
  padding: 48px 24px; text-align: center;
  color: var(--ink-muted); font-size: 13px;
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg);
}
.eqc-cat-tree {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden;
}
.eqc-cat-node {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 14px; border-bottom: 1px solid var(--line);
}
.eqc-cat-tree > .eqc-cat-node:last-child { border-bottom: 0; }
.eqc-cat-node:hover { background: var(--bg-sunken); }
.cat-node__name { font-size: 13px; font-weight: 500; color: var(--ink); }
.cat-node__name--archived {
  color: var(--ink-faint); text-decoration: line-through; font-weight: 400;
}
.eqc-cat-node__spacer { flex: 1; }
.eqc-cat-node__acts { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---------- Карточка оборудования: шапка ---------- */
.eqc-cat-crumb { color: inherit; text-decoration: none; }
.eqc-cat-crumb:hover { color: var(--ink-2); }
.eqc-cat-headbadges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.eqc-cat-headver { font-size: 12px; color: var(--ink-muted); }
.eqc-cat-headver b { color: var(--ink-2); font-family: var(--font-mono); }

/* ---------- Карточка оборудования: двухколоночный layout ---------- */
.eqc-cat-detail {
  padding: 24px 32px 40px; display: grid;
  grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start;
}
.eqc-cat-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.eqc-cat-rail { display: flex; flex-direction: column; gap: 14px; }

/* ---------- Редактор массивов: сетки строк ---------- */
.eqc-cat-row2 { grid-template-columns: 1fr 1fr 36px; }
.eqc-cat-row3 { grid-template-columns: 1fr 1fr 90px 36px; }
.eqc-cat-rowacc { grid-template-columns: 1fr 1fr 0.7fr 36px; }

/* ---------- Фотографии ---------- */
.eqc-cat-uploadbtn { display: inline-flex; cursor: pointer; }
.eqc-cat-uploadbtn__inp { display: none; }
.eqc-cat-photos {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
}
.eqc-cat-photo {
  position: relative; border: 1px solid var(--line);
  border-radius: var(--r-md); overflow: hidden; background: var(--bg-elev);
}
.eqc-cat-photo__img {
  display: block; width: 100%; height: 138px; object-fit: cover;
  background: var(--bg-sunken);
}
.eqc-cat-photo__pri { position: absolute; top: 6px; left: 6px; }
.eqc-cat-photo__body {
  padding: 8px; display: flex; flex-direction: column; gap: 6px;
}
.eqc-cat-photo__acts { display: flex; gap: 12px; flex-wrap: wrap; }

/* ---------- Правая колонка: компактные карточки ---------- */
.eqc-cat-railcard {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 16px 18px;
  display: flex; flex-direction: column; gap: 10px;
}
.eqc-cat-railcard__h {
  margin: 0; font-family: var(--font-mono); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-cat-railcard__row { display: flex; align-items: center; gap: 8px; }
.eqc-cat-railcard__k {
  font-size: 12px; font-weight: 500; color: var(--ink-muted);
}
.eqc-cat-railcard__acts { display: flex; flex-direction: column; gap: 6px; }
.eqc-cat-railcard__acts .eqc-btn { width: 100%; justify-content: center; }
.eqc-cat-railcard__sub {
  padding-top: 10px; border-top: 1px solid var(--line);
  display: flex; flex-direction: column; gap: 6px;
}
.eqc-cat-railbtn { width: 100%; justify-content: center; }
.eqc-cat-usage { margin: 0; font-size: 13px; color: var(--ink-2); }
.eqc-cat-usage b { font-weight: 600; color: var(--ink); }

/* ---------- Точность данных: флаги ---------- */
.eqc-cat-flagopen {
  margin: 0; font-size: 12px; font-weight: 500; color: var(--warn-700);
}
.eqc-cat-flagform { display: flex; flex-direction: column; gap: 8px; }
.eqc-cat-flagform__acts { display: flex; gap: 6px; }
.eqc-cat-flags { display: flex; flex-direction: column; gap: 10px; }
.eqc-cat-flag {
  border-left: 2px solid var(--accent); padding-left: 10px;
}
.eqc-cat-flag.cc-flag--done { border-left-color: var(--line-strong); }
.eqc-cat-flag__note {
  margin: 0 0 4px; font-size: 13px; line-height: 1.45; color: var(--ink-2);
}
.eqc-cat-flag.cc-flag--done .eqc-cat-flag__note { color: var(--ink-muted); }
.eqc-cat-flag__meta {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-size: 11px; color: var(--ink-muted);
}
.eqc-cat-flag__acts { display: flex; gap: 12px; margin-top: 6px; }

/* ---------- Журнал изменений ---------- */
.eqc-cat-log {
  display: flex; flex-direction: column; gap: 10px;
  max-height: 420px; overflow-y: auto;
}
.eqc-cat-log__item { border-left: 2px solid var(--line); padding-left: 10px; }
.eqc-cat-log__top {
  display: flex; justify-content: space-between; gap: 8px;
}
.eqc-cat-log__kind { font-size: 12px; font-weight: 600; color: var(--ink); }
.eqc-cat-log__date {
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-faint);
  white-space: nowrap;
}
.eqc-cat-log__who { font-size: 12px; color: var(--ink-muted); }
.eqc-cat-log__fields {
  margin: 4px 0 0; padding-left: 16px;
  display: flex; flex-direction: column; gap: 1px;
}
.eqc-cat-log__fields li { font-size: 11px; color: var(--ink-muted); }

/* ---------- Очередь ревью / отчёт деактивированных ---------- */
.eqc-cat-badges { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.eqc-cat-wasreq {
  margin-top: 3px; font-family: var(--font-mono); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; color: var(--warn-700);
}

/* ---------- Сравнение с КП ---------- */
.eqc-cat-cmpwrap { padding: 20px 32px 40px; }
.eqc-cat-resolvelink {
  margin-left: 8px; font-weight: 600; color: inherit; text-decoration: underline;
  text-underline-offset: 2px;
}

/* Баннер совпадения/расхождения (JS: cmp-banner--match / --diff). */
.cmp-banner {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; margin-bottom: 14px; border-radius: var(--r-md);
  font-size: 13px; font-weight: 500; border: 1px solid;
}
.cmp-banner--match {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.cmp-banner--diff {
  background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200);
}
[data-theme="dark"] .cmp-banner--match {
  background: var(--green-900); color: #85C29F; border-color: #13633F;
}
[data-theme="dark"] .cmp-banner--diff {
  background: #2A1D05; color: #FCD34D; border-color: #624017;
}

/* 3-колоночная diff-таблица. */
.eqc-cat-cmp {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr) minmax(0, 1fr);
  gap: 1px; background: var(--line);
  border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden;
}
.eqc-cat-cmp__head {
  background: var(--bg); padding: 10px 14px;
  font-family: var(--font-mono); font-size: 11px; font-weight: 500;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ink-muted);
}
.eqc-cat-cmp__row { display: contents; }
.eqc-cat-cmp__cell {
  background: var(--bg-elev); padding: 12px 14px;
  font-size: 13px; line-height: 1.5; color: var(--ink-2);
}
.eqc-cat-cmp__cell--label {
  font-weight: 600; color: var(--ink);
  display: flex; flex-direction: column; gap: 4px;
}
.eqc-cat-cmp__row.cmp-section--diff .eqc-cat-cmp__cell { background: var(--warn-50); }
[data-theme="dark"] .eqc-cat-cmp__row.cmp-section--diff .eqc-cat-cmp__cell {
  background: #221803;
}
.eqc-cat-cmp__flag {
  font-family: var(--font-mono); font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; color: var(--warn-700);
}
.eqc-cat-cmp__line { margin: 0 0 4px; }
.eqc-cat-cmp__line:last-child { margin-bottom: 0; }

/* Карточка резолюции расхождения. */
.eqc-cat-cmpactions {
  margin-top: 16px; display: flex; flex-direction: column; gap: 12px;
}
.eqc-cat-cmp__actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------- Настройки каталога: контроль свежести + токены ---------- */
.eqc-cat-policy { max-width: 280px; }
.eqc-cat-code {
  font-family: var(--font-mono); font-size: 12px; color: var(--ink-2);
  padding: 1px 6px; background: var(--bg-sunken);
  border: 1px solid var(--line); border-radius: var(--r-sm);
}

/* Блок «токен создан». */
.eqc-cat-toknew {
  margin-bottom: 16px; padding: 14px 16px;
  display: flex; flex-direction: column; gap: 10px;
  background: var(--warn-50); border: 1px solid var(--warn-200);
  border-radius: var(--r-md);
}
[data-theme="dark"] .eqc-cat-toknew {
  background: #2A1D05; border-color: #624017;
}
.eqc-cat-toknew__lbl {
  margin: 0; font-size: 13px; font-weight: 600; color: var(--ink);
}
.eqc-cat-tokcode {
  display: block; padding: 9px 11px; word-break: break-all;
  font-family: var(--font-mono); font-size: 13px; color: var(--ink);
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.eqc-cat-toknew__acts { display: flex; gap: 8px; flex-wrap: wrap; }
.eqc-cat-tokform { margin-bottom: 18px; }
.eqc-cat-toktbl { margin-top: 4px; }

/* Бейдж статуса токена (JS: tok-badge--active / --revoked). */
.tok-badge {
  display: inline-flex; align-items: center; padding: 2px 9px;
  border-radius: var(--r-full); font-size: 11px; font-weight: 500;
  white-space: nowrap; border: 1px solid;
}
.tok-badge--active {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.tok-badge--revoked {
  background: var(--bg-sunken); color: var(--ink-muted); border-color: var(--line);
}
[data-theme="dark"] .tok-badge--active {
  background: var(--green-900); color: #85C29F; border-color: #13633F;
}

@media (max-width: 980px) {
  .eqc-cat-detail { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .eqc-cat-tabs { padding: 0 16px; overflow-x: auto; }
  .eqc-cat-pagebanner { margin: 14px 16px 0; }
  .eqc-cat-filters { width: 100%; }
  .eqc-cat-sel { flex: 1 1 140px; }
  .eqc-cat-treewrap { padding: 16px; }
  .eqc-cat-node { flex-wrap: wrap; }
  .eqc-cat-detail { padding: 16px; }
  .eqc-cat-row3 { grid-template-columns: 1fr 1fr; }
  .eqc-cat-rowacc { grid-template-columns: 1fr 1fr; }
  .eqc-cat-cmpwrap { padding: 16px; }
  .eqc-cat-cmp { grid-template-columns: 1fr; }
}
/* ============================================================
   Поиск-комбобокс справочников каталога — расширение автокомплита пака.
   Базовый компонент (.eqc-qf-ac / .eqc-qf-ac__it / .eqc-qf-field--ac /
   .eqc-qf-lblrow / .eqc-qf-link / .eqc-input) — общий с формой КП. Здесь —
   только то, чего нет: пункт очистки, пустое состояние, подвал создания,
   панель быстрого создания, подпись «предложено», вариант для фильтров.
   ============================================================ */
.eqc-qf-ac__clear {
  color: var(--ink-muted);
  font-size: 12px;
}
.eqc-qf-ac__empty {
  padding: 9px;
  font-size: 13px;
  color: var(--ink-muted);
}
.eqc-qf-ac__ft {
  margin-top: 4px;
  padding: 8px 9px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  color: var(--ink-muted);
}
.eqc-qf-acpanel {
  margin-top: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--bg-sunken);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.eqc-qf-acpanel__h {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
}
.eqc-qf-acpanel__foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.eqc-qf-prop {
  margin: 0;
  font-size: 11px;
  line-height: 16px;
  color: var(--warn-700);
}
.eqc-qf-prop--err {
  color: var(--danger-700);
}
[data-theme="dark"] .eqc-qf-prop { color: var(--warn-500); }
[data-theme="dark"] .eqc-qf-prop--err { color: #FCA5A5; }
.eqc-qf-field--filter {
  flex: 1 1 150px;
  min-width: 150px;
}
.eqc-qf-field--filter .eqc-input { height: 32px; }

/* =====================================================================
   БЛОК 16 · ЛИЧНЫЙ КАБИНЕТ — оставшиеся экраны /profile/* (Блок 16).
   Реимплем sessions / training / notifications / hot_dashboard /
   reaction_time. Большинство разметки переиспользует существующие
   `.eqc-*` (.eqc-pgh / .eqc-set-wrap / .eqc-formcard / .eqc-dtbl /
   .eqc-tgl / .eqc-kpi / .eqc-an-preset). Здесь — только то, чего нет.
   ===================================================================== */

/* Ссылки внутри баннеров и подсказок наследуют цвет контейнера. */
.eqc-banner a {
  color: inherit;
  text-decoration: underline;
  font-weight: 500;
}
.eqc-formhint a {
  color: var(--accent);
  text-decoration: underline;
}

/* Список «ключ → значение» — блоки «Текущее состояние» (обучение)
   и «Подробнее» (скорость реакции). */
.eqc-kv { display: flex; flex-direction: column; gap: 10px; }
.eqc-kv__row {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px;
}
.eqc-kv__row + .eqc-kv__row {
  border-top: 1px solid var(--line); padding-top: 10px;
}
.eqc-kv__k { font-size: 13px; color: var(--ink-muted); min-width: 0; }
.eqc-kv__v {
  font-size: 14px; font-weight: 600; color: var(--ink);
  font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap;
}

/* Радио-вариант с заголовком и описанием — выбор scope «горячих КП».
   По образцу .eqc-qf-mode__opt, но как самостоятельная карточка выбора. */
.eqc-radopt-grp { display: flex; flex-direction: column; gap: 10px; }
.eqc-radopt {
  display: flex; gap: 10px; align-items: flex-start; cursor: pointer;
  padding: 12px 14px; border: 1px solid var(--line);
  border-radius: var(--r-md); background: var(--bg-elev);
  transition: background .12s, border-color .12s;
}
.eqc-radopt:hover { background: var(--bg-sunken); }
.eqc-radopt:has(input:checked) { border-color: var(--accent); }
.eqc-radopt input { margin-top: 2px; flex-shrink: 0; accent-color: var(--accent); }
.eqc-radopt__b { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.eqc-radopt__t {
  font-size: 13px; font-weight: 600; color: var(--ink); line-height: 18px;
}
.eqc-radopt__d { font-size: 12px; color: var(--ink-muted); line-height: 16px; }

/* Селектор периода на экране «Скорость реакции». */
.eqc-rt-period {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
}
.eqc-rt-period__lbl {
  font-size: 11px; text-transform: uppercase; letter-spacing: .06em;
  font-weight: 600; color: var(--ink-muted);
}

/* KPI-подпись с акцентом тревоги (просроченные открытия без звонка). */
.eqc-kpi__sub--err { color: var(--danger-700); }
[data-theme="dark"] .eqc-kpi__sub--err { color: #FCA5A5; }

/* Моноширинный инлайн-фрагмент (имя бота, таймзона). */
.eqc-mono { font-family: var(--font-mono); font-size: 12px; }

/* ---- Карточка интеграции (web push / Telegram) на экране уведомлений ---- */
.eqc-prof-intg {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 20px; background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-xl); padding: 20px 22px;
}
.eqc-prof-intg__main {
  flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px;
}
.eqc-prof-intg__t { font-size: 14px; font-weight: 600; color: var(--ink); }
.eqc-prof-intg__d {
  margin: 0; font-size: 13px; color: var(--ink-muted); line-height: 18px;
}
.eqc-prof-intg__actions {
  display: flex; flex-direction: column; gap: 8px; flex-shrink: 0;
}
.eqc-prof-intg__status {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--green-700); font-weight: 500;
}
.eqc-prof-intg__status .glyph { color: var(--green-600); }
[data-theme="dark"] .eqc-prof-intg__status { color: #85C29F; }
.eqc-prof-deeplink {
  display: block; margin-top: 6px; word-break: break-all;
  color: inherit; text-decoration: underline; font-weight: 500;
}

/* Модалка «Как подключить Telegram-бот» — нумерованный список шагов
   с встроенными pre/code-блоками. */
.eqc-tg-help-steps {
  display: flex; flex-direction: column; gap: 14px;
  margin: 0; padding-left: 22px;
  font-size: 13px; line-height: 1.55; color: var(--ink-2);
}
.eqc-tg-help-steps > li { padding-left: 4px; }
.eqc-tg-help-steps > li > b { color: var(--ink); }
.eqc-tg-help-pre {
  display: block; margin: 8px 0 0; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-sunken);
  font-family: var(--font-mono); font-size: 12px; line-height: 1.5;
  color: var(--ink); overflow-x: auto; white-space: pre;
}
.eqc-tg-help-pre code { font: inherit; color: inherit; background: transparent; }

/* Список устройств с активным push-подписками. */
.eqc-prof-devlist { display: flex; flex-direction: column; gap: 6px; }
.eqc-prof-devlist__h {
  font-size: 10px; text-transform: uppercase; letter-spacing: .07em;
  color: var(--ink-faint); font-weight: 600;
}
.eqc-prof-dev {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: var(--r-md); background: var(--bg-sunken);
}
.eqc-prof-dev__id { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.eqc-prof-dev__name { font-size: 13px; color: var(--ink); }
.eqc-prof-dev__info { font-size: 11px; color: var(--ink-muted); }
.eqc-prof-dev__del {
  flex-shrink: 0; background: none; border: 0; cursor: pointer;
  font: inherit; font-size: 12px; color: var(--ink-muted);
  text-decoration: underline;
}
.eqc-prof-dev__del:hover { color: var(--ink); }

/* Заголовок подсекции (матрица каналов, тихие часы). */
.eqc-prof-sec { display: flex; flex-direction: column; gap: 4px; }
.eqc-prof-sec__h {
  margin: 0; font-size: 16px; font-weight: 600; color: var(--ink);
  letter-spacing: -0.005em;
}
.eqc-prof-sec__d {
  margin: 0; font-size: 13px; color: var(--ink-muted); line-height: 18px;
}

/* Матрица «событие × канал» — колонки каналов центрируются. */
.eqc-nmx th + th, .eqc-nmx td + td { text-align: center; }
.eqc-nmx__ev { font-size: 13px; font-weight: 500; color: var(--ink); }

/* Ряд полей «тихих часов». */
.eqc-prof-quiet {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px;
}
.eqc-prof-quiet .eqc-field { flex: 0 0 auto; }
.eqc-prof-quiet .eqc-input { width: auto; }

/* На узких экранах карточка интеграции складывается в колонку. */
@media (max-width: 640px) {
  .eqc-prof-intg { flex-direction: column; gap: 14px; }
  .eqc-prof-intg__actions { width: 100%; }
  .eqc-prof-intg__actions .eqc-btn { width: 100%; }
}

/* =================================================================
   CSV-импорт справочников и массовая архивация
   (.plans/tz-csv-import-and-bulk-archive.md, дизайн-пак
   "Этап 3 · Pack A" + "Этап 5 · Patterns Pack 3").
   ================================================================= */

/* Чекбокс таблицы и форм — из мокапа "Этап 3 · Pack A - Tables & Nav". */
.eqc-cb {
  position: relative; display: inline-flex; cursor: pointer;
  align-items: center; gap: 8px; color: var(--ink-2); font-size: 13px;
}
.eqc-cb input { position: absolute; opacity: 0; pointer-events: none; }
.eqc-cb .eqc-cb__box {
  width: 16px; height: 16px; border: 1px solid var(--line-strong);
  background: var(--bg-elev); border-radius: var(--r-sm);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.eqc-cb.is-checked .eqc-cb__box,
.eqc-cb.is-indeterminate .eqc-cb__box {
  background: var(--accent); border-color: var(--accent);
}
.eqc-cb .eqc-cb__box svg {
  display: none; width: 10px; height: 10px;
  stroke: #fff; fill: none; stroke-width: 2.5;
  stroke-linecap: round; stroke-linejoin: round;
}
.eqc-cb.is-checked .eqc-cb__box svg { display: block; }
.eqc-cb.is-indeterminate .eqc-cb__box::after {
  content: ''; width: 8px; height: 2px; background: #fff; border-radius: 1px;
}
.eqc-cb.is-disabled { opacity: .5; cursor: not-allowed; }
.eqc-cb.is-disabled .eqc-cb__box { background: var(--bg-sunken); }

/* Универсальный бейдж статуса — из "Этап 3 - Core Components". */
.eqc-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 11px; line-height: 1; white-space: nowrap;
  border: 1px solid var(--line-strong);
  background: var(--bg-elev); color: var(--ink-2);
}
.eqc-badge__pip {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--ink-muted);
}
.eqc-badge--success {
  background: var(--green-50); color: var(--green-700); border-color: var(--green-200);
}
.eqc-badge--success .eqc-badge__pip { background: var(--green-500); }
.eqc-badge--warning {
  background: var(--warn-50); color: var(--warn-700); border-color: var(--warn-200);
}
.eqc-badge--warning .eqc-badge__pip { background: var(--warn-500); }
.eqc-badge--danger {
  background: var(--danger-50); color: var(--danger-700); border-color: var(--danger-200);
}
.eqc-badge--danger .eqc-badge__pip { background: var(--danger-500); }
.eqc-badge--info {
  background: var(--info-50); color: var(--info-700); border-color: var(--info-200);
}
.eqc-badge--info .eqc-badge__pip { background: var(--info-500); }

/* Wizard-каркас — из "Этап 5 · Patterns Pack 3". */
.eqc-wiz-shell {
  background: var(--bg-elev); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden;
  display: flex; flex-direction: column;
}
.eqc-wiz-head {
  padding: 18px 24px 16px; border-bottom: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;
}
.eqc-wiz-head__meta {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-muted); margin-bottom: 6px;
}
.eqc-wiz-head__title {
  margin: 0; font-size: 20px; line-height: 26px;
  font-weight: 600; letter-spacing: -0.01em;
}
.eqc-wiz-head__sub {
  font-size: 13px; color: var(--ink-muted); margin-top: 4px; line-height: 18px;
}
.eqc-wiz-head__close {
  background: transparent; border: 0; width: 32px; height: 32px;
  color: var(--ink-muted); cursor: pointer; border-radius: var(--r-sm);
  display: flex; align-items: center; justify-content: center;
}
.eqc-wiz-head__close:hover { background: var(--bg-sunken); color: var(--ink-2); }

/* Степпер шагов wizard. */
.eqc-steps-bar {
  padding: 16px 24px; background: var(--bg-sunken);
  border-bottom: 1px solid var(--line);
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0; align-items: center; position: relative;
}
.eqc-step-cell {
  display: flex; flex-direction: column; gap: 4px;
  position: relative; padding-right: 18px;
}
.eqc-step-cell:last-child { padding-right: 0; }
.eqc-step-cell__row { display: flex; align-items: center; gap: 8px; }
.eqc-step-cell__num {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--bg-elev); border: 1px solid var(--line-strong);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted);
  font-weight: 500; flex-shrink: 0; z-index: 2;
}
.eqc-step-cell__line {
  flex: 1; height: 1px; background: var(--line-strong);
  margin-right: 4px; z-index: 1;
}
.eqc-step-cell:last-child .eqc-step-cell__line { display: none; }
.eqc-step-cell.is-done .eqc-step-cell__num {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
.eqc-step-cell.is-done .eqc-step-cell__num::before {
  content: ''; width: 10px; height: 10px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m3.5 8.5 3 3 6-6' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
}
.eqc-step-cell.is-done .eqc-step-cell__num > span { display: none; }
.eqc-step-cell.is-done .eqc-step-cell__line { background: var(--accent); }
.eqc-step-cell.is-active .eqc-step-cell__num {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
.eqc-step-cell__label {
  font-size: 13px; color: var(--ink-muted);
  padding-left: 30px; line-height: 18px;
}
.eqc-step-cell.is-active .eqc-step-cell__label,
.eqc-step-cell.is-done .eqc-step-cell__label { color: var(--ink-2); }
.eqc-step-cell.is-active .eqc-step-cell__label { color: var(--ink); font-weight: 500; }
.eqc-step-cell__sub {
  font-size: 11px; color: var(--ink-faint); font-family: var(--font-mono);
  margin-top: 1px; text-transform: uppercase; letter-spacing: .04em;
  padding-left: 30px;
}

/* Тело и футер wizard. */
.eqc-wiz-body { padding: 28px 32px; display: flex; flex-direction: column; gap: 18px; }
.eqc-wiz-foot {
  padding: 14px 24px; border-top: 1px solid var(--line);
  background: var(--bg-sunken);
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.eqc-wiz-foot__group { display: flex; gap: 8px; align-items: center; }

/* Drop-zone для CSV-файла — из "Этап 5 · Patterns Pack 3". */
.eqc-drop-zone {
  border: 1.5px dashed var(--line-strong); border-radius: var(--r-md);
  padding: 32px; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 10px;
  background: var(--bg-sunken); text-align: center;
  transition: border-color .15s, background .15s;
}
.eqc-drop-zone.is-drag { border-color: var(--accent); background: var(--green-50); }
.eqc-drop-zone__ico {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--bg-elev); border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  color: var(--ink-muted);
}
.eqc-drop-zone__title { font-size: 14px; font-weight: 500; color: var(--ink-2); }
.eqc-drop-zone__hint { font-size: 12px; color: var(--ink-muted); }
.eqc-drop-zone input[type="file"] { display: none; }

/* Карточка выбранного файла после загрузки. */
.eqc-csv-file {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 12px 14px; border: 1px solid var(--line);
  border-radius: var(--r-md); background: var(--bg-elev);
}
.eqc-csv-file__ico {
  width: 32px; height: 32px; border-radius: var(--r-sm);
  background: var(--green-50); color: var(--green-700);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.eqc-csv-file__body { font-size: 13px; flex: 1; min-width: 0; }
.eqc-csv-file__name { font-weight: 500; color: var(--ink); }
.eqc-csv-file__info { font-size: 11px; color: var(--ink-muted); margin-top: 2px; }
.eqc-csv-file__clear {
  background: none; border: 0; cursor: pointer; padding: 4px;
  color: var(--ink-muted); border-radius: var(--r-sm);
}
.eqc-csv-file__clear:hover { color: var(--ink); background: var(--bg-sunken); }

/* Маппинг-таблица CSV → справочник. */
.eqc-map-tbl {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-md);
  overflow: hidden; font-size: 13px; background: var(--bg-elev);
}
.eqc-map-tbl__head {
  display: grid; grid-template-columns: 1fr 24px 1fr 100px;
  gap: 12px; align-items: center; padding: 10px 14px;
  background: var(--bg-sunken); border-bottom: 1px solid var(--line);
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-muted); font-weight: 500;
}
.eqc-map-tbl__row {
  display: grid; grid-template-columns: 1fr 24px 1fr 100px;
  gap: 12px; align-items: center; padding: 8px 14px;
  border-top: 1px solid var(--line);
}
.eqc-map-tbl__row:first-of-type { border-top: none; }
.eqc-map-tbl__src { color: var(--ink); }
.eqc-map-tbl__src-key { font-family: var(--font-mono); color: var(--ink-muted); margin-right: 4px; }
.eqc-map-tbl__arr { color: var(--ink-muted); display: flex; justify-content: center; }
.eqc-map-tbl__dst select {
  width: 100%; border: 1px solid var(--line-strong); border-radius: var(--r-sm);
  background: var(--bg-elev); padding: 5px 8px; font: inherit; color: var(--ink);
}
.eqc-map-tbl__status {
  text-align: right; font-size: 11px; color: var(--ink-muted);
  font-family: var(--font-mono);
}
.eqc-map-tbl__status--ok { color: var(--green-700); }
.eqc-map-tbl__status--warn { color: var(--warn-700); }
.eqc-map-tbl__status--skip { color: var(--ink-faint); }

/* Preview-таблица первых N строк CSV. */
.eqc-csv-preview {
  width: 100%; border: 1px solid var(--line); border-radius: var(--r-md);
  font-size: 12px; overflow: hidden; background: var(--bg-elev);
}
.eqc-csv-preview table { width: 100%; border-collapse: collapse; }
.eqc-csv-preview th, .eqc-csv-preview td {
  padding: 6px 10px; border-bottom: 1px solid var(--line);
  text-align: left; vertical-align: top;
}
.eqc-csv-preview th {
  background: var(--bg-sunken); font-family: var(--font-mono); font-size: 10px;
  letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); font-weight: 500;
}
.eqc-csv-preview tr:last-child td { border-bottom: 0; }

/* Fieldset «Сопоставление дублей по полям» — multi-select чекбоксы. */
.eqc-match-fields {
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 14px 16px; display: flex; flex-direction: column; gap: 8px;
  background: var(--bg-elev);
}
.eqc-match-fields__title {
  font-size: 13px; font-weight: 500; color: var(--ink); margin: 0 0 4px 0;
}
.eqc-match-fields__hint { font-size: 12px; color: var(--ink-muted); }
.eqc-match-fields__err { font-size: 12px; color: var(--danger-700); }

/* Сводка результата импорта — 3 карточки created/skipped/error. */
.eqc-csv-summary {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
}
.eqc-csv-summary__card {
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 12px 14px; background: var(--bg-elev);
}
.eqc-csv-summary__num {
  font-size: 24px; font-weight: 600; line-height: 1;
  font-variant-numeric: tabular-nums; color: var(--ink);
}
.eqc-csv-summary__lbl {
  font-size: 11px; color: var(--ink-muted); margin-top: 6px;
  text-transform: uppercase; letter-spacing: .04em; font-family: var(--font-mono);
}
.eqc-csv-summary__card--success .eqc-csv-summary__num { color: var(--green-700); }
.eqc-csv-summary__card--warning .eqc-csv-summary__num { color: var(--warn-700); }
.eqc-csv-summary__card--danger .eqc-csv-summary__num { color: var(--danger-700); }

/* Таблица результатов импорта — скролл если много строк. */
.eqc-csv-results {
  max-height: 360px; overflow-y: auto;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--bg-elev);
}
.eqc-csv-results table { width: 100%; border-collapse: collapse; font-size: 13px; }
.eqc-csv-results th, .eqc-csv-results td {
  padding: 8px 12px; border-bottom: 1px solid var(--line);
  text-align: left; vertical-align: top;
}
.eqc-csv-results th {
  background: var(--bg-sunken); font-family: var(--font-mono); font-size: 10px;
  letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted);
  font-weight: 500; position: sticky; top: 0;
}
.eqc-csv-results tr:last-child td { border-bottom: 0; }
.eqc-csv-results__msg { color: var(--ink-muted); font-size: 12px; }

/* Узкие экраны — wizard, сводка и маппинг ужимаются в одну колонку. */
@media (max-width: 768px) {
  .eqc-wiz-body { padding: 20px 18px; }
  .eqc-wiz-head { padding: 16px 18px 12px; }
  .eqc-wiz-foot { padding: 12px 18px; }
  .eqc-steps-bar { padding: 12px 18px; grid-template-columns: 1fr; gap: 6px; }
  .eqc-step-cell { padding-right: 0; }
  .eqc-step-cell__line { display: none; }
  .eqc-csv-summary { grid-template-columns: 1fr; }
  .eqc-map-tbl__head, .eqc-map-tbl__row {
    grid-template-columns: 1fr; gap: 6px;
  }
  .eqc-map-tbl__arr { display: none; }
  .eqc-map-tbl__status { text-align: left; }
}

/* ===== Перенос файлов в S3 (tz-storage-settings-ui, Фаза 4) ===== */
.eqc-stmig__hint { color: var(--ink-muted); font-size: 13px; margin: 0 0 14px; }
.eqc-stmig__opt {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--ink); margin: 0 0 14px;
}
.eqc-stmig__bar {
  height: 10px; border-radius: 999px; background: var(--surface-2, #eef1f5);
  overflow: hidden; margin: 4px 0 10px;
}
.eqc-stmig__fill {
  height: 100%; border-radius: 999px; background: var(--accent, #2563eb);
  transition: width .4s ease;
}
.eqc-stmig__counts {
  display: flex; flex-wrap: wrap; gap: 16px;
  font-size: 13px; color: var(--ink-muted); margin-top: 8px;
}
.eqc-stmig__counts b { color: var(--ink); font-weight: 600; }
.eqc-stmig__status { font-size: 13px; color: var(--ink-muted); margin: 0 0 8px; }