/* =====================================================================
 * Cargo CRM — стили нового интерфейса (v2, редизайн)
 * Современные кнопки, плавные анимации, скелетоны, чистые панели.
 * ===================================================================== */

/* ---------- Базовые утилиты, которых нет в purged-сборке ---------- */
.z-30 { z-index: 30; } .z-40 { z-index: 40; } .z-50 { z-index: 50; } .z-\[60\]{z-index:60;} .z-\[70\]{z-index:70;}
.min-w-0 { min-width: 0; }
.flex-1 { flex: 1 1 0%; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-start { align-items: flex-start; }
.justify-center { justify-content: center; }
.max-w-md { max-width: 28rem; }
.w-full { width: 100%; }
.h-screen { height: 100vh; }
.overflow-y-auto { overflow-y: auto; }
.overflow-hidden { overflow: hidden; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.whitespace-nowrap { white-space: nowrap; }
.whitespace-pre-wrap { white-space: pre-wrap; }
.break-all { word-break: break-all; }
.font-mono { font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace; font-size: .92em; }
.tabular-nums { font-variant-numeric: tabular-nums; }
.select-all { user-select: all; }
.line-through { text-decoration: line-through; }
.opacity-60 { opacity: .6; } .opacity-40 { opacity: .4; }
.shrink-0 { flex-shrink: 0; }
.cursor-pointer { cursor: pointer; }
.text-right { text-align: right; } .text-center { text-align: center; }
.leading-2\.5 { line-height: .7rem; }
.gap-1 { gap: .25rem; }
.space-y-2 > * + * { margin-top: .5rem; }
.space-y-3 > * + * { margin-top: .75rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.max-h-96 { max-height: 24rem; }
.max-h-\[60vh\] { max-height: 60vh; }
@media (min-width:640px){ .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));} .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (min-width:768px){ .md\:hidden{display:none;} .md\:block{display:block;} .md\:flex{display:flex;} .md\:col-span-4{grid-column:span 4/span 4;} .md\:col-span-6{grid-column:span 6/span 6;} .md\:col-span-8{grid-column:span 8/span 8;} }
@media (min-width:1024px){ .lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr));} }

/* ---------- Плавность по умолчанию ---------- */
* { -webkit-tap-highlight-color: transparent; }
.crm-anim, .card, .btn, button, a, input, select, .sidebar-link, .crm-chip, .crm-tab {
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease, opacity .18s ease, transform .18s ease;
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }

/* ---------- САЙДБАР: скролл, чтобы меню не обрезалось ---------- */
.left-sidebar { display: flex; flex-direction: column; }
.left-sidebar .scroll-sidebar,
.left-sidebar .simplebar-content-wrapper { height: calc(100vh - 74px); max-height: calc(100vh - 74px); overflow-y: auto; }
.left-sidebar .scroll-sidebar { padding-bottom: 2rem; }
.left-sidebar .scroll-sidebar::-webkit-scrollbar { width: 6px; }
.left-sidebar .scroll-sidebar::-webkit-scrollbar-thumb { background: rgba(125,143,172,.35); border-radius: 6px; }
.left-sidebar .caption { padding: 1rem .25rem .35rem; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #9aa8be; }
.dark .left-sidebar .caption { color: #5f708c; }
.sidebar-item { margin-bottom: 2px; }
.sidebar-link { display: flex; align-items: center; gap: .7rem; padding: .6rem .8rem; border-radius: 10px; font-weight: 500; font-size: .92rem; color: #4a5a75; }
.dark .sidebar-link { color: #8b9cb8; }
.sidebar-link:hover { background: var(--color-lightprimary, rgba(93,135,255,.12)); color: var(--color-primary,#5D87FF); }
.sidebar-link.active, .sidebar-link.activemenu { background: var(--color-primary,#5D87FF); color: #fff; box-shadow: 0 6px 16px -6px rgba(93,135,255,.7); }
.sidebar-link.active svg, .sidebar-link.activemenu svg { color: #fff; }

/* ---------- КНОПКИ (современные) ---------- */
.btn, .b {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  padding: .55rem .95rem; border-radius: 10px; font-weight: 600; font-size: .88rem;
  line-height: 1; border: 1px solid transparent; cursor: pointer; white-space: nowrap;
  background: var(--color-primary,#5D87FF); color: #fff;
}
.btn:hover, .b-primary:hover { background: var(--color-primaryemphasis,#4570EA); box-shadow: 0 8px 18px -8px rgba(93,135,255,.8); }
.btn:disabled, .b:disabled { opacity: .5; pointer-events: none; box-shadow: none; }
.b-primary { background: var(--color-primary,#5D87FF); color:#fff; }
.b-secondary { background: var(--color-secondary,#49BEFF); color:#fff; }
.b-success { background: var(--color-success,#13DEB9); color:#fff; }
.b-warning { background: var(--color-warning,#FFAE1F); color:#fff; }
.b-error { background: var(--color-error,#FA896B); color:#fff; }
.b-success:hover{background:#11c4a4;} .b-warning:hover{background:#e69c17;} .b-error:hover{background:#e2745a;} .b-secondary:hover{background:#38a9e8;}
/* призрачные / контурные */
.b-ghost { background: transparent; color: #4a5a75; border-color: transparent; }
.dark .b-ghost { color: #8b9cb8; }
.b-ghost:hover { background: var(--color-lightprimary,rgba(93,135,255,.12)); color: var(--color-primary,#5D87FF); }
.b-outline { background: transparent; border-color: var(--color-border,#e5eaef); color: #4a5a75; }
.dark .b-outline { border-color: #333f55; color:#8b9cb8; }
.b-outline:hover { border-color: var(--color-primary,#5D87FF); color: var(--color-primary,#5D87FF); background: var(--color-lightprimary,rgba(93,135,255,.08)); }
.b-outline-error { background:transparent; border-color: var(--color-error,#FA896B); color: var(--color-error,#FA896B); }
.b-outline-error:hover { background: var(--color-error,#FA896B); color:#fff; }
.b-sm { padding: .4rem .7rem; font-size: .8rem; border-radius: 9px; }
.b-icon { padding: .5rem; border-radius: 10px; width: 2.4rem; height: 2.4rem; }
/* иконка-кнопка круглая в тулбаре */
.b-tool { display:inline-flex; align-items:center; justify-content:center; width:2.4rem; height:2.4rem; border-radius:10px; color:#4a5a75; cursor:pointer; background:transparent; }
.dark .b-tool { color:#8b9cb8; }
.b-tool:hover { background: var(--color-lightprimary,rgba(93,135,255,.12)); color: var(--color-primary,#5D87FF); }
.b-tool.active { background: var(--color-primary,#5D87FF); color:#fff; }

/* ---------- Сегментированный тулбар фильтров ---------- */
.crm-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; }
.crm-chip {
  display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .85rem; border-radius:10px;
  font-weight:600; font-size:.85rem; cursor:pointer; white-space:nowrap;
  background: var(--color-lightgray,#f4f6fb); color:#4a5a75; border:1px solid transparent;
}
.dark .crm-chip { background: #29334480; color:#8b9cb8; }
.crm-chip:hover { background: var(--color-lightprimary,rgba(93,135,255,.14)); color: var(--color-primary,#5D87FF); }
.crm-chip.active { background: var(--color-primary,#5D87FF); color:#fff; }
.crm-chip .crm-chip-badge { background: rgba(255,255,255,.25); border-radius:20px; padding:0 .4rem; font-size:.72rem; }

/* ---------- Табы ---------- */
.crm-tab { padding:.5rem .95rem; border-radius:10px; font-weight:600; font-size:.86rem; cursor:pointer; color:#4a5a75; background:transparent; border:1px solid transparent; }
.dark .crm-tab { color:#8b9cb8; }
.crm-tab:hover { background: var(--color-lightprimary,rgba(93,135,255,.12)); color: var(--color-primary,#5D87FF); }
.crm-tab.active { background: var(--color-primary,#5D87FF); color:#fff; }

/* ---------- Поля ---------- */
.form-control:focus, select:focus { outline:none; border-color: var(--color-primary,#5D87FF); box-shadow: 0 0 0 3px rgba(93,135,255,.15); }
.crm-search { position: relative; display: block; }
.crm-search input { padding-left: 2.75rem; border-radius: 12px; }
.crm-search svg { position:absolute; left:.95rem; top:50%; transform:translateY(-50%); color:#9aa8be; pointer-events:none; display:block; }

/* чекбоксы покрупнее и аккуратнее */
.crm-cbx { width:1.15rem; height:1.15rem; border-radius:6px; accent-color: var(--color-primary,#5D87FF); cursor:pointer; flex-shrink:0; }

/* ---------- Карточки-строки списков ---------- */
.crm-row-click { cursor:pointer; border-radius:12px; }
.crm-row-click:hover { background: var(--color-lightprimary,rgba(93,135,255,.07)); }
.dark .crm-row-click:hover { background: rgba(255,255,255,.035); }
.crm-list-item { border:1px solid var(--color-border,#e9eef4); border-radius:12px; }
.dark .crm-list-item { border-color:#2b3648; }

/* аккордеоны */
.crm-acc-body.hidden { display:none; }
.rotate-180 { transform: rotate(180deg); }
.transition-transform { transition: transform .2s ease; }

/* ---------- Статус-бейджи ---------- */
.crm-badge { display:inline-flex; align-items:center; gap:.3rem; padding:.28rem .7rem; border-radius:20px; font-size:.74rem; font-weight:600; white-space:nowrap; }

/* ---------- Читаемые цвета мета-текста (были слишком светлые/блёклые) ---------- */
.crm-t-buyout { color:#1f5fc0; } .dark .crm-t-buyout { color:#8fbcff; }
.crm-t-calc { color:#0a8f6f; } .dark .crm-t-calc { color:#33d6b8; }
.crm-t-muted { color:#4a5a75; } .dark .crm-t-muted { color:#9fb0c9; }

/* ==== ГЛОБАЛЬНОЕ УСИЛЕНИЕ ЦВЕТНОГО ТЕКСТА (в светлой теме были блёклые/«неживые») ====
 * Затрагивает ТОЛЬКО текст (кнопки красятся своими классами и остаются как есть). */
.light .text-primary   { color:#2f52c0 !important; }
.light .text-secondary { color:#0f7bab !important; }
.light .text-info      { color:#2c62c8 !important; }
.light .text-success   { color:#079268 !important; }
.light .text-warning   { color:#a86f0c !important; }
.light .text-error     { color:#d8462a !important; }
/* в тёмной теме делаем цвета чуть ярче и сочнее */
.dark .text-primary    { color:#8aa6ff !important; }
.dark .text-secondary  { color:#5bccff !important; }
.dark .text-info       { color:#77a8ff !important; }
.dark .text-success    { color:#2fe0bd !important; }
.dark .text-warning    { color:#ffc04d !important; }
.dark .text-error      { color:#ff9e82 !important; }
/* кнопки с цветным фоном — текст всегда белый (не даём переопределить) */
.btn, .b-primary, .b-secondary, .b-success, .b-warning, .b-error,
.crm-chip.active, .sidebar-link.active { color:#fff !important; }

/* ---------- Модалки ---------- */
/* Оверлей: фикс на весь экран, сам не скроллится */
.crm-modal-backdrop {
  position: fixed; inset: 0; z-index: 60;
  background: rgba(17,25,40,.55); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; padding: 32px 12px;
  animation: crm-fade .18s ease;
}
/* Коробка модалки: центрирована, ограничена по высоте, не двигается */
.crm-modal-box {
  width:100%; max-height: calc(100vh - 64px); display:flex;
  animation: crm-pop .22s cubic-bezier(.2,.8,.3,1);
}
.crm-modal-box > .card {
  display:flex; flex-direction:column; width:100%; max-height:100%; overflow:hidden;
  box-shadow: 0 24px 60px -20px rgba(17,25,40,.5);
}
/* Шапка и футер закреплены */
.crm-modal-header, .crm-modal-footer { flex-shrink:0; }
/* Тело по умолчанию — единственная зона прокрутки */
.crm-modal-box > .card > .card-body {
  flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain;
}
/* Режим «закреплённые блоки + один прокручиваемый список внутри тела» */
.crm-modal-box > .card > .card-body.crm-body-flex {
  overflow:hidden; display:flex; flex-direction:column;
}
.crm-modal-box .card-body.crm-body-flex > * { flex-shrink:0; }
.crm-modal-box .card-body.crm-body-flex > .crm-grow {
  flex:1 1 auto; min-height:0; display:flex; flex-direction:column;
}
.crm-modal-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }
/* Двухколоночная модалка выдачи: слева заказы на всю высоту, справа управление */
.im-2col { display:flex; flex-direction:column; flex:1 1 auto; min-height:0; }
.im-2col > .im-left, .im-2col > .im-right { min-height:0; }
@media (min-width:768px){
  .im-2col { flex-direction:row; }
  .im-2col > .im-left { flex:1 1 58%; border-right:1px solid var(--color-border,#e9eef4); }
  .dark .im-2col > .im-left { border-right-color:#2b3648; }
  .im-2col > .im-right { flex:1 1 42%; }
}
@media (max-width:767px){
  .im-2col > .im-left { max-height:52vh; border-bottom:1px solid var(--color-border,#e9eef4); }
  .dark .im-2col > .im-left { border-bottom-color:#2b3648; }
}
/* Блокировка прокрутки страницы, пока открыта модалка */
body.modal-open { overflow:hidden; }
.crm-w-md{max-width:32rem;} .crm-w-lg{max-width:44rem;} .crm-w-xl{max-width:60rem;} .crm-w-2xl{max-width:78rem;}
@keyframes crm-fade { from{opacity:0;} to{opacity:1;} }
@keyframes crm-pop { from{opacity:0; transform:translateY(14px) scale(.98);} to{opacity:1; transform:none;} }

/* ======================================================
 * Оболочка приложения: сайдбар и шапка закреплены,
 * скроллится только область контента (#view).
 * ====================================================== */
.page-wrapper { height:100vh; display:flex; flex-direction:column; overflow:hidden; }
.page-wrapper > header { flex-shrink:0; }
.page-wrapper > main { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
#view { flex:1 1 auto; min-height:0; }
/* обычные разделы прокручиваются целиком */
#view.view-scroll { overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }
/* разделы с закреплённым тулбаром: карточка заполняет высоту, скроллится только список */
#view.view-fixed { overflow:hidden; display:flex; flex-direction:column; }
#view.view-fixed > .card { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; margin-bottom:0; }
#view.view-fixed > .card > .card-body { flex:1 1 auto; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
#view.view-fixed > .card > .card-body > *:not(.crm-scroll-list) { flex-shrink:0; }
.crm-scroll-list { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; }

/* ---------- Правая панель ИИ (slide-over) ---------- */
#ai-drawer {
  position: fixed; top:0; right:0; height:100vh; width:100%; max-width:420px; z-index:70;
  transform: translateX(100%); transition: transform .28s cubic-bezier(.2,.8,.3,1);
  display:flex; flex-direction:column;
  box-shadow: -20px 0 50px -25px rgba(17,25,40,.5);
}
#ai-drawer.open { transform: translateX(0); }
#ai-backdrop { position:fixed; inset:0; z-index:65; background:rgba(17,25,40,.4); opacity:0; visibility:hidden; transition:opacity .25s; }
#ai-backdrop.open { opacity:1; visibility:visible; }
.ai-msg-user { background: var(--color-primary,#5D87FF); color:#fff; border-radius:14px 14px 3px 14px; padding:.6rem .85rem; margin-left:2rem; }
.ai-msg-bot { background:#f1f4f9; border-radius:14px 14px 14px 3px; padding:.6rem .85rem; margin-right:2rem; color:#2A3547; }
.dark .ai-msg-bot { background:#2b3648; color:#e6ebf2; }

/* ---------- Тосты ---------- */
.crm-toast {
  min-width:260px; max-width:400px; display:flex; align-items:center; gap:.6rem;
  padding:.8rem 1rem; border-radius:12px; color:#fff; font-size:.88rem; font-weight:500;
  box-shadow:0 12px 30px -10px rgba(17,25,40,.45); animation: crm-toast-in .25s ease;
}
@keyframes crm-toast-in { from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }
.crm-toast.ok{background:#13c296;} .crm-toast.err{background:#FA896B;} .crm-toast.info{background:#5D87FF;} .crm-toast.warn{background:#FFAE1F; color:#3d2c00;}

/* ---------- Скелетоны ---------- */
.crm-skel { position:relative; overflow:hidden; background:var(--color-lightgray,#eef2f7); border-radius:10px; }
.dark .crm-skel { background:#252f3f; }
.crm-skel::after { content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent); animation:crm-shimmer 1.3s infinite; }
.dark .crm-skel::after { background:linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent); }
@keyframes crm-shimmer { 100%{ transform:translateX(100%);} }
.crm-skel-row { height:64px; margin-bottom:.6rem; }

/* появление строк списка */
.crm-enter { animation: crm-enter .25s ease both; }
@keyframes crm-enter { from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

/* подсветка при сканировании */
.crm-flash { animation: crm-flash 1.2s ease; }
@keyframes crm-flash { 0%{background:rgba(93,135,255,.28);} 100%{background:transparent;} }

/* спиннер в кнопке */
.crm-spin { animation: crm-spin 1s linear infinite; }
@keyframes crm-spin { to { transform: rotate(360deg); } }

/* таблицы «липкая шапка» */
.sticky-th thead th { position:sticky; top:0; background:#fff; z-index:1; }
.dark .sticky-th thead th { background: var(--color-dark,#202936); }