/* static/css/main.css */

/* ═══════════════════════════════════════════════════════════════════
   CSS ПЕРЕМЕННЫЕ
   ═══════════════════════════════════════════════════════════════════ */
:root {
  /* Бренд */
  --color-primary:#1e3a5f; --color-primary-light:#2d5a9e; --color-primary-dark:#142840;
  --color-primary-50:#eff6ff; --color-primary-100:#dbeafe;
  --color-accent:#0ea5e9; --color-accent-hover:#0284c7; --color-accent-50:#f0f9ff;

  /* Slate */
  --color-slate-50:#f8fafc; --color-slate-100:#f1f5f9; --color-slate-200:#e2e8f0;
  --color-slate-300:#cbd5e1; --color-slate-400:#94a3b8; --color-slate-500:#64748b;
  --color-slate-600:#475569; --color-slate-700:#334155; --color-slate-800:#1e293b;
  --color-slate-900:#0f172a;

  /* Доменные цвета */
  --color-preparation:#f59e0b; --color-submitted:#3b82f6; --color-won:#0891b2;
  --color-contract:#1d4ed8; --color-execution:#f97316; --color-closed:#16a34a;
  --color-lost:#ef4444; --color-declined:#6b7280; --color-delivery:#f97316;
  --color-acceptance:#10b981; --color-payment:#eab308;

  /* Уровни доступа */
  --level-admin:#7c3aed; --level-employee:#0284c7; --level-observer:#64748b;

  /* Тренды */
  --color-trend-up:#16a34a; --color-trend-down:#dc2626; --color-trend-neutral:#64748b;

  /* Layout */
  --sidebar-width:240px; --sidebar-collapsed:64px; --navbar-height:56px;

  /* Радиусы */
  --radius-xs:4px; --radius-sm:6px; --radius:10px; --radius-lg:16px; --radius-xl:20px; --radius-full:9999px;

  /* Тени */
  --shadow-xs:0 1px 2px rgba(0,0,0,.05);
  --shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --shadow-md:0 4px 6px -1px rgba(0,0,0,.07),0 2px 4px -2px rgba(0,0,0,.05);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.08),0 4px 6px -4px rgba(0,0,0,.04);
  --shadow-xl:0 20px 25px -5px rgba(0,0,0,.08),0 8px 10px -6px rgba(0,0,0,.04);
  --shadow-glow-primary:0 0 20px rgba(30,58,95,.15);
  --shadow-glow-accent:0 0 20px rgba(14,165,233,.15);

  /* Анимации */
  --ease-out:cubic-bezier(.2,.8,.2,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --duration-fast:.15s; --duration-normal:.25s; --duration-slow:.4s;
  --transition:all var(--duration-normal) var(--ease-out);
  --transition-fast:all var(--duration-fast) var(--ease-out);
  --transition-spring:transform var(--duration-normal) var(--ease-spring);

  /* Ширины */
  --sticky-col-1-width:130px; --sticky-col-2-width:200px;
  --dates-col-w:130px;
}

/* ═══════════════════════════════════════════════════════════════════
   БАЗА & ГЛОБАЛЬНЫЕ УТИЛИТЫ
   ═══════════════════════════════════════════════════════════════════ */
*,*::before,*::after { box-sizing:border-box; }
html,body { height:100%; }

body {
  font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  font-size:14px; line-height:1.5; color:var(--color-slate-800); background:var(--color-slate-100);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeSpeed;
}
h1,h2,h3,h4,h5,h6 { text-rendering:optimizeLegibility; }

::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--color-slate-300); border-radius:var(--radius-full); }
::-webkit-scrollbar-thumb:hover { background:var(--color-slate-400); }

:focus-visible { outline:2px solid var(--color-accent); outline-offset:2px; border-radius:var(--radius-xs); }
::selection { background:var(--color-primary-100); color:var(--color-primary); }

.min-width-0 { min-width:0; }
.font-monospace { font-family:'JetBrains Mono','Courier New',Courier,monospace; }
.opacity-60 { opacity:.6; }
[x-cloak] { display:none !important; }

/* Утилиты */
.cursor-pointer { cursor: pointer !important; }
.cursor-default { cursor: default !important; }
.bg-primary-subtle { background-color:#dbeafe !important; }
.text-primary { color:#1e40af !important; }
.border-primary { border-color:#3b82f6 !important; }
.bg-info-accent { background-color:#0ea5e9 !important; }
.font-size-10 { font-size: 10px !important; }
.font-size-11 { font-size: 11px !important; }
.font-size-12 { font-size: 12px !important; }

/* Единый HTMX индикатор загрузки */
.htmx-indicator { display: none !important; }
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator { display: block !important; }
#calendar-day-details-body.htmx-request,
.table-loading-overlay.htmx-request { opacity: 0.3; pointer-events: none; }

/* ═══════════════════════════════════════════════════════════════════
   АВТОРИЗАЦИЯ (LOGIN & SELECT ORG) - СОВРЕМЕННАЯ ВЕРСИЯ С ШАРАМИ
   ═══════════════════════════════════════════════════════════════════ */
.login-page {
    position: relative;
    min-height: 100vh;
    background-color: #f1f5f9;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Анимированный фон (шары) */
.login-bg-decor {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}

.decor-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    animation: floatCircles 20s infinite ease-in-out alternate;
}

.decor-circle-1 { width: 500px; height: 500px; background: #93c5fd; top: -10%; left: -10%; animation-delay: 0s; }
.decor-circle-2 { width: 600px; height: 600px; background: #c4b5fd; bottom: -20%; right: -10%; animation-delay: -5s; }
.decor-circle-3 { width: 400px; height: 400px; background: #a5b4fc; top: 40%; left: 40%; animation-delay: -10s; }

@keyframes floatCircles {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, 60px) scale(1.15); }
}

/* Карточка входа */
.login-wrapper {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 20px;
}

.login-card {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 1);
    border-radius: 24px;
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.15), 0 0 0 1px rgba(226, 232, 240, 0.6);
    overflow: hidden;
}

.login-logo-wrap {
    display: inline-flex; align-items: center; justify-content: center;
    width: 68px; height: 68px; background: #ffffff; border-radius: 20px;
    box-shadow: 0 10px 20px rgba(45, 90, 158, 0.1), inset 0 0 0 1px #e2e8f0;
    margin-bottom: 24px;
}
.login-logo-wrap svg { width: 38px; height: 38px; }

/* Инпуты */
.login-input {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    font-size: 15px !important;
    font-weight: 500;
    transition: all 0.2s ease !important;
}
.login-input:focus {
    background: #ffffff !important;
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15) !important;
}

/* Группа для пароля (Четкое разделение поля и глазика) */
.login-input-group {
    display: flex;
    align-items: stretch;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.2s ease;
}
.login-input-group:focus-within {
    background: #ffffff;
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15);
}
.login-input-group .login-input {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    flex: 1;
}
.login-eye-btn {
    display: flex; align-items: center; justify-content: center;
    border: none; background: #f1f5f9; 
    border-left: 1px solid #e2e8f0; 
    color: #64748b; padding: 0 18px; cursor: pointer; transition: all 0.2s ease;
}
.login-eye-btn:hover { background: #e2e8f0; color: #0f172a; }

/* Кнопка входа */
.login-btn {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    border: none; border-radius: 12px; padding: 14px; font-size: 15.5px; font-weight: 700; color: #ffffff;
    box-shadow: 0 8px 16px -4px rgba(45, 90, 158, 0.4); transition: all 0.2s ease;
}
.login-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 20px -4px rgba(45, 90, 158, 0.5); color: #fff; }
.login-btn:active { transform: translateY(0); box-shadow: 0 4px 8px -2px rgba(45, 90, 158, 0.4); }

/* ═══════════════════════════════════════════════════════════════════
   УНИВЕРСАЛЬНАЯ КАРТОЧКА СПРАВОЧНИКОВ (Юрлица, Сотрудники, Поставщики)
   ═══════════════════════════════════════════════════════════════════ */
.dir-card {
    display: flex; flex-direction: column; height: 100%;
    background: #ffffff; border: 1px solid #e2e8f0; border-radius: 16px;
    padding: 16px 20px; text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.dir-card:hover { 
    transform: translateY(-2px); 
    box-shadow: 0 10px 25px -5px rgba(15,23,42,0.08); 
    border-color: #cbd5e1; 
}
.dir-card--inactive { opacity: 0.7; background: #f8fafc; filter: grayscale(40%); }
.dir-card--inactive:hover { opacity: 1; filter: none; }

.dir-card__header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.dir-card__avatar {
    width: 46px; height: 46px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px; font-weight: 700; border-radius: 12px;
}
.dir-card__avatar--indigo { background: #e0e7ff; color: #4f46e5; border: 1px solid #c7d2fe; }
.dir-card__avatar--blue   { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
.dir-card__avatar--green  { background: #f0fdf4; color: #16a34a; border: 1px solid #bbf7d0; }

.dir-card__title-wrap { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding-top: 2px; }
.dir-card__title-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dir-card__name { font-size: 15px; font-weight: 700; color: #0f172a; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.dir-badge {
    display: inline-flex; align-items: center; padding: 2px 8px; font-size: 10px; font-weight: 700;
    border-radius: 20px; white-space: nowrap; flex-shrink: 0; letter-spacing: 0.3px; text-transform: uppercase;
}
.dir-badge--success { background: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.dir-badge--primary { background: #dbeafe; color: #1d4ed8; border: 1px solid #bfdbfe; }
.dir-badge--neutral { background: #f1f5f9; color: #64748b; border: 1px solid #e2e8f0; }

.dir-card__body { flex: 1; display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; color: #475569; margin-bottom: 16px; }

/* ИСПРАВЛЕНИЕ: Выравнивание иконки строго по центру строки */
.dir-card__meta-item { display: flex; align-items: center; gap: 8px; line-height: 1.4; }
.dir-card__meta-item i { color: #94a3b8; font-size: 13px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; margin: 0; }

.dir-card__meta-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }

/* ИСПРАВЛЕНИЕ: Фиксированная минимальная высота подвала для ровной линии */
.dir-card__footer { 
    display: flex; align-items: center; justify-content: space-between; gap: 12px; 
    padding-top: 14px; border-top: 1px solid #f1f5f9; margin-top: auto; 
    min-height: 49px; 
}

.dir-card__contacts { display: flex; align-items: center; gap: 6px; }

.dir-btn-icon {
    width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center;
    border-radius: 8px; font-size: 15px; text-decoration: none; border: none; cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease;
}
.dir-btn-icon:hover { transform: translateY(-2px); }
.dir-btn-icon--phone { background: #f0fdf4; color: #16a34a; }
.dir-btn-icon--phone:hover { background: #dcfce7; }
.dir-btn-icon--email { background: #eff6ff; color: #2563eb; }
.dir-btn-icon--email:hover { background: #dbeafe; }
.dir-btn-icon--web   { background: #f5f3ff; color: #7c3aed; }
.dir-btn-icon--web:hover { background: #ede9fe; }
.dir-btn-icon--wa    { background: #dcfce7; color: #15803d; }
.dir-btn-icon--wa:hover { background: #bbf7d0; }
.dir-btn-icon--gray  { background: #f8fafc; color: #64748b; border: 1px solid #e2e8f0; }
.dir-btn-icon--gray:hover { background: #f1f5f9; color: #334155; }
.dir-btn-icon--danger{ background: #f8fafc; color: #64748b; border: 1px solid #e2e8f0; }
.dir-btn-icon--danger:hover { background: #fef2f2; color: #dc2626; border-color: #fecaca; }

.dir-btn-text {
    display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; font-size: 12.5px; font-weight: 600;
    color: #475569; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; text-decoration: none; 
    transition: all 0.2s ease; white-space: nowrap;
}
.dir-btn-text:hover { color: #0f172a; background: #f1f5f9; border-color: #cbd5e1; }


/* ═══════════════════════════════════════════════════════════════════
   НАВБАР
   ═══════════════════════════════════════════════════════════════════ */
.app-navbar {
  position:fixed; top:0; left:0; right:0; z-index:1030; height:var(--navbar-height);
  background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-light) 100%);
  box-shadow:0 1px 3px rgba(0,0,0,.12),0 4px 12px rgba(0,0,0,.08),inset 0 -1px 0 rgba(255,255,255,.06);
}

.brand-icon {
  width:34px; height:34px; flex-shrink:0; font-size:16px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius-sm);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-spring);
}
.brand-icon:hover { background:rgba(255,255,255,.25); transform:scale(1.05); }
.brand-text { font-size:15px; font-weight:700; letter-spacing:-.3px; white-space:nowrap; }

.btn-accent {
  border:none; color:#fff; background:var(--color-accent); box-shadow:0 2px 8px rgba(14,165,233,.3);
  transition:background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-spring);
}
.btn-accent:hover { color:#fff; background:var(--color-accent-hover); transform:translateY(-1px); box-shadow:0 4px 12px rgba(14,165,233,.4); }
.btn-accent:active { transform:translateY(0); }

.navbar-search-wrap { align-items:center; }
.navbar-search-group {
  overflow:hidden; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.15);
  transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}
.navbar-search-group:focus-within {
  background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.35);
  box-shadow:0 0 0 3px rgba(255,255,255,.08);
}
.navbar-search-icon { padding:0 8px 0 10px; color:rgba(255,255,255,.6) !important; background:transparent !important; border:none !important; }
.navbar-search-input {
  padding:7px 8px !important; font-size:13px !important; color:#fff !important;
  background:transparent !important; border:none !important; box-shadow:none !important;
}
.navbar-search-input::placeholder { color:rgba(255,255,255,.45) !important; }
.navbar-search-input:focus { box-shadow:none !important; }
.navbar-search-clear {
  display:flex; align-items:center; padding:0 10px; font-size:11px; color:rgba(255,255,255,.5);
  text-decoration:none; background:transparent; border:none; cursor:pointer; transition:color var(--duration-fast);
}
.navbar-search-clear:hover { color:rgba(255,255,255,.9); }

.navbar-mobile-toggle {
  width:36px; height:36px; padding:0; flex-shrink:0; font-size:18px; color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-sm);
  transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-spring);
}
.navbar-mobile-toggle:hover { background:rgba(255,255,255,.2); }
.navbar-mobile-toggle:active { background:rgba(255,255,255,.25); transform:scale(.95); }

.navbar-divider { width:1px; height:28px; margin:0 4px; flex-shrink:0; background:rgba(255,255,255,.15); }

.navbar-org-btn {
  display:flex; align-items:center; gap:6px; max-width:220px; padding:6px 10px; color:#fff; cursor:pointer; white-space:nowrap;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-sm);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.navbar-org-btn:hover { background:rgba(255,255,255,.2); }
.navbar-org-btn:active { background:rgba(255,255,255,.25); }
.navbar-org-icon { flex-shrink:0; font-size:14px; color:#fbbf24; }
.navbar-org-name { max-width:160px; overflow:hidden; text-overflow:ellipsis; font-size:12px; font-weight:500; }

.navbar-chevron { flex-shrink:0; font-size:10px; opacity:.6; transition:transform var(--duration-normal) var(--ease-out); }
.show > .navbar-org-btn .navbar-chevron,
.show > .navbar-user-btn .navbar-chevron { transform:rotate(180deg); }

.navbar-user-btn {
  display:flex; align-items:center; gap:10px; padding:5px 10px 5px 5px; color:#fff; cursor:pointer; text-align:left;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius);
  transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);
}
.navbar-user-btn:hover { background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.2); }
.navbar-user-btn:active { background:rgba(255,255,255,.22); }

.navbar-avatar-wrap { position:relative; flex-shrink:0; }
.navbar-online-dot {
  position:absolute; right:0; bottom:0; width:9px; height:9px; border-radius:50%;
  background:#22c55e; border:2px solid var(--color-primary);
  animation:onlinePulse 3s ease-in-out infinite;
}

.navbar-user-info { min-width:0; gap:1px; }
.navbar-user-name {
  display:block; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:13px; font-weight:600; line-height:1.3; color:#fff;
}
.navbar-user-meta {
  display:block; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:10.5px; font-weight:400; line-height:1.2; color:rgba(255,255,255,.6);
}

/* ═══════════════════════════════════════════════════════════════════
   LAYOUT — САЙДБАР / КОНТЕНТ
   ═══════════════════════════════════════════════════════════════════ */
.app-container { display:flex; min-height:100vh; padding-top:var(--navbar-height); }
.app-container.preload .app-sidebar,
.app-container.preload .app-main { transition:none !important; }

.app-sidebar {
  position:fixed; top:var(--navbar-height); left:0; bottom:0; z-index:100;
  width:var(--sidebar-width); overflow-x:hidden; overflow-y:auto; display:flex; flex-direction:column;
  background:#fff; border-right:1px solid var(--color-slate-200); box-shadow:1px 0 4px rgba(0,0,0,.03);
  transition:width var(--duration-normal) var(--ease-out);
}

.app-main {
  flex:1; min-width:0; max-width:100%; margin-left:var(--sidebar-width); padding:24px 28px;
  transition:margin-left var(--duration-normal) var(--ease-out);
}

.sidebar-collapsed .app-sidebar { width:var(--sidebar-collapsed); }
.sidebar-collapsed .app-main { margin-left:var(--sidebar-collapsed); }
.sidebar-collapsed .sidebar-section-label { opacity:0; pointer-events:none; }
.sidebar-collapsed .sidebar-nav .sidebar-link span:not(.status-dot) { display:none; }
.sidebar-collapsed .sidebar-soon-badge,
.sidebar-collapsed .sidebar-footer-text,
.sidebar-collapsed .sidebar-expand-btn { display:none; }
.sidebar-collapsed .sidebar-submenu { display:none !important; }
.sidebar-collapsed .sidebar-link { justify-content:center; padding:10px 0; }
.sidebar-collapsed .sidebar-link i { width:auto; margin:0; font-size:18px; }
.sidebar-collapsed .sidebar-collapse-btn:active,
.sidebar-collapsed .sidebar-collapse-btn:hover,
.sidebar-collapsed .sidebar-link:hover,
.sidebar-collapsed .sidebar-link:active,
.sidebar-collapsed .collapse-btn-icon { transform:none !important; }
.sidebar-collapsed .sidebar-link { transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out); }

/* САЙДБАР — МЕНЮ И КНОПКА СВОРАЧИВАНИЯ */
.sidebar-nav { flex:1; padding:16px 0; }
.sidebar-section-label {
  padding:0 16px; margin-bottom:6px; overflow:hidden; white-space:nowrap;
  font-size:10px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:var(--color-slate-400);
  transition:opacity var(--duration-normal);
}
.sidebar-menu { margin:0; padding:0 8px; }

.sidebar-link {
  position:relative; display:flex; align-items:center; gap:10px; min-height:38px; padding:9px 12px;
  overflow:hidden; white-space:nowrap; text-decoration:none; font-weight:500; color:var(--color-slate-600);
  border-radius:var(--radius-sm);
  transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.sidebar-link i {
  width:20px; flex-shrink:0; text-align:center; font-size:16px;
  transition:color var(--duration-fast);
}
.sidebar-link:hover { color:var(--color-primary); background:var(--color-slate-50); }
.sidebar-link.active {
  color:var(--color-primary-light); font-weight:600;
  background:linear-gradient(135deg,var(--color-primary-50),var(--color-primary-100));
  box-shadow:inset 3px 0 0 var(--color-primary-light);
}
.sidebar-link.active i { color:var(--color-primary-light); }
.sidebar-link-sm { min-height:34px; padding:7px 12px; font-size:12.5px; }

.sidebar-footer { display:flex; flex-direction:column; margin-top:auto; padding:8px 0 0; border-top:1px solid var(--color-slate-100); }
.sidebar-footer-text {
  padding:4px 8px 6px; overflow:hidden; white-space:nowrap; text-align:center;
  font-size:11px; color:var(--color-slate-400);
  transition:opacity var(--duration-normal);
}

.sidebar-soon-badge {
  margin-left:auto; padding:1px 6px; flex-shrink:0; white-space:nowrap;
  font-size:9px; font-weight:600; letter-spacing:.4px; text-transform:uppercase;
  color:var(--color-accent); background:var(--color-accent-50); border:1px solid rgba(14,165,233,.2); border-radius:var(--radius-full);
}
.sidebar-stub { opacity:.5; cursor:not-allowed !important; pointer-events:none; user-select:none; }

.sidebar-collapse-btn {
  display:flex; align-items:center; gap:8px; width:calc(100% - 16px); margin:0 8px 8px; padding:8px 10px;
  overflow:hidden; white-space:nowrap; flex-shrink:0; text-align:left; cursor:pointer;
  background:transparent; border:1px solid transparent; border-radius:var(--radius-sm); color:var(--color-slate-500);
  font-size:13px; font-weight:500;
  transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.sidebar-collapse-btn:hover { color:var(--color-primary); background:var(--color-slate-100); border-color:var(--color-slate-200); }
.sidebar-collapse-btn:active { background:var(--color-primary-50); transform:scale(.98); }

.collapse-btn-icon {
  width:28px; height:28px; flex-shrink:0; font-size:11px; color:var(--color-slate-600);
  display:flex; align-items:center; justify-content:center;
  background:var(--color-slate-100); border:1px solid var(--color-slate-200); border-radius:var(--radius-sm);
  transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.sidebar-collapse-btn:hover .collapse-btn-icon { color:var(--color-primary-light); background:var(--color-primary-50); border-color:var(--color-primary-100); }

.collapse-btn-label {
  overflow:hidden; white-space:nowrap;
  font-size:12.5px; font-weight:500; color:var(--color-slate-500);
  transition:opacity var(--duration-fast);
}
.collapse-chevron { transition:transform var(--duration-normal) var(--ease-out); }

.sidebar-collapsed .sidebar-collapse-btn { justify-content:center; padding:8px 0; }
.sidebar-collapsed .collapse-btn-label { display:none; }
.sidebar-collapsed .collapse-btn-icon { width:32px; height:32px; font-size:13px; }
.sidebar-collapsed .collapse-chevron { transform:rotate(180deg); }

/* PAGE HEADER / BREADCRUMBS */
.page-header { margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--color-slate-200); }
.page-title { margin:0; font-size:22px; font-weight:700; line-height:1.3; letter-spacing:-.3px; color:var(--color-slate-900); }
.breadcrumb { margin:0; font-size:12px; }
.breadcrumb-item + .breadcrumb-item::before { color:var(--color-slate-400); }
.breadcrumb a { color:var(--color-slate-500); transition:color var(--duration-fast); }
.breadcrumb a:hover { color:var(--color-primary-light); }

/* ═══════════════════════════════════════════════════════════════════
   BOOTSTRAP ПЕРЕОПРЕДЕЛЕНИЯ
   ═══════════════════════════════════════════════════════════════════ */
.card {
  border:1px solid rgba(0,0,0,.04) !important; border-radius:var(--radius) !important;
  box-shadow:var(--shadow-sm); transition:box-shadow var(--duration-normal) var(--ease-out);
}
.card-header { background:transparent !important; border-bottom:1px solid var(--color-slate-100) !important; }

.btn {
  letter-spacing:.1px; font-weight:500; border-radius:var(--radius-sm) !important;
  transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-spring) !important;
}
.btn:active { transform:scale(.97); }
.btn-primary {
  background:var(--color-primary-light) !important; border-color:var(--color-primary-light) !important; box-shadow:0 1px 3px rgba(45,90,158,.2);
}
.btn-primary:hover {
  background:var(--color-primary) !important; border-color:var(--color-primary) !important;
  transform:translateY(-1px); box-shadow:0 4px 12px rgba(45,90,158,.25);
}
.btn-outline-primary:hover { transform:translateY(-1px); box-shadow:0 2px 8px rgba(45,90,158,.15); }
.btn-outline-secondary:hover { transform:translateY(-1px); box-shadow:0 2px 8px rgba(100,116,139,.15); }
.btn-outline-danger:hover { box-shadow:0 2px 8px rgba(239,68,68,.15); }
.btn-outline-success:hover { box-shadow:0 2px 8px rgba(34,197,94,.15); }
.btn-outline-warning:hover { box-shadow:0 2px 8px rgba(245,158,11,.15); }

.form-control,
.form-select {
  padding:8px 12px; font-size:13.5px; border-color:var(--color-slate-200); border-radius:var(--radius-sm) !important;
  transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}
.form-control:focus,
.form-select:focus { border-color:var(--color-primary-light); box-shadow:0 0 0 3px rgba(45,90,158,.1),0 1px 2px rgba(0,0,0,.06); }
.form-control::placeholder { color:var(--color-slate-400); font-weight:400; }
.form-label { margin-bottom:4px; font-size:12.5px; font-weight:500; color:var(--color-slate-700); }
.form-check-input:checked { background-color:var(--color-primary-light); border-color:var(--color-primary-light); }

.progress { overflow:hidden; background:var(--color-slate-100); border-radius:var(--radius-full); }
.progress-bar { border-radius:var(--radius-full); transition:width var(--duration-slow) var(--ease-out); }
/* Поддержка CSS-переменной --w для progress-bar (устраняет ругань линтера) */
.progress-bar[style*="--w"] { width:var(--w,0%); }

.dropdown-menu {
  padding:4px; border:1px solid var(--color-slate-200) !important; border-radius:var(--radius) !important;
  box-shadow:var(--shadow-lg) !important; animation:fadeInUp var(--duration-fast) var(--ease-out);
}
.dropdown-item { padding:6px 12px; border-radius:var(--radius-sm); transition:background-color var(--duration-fast) var(--ease-out); }
.dropdown-item:hover { background:var(--color-slate-50); }

.toast {
  border-radius:var(--radius) !important; box-shadow:var(--shadow-lg) !important;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  animation:fadeInUp var(--duration-normal) var(--ease-out);
}
.modal-content { border-radius:var(--radius-lg) !important; }

.tooltip .tooltip-inner {
  max-width:280px; padding:6px 10px; text-align:left; line-height:1.5;
  font-size:12px; color:#fff; font-family:'Inter',system-ui,sans-serif;
  background:var(--color-slate-900); border-radius:var(--radius-sm); box-shadow:var(--shadow-lg);
}
.tooltip.bs-tooltip-top .tooltip-arrow::before { border-top-color:var(--color-slate-900); }
.tooltip.bs-tooltip-bottom .tooltip-arrow::before { border-bottom-color:var(--color-slate-900); }
.tooltip.bs-tooltip-start .tooltip-arrow::before { border-left-color:var(--color-slate-900); }
.tooltip.bs-tooltip-end .tooltip-arrow::before { border-right-color:var(--color-slate-900); }

/* ════════════════════════════════════════════════════════════════
   SaaS KPI CARDS
   ════════════════════════════════════════════════════════════════ */
.saas-kpi-card {
    padding: 20px 24px;
    border-radius: 12px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    text-decoration: none !important;
}

.saas-kpi-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
}

/* Модификаторы фона всей карточки */
.saas-kpi-card--white  { background-color: #ffffff; border: 1px solid #e2e8f0; box-shadow: 0 1px 3px rgba(15,23,42,0.04); }
.saas-kpi-card--gray   { background-color: #f8fafc; border: 1px solid #e2e8f0; }
.saas-kpi-card--yellow { background-color: #fefce8; border: 1px solid #fde68a; } 
.saas-kpi-card--purple { background-color: #f5f3ff; border: 1px solid #ede9fe; } 
.saas-kpi-card--green  { background-color: #f0fdf4; border: 1px solid #bbf7d0; }
.saas-kpi-card--red    { background-color: #fef2f2; border: 1px solid #fecaca; }
.saas-kpi-card--blue   { background-color: #eff6ff; border: 1px solid #bfdbfe; }

/* Шапка: Иконка + Цифра */
.saas-kpi-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

/* Квадратик с иконкой и заливкой */
.saas-kpi-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}

/* Цвета заливки иконок */
.kpi-icon-blue { background: #dbeafe; color: #1d4ed8; }
.kpi-icon-green { background: #dcfce7; color: #15803d; }
.kpi-icon-teal { background: #ccfbf1; color: #0f766e; }
.kpi-icon-purple { background: #ede9fe; color: #6d28d9; }
.kpi-icon-orange { background: #ffedd5; color: #c2410c; }
.kpi-icon-red { background: #fee2e2; color: #b91c1c; }
.kpi-icon-yellow { background: #fef9c3; color: #a16207; }
.kpi-icon-indigo { background: #e0e7ff; color: #4338ca; }

/* Огромная цифра */
.saas-kpi-value {
    font-size: 22px;
    font-weight: 800;
    color: #0f172a;
    line-height: 1;
    margin: 0;
    letter-spacing: -1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.saas-kpi-suffix {
    font-size: 16px;
    font-weight: 500;
    color: #64748b;
    margin-left: 4px;
}

/* Блок с текстами */
.saas-kpi-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Заголовок (UPPERCASE) */
.saas-kpi-title {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Подзаголовок */
.saas-kpi-subtitle {
    font-size: 12px;
    color: #94a3b8;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.badge-trend { padding: 3px 8px; font-size: 11px; }

@media (max-width: 575.98px) {
    .saas-kpi-card { padding: 16px; }
    .saas-kpi-header { margin-bottom: 12px; gap: 12px; }
    .saas-kpi-icon { width: 38px; height: 38px; font-size: 18px; }
    .saas-kpi-value { font-size: 24px; }
    .saas-kpi-suffix { font-size: 14px; }
    .saas-kpi-title { font-size: 11px; }
    .saas-kpi-subtitle { font-size: 11px; }
}

/* ═══════════════════════════════════════════════════════════════════
   ПЕРЕКЛЮЧАТЕЛЬ ПЕРИОДОВ ДАШБОРДОВ (v19.3)
   ═══════════════════════════════════════════════════════════════════ */
.period-switcher {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    background: #ffffff;
    border: 1px solid var(--color-slate-200);
    border-radius: var(--radius);
    padding: 8px 14px;
    margin-bottom: 20px;
    box-shadow: var(--shadow-sm);
}

.period-switcher-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 700;
    color: var(--color-slate-500);
    text-transform: uppercase;
    letter-spacing: .5px;
    white-space: nowrap;
}
.period-switcher-label i { font-size: 14px; color: var(--color-primary-light); }

.period-switcher-group {
    display: inline-flex;
    gap: 2px;
    background: var(--color-slate-100);
    border-radius: var(--radius-sm);
    padding: 3px;
}

.period-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-slate-600);
    text-decoration: none;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--radius-xs);
    transition: var(--transition-fast);
    white-space: nowrap;
    cursor: pointer;
}
.period-btn:hover { background: #ffffff; color: var(--color-primary-light); box-shadow: var(--shadow-xs); }

.period-btn--active {
    background: var(--color-primary-light) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(45,90,158,.25) !important;
}

.period-btn--dropdown {
    background: var(--color-slate-50);
    border-color: var(--color-slate-200);
}
.period-btn--dropdown:hover { background: #fff; border-color: var(--color-slate-300); }

/* Составная плашка активного фильтра (Кнопка + Крестик) */
.period-btn-pill {
    display: inline-flex;
    align-items: stretch;
    background: var(--color-primary-light);
    color: #ffffff;
    border-radius: var(--radius-xs);
    box-shadow: 0 2px 6px rgba(45,90,158,.25);
    overflow: hidden;
}

.period-btn-pill-trigger {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px 6px 12px;
    font-size: 12.5px;
    font-weight: 600;
    color: #ffffff;
    background: transparent;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color var(--duration-fast) var(--ease-out);
}
.period-btn-pill-trigger:hover {
    background: rgba(255,255,255,.15);
}

.period-btn-pill-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    color: rgba(255,255,255,.8);
    font-size: 11px;
    line-height: 1;
    text-decoration: none;
    border-left: 1px solid rgba(255,255,255,.25);
    transition: var(--transition-fast);
}
.period-btn-pill-close:hover {
    color: #ffffff;
    background: rgba(239, 68, 68, .5);
}

.period-btn-label { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.period-btn-chevron { font-size: 9px; opacity: .7; margin-left: 2px; }

.period-dropdown-wrap { position: relative; }

.period-dropdown-menu {
    max-height: 320px;
    overflow-y: auto;
    min-width: 200px;
    margin-top: 4px !important;
}

.period-dropdown-header {
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: .5px;
    color: var(--color-slate-400) !important;
    padding: 6px 12px 4px !important;
}

.period-custom-menu {
    min-width: 250px;
    margin-top: 4px !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow-lg) !important;
}

.period-custom-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-slate-800);
    margin-bottom: 10px;
}
.period-custom-label {
    font-size: 11px !important;
    color: var(--color-slate-500) !important;
    margin-bottom: 2px !important;
}
.period-date-input {
    font-size: 13px !important;
    padding: 6px 10px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   ДАШБОРД УТИЛИТЫ
   ═══════════════════════════════════════════════════════════════════ */
.dashboard-nav {
  display:flex; align-items:center; flex-wrap:wrap; gap:4px; margin-bottom:24px; padding:4px;
  background:#fff; border:1px solid var(--color-slate-200); border-radius:var(--radius); box-shadow:var(--shadow-sm);
}
.dashboard-nav-link {
  display:inline-flex; align-items:center; gap:6px; padding:8px 16px; white-space:nowrap;
  font-size:13px; font-weight:500; text-decoration:none; color:var(--color-slate-600); border-radius:var(--radius-sm);
  transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);
}
.dashboard-nav-link:hover { color:var(--color-primary-light); background:var(--color-slate-50); }
.dashboard-nav-link.active { color:#fff; background:var(--color-primary-light); box-shadow:0 2px 8px rgba(45,90,158,.25); }
.dashboard-nav-link i { font-size:14px; }

.analytics-section {
  overflow:hidden; margin-bottom:20px; background:#fff;
  border:1px solid rgba(0,0,0,.04); border-radius:var(--radius); box-shadow:var(--shadow-sm);
}
.analytics-section-header {
  display:flex; align-items:center; justify-content:space-between; padding:16px 20px 12px;
  border-bottom:1px solid var(--color-slate-100);
}
.analytics-section-title {
  display:flex; align-items:center; gap:8px; margin:0;
  font-size:14px; font-weight:700; color:var(--color-slate-800);
}
.analytics-section-title i { font-size:16px; }
.analytics-section-body { padding:16px 20px; }
.analytics-section-body--no-pad { padding:0; }
.tooltip-icon { font-size: 13px; cursor: help; }

/* Утилиты графиков и баланса */
.chart-container-280 { position: relative; height: 280px; }
.chart-legend-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.badge-period { font-size: 10px; }

.chart-empty {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:160px; padding:40px 20px; text-align:center;
}
.chart-empty-icon {
  width:56px; height:56px; margin-bottom:12px; font-size:24px; color:var(--color-slate-300);
  display:flex; align-items:center; justify-content:center; background:var(--color-slate-100); border-radius:var(--radius-lg);
}
.chart-empty-title { margin-bottom:4px; font-size:14px; font-weight:600; color:var(--color-slate-500); }
.chart-empty-text { max-width:220px; font-size:12px; line-height:1.5; color:var(--color-slate-400); }
.chart-skeleton { background:linear-gradient(90deg,var(--color-slate-100) 25%,var(--color-slate-50) 50%,var(--color-slate-100) 75%); background-size:200% 100%; border-radius:var(--radius-sm); animation:skeletonShimmer 1.5s ease-in-out infinite; }

/* ═══════════════════════════════════════════════════════════════════
   ATTENTION / FUNNEL / РЕЙТИНГИ
   ═══════════════════════════════════════════════════════════════════ */
.attention-list { display:flex; flex-direction:column; }
.attention-item {
  display:flex; align-items:flex-start; gap:12px; padding:12px 16px; color:inherit; text-decoration:none;
  border-left:3px solid transparent; border-bottom:1px solid var(--color-slate-50);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.attention-item:last-child { border-bottom:none; }
.attention-item:hover { background:var(--color-slate-50); }
.attention-item--danger { border-left-color:#ef4444; }
.attention-item--warning { border-left-color:#f59e0b; }
.attention-item--info { border-left-color:var(--color-accent); }
.attention-item:hover.attention-item--danger { background:#fff5f5; }
.attention-item:hover.attention-item--warning { background:#fffbeb; }
.attention-icon {
  width:32px; height:32px; margin-top:1px; flex-shrink:0; font-size:14px;
  display:flex; align-items:center; justify-content:center; border-radius:var(--radius-sm);
}
.attention-icon--danger { background:#fee2e2; color:#dc2626; }
.attention-icon--warning { background:#fef3c7; color:#d97706; }
.attention-icon--info { background:var(--color-accent-50); color:var(--color-accent); }
.attention-title { margin-bottom:2px; font-size:13px; font-weight:600; line-height:1.3; color:var(--color-slate-800); }
.attention-subtitle { font-size:11px; line-height:1.3; color:var(--color-slate-500); }
.attention-number { font-size:10px; font-weight:500; color:var(--color-slate-400); }
.attention-meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:3px; }
.attention-amount { margin-left:auto; flex-shrink:0; font-size:12px; font-weight:700; color:var(--color-slate-700); }

.sales-funnel { display:flex; align-items:stretch; gap:0; overflow-x:auto; scrollbar-width:none; }
.sales-funnel::-webkit-scrollbar { display:none; }
.sales-funnel-step { position:relative; display:flex; flex-direction:column; flex:1; min-width:80px; }
.sales-funnel-body {
  flex:1; display:flex; flex-direction:column; align-items:center; padding:16px 8px 12px; margin:0 2px;
  text-align:center; border-radius:var(--radius-sm); cursor:default;
  transition:transform var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);
}
.sales-funnel-body:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); }
.sales-funnel-count { margin-bottom:4px; font-size:28px; font-weight:800; line-height:1; letter-spacing:-.5px; }
.sales-funnel-label { font-size:10px; font-weight:600; line-height:1.3; letter-spacing:.5px; text-transform:uppercase; opacity:.85; }
.sales-funnel-arrow {
  position:absolute; top:50%; right:-12px; z-index:2; transform:translateY(-50%);
  display:flex; align-items:center; gap:1px;
}
.sales-funnel-arrow-icon { font-size:12px; line-height:1; color:var(--color-slate-300); }
.sales-funnel-drop { padding:1px 4px; white-space:nowrap; line-height:1; font-size:9px; font-weight:700; border-radius:var(--radius-full); }
.sales-funnel-drop--low { background:#dcfce7; color:#15803d; }
.sales-funnel-drop--medium { background:#fef9c3; color:#a16207; }
.sales-funnel-drop--high { background:#fee2e2; color:#b91c1c; }
.funnel-preparation { background:#fef9c3; color:#a16207; }
.funnel-submitted { background:#dbeafe; color:#1e40af; }
.funnel-won { background:#dcfce7; color:#15803d; }

/* Финансы - Баланс и Платежи */
.finance-balance-card { padding: 16px; border-radius: 12px; border: 1px solid; background-color: rgba(255, 255, 255, 0.1); }
.finance-balance-card--success { background-color: rgba(21, 128, 61, 0.05); border-color: rgba(21, 128, 61, 0.2); }
.finance-balance-card--danger { background-color: rgba(185, 28, 28, 0.05); border-color: rgba(185, 28, 28, 0.2); }
.finance-balance-card--primary { background-color: rgba(29, 78, 216, 0.05); border-color: rgba(29, 78, 216, 0.2); }
.finance-balance-card--warning { background-color: rgba(161, 98, 7, 0.05); border-color: rgba(161, 98, 7, 0.2); }
.finance-balance-label { font-size: 12px; color: #64748b; font-weight: 600; margin-bottom: 4px; }
.finance-balance-value { font-size: 1.25rem; font-weight: 700; }
.text-warning-dark { color: #b45309; }

.upcoming-payment-row { display: grid; grid-template-columns: 60px 1fr auto; gap: 12px; align-items: center; padding: 6px 10px; border-radius: 6px; color: #334155; transition: var(--transition-fast); font-size: 12.5px; }
.upcoming-payment-row:hover { background: #f8fafc; color: #0f172a; }
.upcoming-payment-date { font-weight: 700; color: #0ea5e9; font-variant-numeric: tabular-nums; font-size: 12px; }
.upcoming-payment-name { color: #475569; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upcoming-payment-amount { font-weight: 700; color: #15803d; font-variant-numeric: tabular-nums; white-space: nowrap; }

.top-customer-rank { width: 22px; font-size: 13px; }
.top-customer-meta { font-size: 11px; color: #94a3b8; }
.list-badge-le { font-size: 10px; }
.list-meta-date { font-size: 11px; }
.badge-sm { font-size: 9px; }
.badge-mini { font-size: 10px; }

/* Команда / Менеджеры */
.manager-rating-row {
  display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:1px solid var(--color-slate-50);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.manager-rating-row:last-child { border-bottom:none; }
.manager-rating-row:hover { background:var(--color-slate-50); }
.manager-rank {
  width:28px; height:28px; flex-shrink:0; font-size:13px; font-weight:800; color:var(--color-slate-500);
  display:flex; align-items:center; justify-content:center; background:var(--color-slate-100); border-radius:var(--radius-sm);
}
.manager-rank--gold { background:#fef9c3; color:#b45309; }
.manager-rank--silver { background:#f1f5f9; color:#475569; }
.manager-rank--bronze { background:#ffedd5; color:#c2410c; }
.manager-info { flex:1; min-width:0; }
.manager-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:600; color:var(--color-slate-800); }
.manager-meta { margin-top:1px; font-size:11px; color:var(--color-slate-500); }

/* Выравнивание рейтинга менеджеров */
.manager-stats {
  display: grid;
  grid-template-columns: 46px 60px 100px;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.manager-kpi {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.manager-kpi:first-child { text-align: right; }
.manager-kpi:last-child { text-align: right; }
.manager-kpi-v { font-size:13px; font-weight:700; line-height:1.2; color:var(--color-slate-800); white-space:nowrap; }
.manager-kpi-l { font-size:10px; color:var(--color-slate-400); white-space:nowrap; }

@media (min-width: 576px) {
  .manager-stats { grid-template-columns: 50px 80px 120px; gap: 16px; }
}

.win-rate-bar { width:100%; height:6px; overflow:hidden; background:var(--color-slate-100); border-radius:var(--radius-full); }
.win-rate-fill { height:100%; border-radius:var(--radius-full); transition:width var(--duration-slow) var(--ease-out); }
.win-rate-fill--high { background:#16a34a; }
.win-rate-fill--medium { background:#f59e0b; }
.win-rate-fill--low { background:#ef4444; }

/* Поддержка CSS-переменной --w для win-rate-fill */
.win-rate-fill[style*="--w"] { width:var(--w,0%); }

.top-manager-banner { background: linear-gradient(135deg, #fef9c3 0%, #fef3c7 100%); border: 1px solid #fde68a; border-radius: 12px; padding: 16px 20px; }
.top-manager-emoji { font-size: 36px; line-height: 1; }
.top-manager-label { letter-spacing: 0.5px; }
.top-manager-badge { font-size: 12px; }

.workload-card { padding: 12px 16px; border-radius: 10px; border: 1px solid #e2e8f0; background-color: #ffffff; }
.workload-progress { height: 8px; border-radius: 4px; background-color: #f1f5f9; }

.le-stat-row {
  padding:10px 16px; border-bottom:1px solid var(--color-slate-50);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.le-stat-row:last-child { border-bottom:none; }
.le-stat-row:hover { background:var(--color-slate-50); }

.stale-item {
  display:flex; align-items:center; gap:12px; padding:10px 16px; color:inherit; text-decoration:none;
  border-bottom:1px solid var(--color-slate-50);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.stale-item:last-child { border-bottom:none; }
.stale-item:hover { background:var(--color-slate-50); }
.stale-days { min-width:40px; flex-shrink:0; text-align:center; }
.stale-days-num { font-size:18px; font-weight:800; line-height:1; }
.stale-days-lbl { font-size:9px; letter-spacing:.5px; text-transform:uppercase; }
.stale-days--critical .stale-days-num { color:#dc2626; }
.stale-days--warning .stale-days-num { color:#d97706; }
.stale-days--normal .stale-days-num { color:var(--color-slate-500); }

/* Логистика - Этапы и Таблицы */
.pipeline-stage-card {
    display: block;
    text-decoration: none;
    height: 100%;
    padding: 12px 8px;
    text-align: center;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.pipeline-stage-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08); }
.pipeline-stage-count { font-size: 28px; font-weight: 800; color: #0f172a; line-height: 1; }
.pipeline-stage-label { font-size: 11px; font-weight: 600; color: #64748b; margin-top: 6px; line-height: 1.3; }
.pipeline-stage-amount { font-size: 11px; color: #94a3b8; margin-top: 6px; font-variant-numeric: tabular-nums; }

.pnr-tasks-table { font-size: 13px; }
.pnr-tasks-table th { font-size: 11px; font-weight: 600; color: #64748b; }
.pnr-task-row { cursor: pointer; transition: background-color 0.15s ease; }
.pnr-task-row:hover { background-color: #f8fafc; }
.pnr-task-product { max-width: 200px; font-size: 11px; }

/* Денежный pipeline */
.money-pipeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.money-bucket {
    display: flex; flex-direction: column; gap: 4px;
    padding: 14px 14px 12px; border-radius: 12px; border: 1px solid transparent;
    text-decoration: none; color: inherit;
    transition: transform .18s ease, box-shadow .18s ease;
    background: #f8fafc; min-height: 110px;
}
.money-bucket:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(15,23,42,.08); text-decoration: none; }
.money-bucket-head { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; opacity: .85; }
.money-bucket-head i { font-size: 13px; }
.money-bucket-name { line-height: 1.1; }
.money-bucket-amount { font-size: 18px; font-weight: 800; line-height: 1.1; margin-top: 4px; letter-spacing: -.3px; font-variant-numeric: tabular-nums; }
.money-bucket-count { font-size: 11px; opacity: .65; margin-top: 2px; }
.money-bucket--danger { background: #fee2e2; color: #b91c1c; border-color: #fecaca; }
.money-bucket--warning { background: #fef3c7; color: #a16207; border-color: #fde68a; }
.money-bucket--info { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.money-bucket--neutral { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.money-pipeline-total { display: flex; align-items: baseline; justify-content: flex-end; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #e2e8f0; }

/* Pipeline универсальный компонент */
.pipeline-track { display: flex; align-items: stretch; gap: 0; overflow-x: auto; scrollbar-width: thin; padding: 4px 2px; }
.pipeline-track::-webkit-scrollbar { height: 4px; }
.pipeline-track::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 2px; }
.pipeline-stage {
    flex: 1 1 0; min-width: 140px; max-width: 220px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; padding: 16px 12px; border-radius: 12px;
    text-decoration: none; transition: transform .18s ease, box-shadow .18s ease;
    border: 1px solid transparent; background: #f8fafc; color: #334155;
}
.pipeline-stage:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(15,23,42,.08); text-decoration: none; }
.pipeline-stage--neutral { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.pipeline-stage--info { background: #e0f2fe; color: #0369a1; }
.pipeline-stage--warning { background: #fef9c3; color: #a16207; }
.pipeline-stage--primary { background: #dbeafe; color: #1e40af; }
.pipeline-stage--delivery { background: #ffedd5; color: #c2410c; }
.pipeline-stage--purple { background: #ede9fe; color: #5b21b6; }
.pipeline-stage--acceptance { background: #ccfbf1; color: #0f766e; }
.pipeline-stage--success { background: #dcfce7; color: #15803d; }
.pipeline-stage--danger { background: #fee2e2; color: #b91c1c; }

/* ═══════════════════════════════════════════════════════════════════
   РЕЕСТР ЗАКУПОК — ФИЛЬТРЫ / ТАБЛИЦА / ДЕЙСТВИЯ
   ═══════════════════════════════════════════════════════════════════ */
.views-switcher-wrap {
  padding:0 4px; background:#fff; border-bottom:1px solid var(--color-slate-200);
  border-radius:var(--radius) var(--radius) 0 0; box-shadow:var(--shadow-sm);
}
.views-switcher { display:flex; align-items:stretch; gap:0; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none; }
.views-switcher::-webkit-scrollbar { display:none; }
.views-switcher--pill { gap:2px; padding:3px; background:var(--color-slate-100); border-radius:var(--radius-sm); align-items:center; }

.view-tab {
  position:relative; display:inline-flex; align-items:center; gap:6px; padding:12px 16px; white-space:nowrap;
  font-size:13px; font-weight:500; color:var(--color-slate-500); text-decoration:none; cursor:pointer;
  border-bottom:2px solid transparent;
  transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);
}
.view-tab:hover { color:var(--color-primary-light); background:var(--color-primary-50); }
.view-tab.active { color:var(--color-primary-light); font-weight:600; background:transparent; border-bottom-color:var(--color-primary-light); }

.views-switcher--pill .view-tab { padding:5px 12px; font-size:13px; border-bottom:2px solid transparent; border-radius:var(--radius-sm); }
.views-switcher--pill .view-tab:hover { background:#fff; color:var(--color-primary); }
.views-switcher--pill .view-tab.active {
  color:var(--color-primary-light); font-weight:600; background:#fff; border-bottom-color:transparent; box-shadow:var(--shadow-sm);
}

.view-tab-count {
  display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 6px; line-height:1;
  font-size:11px; font-weight:700; color:var(--color-slate-600);
  background:var(--color-slate-100); border-radius:var(--radius-full);
  transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.view-tab.active .view-tab-count { color:var(--color-primary-light); background:var(--color-primary-100); }
.view-tab-count-success { background:#dcfce7 !important; color:#15803d !important; }

.view-tab-urgent { color:var(--color-lost); }
.view-tab-urgent:hover { color:var(--color-lost); background:#fff1f2; }
.view-tab-urgent.active { color:var(--color-lost); border-bottom-color:var(--color-lost); }
.view-tab-urgent .view-tab-count,
.view-tab-urgent.active .view-tab-count { background:#fee2e2; color:var(--color-lost); }

.procurement-table-frame {
  display:flex; flex-direction:column; min-height:360px; height:calc(100vh - 260px);
  overflow:hidden; background:#fff; border-radius:0 0 var(--radius) var(--radius);
}

body.body--fullscreen-table { overflow:hidden; }
.body--fullscreen-table .app-container { height:100vh; overflow:hidden; }
.body--fullscreen-table .app-main { display:flex; flex-direction:column; height:100%; overflow:hidden; }
.body--fullscreen-table .page-header { flex:0 0 auto; }
.body--fullscreen-table .page-content { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.body--fullscreen-table #procurement-workspace { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; gap:12px; }
.body--fullscreen-table #procurement-workspace > .procurement-filters-card { flex:0 0 auto; margin-bottom:0 !important; }
.body--fullscreen-table #procurement-workspace > .procurement-table-card,
.body--fullscreen-table #procurement-workspace > .procurement-table-card > .card-body { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; }
.body--fullscreen-table #procurement-workspace > nav { flex:0 0 auto; margin-top:0 !important; }
.body--fullscreen-table .procurement-table-frame { height:auto !important; min-height:0 !important; flex:1 1 auto; }

.procurement-table-wrap {
  position:relative; flex:1 1 auto; min-height:0; max-width:100%; overflow:auto; isolation:isolate;
  background:#fff; scrollbar-gutter:stable; scrollbar-width:auto; scrollbar-color:var(--color-slate-400) var(--color-slate-100);
}
.procurement-table-wrap::-webkit-scrollbar { width:8px; height:14px; }
.procurement-table-wrap::-webkit-scrollbar-track { background:var(--color-slate-100); }
.procurement-table-wrap::-webkit-scrollbar-thumb {
  background:var(--color-slate-400); border:2px solid var(--color-slate-100); border-radius:var(--radius-full);
}
.procurement-table-wrap::-webkit-scrollbar-thumb:hover { background:var(--color-slate-600); }
.procurement-table-wrap::-webkit-scrollbar-corner { background:var(--color-slate-100); }

.procurement-table { width:max-content; min-width:100%; font-size:13px; border-collapse:separate; border-spacing:0; }

.procurement-table thead th {
  position:sticky; top:0; z-index:60; white-space:nowrap;
  font-size:10px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--color-slate-600);
  background:linear-gradient(180deg,#ffffff 0%,var(--color-slate-50) 100%);
  border-bottom:1px solid var(--color-slate-200); background-clip:padding-box;
  box-shadow:0 2px 8px rgba(15,23,42,.08),0 1px 0 rgba(15,23,42,.06);
}
.procurement-table thead th[data-col-key] { padding:0; }
.procurement-table thead th.col-sticky { z-index:80; }

.procurement-table tbody td {
  padding:10px 12px; vertical-align:middle; border-bottom:1px solid var(--color-slate-100);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.procurement-table tbody tr { transition:background-color var(--duration-fast) var(--ease-out); }
.procurement-table tbody tr:hover td { background:var(--color-primary-50) !important; }

.col-sticky { position:sticky; z-index:30; background:#fff; background-clip:padding-box; }
thead .col-sticky { z-index:80; background:linear-gradient(180deg,#ffffff 0%,var(--color-slate-50) 100%); }
tbody .col-sticky { box-shadow:4px 0 12px -10px rgba(15,23,42,.3); }
.procurement-table tbody tr:hover .col-sticky { background:var(--color-primary-50) !important; }

.procurement-row.row-urgent:hover .col-sticky { background:#fff5f5 !important; }
.procurement-row.row-critical:hover .col-sticky { background:#fffbeb !important; }
.procurement-row.row-urgent td:first-child::before,
.procurement-row.row-critical td:first-child::before {
  content:''; position:absolute; left:0; top:0; bottom:0; width:3px; border-radius:0 2px 2px 0;
}
.procurement-row.row-urgent td:first-child::before { background:#ef4444; }
.procurement-row.row-critical td:first-child::before { background:#f59e0b; }
.procurement-row.row-urgent:hover td { background:#fff5f5 !important; }
.procurement-row.row-critical:hover td { background:#fffbeb !important; }

.sort-th .th-cell,
thead th[data-col-key] .th-cell {
  display:flex; align-items:center; justify-content:space-between; gap:6px; width:100%; min-height:44px; padding:10px 12px;
}

.sort-link {
  display:flex; align-items:center; gap:4px; flex:1 1 auto; min-width:0; padding:0; white-space:nowrap;
  font-size:10px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; text-decoration:none; color:var(--color-slate-600);
  transition:color var(--duration-fast) var(--ease-out);
}
.sort-link:hover { color:var(--color-primary-light); }
.sort-icon-idle { flex-shrink:0; font-size:12px; color:var(--color-slate-300); }
.sort-icon-active { flex-shrink:0; font-size:12px; color:var(--color-primary-light); }

.sticky-pin-btn {
  width:24px; height:24px; flex:0 0 24px; padding:0; color:var(--color-slate-400); background:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--color-slate-200); border-radius:8px;
  transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);
}
.sticky-pin-btn:hover { color:var(--color-primary-light); background:var(--color-primary-50); border-color:var(--color-primary-100); }
.sticky-pin-btn.active { color:#fff; background:var(--color-primary-light); border-color:var(--color-primary-light); box-shadow:0 2px 8px rgba(45,90,158,.2); }

.table-loading-overlay {
  position:absolute; inset:0; z-index:120; opacity:0; pointer-events:none; border-radius:0 0 var(--radius) var(--radius);
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.65); -webkit-backdrop-filter:blur(2px); backdrop-filter:blur(2px);
  transition:opacity var(--duration-fast);
}

.table-loading-spinner {
  display:flex; flex-direction:column; align-items:center; gap:10px; padding:20px 28px;
  background:#fff; border:1px solid var(--color-slate-200); border-radius:var(--radius); box-shadow:var(--shadow-lg);
}
.table-loading-spinner span { font-size:12px; font-weight:500; color:var(--color-slate-500); }

.product-name-cell {
  max-width:280px; overflow:hidden; text-overflow:ellipsis; word-break:break-word;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  font-size:13px; font-weight:500; line-height:1.4; color:var(--color-slate-800);
}

.proc-alert-icon {
  width:22px; height:22px; flex-shrink:0; font-size:11px; cursor:help;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  transition:transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}
.proc-alert-icon:hover { transform:scale(1.15); box-shadow:0 2px 6px rgba(15,23,42,.12); }
.proc-alert-icon--danger { background:#fee2e2; color:#b91c1c; border:1px solid #fecaca; }
.proc-alert-icon--warning { background:#fef3c7; color:#a16207; border:1px solid #fde68a; }
.proc-alert-icon--info { background:#dbeafe; color:#1e40af; border:1px solid #bfdbfe; }
.proc-alert-icon--success { background:#dcfce7; color:#15803d; border:1px solid #bbf7d0; }

.row-actions-cell { opacity:0; transition:opacity var(--duration-fast); }
.procurement-row:hover .row-actions-cell { opacity:1; }
@media (hover:none) { .row-actions-cell { opacity:1; } }

.proc-action-btn {
  width:30px; height:30px; padding:0; font-size:14px; cursor:pointer; color:var(--color-slate-400); background:transparent;
  display:inline-flex; align-items:center; justify-content:center; border:none; border-radius:50%;
  transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);
}
.proc-action-btn:hover { color:var(--color-slate-700); background:var(--color-slate-100); }
.proc-action-btn:active { background:var(--color-slate-200); transform:scale(.93); }

.proc-action-menu {
  min-width:188px !important; padding:6px !important;
  border:1px solid var(--color-slate-100) !important; border-radius:var(--radius) !important;
  box-shadow:0 8px 24px rgba(15,23,42,.12),0 2px 8px rgba(15,23,42,.06) !important;
  animation:fadeInUp var(--duration-fast) var(--ease-out);
}
.proc-action-item {
  display:flex !important; align-items:center !important; gap:10px !important; width:100%; padding:7px 10px !important;
  text-align:left; font-size:13px !important; font-weight:500 !important; color:var(--color-slate-700) !important; cursor:pointer;
  background:none; border:none; border-radius:var(--radius-sm) !important;
  transition:background-color var(--duration-fast) var(--ease-out) !important;
}
.proc-action-item:hover { color:var(--color-slate-900) !important; background:var(--color-slate-50) !important; }
.proc-action-item__icon {
  width:26px; height:26px; flex-shrink:0; font-size:12px;
  display:inline-flex; align-items:center; justify-content:center; border-radius:6px;
}
.proc-action-item__icon--blue { background:#dbeafe; color:#1d4ed8; }
.proc-action-item__icon--slate { background:var(--color-slate-100); color:var(--color-slate-600); }
.proc-action-item__icon--yellow { background:#fef9c3; color:#a16207; }
.proc-action-item__icon--teal { background:#ccfbf1; color:#0f766e; }
.proc-action-item__icon--red { background:#fee2e2; color:#b91c1c; }
.proc-action-item__text { flex:1; }
.proc-action-menu .dropdown-divider { margin:4px 0 !important; border-color:var(--color-slate-100) !important; }

.form-select.form-select-sm { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ═══════════════════════════════════════════════════════════════════
   ДЕТАЛЬНАЯ КАРТОЧКА: ПУСТЫЕ СОСТОЯНИЯ / ЧЕКЛИСТ / ТАБЫ
   ═══════════════════════════════════════════════════════════════════ */
.empty-state {
  display:flex; flex-direction:column; align-items:center; justify-content:center; padding:64px 24px; text-align:center;
}
.empty-state-icon {
  width:72px; height:72px; margin-bottom:16px; font-size:32px; color:var(--color-slate-400);
  display:flex; align-items:center; justify-content:center; background:var(--color-slate-100); border-radius:var(--radius-xl);
}
.empty-state-title { margin-bottom:6px; font-size:16px; font-weight:600; color:var(--color-slate-700); }
.empty-state-text { max-width:320px; font-size:13px; line-height:1.5; color:var(--color-slate-400); }

/* Утилиты Чеклиста */
.checklist-item { cursor:pointer; border-radius:var(--radius-sm); transition:background-color var(--duration-fast) var(--ease-out); }
.checklist-item:hover { background:var(--color-slate-50); }
.checklist-done { background:#f0fdf4; }
.checklist-pending { background:#fff; }
.checklist-done:hover { background:#dcfce7; }
.checklist-progress-wrap { width:80px; height:8px; }
.checklist-progress-bar { width:var(--pg-width, 0%); transition:width .3s ease; }
.checklist-input-hidden {
    position:absolute !important; width:1px !important; height:1px !important; padding:0 !important;
    margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important;
    white-space:nowrap !important; border:0 !important; opacity:0 !important; pointer-events:none !important;
}

.timeline::before {
  content:''; position:absolute; left:11px; top:8px; bottom:8px; width:2px;
  background:var(--color-slate-200); border-radius:2px;
}
.timeline-dot {
  position:relative; z-index:1; width:24px; height:24px; border-radius:50%;
  border:3px solid #fff; box-shadow:0 0 0 2px var(--color-slate-200);
}

.deadline-item { border-radius:var(--radius-sm) !important; transition:background-color var(--duration-fast) var(--ease-out); }
.deadline-urgent { background:#fff1f2; border-left:3px solid var(--color-lost) !important; }
.deadline-critical { background:#fffbeb; border-left:3px solid var(--color-preparation) !important; }
.deadline-urgent:hover { background:#fee2e2 !important; }
.deadline-critical:hover { background:#fef3c7 !important; }

/* Общий стиль Табов/Секций */
.main-tab-btn {
  position:relative; overflow:hidden; padding:16px 20px; color:inherit; cursor:pointer;
  background:#fff; border:2px solid #e2e8f0; border-radius:16px;
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.main-tab-btn::before {
  content:''; position:absolute; top:0; left:0; bottom:0; width:4px; background:transparent;
  border-radius:16px 0 0 16px; transition:background .2s ease;
}
.main-tab-btn:hover { border-color:#cbd5e1; transform:translateY(-1px); box-shadow:0 4px 16px rgba(15,23,42,.07); }
.main-tab-btn.active {
  border-color:#3b82f6; background:linear-gradient(135deg,#eff6ff 0%,#fff 60%);
  box-shadow:0 4px 20px rgba(59,130,246,.18);
}
.main-tab-btn.active::before { background:#3b82f6; }

.main-tab-icon {
  width:44px; height:44px; display:flex; align-items:center; justify-content:center;
  background:#f1f5f9; border-radius:12px; transition:background .2s ease;
}
.main-tab-btn.active .main-tab-icon { background:#dbeafe; }

.main-tab-title { margin-bottom:2px; font-size:15px; font-weight:600; color:#1e293b; }
.main-tab-status { font-size:12px; color:#64748b; }

.status-dot { width:8px; height:8px; flex-shrink:0; display:inline-block; border-radius:50%; }
.status-dot--success { background:#16a34a; }
.status-dot--primary { background:#3b82f6; }
.status-dot--info { background:#0ea5e9; }
.status-dot--warning { background:#f59e0b; }
.status-dot--danger { background:#dc2626; }
.status-dot--secondary { background:#94a3b8; }
.status-dot--dark { background:#475569; }

.card-section {
  overflow:hidden; margin-bottom:12px; background:#fff;
  border:1px solid #e2e8f0; border-radius:14px; box-shadow:0 1px 3px rgba(15,23,42,.04);
  transition:box-shadow .25s ease;
}
.card-section:hover { box-shadow:0 6px 20px rgba(15,23,42,.08); }

.card-section-header {
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 20px;
  background:#f8fafc; border-bottom:1px solid #e2e8f0; cursor:pointer; user-select:none;
  transition:background .15s ease,box-shadow .15s ease;
}
.card-section-header:hover { background:#f1f5f9; box-shadow:inset 3px 0 0 #3b82f6; }
.card-section-header.always-open { cursor:default; }
.card-section-header.always-open:hover { background:#f8fafc; box-shadow:none; }

.card-section-title {
  display:flex; align-items:center; gap:10px; margin:0;
  font-size:14px; font-weight:600; color:#1e293b;
}
.card-section-title i { font-size:16px; color:#64748b; }
.card-section-hint { font-size:11px; font-weight:400; color:#94a3b8; }

.card-section-body { padding:6px 20px 4px; }
.card-section-body.p-0 { padding:0 !important; }

.ef-row {
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0;
  border-bottom:1px solid #f1f5f9; transition:background .15s ease;
}
.ef-row:hover { background:#f8fafc; }
.card-section-body .ef-row:last-child { border-bottom:none; }

.ef-row--critical {
  margin:0 -20px; padding:9px 20px; background:#fffbeb; border-radius:0;
}
.ef-row--critical:hover { background:#fef3c7; }

.ef-label {
  min-width:140px; max-width:200px; flex-shrink:0;
  display:flex; align-items:center; gap:4px;
  font-size:13px; color:#64748b;
}
.ef-label i { color:#3b82f6; }

.ef-value {
  min-width:0; flex-grow:1;
  display:flex; align-items:center; justify-content:flex-end; gap:8px;
  font-size:13px; text-align:right; word-break:break-word;
}

.ef-separator { display:none; }

.ef-edit-btn,
.dates-edit-btn {
  opacity:.35; line-height:1; color:#64748b; cursor:pointer;
  background:none; border:none;
  transition:opacity .15s ease,color .15s ease,background .15s ease;
}
.ef-edit-btn:hover,
.dates-edit-btn:hover { opacity:1; color:#3b82f6; background:#eff6ff; }

.ef-edit-btn { padding:3px 6px; flex-shrink:0; border-radius:6px; }
.ef-edit-btn i { font-size:12px; }

.dates-edit-btn { padding:2px 5px; border-radius:5px; }
.dates-edit-btn i { font-size:11px; }

.ef-row:hover .ef-edit-btn,
.dates-matrix-row:hover .dates-edit-btn { opacity:.7; }
.ef-row:hover .ef-edit-btn:hover,
.dates-matrix-row:hover .dates-edit-btn:hover { opacity:1; }

.toggle-pill-btn {
  cursor:pointer; outline:none; font-size:13px; line-height:1.2; background:none;
  transition:transform .15s cubic-bezier(.4,.0,.2,1),box-shadow .2s ease,border-color .2s ease,background .2s ease;
}
.toggle-pill-btn:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(15,23,42,.08); filter:brightness(1.03); }
.toggle-pill-btn:active { transform:translateY(0) scale(.98); }
.toggle-pill-btn:focus-visible { box-shadow:0 0 0 3px rgba(59,130,246,.25); }
.toggle-pill-btn i.bi-toggle-on,
.toggle-pill-btn i.bi-toggle-off { transition:transform .2s ease; }
.toggle-pill-btn:hover i.bi-toggle-on,
.toggle-pill-btn:hover i.bi-toggle-off { transform:scale(1.1); }

.pipeline-strip { display:flex; gap:4px; width:100%; overflow-x:auto; padding:4px 0; }
.pipeline-step {
  display:inline-flex; align-items:center; gap:6px; flex-shrink:0; padding:6px 12px; white-space:nowrap;
  font-size:12px; font-weight:500; color:#94a3b8; background:#f1f5f9; border:1px solid transparent; border-radius:20px;
  transition:box-shadow .2s ease;
}
.pipeline-step--completed { color:#16a34a; background:#dcfce7; border-color:#bbf7d0; }
.pipeline-step--current { color:#1e40af; font-weight:600; background:#dbeafe; border-color:#93c5fd; }
.pipeline-step--fail { color:#b91c1c; background:#fee2e2; border-color:#fecaca; }
.pipeline-arrow { display:flex; align-items:center; font-size:14px; color:#cbd5e1; }

.dates-matrix { overflow:hidden; }
.dates-matrix-header,
.dates-matrix-row {
  display:grid; grid-template-columns:1fr var(--dates-col-w) var(--dates-col-w); align-items:center; padding:10px 16px;
}
.dates-matrix-header {
  font-size:11px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:#64748b;
  background:#f8fafc; border-bottom:1px solid #e2e8f0;
}
.dates-matrix-row { font-size:13px; border-top:1px solid #f1f5f9; transition:background .15s ease; }
.dates-matrix-row:first-of-type { border-top:none; }
.dates-matrix-row:hover { background:#f8fafc; }

.dates-matrix-label { display:flex; align-items:center; font-weight:500; color:#1e293b; }
.dates-matrix-value--filled { color:#16a34a; font-weight:500; }
.dates-matrix-value--overdue { color:#b91c1c; font-weight:600; }
.dates-matrix-value--empty { color:#cbd5e1; font-style:italic; }
.dates-cell { display:inline-flex; align-items:center; justify-content:center; gap:6px; }

.warning-banner {
  display:flex; align-items:center; gap:12px; margin-bottom:16px; padding:12px 16px;
  font-size:13px; color:#78350f;
  background:linear-gradient(135deg,#fef3c7 0%,#fef9c3 100%);
  border:1px solid #fde68a; border-radius:12px;
}
.warning-banner i { flex-shrink:0; font-size:20px; color:#d97706; }

.totals-block {
  padding:16px 20px;
  background:linear-gradient(135deg,#f0f9ff 0%,#e0f2fe 100%);
  border:1px solid #bae6fd; border-radius:12px; box-shadow:0 2px 8px rgba(14,165,233,.08);
}
.totals-row { display:flex; align-items:center; justify-content:space-between; padding:6px 0; font-size:13px; }
.totals-row--separator { margin-top:6px; padding-top:10px; border-top:1px solid #bae6fd; }
.totals-highlight { font-size:15px; font-weight:700; letter-spacing:-.3px; color:#0c4a6e; }

.bottom-tabs { border-bottom:2px solid #e2e8f0; }
.bottom-tabs .nav-link {
  padding:10px 16px; font-size:13px; font-weight:500; color:#64748b; background:transparent; border:none; border-radius:8px 8px 0 0;
  transition:color .15s ease,background .15s ease;
}
.bottom-tabs .nav-link:hover { color:#1e293b; background:#f8fafc; }
.bottom-tabs .nav-link.active {
  margin-bottom:-2px; color:#3b82f6; border-bottom:3px solid #3b82f6;
  background:linear-gradient(180deg,#eff6ff 0%,transparent 100%);
}

#inline-edit-modal .form-control-sm,
#inline-edit-modal .form-select-sm { font-size:14px; border-radius:8px; }
#inline-edit-modal textarea.form-control-sm { min-height:90px; resize:vertical; }

.proc-page-header { margin-bottom:16px !important; padding-bottom:14px !important; }
.proc-title {
  max-width:100%; word-break:break-word;
  font-size:20px !important; font-weight:700; line-height:1.35 !important; letter-spacing:-.3px; color:var(--color-slate-900);
}
.proc-meta { margin-top:2px; font-size:12px; line-height:1.5; }
.proc-meta__item { display:inline-flex; align-items:center; gap:4px; color:var(--color-slate-500); }
.proc-meta__item i { font-size:11px; opacity:.7; }
.proc-meta__sep { color:var(--color-slate-300); user-select:none; }
.proc-meta__serial {
  padding:1px 6px; font-size:11px; font-weight:500; color:var(--color-slate-400);
  font-family:'JetBrains Mono',monospace; background:var(--color-slate-50); border:1px solid var(--color-slate-200); border-radius:var(--radius-xs);
}
.proc-header-btn { padding:5px 10px !important; font-size:12.5px !important; white-space:nowrap; }

.deadline-chip {
  display:inline-flex; align-items:center; gap:8px; max-width:100%; padding:6px 12px; white-space:nowrap; cursor:default;
  font-size:12px; font-weight:500; line-height:1.3;
  border:1px solid transparent; border-radius:var(--radius-full);
  transition:box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);
}
.deadline-chip:hover { transform:translateY(-1px); box-shadow:var(--shadow-sm); }
.deadline-chip__icon { flex-shrink:0; font-size:13px; }
.deadline-chip__body { min-width:0; display:inline-flex; align-items:baseline; gap:6px; }
.deadline-chip__label { font-size:10px; font-weight:600; letter-spacing:.3px; text-transform:uppercase; opacity:.85; }
.deadline-chip__value { font-size:12px; font-weight:600; }
.deadline-chip__left { margin-left:2px; font-size:11px; font-weight:400; opacity:.85; }
.deadline-chip--expired { color:#991b1b; background:#fee2e2; border-color:#fecaca; }
.deadline-chip--critical { color:#b91c1c; background:#fef2f2; border-color:#fecaca; }
.deadline-chip--urgent { color:#c2410c; background:#ffedd5; border-color:#fed7aa; }
.deadline-chip--warning { color:#a16207; background:#fef9c3; border-color:#fef08a; }
.deadline-chip--normal { color:#1e40af; background:#eff6ff; border-color:#bfdbfe; }

/* ═══════════════════════════════════════════════════════════════════
   АВАТАРЫ / СОТРУДНИКИ
   ═══════════════════════════════════════════════════════════════════ */
.employee-avatar-sm,.employee-avatar-lg,.employee-avatar-xl,
.user-avatar-sm,.user-avatar-lg,.user-avatar-xl {
  color:#fff; font-weight:700; flex-shrink:0;
  background:linear-gradient(135deg,var(--color-primary),var(--color-accent));
  box-shadow:0 2px 8px rgba(30,58,95,.2);
  transition:transform var(--duration-normal) var(--ease-spring),box-shadow var(--duration-normal) var(--ease-out);
}
.employee-avatar-sm,.user-avatar-sm { width:32px; height:32px; font-size:12px; }
.employee-avatar-lg,.user-avatar-lg { width:56px; height:56px; font-size:20px; }
.employee-avatar-xl,.user-avatar-xl { width:80px; height:80px; font-size:28px; }

/* Карточка - h-100 и flex-column для идеального выравнивания высоты */
.emp-card-v2 {
  position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center; padding:0 20px 20px; height:100%;
  background:#fff; border:1px solid var(--color-slate-200); border-radius:var(--radius-lg);
  transition:transform var(--duration-normal) var(--ease-spring),box-shadow var(--duration-normal) var(--ease-out),border-color var(--duration-normal) var(--ease-out);
}
.emp-card-v2:hover { transform:translateY(-3px); box-shadow:var(--shadow-lg) !important; border-color:transparent !important; }
.emp-card-v2--inactive { opacity:.7; }
.emp-card-v2--inactive:hover { opacity:1; }
.emp-card-v2__link { position:absolute; inset:0; z-index:1; }

.emp-card-v2__strip { width:100%; height:3px; background:var(--color-slate-200); flex-shrink:0; }
.emp-strip-admin { background:linear-gradient(90deg,#7c3aed,#a78bfa); }
.emp-strip-employee { background:linear-gradient(90deg,#0284c7,#38bdf8); }
.emp-strip-observer { background:linear-gradient(90deg,#94a3b8,#cbd5e1); }

.emp-card-v2__avatar-wrap { position:relative; margin-top:24px; margin-bottom:12px; flex-shrink:0; }
.emp-card-v2__avatar {
  width:64px; height:64px; border-radius:50%; font-size:22px; font-weight:700; color:#fff;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--color-primary),var(--color-accent));
  box-shadow:0 4px 12px rgba(30,58,95,.2);
}
.emp-avatar-admin { background:linear-gradient(135deg,#7c3aed,#a78bfa); box-shadow:0 4px 12px rgba(124,58,237,.3); }
.emp-avatar-employee { background:linear-gradient(135deg,#0284c7,#38bdf8); box-shadow:0 4px 12px rgba(2,132,199,.3); }
.emp-avatar-observer { background:linear-gradient(135deg,#94a3b8,#64748b); box-shadow:0 4px 12px rgba(100,116,139,.2); }

.emp-card-v2__name {
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center;
  margin:0 0 8px; font-size:14px; font-weight:700; line-height:1.3; color:var(--color-slate-900); flex-shrink:0;
}

.emp-card-v2__role-wrap { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px; margin-bottom:16px; flex-shrink:0; }
.emp-role-admin,
.emp-role-employee,
.emp-role-observer { display:inline-block; padding:3px 9px; border-radius:20px; font-size:11px; font-weight:600; }
.emp-role-admin { background:#ede9fe; color:#7c3aed; border:1px solid #ddd6fe; }
.emp-role-employee { background:#dbeafe; color:#0284c7; border:1px solid #bfdbfe; }
.emp-role-observer { background:#f1f5f9; color:#64748b; border:1px solid #e2e8f0; }

.emp-card-v2__inactive-pill {
  padding:2px 8px; font-size:10px; font-weight:600; color:var(--color-slate-500);
  background:var(--color-slate-100); border:1px solid var(--color-slate-200); border-radius:20px;
}
.emp-card-v2__financials-badge {
  width:18px; height:18px; margin-left:4px; flex-shrink:0; vertical-align:middle; font-size:10px;
  display:inline-flex; align-items:center; justify-content:center; color:#15803d; background:#dcfce7; border-radius:50%;
}

.emp-card-v2__info { width:100%; display:flex; flex-direction:column; gap:6px; flex-grow:1; }
/* ИСПРАВЛЕНИЕ: Выравнивание иконки строго по центру строки (было flex-start) */
.emp-card-v2__info-row { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--color-slate-500); line-height:1.4; }
.emp-card-v2__info-row i { flex-shrink:0; font-size:13px; opacity:.6; margin:0; display:flex; align-items:center; justify-content:center; }
.emp-card-v2__info-row span { word-break:break-word; }

.emp-card-v2__workload { width:100%; min-height:28px; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:8px; }
.emp-card-v2__workload-badge {
  position:relative; z-index:2; display:inline-flex; align-items:center; gap:4px; padding:3px 10px;
  font-size:11px; font-weight:600; color:var(--color-primary-light);
  background:var(--color-primary-50); border:1px solid var(--color-primary-100); border-radius:20px;
}

/* ИСПРАВЛЕНИЕ: Фиксированная минимальная высота подвала для ровной линии */
.emp-card-v2__footer {
  position:relative; z-index:2; width:100%; margin-top:auto;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
}

.emp-card-v2__contacts-row {
  width:100%; min-height:48px; display:flex; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap;
  border-top:1px solid var(--color-slate-100); padding-top:12px; margin-top:12px;
}
.emp-card-v2__footer-empty { font-size:11px; color:var(--color-slate-400); }
.emp-card-v2__contact, .contact-action {
  width:32px; height:32px; font-size:14px; color:var(--color-slate-500); text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--color-slate-50); border:1px solid var(--color-slate-200); border-radius:var(--radius-sm);
  transition:all var(--duration-fast) var(--ease-out);
}
.contact-action { width:36px; height:36px; font-size:15px; }
.emp-card-v2__contact:hover, .contact-action:hover { transform:translateY(-2px); box-shadow:var(--shadow-sm); }
.emp-contact-phone:hover, .emp-contact-whatsapp:hover, .contact-action--phone:hover, .contact-action--whatsapp:hover { background:#dcfce7; border-color:#86efac; color:#15803d; }
.emp-contact-email:hover, .contact-action--email:hover { background:#dbeafe; border-color:#93c5fd; color:#1d4ed8; }
.emp-contact-telegram:hover, .contact-action--telegram:hover { background:#e0f2fe; border-color:#7dd3fc; color:#0369a1; }

.contact-row { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.contact-row .contact-action { width:30px; height:30px; font-size:13px; }

.emp-card-v2__actions-row {
  width:100%; display:flex; align-items:center; justify-content:center; gap:8px; margin-top:12px;
}

.info-panel { overflow:hidden; margin-bottom:16px; background:#fff; border:1px solid var(--color-slate-200); border-radius:var(--radius-lg); }
.info-panel__header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; background:var(--color-slate-50); border-bottom:1px solid var(--color-slate-100); }
.info-panel__title { display:flex; align-items:center; gap:8px; margin:0; font-size:13px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--color-slate-700); }
.info-panel__title i { font-size:14px; color:var(--color-primary-light); }
.info-panel__counter { padding:2px 10px; font-size:12px; font-weight:600; color:var(--color-slate-500); background:#fff; border:1px solid var(--color-slate-200); border-radius:var(--radius-full); }
.info-panel__body { padding:16px 18px; }
.info-panel__body--no-pad { padding:0 !important; }
.info-panel__footer { padding:10px 18px; font-size:12px; text-align:center; background:var(--color-slate-50); border-top:1px solid var(--color-slate-100); }

.meta-list { display:flex; flex-direction:column; gap:4px; }
.meta-list__item { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--color-slate-50); }
.meta-list__item:last-child { border-bottom:none; }
.meta-list__icon { width:28px; height:28px; flex-shrink:0; font-size:13px; color:var(--color-slate-500); display:flex; align-items:center; justify-content:center; background:var(--color-slate-50); border-radius:var(--radius-sm); }
.meta-list__label { margin-bottom:1px; font-size:11px; letter-spacing:.3px; text-transform:uppercase; color:var(--color-slate-400); }
.meta-list__value { font-size:13px; font-weight:500; color:var(--color-slate-800); word-break:break-word; }
.meta-list__value a { color:var(--color-primary-light); text-decoration:none; }
.meta-list__value a:hover { text-decoration:underline; }
.meta-list__body { flex:1; min-width:0; }

.le-chip {
  display:flex; align-items:center; gap:10px; padding:10px 12px;
  background:var(--color-slate-50); border:1px solid var(--color-slate-200); border-radius:var(--radius-sm);
  transition:background-color var(--duration-fast) var(--ease-out);
}
.le-chip:hover { background:var(--color-primary-50); border-color:var(--color-primary-100); }
.le-chip__icon { width:30px; height:30px; flex-shrink:0; color:var(--color-primary-light); display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid var(--color-slate-200); border-radius:var(--radius-sm); }
.le-chip__body { flex:1; min-width:0; }
.le-chip__name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:600; color:var(--color-slate-800); }
.le-chip__inn { font-size:11px; color:var(--color-slate-400); font-family:'JetBrains Mono','Courier New',monospace; }

.employee-hero { position:relative; overflow:hidden; margin-bottom:24px; padding:28px 28px 24px; color:#ffffff !important; background:linear-gradient(135deg,#1e3a5f 0%,#2d5a9e 100%); border-radius:16px; box-shadow:0 10px 25px -5px rgba(30,58,95,.25); }
.employee-hero::before { content:''; position:absolute; top:-60%; right:-10%; width:500px; height:500px; background:radial-gradient(circle,rgba(255,255,255,.12) 0%,transparent 70%); pointer-events:none; }
.employee-hero::after { content:''; position:absolute; bottom:-40%; left:-10%; width:300px; height:300px; background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%); pointer-events:none; }
.employee-hero--admin { background:linear-gradient(135deg,#5b21b6 0%,#7c3aed 50%,#a78bfa 100%) !important; }
.employee-hero--employee { background:linear-gradient(135deg,#0c4a6e 0%,#0284c7 50%,#38bdf8 100%) !important; }
.employee-hero--observer { background:linear-gradient(135deg,#334155 0%,#475569 50%,#94a3b8 100%) !important; }
.employee-hero__inner { position:relative; z-index:1; display:flex; align-items:center; flex-wrap:wrap; gap:24px; }
.employee-hero__avatar { width:80px; height:80px; flex-shrink:0; font-size:30px; font-weight:700; color:#ffffff !important; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.2); border:3px solid rgba(255,255,255,.35); border-radius:50%; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:0 8px 24px rgba(0,0,0,.15); }
.employee-hero__info { flex:1; min-width:240px; }
.employee-hero__name { margin:0 0 4px; font-size:26px; font-weight:800; line-height:1.2; letter-spacing:-.4px; color:#ffffff !important; text-shadow:0 1px 2px rgba(0,0,0,.1); }
.employee-hero__position { margin-bottom:12px; font-size:14px; font-weight:500; color:rgba(255,255,255,.85) !important; }
.employee-hero__meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.employee-hero__meta-item { display:inline-flex; align-items:center; gap:6px; padding:4px 12px; font-size:12px; font-weight:500; color:rgba(255,255,255,.95) !important; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.2); border-radius:20px; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.employee-hero__meta-item i { font-size:11px; opacity:.9; }
.employee-hero__meta-item--inactive { background:rgba(239,68,68,.25) !important; border-color:rgba(239,68,68,.4) !important; }
.employee-hero__action { display:inline-flex; align-items:center; gap:6px; padding:7px 14px; font-size:12.5px; font-weight:500; color:#ffffff !important; text-decoration:none !important; cursor:pointer; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.25); border-radius:8px; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); transition:all .2s ease; }
.employee-hero__action:hover { color:#ffffff !important; background:rgba(255,255,255,.3) !important; border-color:rgba(255,255,255,.4) !important; transform:translateY(-1px); }
.employee-hero__action--danger { background:rgba(239,68,68,.25) !important; border-color:rgba(239,68,68,.4) !important; }
.employee-hero__action--danger:hover { background:rgba(239,68,68,.4) !important; border-color:rgba(239,68,68,.6) !important; }


/* ═══════════════════════════════════════════════════════════════════
   АВТОРИЗАЦИЯ (LOGIN & SELECT ORG) - АНИМИРОВАННЫЙ ФОН
   ═══════════════════════════════════════════════════════════════════ */
.login-page {
    position: relative;
    min-height: 100vh;
    background-color: #f1f5f9;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-bg-decor {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: linear-gradient(135deg, #1e3a5f 0%, #0ea5e9 100%);
}

.decor-circle {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    animation: floatCircles 20s infinite ease-in-out alternate;
}
.decor-circle-1 { width: 500px; height: 500px; background: #60a5fa; top: -10%; left: -10%; animation-delay: 0s; }
.decor-circle-2 { width: 600px; height: 600px; background: #34d399; bottom: -20%; right: -10%; animation-delay: -5s; }
.decor-circle-3 { width: 400px; height: 400px; background: #818cf8; top: 40%; left: 40%; animation-delay: -10s; }

@keyframes floatCircles {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(40px, 60px) scale(1.15); }
}

.login-wrapper {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 20px;
}
.login-card {
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25);
    overflow: hidden;
}
.login-logo-wrap {
    display: inline-flex; align-items: center; justify-content: center;
    width: 64px; height: 64px; background: #f8fafc; border-radius: 16px;
    box-shadow: 0 4px 6px rgba(15, 23, 42, 0.05), inset 0 0 0 1px #e2e8f0;
    margin-bottom: 24px;
}
.login-logo-wrap svg { width: 32px; height: 32px; }

.login-input {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: 14.5px !important;
    font-weight: 500;
    transition: all 0.2s ease !important;
}
.login-input:focus {
    background: #ffffff !important;
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15) !important;
}
.login-input-group {
    display: flex;
    align-items: stretch;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.2s ease;
}
.login-input-group:focus-within {
    background: #ffffff;
    border-color: #3b82f6;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15);
}
.login-input-group .login-input {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    flex: 1;
}
.login-eye-btn {
    display: flex; align-items: center; justify-content: center;
    border: none; background: #f1f5f9;
    border-left: 1px solid #e2e8f0;
    color: #64748b; padding: 0 16px; cursor: pointer; transition: all 0.2s ease;
}
.login-eye-btn:hover { background: #e2e8f0; color: #0f172a; }

.login-btn {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    border: none; border-radius: 10px; padding: 12px; font-size: 15px; font-weight: 700; color: #ffffff;
    box-shadow: 0 6px 12px -4px rgba(45, 90, 158, 0.3); transition: all 0.2s ease;
}
.login-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 16px -4px rgba(45, 90, 158, 0.4); color: #fff; }
.login-btn:active { transform: translateY(0); }


/* ═══════════════════════════════════════════════════════════════════
   ФОРМЫ СПРАВОЧНИКОВ (Сотрудники, Юрлица, Поставщики)
   ═══════════════════════════════════════════════════════════════════ */
.role-select-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; margin-bottom:8px; }
.role-card { position:relative; display:flex; align-items:flex-start; gap:12px; padding:16px; border:2px solid #e2e8f0; border-radius:12px; background:#fff; cursor:pointer; transition:all .2s ease; }
.role-card:hover { border-color:#cbd5e1; background:#f8fafc; }
.role-card input[type="radio"] { position:absolute; opacity:0; width:0; height:0; }
.role-card.is-selected { border-color:var(--color-primary); background:var(--color-primary-50); }
.role-card.is-selected .role-icon { background:var(--color-primary); color:#fff !important; }
.role-icon { display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:8px; background:#f1f5f9; font-size:18px; flex-shrink:0; transition:all .2s ease; }
.role-title { font-weight:700; color:#1e293b; margin-bottom:2px; display:block; }
.role-desc { font-size:12px; color:#64748b; line-height:1.4; display:block; }

.le-checkbox-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.le-card { display:flex; align-items:center; gap:12px; padding:12px 16px; border:1px solid #e2e8f0; border-radius:10px; background:#fff; cursor:pointer; transition:all .15s ease; }
.le-card:hover { border-color:#cbd5e1; }
.le-card input[type="checkbox"] { margin:0; width:18px; height:18px; cursor:pointer; }
.le-card.is-checked { border-color:#3b82f6; background:#eff6ff; }
.le-info { display:flex; flex-direction:column; min-width:0; }
.le-name { font-weight:600; color:#334155; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.le-inn { font-size:11px; color:#64748b; }

/* ═══════════════════════════════════════════════════════════════════
   МАРЖИНАЛЬНОСТЬ
   ═══════════════════════════════════════════════════════════════════ */
.margin-display { font-size:3rem; line-height:1; }
.margin-excellent { color:#198754; }
.margin-good { color:#0dcaf0; }
.margin-warning { color:#ffc107; }
.margin-bad { color:#dc3545; }

/* ═══════════════════════════════════════════════════════════════════
   ЛОТЫ / ТОВАРЫ / ПОСТАВЩИКИ (v17.2)
   ═══════════════════════════════════════════════════════════════════ */
.product-list { display:flex; flex-direction:column; }
.product-item { display:flex; align-items:flex-start; gap:14px; padding:14px 16px; border-bottom:1px solid #f1f5f9; transition:background .15s ease; }
.product-item:last-child { border-bottom:none; }
.product-item:hover { background:#f8fafc; }
.product-item--in-stock { background:linear-gradient(90deg,#f0fdf4 0%,transparent 200px); }
.product-item--in-stock:hover { background:linear-gradient(90deg,#dcfce7 0%,#f8fafc 300px); }
.product-item__check { flex-shrink:0; width:36px; height:36px; padding:0; display:flex; align-items:center; justify-content:center; font-size:28px; color:#cbd5e1; cursor:pointer; background:none; border:none; transition:color .15s ease,transform .15s ease; }
.product-item__check:hover { color:#16a34a; transform:scale(1.1); }
.product-item--in-stock .product-item__check { color:#16a34a; }
.product-item--in-stock .product-item__check:hover { color:#15803d; }
.product-item__body { flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.product-item__title-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.product-item__number { padding:2px 8px; font-size:11px; font-weight:700; color:#64748b; background:#f1f5f9; border:1px solid #e2e8f0; border-radius:6px; flex-shrink:0; }
.product-item__name { font-size:14px; font-weight:600; color:#1e293b; min-width:0; flex:1; }
.product-item__qty { padding:2px 8px; font-size:11px; font-weight:500; color:#64748b; background:#f1f5f9; border-radius:6px; }
.product-item__stock-badge { padding:3px 8px !important; font-size:10px !important; background:#dcfce7 !important; color:#15803d !important; border:1px solid #bbf7d0 !important; }
.product-item__supplier-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12.5px; }
.product-item__supplier-name { color:#15803d; font-weight:500; }
.product-item__supplier-inn { color:#94a3b8; font-size:11px; }
.product-item__supplier-empty { color:#94a3b8; font-style:italic; }
.product-item__supplier-edit { font-size:12px !important; padding:2px 8px !important; color:#64748b !important; text-decoration:none; }
.product-item__supplier-edit:hover { color:#3b82f6 !important; }
.product-item__finance-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:10px 16px; padding:10px 12px; background:#f8fafc; border:1px solid #e2e8f0; border-radius:8px; margin-top:4px; }
.product-item__finance-cell { display:flex; flex-direction:column; gap:2px; min-width:0; }
.product-item__finance-label { font-size:10px; font-weight:600; text-transform:uppercase; letter-spacing:.3px; color:#94a3b8; }
.product-item__finance-value { display:flex; align-items:center; gap:6px; font-size:13px; }
.product-item__progress { display:flex; align-items:center; gap:8px; margin-top:4px; }
.product-item__progress-bar { flex:1; height:6px; background:#e2e8f0; border-radius:3px; overflow:hidden; }
.product-item__progress-fill { height:100%; width:0; border-radius:3px; transition:width .3s ease; }
.product-item__progress-fill--paid { background:#16a34a; }
.product-item__progress-fill--partial { background:#3b82f6; }
.product-item__progress-fill--overdue { background:#ef4444; }
.product-item__progress-label { font-size:11px; font-weight:600; color:#64748b; min-width:40px; text-align:right; }
.product-item__notes { padding:6px 10px; margin-top:4px; font-size:12px; font-style:italic; color:#64748b; background:#fefce8; border-left:3px solid #fde68a; border-radius:4px; }
.product-item__actions { flex-shrink:0; display:flex; align-items:flex-start; gap:4px; }
.product-list__summary { padding:12px 16px; background:#f8fafc; border-top:1px solid #e2e8f0; }

.supplier-pay-card { padding:0; transition:background .15s ease; }
.supplier-pay-card:hover { background:#f8fafc; }
.supplier-pay-card__header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; background:#f8fafc; border-bottom:1px solid #e2e8f0; }
.supplier-pay-card__title { display:flex; align-items:center; gap:10px; min-width:0; flex:1; }
.supplier-pay-card__title > i { font-size:20px; color:#3b82f6; flex-shrink:0; }
.supplier-pay-card__name { font-size:13px; font-weight:700; color:#1e293b; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.supplier-pay-card__inn { font-size:10.5px; color:#94a3b8; font-family:monospace; }
.supplier-pay-card__lots { padding:4px 0; }
.supplier-pay-card__lot-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 16px; transition:background .15s ease; }
.supplier-pay-card__lot-row:hover { background:#eff6ff; }
.supplier-pay-card__lot-info { display:flex; align-items:center; gap:8px; min-width:0; flex:1; font-size:12.5px; }
.supplier-pay-card__lot-amount { display:flex; align-items:center; gap:6px; flex-shrink:0; font-size:13px; }
.supplier-pay-card__total { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px; background:#f1f5f9; font-size:13px; border-top:1px solid #e2e8f0; }
.supplier-pay-card__grand-total { padding:14px 16px; background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%); border-top:2px solid #bfdbfe; }

/* ════════════════════════════════════════════════════════════════
   СЕТКА КАЛЕНДАРЯ (Оптимизированная версия)
   ════════════════════════════════════════════════════════════════ */
.cal-grid { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; }
.cal-grid thead th { background-color:#ffffff; color:#64748b; font-size:11px; text-transform:uppercase; letter-spacing:0.5px; font-weight:700; padding:12px 8px; text-align:center; border-bottom:1px solid #e2e8f0; }
.cal-grid thead th.cal-weekend { color:#ef4444; }

.cal-day-cell { position:relative; min-height:105px; height:105px; width:14.2857%; vertical-align:top; padding:0 !important; background:#ffffff; border-right:1px solid #f1f5f9; border-bottom:1px solid #f1f5f9; }
.cal-day-cell:last-child { border-right:none; }
.cal-grid tbody tr:last-child .cal-day-cell { border-bottom:none; }

.cal-day-btn { position:relative; width:100%; height:100%; min-height:105px; border:0; background:transparent; padding:10px; text-align:left; display:flex; flex-direction:column; cursor:pointer; transition:background-color 0.2s ease; }
.cal-day-btn:hover { background-color:rgba(59,130,246,0.04); }
.cal-day-btn:focus-visible { outline:2px solid #3b82f6; outline-offset:-2px; }

.cal-day-head { display:flex; align-items:center; margin-bottom:auto; }
.cal-day-number { font-size:15px; font-weight:700; color:#334155; }
.cal-weekend-day .cal-day-number { color:#94a3b8; }
.cal-day-today .cal-day-number { color:white; background-color:#3b82f6; width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:13px; }
.cal-day-muted .cal-day-btn { opacity:0.35; }

/* ДЕСКТОП: Строгий ряд (слева направо) */
.cal-day-badges {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; 
    justify-content: flex-start;
    align-items: flex-end;
    gap: 4px;
    width: 100%;
    margin-top: 8px;
}
.cal-badge-sq {
    width: 32px; height: 32px; flex: 0 0 32px; 
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
    border-radius: 6px; border: 1px solid transparent; transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.cal-day-btn:hover .cal-badge-sq { transform: translateY(-2px); box-shadow: 0 3px 8px rgba(15, 23, 42, 0.08); }
.cal-badge-sq i { font-size: 11px; line-height: 1; }
.cal-badge-sq span { font-size: 12px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; color:#ffffff; }
.cal-badge--danger  { background-color: #ef4444; color:#ffffff; }
.cal-badge--warning { background-color: #f59e0b; color:#ffffff; }
.cal-badge--success { background-color: #10b981; color:#ffffff; }
.cal-badge--neutral { background-color: #64748b; color:#ffffff; }

/* Стили модалки календаря */
.calendar-event-card { overflow:hidden; background:#fff; border:1px solid rgba(15,23,42,.08); border-left-width:4px; border-radius:16px; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.calendar-event-card--danger { border-left-color:#ef4444; }
.calendar-event-card--warning { border-left-color:#f59e0b; }
.calendar-event-card--success { border-left-color:#16a34a; }
.calendar-event-card--neutral { border-left-color:#94a3b8; }
.calendar-event-icon { width:34px; height:34px; flex:0 0 34px; font-size:16px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; }
.calendar-event-icon--danger { background:#fee2e2; color:#dc2626; }
.calendar-event-icon--warning { background:#fef3c7; color:#d97706; }
.calendar-event-icon--success { background:#dcfce7; color:#15803d; }
.calendar-event-icon--neutral { background:#e2e8f0; color:#475569; }
.calendar-event-meta { font-size:11px; line-height:1.35; color:var(--color-slate-500); }
.calendar-event-note { font-size:12px; line-height:1.45; color:var(--color-slate-600); }

/* ═══════════════════════════════════════════════════════════════════
   АНИМАЦИИ
   ═══════════════════════════════════════════════════════════════════ */
@keyframes rowFadeIn { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeInUp { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes floatSlow {
  0%,100% { transform:translate(0,0); }
  25% { transform:translate(15px,-20px); }
  50% { transform:translate(-10px,15px); }
  75% { transform:translate(20px,10px); }
}
@keyframes pulseGlow {
  0%,100% { box-shadow:0 0 0 0 rgba(239,68,68,.3); }
  50% { box-shadow:0 0 0 6px rgba(239,68,68,0); }
}
@keyframes pulseHighlight {
  0% { box-shadow:0 0 0 0 rgba(14,165,233,.5); }
  100% { box-shadow:0 0 0 12px rgba(14,165,233,0); }
}
@keyframes onlinePulse {
  0%,100% { box-shadow:0 0 0 0 rgba(34,197,94,.4); }
  50% { box-shadow:0 0 0 3px rgba(34,197,94,0); }
}
@keyframes skeletonShimmer {
  0% { background-position:200% 0; }
  100% { background-position:-200% 0; }
}

.blink { animation:blink 1.2s ease-in-out infinite; }
.fade-in-up { animation:fadeInUp .3s var(--ease-out) forwards; }
.pulse-danger { animation:pulseGlow 2s ease-in-out infinite; }
.pulse-highlight { animation:pulseHighlight 1.5s ease; }


/* ═══════════════════════════════════════════════════════════════════
   АДАПТИВНОСТЬ
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 1199.98px) {
  .cal-badge-sq span { font-size: 11px; }
}

@media (max-width: 991.98px) {
  .proc-alert-icon { width:20px; height:20px; font-size:10px; }
  .product-name-cell { max-width:220px; font-size:12.5px; }
  
  .cal-day-cell { min-height: 80px; height: 80px; }
  .cal-day-btn { padding: 6px; }
  .cal-day-number { font-size: 14px; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .app-main { padding: 20px; }
}

@media (max-width: 767.98px) {
  .app-sidebar { width:var(--sidebar-width) !important; transform:translateX(-100%); box-shadow:none; transition:transform var(--duration-normal) var(--ease-out); }
  .app-main { margin-left:0 !important; padding:16px; }
  .sidebar-open .app-sidebar { transform:translateX(0); box-shadow:4px 0 24px rgba(0,0,0,.15); }
  .sidebar-open::after { content:''; position:fixed; inset:0; z-index:99; background:rgba(0,0,0,.3); animation:fadeIn var(--duration-fast) ease; }
  .sidebar-collapse-btn { display:none !important; }
  .navbar-user-btn { padding:5px; border-color:transparent; border-radius:50%; }
  .criteria-card .row > div + div { margin-top:6px; padding-top:10px; border-top:1px solid var(--color-slate-100); }
  .procurement-table-frame { height:calc(100vh - 320px); min-height:320px; }
  .procurement-table-wrap::-webkit-scrollbar { width:6px; height:8px; }
  body.body--fullscreen-table { overflow:visible !important; }
  .body--fullscreen-table .app-container { height:auto !important; overflow:visible !important; }
  .body--fullscreen-table .app-main { display:block !important; height:auto !important; overflow:visible !important; }
  .body--fullscreen-table .page-content { display:block !important; height:auto !important; overflow:visible !important; }
  .body--fullscreen-table #procurement-workspace { display:block !important; }
  .body--fullscreen-table #procurement-workspace > .procurement-filters-card { margin-bottom:1rem !important; }
  .body--fullscreen-table #procurement-workspace > .procurement-table-card, .body--fullscreen-table #procurement-workspace > .procurement-table-card > .card-body { display:block !important; }
  .body--fullscreen-table #procurement-workspace > nav { margin-top:1rem !important; }
  .body--fullscreen-table .procurement-table-frame { height:calc(100vh - 320px) !important; min-height:320px !important; flex:0 0 auto !important; }
  .proc-title { font-size:17px !important; }
  .deadline-chip { padding:5px 10px; font-size:11px; }
  .deadline-chip__label { display:none; }
  .proc-header-btn span { display:none !important; }
  .employee-hero { padding:22px 20px 20px; }
  .employee-hero__inner { gap:16px; }
  .employee-hero__avatar { width:72px; height:72px; font-size:28px; }
  .employee-hero__name { font-size:20px; }
  .employee-hero__actions { width:100%; margin-left:0; }

  .period-switcher {
      flex-direction: column;
      align-items: stretch;
      gap: 10px;
  }
  .period-switcher-left {
      width: 100%;
      justify-content: flex-start;
  }
  .period-switcher-group {
      width: 100%;
      overflow-x: auto;
      scrollbar-width: none;
      max-width: 100%;
  }
  .period-switcher-group::-webkit-scrollbar { display: none; }
  .period-btn-label { max-width: 100px; }
  .money-pipeline { grid-template-columns: repeat(2, 1fr); }
  .money-bucket { min-height: 96px; padding: 12px; }
  .money-bucket-amount { font-size: 15px; }
}

@media (max-width: 575.98px) {
  .page-title { font-size:17px; }
  .kpi-value { font-size:22px; }
  .app-main { padding:12px; }
  .views-switcher-wrap { border-radius:0; }
  .view-tab { padding:10px 12px; font-size:12px; }
  .empty-state { padding:40px 16px; }
  .empty-state-icon { width:56px; height:56px; font-size:24px; }
  .sidebar-link { min-height:44px; }
  .btn-sm { min-height:36px; padding:6px 12px; }
  .col-sticky { position:static !important; z-index:auto !important; left:auto !important; width:auto !important; box-shadow:none !important; }
  .sticky-pin-btn { display:none !important; }
  .dashboard-nav { gap:2px; padding:3px; }
  .dashboard-nav-link { padding:7px 12px; font-size:12px; }
  .monitoring-table .col-region, .monitoring-table .col-etp { display:none; }
  .monitoring-product-name { -webkit-line-clamp:3; }
  .procurement-table-frame { height:calc(100vh - 280px); min-height:280px; }
  
  .main-tabs .row { --bs-gutter-x:.25rem; }
  .main-tab-btn { padding:8px 8px; }
  .main-tab-title { font-size:12px; }
  .dates-matrix-header, .dates-matrix-row { padding:6px 8px; font-size:11px; }
  .dates-edit-btn { padding:2px 3px; }
  .dates-edit-btn i { font-size:10px; }
  .active-proc-item { padding:12px 14px; gap:10px; }
  .active-proc-item__right { display:none; }
  .navbar-org-name { display:none; }

  .period-switcher { padding: 6px 8px; gap: 6px; }
  .period-switcher-label { font-size: 11px; }
  .period-btn { padding: 5px 8px; font-size: 11.5px; }
  .period-btn-label { max-width: 90px; }

  /* КАЛЕНДАРЬ МОБАЙЛ: Строгая сетка 2x2 */
  .cal-day-cell { min-height: 65px; height: 65px; }
  .cal-day-btn { padding: 4px; }
  .cal-day-number { font-size: 12px; }
  .cal-day-today .cal-day-number { width: 20px; height: 20px; font-size: 11px; }
  
  .cal-day-badges { 
      display: grid;
      grid-template-columns: repeat(2, 20px); 
      justify-content: start; 
      gap: 2px; 
      margin-top: 4px; 
  }
  .cal-badge-sq { width: 20px; height: 20px; flex: none; border-radius: 4px; }
  .cal-badge-sq i { display: none; } 
  .cal-badge-sq span { font-size: 10px; margin-top: 1px; color:#ffffff; }
}

@media (min-width: 1400px) {
  .app-main { padding: 28px 36px; }
}

/* ═══════════════════════════════════════════════════════════════════
   ПЕЧАТЬ И ДОСТУПНОСТЬ
   ═══════════════════════════════════════════════════════════════════ */
@media print {
  .app-navbar,.app-sidebar,.page-actions,.views-switcher-wrap,.btn,.toast-container,.workflow-panel form,.dashboard-nav,.period-switcher { display:none !important; }
  .app-main { margin-left:0 !important; padding:0 !important; }
  .card { box-shadow:none !important; border:1px solid #ddd !important; }
  .col-sticky { position:static !important; }
  .employee-hero { color:#000 !important; background:#fff !important; border:1px solid #ddd; box-shadow:none !important; }
  .employee-hero__name,.employee-hero__position,.employee-hero__meta-item { color:#000 !important; }
  .procurement-table-frame { height:auto !important; min-height:0 !important; overflow:visible !important; }
  .procurement-table-wrap { overflow:visible !important; max-height:none !important; }
  .procurement-table thead th { position:static !important; box-shadow:none !important; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .navbar-online-dot, .criteria-status-dot--active, .blink, .pulse-danger, .wf-badge--danger, .view-tab-urgent .view-tab-count, .decor-circle-1, .decor-circle-2, .decor-circle-3 { animation:none !important; }
  .navbar-online-dot { box-shadow:0 0 0 2px rgba(34,197,94,.4); }
  .criteria-status-dot--active { box-shadow:0 0 0 3px rgba(34,197,94,.2); }
}


/* ═══════════════════════════════════════════════════════════════════
   v22.5: СРОК ПОСТАВКИ + ФОРМА ИМПОРТА ИЗ ЕИС (вынесено из HTML)
   Добавить в КОНЕЦ static/css/main.css
   ═══════════════════════════════════════════════════════════════════ */

/* Тип дней — квадратные чекбоксы-радио */
.delivery-type-options {
  height: 100%;
}
.delivery-type-option {
  cursor: pointer;
  background: #fff;
  border-color: #dee2e6 !important;
  transition: all .15s ease;
  user-select: none;
  min-height: 38px;
  padding-top: .375rem;
  padding-bottom: .375rem;
}
.delivery-type-option:hover {
  background: #f8f9fa;
  border-color: #adb5bd !important;
}
.delivery-type-option input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.delivery-type-checkbox {
  position: relative;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  border: 2px solid #ced4da;
  background: #fff;
  flex-shrink: 0;
  transition: all .15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.delivery-type-checkbox::after {
  content: '';
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  margin-top: -2px;
  opacity: 0;
  transition: opacity .1s ease;
}
.delivery-type-option:has(input[type="radio"]:checked) {
  background: #eff6ff !important;
  border-color: #3b82f6 !important;
}
.delivery-type-option:has(input[type="radio"]:checked) .delivery-type-checkbox {
  background: #3b82f6;
  border-color: #3b82f6;
}
.delivery-type-option:has(input[type="radio"]:checked) .delivery-type-checkbox::after {
  opacity: 1;
}
.delivery-type-option:has(input[type="radio"]:checked) span.fw-medium {
  color: #1e40af;
  font-weight: 600 !important;
}

/* Карточка импорта по номеру / данные загружены */
.form-import-card {
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(180deg, #fff 0%, #f8fdff 100%);
}
.form-loaded-card {
  border-radius: 16px;
  overflow: hidden;
}
.form-loaded-header {
  background: #f0fdf4;
}
.form-section-soft {
  background: #fafbfc;
}
.form-card-rounded {
  border-radius: 16px !important;
}

.icon-square {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
  flex-shrink: 0;
}
.icon-square--sm {
  width: 38px;
  height: 38px;
  font-size: 17px;
}
.icon-square--primary {
  background: linear-gradient(135deg, #1e3a5f, #0ea5e9);
}
.icon-square--success {
  background: linear-gradient(135deg, #16a34a, #22c55e);
}

.section-label-upper {
  letter-spacing: .4px;
}

.lot-preview-item {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.lot-preview-name {
  line-height: 1.35;
}
.lot-preview-meta {
  font-size: 11.5px;
}
.lot-preview-place {
  max-width: 400px;
}
.lot-preview-term {
  max-width: 300px;
}
.lot-preview-price {
  font-size: 14px;
}
.lot-badge-num {
  font-size: 11px;
}
.lot-badge-synth {
  font-size: 9px;
}

.doc-row-compact {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.doc-icon-sm {
  width: 28px;
  height: 28px;
  font-size: 13px;
}
.doc-status-w {
  font-size: 11px;
  min-width: 60px;
  text-align: right;
}
.doc-dl-btn {
  padding: 2px 8px;
  font-size: 11px;
}
.spin-xs {
  width: 10px;
  height: 10px;
}
.spin-sm-12 {
  width: 12px;
  height: 12px;
}

.form-help-xs {
  font-size: 11.5px;
}
.inn-msg-text {
  font-size: 13px;
}
.btn-inn-pull {
  border-radius: 8px;
}
.role-card-desc {
  font-size: .78rem;
}

/* Карточка тендера: иконки и справочный текст */
.ef-icon-primary {
  color: #3b82f6;
}
.ef-value-text-left {
  text-align: left;
}
.ef-value-pre {
  text-align: left;
  white-space: pre-wrap;
  word-break: break-word;
}
.ef-value-eis-term {
  text-align: left;
  white-space: pre-wrap;
  font-style: italic;
}
.loss-reason-box {
  background: #fef2f2;
  border: 1px solid #fecaca;
  white-space: pre-wrap;
}
.loss-reason-label {
  font-size: 11px;
}
.pipeline-dot-sm {
  font-size: 8px;
}
.badge-matrix-xs {
  font-size: 9px;
}
.chevron-muted {
  color: #94a3b8;
}
.customer-name-max {
  max-width: 280px;
}
.field-flash-success {
  border-color: #22c55e !important;
  transition: border-color .4s ease;
}