/* ══════════════════════════════════════════════════════════
   Реестр отгрузок — современная светлая тема (soft rounded)
   Загружается ПОСЛЕ app.css и перекрывает базовые стили.
   ══════════════════════════════════════════════════════════ */

:root {
  /* акценты */
  --primary: #3b82f6;
  --primary-deep: #2563eb;
  --primary-soft: #eff6ff;
  --primary-light: #60a5fa;
  --ring: rgba(59, 130, 246, .14);
  --ring-strong: rgba(59, 130, 246, .28);
  --logo-grad-a: #3b82f6;
  --logo-grad-b: #7c3aed;
  --btn-grad-a: #3b82f6;
  --btn-grad-b: #7c3aed;
  --btn-shadow: rgba(79, 70, 229, .28);
  --topbar-a: #16120e;
  --topbar-b: #211a14;
  --topbar-glow-a: rgba(96, 165, 250, .55);
  --topbar-glow-b: rgba(45, 212, 191, .4);

  /* текст — тёплые тона */
  --ink: #1c1917;
  --text: #2d2a24;
  --muted: #7a7261;
  --faint: #a49b86;

  /* фон и карточки — тёплый крем, как в образцах */
  --bg: #f6f1e7;
  --card: #fffdf8;
  --card-solid: #fffdf8;
  --card-solid-2: #faf6ec;
  --border: #e7decc;
  --border-soft: #efe8d8;
  --glass: #fffdf8;

  /* статусные */
  --danger: #dc2626;
  --danger-soft: #fef2f2;
  --green: #059669;
  --green-soft: #ecfdf5;
  --amber: #d97706;
  --amber-soft: #fffbeb;

  /* тени — мягкие и «дорогие» */
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .05);
  --shadow-md: 0 2px 4px rgba(16, 24, 40, .04), 0 10px 26px -12px rgba(16, 24, 40, .1);
  --shadow-lg: 0 4px 8px rgba(16, 24, 40, .05), 0 20px 44px -16px rgba(16, 24, 40, .16);
  --shadow-primary: 0 4px 16px rgba(79, 70, 229, .3);

  /* радиусы — всё закруглённое */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;

  /* таблицы */
  --row-hover: #faf5ea;
  --row-stripe: #fcf9f2;
  --sel: #dbeafe;
  --sel-border: #3b82f6;

  /* свечения фона — тёплые */
  --glow-a: rgba(217, 119, 6, .08);
  --glow-b: rgba(120, 80, 20, .06);
  --glow-c: rgba(59, 130, 246, .04);
}

/* темы компаний */
body.theme-green {
  --primary: #059669;
  --primary-deep: #047857;
  --primary-soft: #ecfdf5;
  --primary-light: #10b981;
  --ring: rgba(5, 150, 105, .14);
  --ring-strong: rgba(5, 150, 105, .28);
  --logo-grad-a: #10b981;
  --logo-grad-b: #0d9488;
  --btn-grad-a: #10b981;
  --btn-grad-b: #0d9488;
  --btn-shadow: rgba(5, 150, 105, .3);
  --sel: #d1fae5;
  --sel-border: #10b981;
}
body.theme-violet {
  --primary: #7c3aed;
  --primary-deep: #6d28d9;
  --primary-soft: #f5f3ff;
  --primary-light: #8b5cf6;
  --ring: rgba(124, 58, 237, .14);
  --ring-strong: rgba(124, 58, 237, .28);
  --logo-grad-a: #8b5cf6;
  --logo-grad-b: #d946ef;
  --btn-grad-a: #8b5cf6;
  --btn-grad-b: #c026d3;
  --btn-shadow: rgba(124, 58, 237, .32);
  --sel: #ede9fe;
  --sel-border: #8b5cf6;
}

/* ═══ базовое полотно ═══ */
html, body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  background:
    radial-gradient(1100px 520px at 12% -8%, var(--glow-a), transparent 60%),
    radial-gradient(900px 480px at 88% -12%, var(--glow-b), transparent 55%),
    var(--bg) !important;
  background-attachment: fixed;
  color: var(--text);
}
::selection { background: rgba(59, 130, 246, .2); }

/* ═══ сайдбар — светлый, закруглённые пункты ═══ */
.sidebar {
  background: #fffdf8 !important;
  border-right: 1px solid var(--border-soft);
}
.sidebar-brand { color: var(--ink); }
.brand-name { color: var(--ink); }
.sidebar-label { color: #a49b86; }
.nav-item {
  color: #6b6455;
  border-radius: 12px;
}
.nav-item:hover { background: #f5efe2; color: var(--ink); }
.nav-item.active {
  background: linear-gradient(135deg, #eef2ff, #f5f3ff) !important;
  color: #4f46e5 !important;
  box-shadow: none;
  border: 1px solid #e0e7ff;
}
.company-item {
  background: #fffdf8;
  border-color: var(--border);
  color: var(--text);
  border-radius: 12px;
}
.company-item:hover { background: #faf6ec; }
.company-item.active {
  background: linear-gradient(135deg, #eef2ff, #f5f3ff);
  border-color: #e0e7ff;
  color: #4338ca;
}
.company-check { color: #059669; }
.sidebar-user { border-top-color: var(--border-soft); }
.user-name { color: var(--ink); }
.user-role { color: #a49b86; }
.sidebar .btn-link { color: #a49b86; }
.sidebar .btn-link:hover { color: #dc2626; background: #fef2f2; }

/* ═══ верхняя панель ═══ */
.page-topbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 10px 16px;
  border-radius: 18px;
  background: #fffdf8;
  border: 1px solid var(--border-soft);
  box-shadow: var(--shadow-md);
}
.pt-search { position: relative; flex: 1; max-width: 560px; min-width: 200px; }
.pt-search-icon {
  position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  color: var(--faint); font-size: 13px; pointer-events: none;
}
.pt-search input {
  width: 100%;
  padding: 10px 16px 10px 40px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: #f5efe2;
  color: var(--text);
  font: inherit; font-size: 13.5px;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.pt-search input::placeholder { color: var(--faint); }
.pt-search input:focus {
  outline: none;
  border-color: var(--primary);
  background: #fffdf8;
  box-shadow: 0 0 0 4px var(--ring);
}
.pt-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.pt-icon {
  position: relative;
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: #fffdf8;
  color: var(--muted);
  font-size: 16px; cursor: pointer;
  transition: background .15s ease, transform .15s ease, border-color .15s ease;
}
.pt-icon:hover { background: #faf6ec; border-color: #e7decc; transform: translateY(-1px); }
.pt-dot {
  position: absolute; top: 8px; right: 8px;
  width: 8px; height: 8px; border-radius: 50%;
  background: #ec4899;
  border: 2px solid #ffffff;
}
.pt-avatar {
  width: 38px; height: 38px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 14px; color: #fff;
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
  box-shadow: 0 0 0 2px #ffffff, 0 4px 12px rgba(79, 70, 229, .3);
  text-decoration: none;
}

/* ═══ карточки — белые, крупные радиусы, мягкие тени ═══ */
.card-section, .card-head, .toolbar, .pane, .stat, .modal, .login-card,
.dadata-item, .dadata-box, .settings-company, .user-row, .upload-row,
.file-chosen, .contact-row, .contract-row, .consignee-row,
.mini-map, .request-progress, .inline-form, .partner-dialog,
.history-row td {
  background: #fffdf8 !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: var(--shadow-md);
}
.card-head::before {
  display: block !important;
  background: linear-gradient(90deg, #3b82f6, #7c3aed, #ec4899);
  height: 3px;
}
.card-section, .stat, .dadata-item {
  transition: transform .18s ease, box-shadow .18s ease;
}
.card-section:hover, .stat:hover, .dadata-item:hover {
  box-shadow: var(--shadow-lg), 0 0 0 1px rgba(59, 130, 246, .12) !important;
  transform: translateY(-2px);
}

/* ═══ кнопки — скруглённые ═══ */
.btn {
  background: #fffdf8;
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 12px;
}
.btn:hover {
  background: #faf6ec;
  border-color: #e7decc;
  box-shadow: var(--shadow-sm);
}
.btn.primary {
  background: linear-gradient(135deg, var(--btn-grad-a), var(--btn-grad-b));
  border: none;
  color: #fff;
  box-shadow: var(--shadow-primary);
}
.btn.primary:hover {
  background: linear-gradient(135deg, var(--primary-light), var(--btn-grad-b));
  box-shadow: 0 8px 24px var(--btn-shadow);
  transform: translateY(-1px);
}
.btn.danger { border-color: #fecaca; background: #fffdf8; }
.btn-1c-on { border-color: #16a34a; background: #dcfce7; color: #166534; font-weight: 600; }
.btn-1c-on:hover { background: #bbf7d0; }
.icon-btn { background: #fffdf8; border: 1px solid var(--border); color: var(--muted); border-radius: 10px; }

/* ═══ формы — скруглённые ═══ */
.field input, .field select, .field textarea,
.inline-form input, .search, .toolbar .search,
.dadata-row input, .user-row input, .user-row select,
.settings-row input, .settings-row select, .upload-row input,
.contact-row input, .contact-row select, .contract-row input, .contract-row textarea,
.consignee-row input, .consignee-row textarea, .modal textarea,
.filter-label input[type="date"], .bik-row input,
#items-table input, #items-table select {
  background: #fffdf8 !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 12px;
}
.field input:focus, .field select:focus, .field textarea:focus,
.inline-form input:focus, .search:focus, .toolbar .search:focus,
.dadata-row input:focus, .user-row input:focus, .settings-row input:focus,
.upload-row input:focus, .contact-row input:focus, .contract-row input:focus,
.consignee-row input:focus, .modal textarea:focus, .bik-row input:focus,
#items-table input:focus, #items-table select:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 4px var(--ring) !important;
}
.field span { color: #6b6455; }
/* формы внутри карточек-блоков — без внутренней прокрутки */
.card-section .form-grid { max-height: none; overflow: visible; }
.card-section .dadata-row input { min-width: 200px; }

/* ═══ канбан-доска заявок ═══ */
.board-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 14px; flex-wrap: wrap; margin-bottom: 16px;
}
.board-title h2 { margin: 0; font-size: 20px; font-weight: 800; color: #2d2a24; }
.board-title p { margin: 4px 0 0; font-size: 12.5px; }
.board-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.kanban {
  display: flex; gap: 14px; align-items: flex-start;
  overflow-x: auto; padding-bottom: 16px; min-height: 60vh;
}
.kanban-col {
  flex: 1; min-width: 264px; max-width: 340px;
  background: #f5efe2;
  border: 1px solid var(--border-soft);
  border-radius: 16px; padding: 12px;
  display: flex; flex-direction: column;
}
.kanban-col-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px; padding: 0 4px;
}
.kanban-col-head h3 { margin: 0; font-size: 13.5px; font-weight: 700; color: #2d2a24; }
.kanban-count {
  background: #fff; border: 1px solid var(--border-soft); border-radius: 999px;
  padding: 1px 9px; font-size: 12px; font-weight: 700; color: #6b6455;
}
.kanban-list { display: flex; flex-direction: column; gap: 10px; min-height: 120px; flex: 1; }
.kanban-list.drag-over {
  outline: 2px dashed #3b82f6; outline-offset: -6px;
  border-radius: 12px; background: #eff6ff;
}
.kanban-card {
  background: #fff; border: 1px solid var(--border-soft); border-radius: 14px;
  padding: 12px; box-shadow: var(--shadow-sm); cursor: grab;
  transition: box-shadow .15s ease, transform .15s ease, opacity .15s ease;
}
.kanban-card:hover { box-shadow: var(--shadow-md); transform: translateY(-1px); }
.kanban-card.dragging { opacity: .45; }
.kanban-card-top {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px; margin-bottom: 6px;
}
.kanban-num { font-weight: 800; color: var(--primary); text-decoration: none; font-size: 14px; }
.kanban-num:hover { text-decoration: underline; }
.kanban-customer { font-weight: 600; font-size: 13px; color: #2d2a24; }
.kanban-site, .kanban-date, .kanban-rate, .kanban-carrier { font-size: 12px; color: #6b6455; margin-top: 3px; }
.kanban-material { font-weight: 600; font-size: 12.5px; color: #2d2a24; margin-top: 4px; }
.kanban-vehicles {
  display: inline-flex; gap: 5px; margin-top: 5px;
  align-items: center; align-self: flex-start;
}
.kanban-vehicles .vt {
  font-size: 11px; font-weight: 700;
  border-radius: 999px; padding: 1px 8px;
  color: #a49b86; background: #f5efe2; border: 1px solid #e7decc;
  cursor: pointer; user-select: none;
  transition: all .12s ease;
}
.kanban-vehicles .vt:hover { border-color: #a7f3d0; }
.kanban-vehicles .vt.on {
  color: #047857; background: #ecfdf5; border-color: #a7f3d0;
}
.kanban-progress { height: 6px; background: #e7decc; border-radius: 999px; margin-top: 8px; overflow: hidden; }
.kanban-progress-bar { height: 100%; background: linear-gradient(90deg, #3b82f6, #7c3aed); border-radius: 999px; }
.kanban-vol { font-size: 11.5px; color: #6b6455; margin-top: 4px; }
.kanban-cr {
  margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--border-soft);
  font-size: 12px; color: #6b6455;
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
}
.kanban-cr a { color: var(--primary); font-weight: 700; text-decoration: none; }
.kanban-cr a:hover { text-decoration: underline; }
.kanban-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.kanban-tag {
  font-size: 10.5px; font-weight: 700; color: #6d28d9;
  background: #f5f3ff; border: 1px solid #ddd6fe;
  border-radius: 999px; padding: 1px 8px;
}
.kanban-empty { color: #a49b86; font-size: 12.5px; text-align: center; padding: 18px 0; }
.kanban-col.incoming { background: #fefce8; border-color: #fde68a; }
.kanban-card.incoming-card { border-color: #fde68a; }
.btn-block { width: 100%; margin-top: 8px; justify-content: center; }

/* ═══ активные заявки (карточки с маршрутом) ═══ */
.active-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 14px;
}
.active-card {
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 16px;
  padding: 14px;
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.active-card-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px; margin-bottom: 2px;
}
.active-params {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px; margin-top: 6px;
  align-items: start;
}
.active-param {
  display: flex; flex-direction: column; gap: 2px;
  font-size: 12px; color: #2d2a24;
  min-width: 0;
}
.active-param.wide { grid-column: span 2; }
.active-param span {
  font-size: 10.5px; font-weight: 700; color: #a49b86;
  text-transform: uppercase; letter-spacing: .02em;
  line-height: 1.4;
}
.active-val {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: 600; font-size: 12.5px;
}
.active-map {
  height: 170px; margin-top: 8px; border-radius: 12px; overflow: hidden;
}

/* ═══ переворот карточки активной заявки (без 3D — Leaflet корректно рисуется во всех браузерах) ═══ */
.active-card.flip-card { padding: 0; }
.flip-inner { position: relative; width: 100%; }
.flip-face {
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 16px;
}
.flip-front {
  position: relative; z-index: 1;
  padding: 14px;
  display: flex; flex-direction: column; gap: 4px;
}
.flip-back {
  display: none;
  padding: 14px;
  flex-direction: column; gap: 6px;
}
.flip-card.flipped .flip-front { display: none; }
.flip-card.flipped .flip-back { display: flex; }
.flip-back-title { font-size: 13.5px; color: #2d2a24; }
.flip-btn {
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 999px;
  cursor: pointer;
  font-size: 15px;
  padding: 3px 10px;
  line-height: 1.5;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  box-shadow: var(--shadow-sm);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.flip-btn:hover { border-color: var(--primary); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.flip-count {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
  color: #fff;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
  padding: 0 6px;
  line-height: 16px;
}
.flip-btn-back { font-size: 12.5px; padding: 4px 10px; }

/* ═══ симметрия форм в карточках ═══ */
.card-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.card-section .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.field input[type="file"] {
  width: 100%;
  min-width: 0;
  padding: 7px 10px;
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.file-current, .file-current a {
  word-break: break-all;
  overflow-wrap: anywhere;
  max-width: 100%;
  display: block;
}

/* ═══ фото ТТН в реестре ═══ */
.ttn-photos { display: inline-flex; gap: 5px; align-items: center; }
.ttn-photo-slot { width: 40px; height: 52px; }
.ttn-photo-slot img {
  width: 40px; height: 52px; object-fit: cover;
  border-radius: 8px; border: 1px solid var(--border-soft);
  box-shadow: var(--shadow-sm); display: block;
  transition: transform .15s ease, box-shadow .15s ease;
}
.ttn-photo-slot img:hover { transform: scale(1.06); box-shadow: var(--shadow-md); }
.ttn-photo-add {
  width: 40px; height: 52px;
  border: 1px dashed #d6ccb8; border-radius: 8px;
  background: #faf6ec; color: #a49b86; font-size: 15px;
  cursor: pointer; transition: all .15s ease;
}
.ttn-photo-add:hover { border-color: var(--primary); color: var(--primary); background: #eff6ff; }
#shipments-table .col-photo .tabulator-cell { justify-content: center; }
.modal-body-pad { padding: 14px 22px; }
.ttn-result { margin-top: 12px; font-size: 13px; display: flex; flex-direction: column; gap: 8px; }
.ttn-progress { color: #1d4ed8; }
.ttn-result-ok { color: #047857; font-weight: 600; }
.ttn-result-err { color: #dc2626; font-size: 12px; }

/* ═══ пул нераспознанных фото ТТН ═══ */
.pool-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin-top: 14px; }
.pool-card {
  background: #fff; border: 1px solid var(--border-soft); border-radius: 16px;
  padding: 12px; box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 8px;
}
.pool-photo img {
  width: 100%; max-height: 240px; object-fit: contain;
  border-radius: 10px; border: 1px solid var(--border-soft); background: #faf6ec;
}
.pool-info { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.pool-info select { padding: 8px 10px; border-radius: 10px; border: 1px solid var(--border); background: #fff; font: inherit; }
.pool-status.ok { color: #047857; font-weight: 700; }
.pool-status.err { color: #dc2626; font-size: 12px; }

/* ═══ массовые действия в реестре (меню как в Bitrix) ═══ */
.bulk-wrap { position: relative; display: inline-flex; }
.bulk-btn { display: inline-flex; align-items: center; gap: 7px; }
.bulk-count {
  background: linear-gradient(135deg, #3b82f6, #7c3aed);
  color: #fff; border-radius: 999px; padding: 1px 8px;
  font-size: 11.5px; font-weight: 700; line-height: 18px;
}
.bulk-menu {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 500;
  min-width: 270px; background: #fffdf8;
  border: 1px solid var(--border-soft); border-radius: 14px;
  box-shadow: var(--shadow-lg); padding: 6px;
  display: flex; flex-direction: column;
}
.bulk-menu.hidden { display: none; }
.bulk-item {
  display: block; width: 100%; text-align: left;
  background: none; border: none; cursor: pointer;
  padding: 9px 12px; border-radius: 9px;
  font-size: 13.5px; color: var(--text); font-family: inherit;
}
.bulk-item:hover { background: #f5efe2; }
.bulk-item.danger { color: #dc2626; }
.bulk-item.danger:hover { background: #fef2f2; }
.bulk-sep { height: 1px; background: var(--border-soft); margin: 5px 4px; }
.bulk-status { color: #b45309; font-size: 12.5px; }
#shipments-table .col-sel .tabulator-cell { justify-content: center; padding: 0 4px; }
#shipments-table .sel-cb, #sel-all-cb {
  accent-color: var(--primary); width: 16px; height: 16px; cursor: pointer;
}

/* ═══ строки договоров (редактор) ═══ */
.contract-row {
  grid-template-columns: 1.2fr 1.5fr 150px 1.4fr 44px;
  align-items: center;
}
.contract-row .ct-file-wrap {
  grid-column: 1 / -1;
  display: flex;
  gap: 10px;
  align-items: center;
}
.contract-row .ct-file { flex: 1; padding: 7px 10px; font-size: 12.5px; }
.contract-row .ct-file-link { text-decoration: none; font-size: 15px; }
.contract-row select {
  background: #fffdf8 !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 12px;
  padding: 9px 12px;
  font: inherit;
}
.contract-row select:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 4px var(--ring) !important;
}
.field input[type="checkbox"],
.checkbox-item input[type="checkbox"] { accent-color: var(--primary); }
.file-current { color: var(--muted); }
select option { background: #fffdf8; color: var(--text); }

/* ═══ вкладки — элегантное меню с градиентным подчёркиванием ═══ */
.tabs, .card-tabs {
  display: inline-flex;
  gap: 2px;
  background: transparent;
  padding: 0;
  border-radius: 0;
  border-bottom: 1px solid var(--border-soft);
  margin-bottom: 16px;
}
.tab {
  color: var(--muted);
  border-radius: 10px 10px 0 0;
  padding: 10px 18px;
  border-bottom: none !important;
  position: relative;
  font-weight: 500;
  background: transparent;
}
.tab:hover { color: var(--ink); background: #f5efe2; }
.tab.active {
  color: var(--ink);
  background: transparent;
  box-shadow: none;
  font-weight: 700;
}
.tab.active::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -1px;
  height: 2.5px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--btn-grad-a), var(--btn-grad-b));
}

/* ═══ блоки-колонки (адреса / материалы / грузополучатели) ═══ */
.agg-grid { gap: 12px; }
.agg-col {
  background: #faf6ec;
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  padding: 12px 14px;
  box-shadow: none;
}
.agg-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--faint);
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--border-soft);
}
.agg-items { font-size: 13.5px; line-height: 1.6; }
.agg-items > div + div { margin-top: 4px; padding-top: 4px; border-top: 1px dashed var(--border-soft); }
.agg-items .muted { color: var(--faint); }

/* ═══ заголовки ═══ */
.card-head h1, .settings-title, .login-card h1 { color: var(--ink); }
.card-section h3, .modal-head h3, .section-head-row h3 { color: #2d2a24; }
.agg-title { color: var(--faint); }
.kv dt { color: var(--muted); }
.kv dd { color: var(--text); }
.back-link { color: var(--muted); }
.back-link:hover { color: var(--primary); }
.partner-name-link, .contacts-table td a { color: var(--primary); }

/* ═══ бейджи — пилюли ═══ */
.badge { border-radius: 999px; padding: 3px 10px; }
.badge.kind-customer { background: #ecfdf5; color: #047857; box-shadow: inset 0 0 0 1px rgba(5, 150, 105, .2); }
.badge.kind-carrier { background: #eff6ff; color: #1d4ed8; box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .18); }
.badge.kind-supplier { background: #fffbeb; color: #b45309; box-shadow: inset 0 0 0 1px rgba(217, 119, 6, .18); }
.badge.vat-with { background: #eef2ff; color: #4338ca; }
.badge.vat-usn { background: #ecfdf5; color: #047857; }
.badge.vat-patent { background: #f5f3ff; color: #6d28d9; }
.badge.vat-none, .badge-inactive { background: #f5efe2; color: #7a7261; }
.badge.req-draft, .badge.spec-draft { background: #f5efe2; color: #6b6455; border: 1px solid #e7decc; }
.badge.req-logistics { background: #f5f3ff; color: #6d28d9; border: 1px solid #ddd6fe; }
.badge.req-sent, .badge.spec-on_approval { background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe; }
.badge.spec-protocol { background: #fffbeb; color: #b45309; border: 1px solid #fde68a; }
.badge.spec-in_progress, .badge.req-in_progress { background: #ecfeff; color: #0e7490; border: 1px solid #a5f3fc; }
.badge.req-in_progress { background: #ecfeff; color: #0e7490; border: 1px solid #a5f3fc; }
.badge.req-done, .badge.spec-signed { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; }

/* ═══ статус-селект ═══ */
.status-select { color: var(--text); border-radius: 10px; }
.status-select.req-draft { background-color: #faf6ec; color: #6b6455; border-color: #e7decc; }
.status-select.req-logistics { background-color: #f5f3ff; color: #6d28d9; border-color: #ddd6fe; }
.status-select.req-sent { background-color: #eff6ff; color: #1d4ed8; border-color: #bfdbfe; }
.status-select.req-in_progress { background-color: #ecfeff; color: #0e7490; border-color: #a5f3fc; }
.status-select.req-done { background-color: #ecfdf5; color: #047857; border-color: #a7f3d0; }

/* ═══ таблицы-списки ═══ */
.list-table th {
  background: #faf6ec;
  color: var(--muted);
}
.list-table { background: #fffdf8; }
.list-table td { border-bottom-color: var(--border-soft); }
.list-table tbody tr:hover { background: var(--row-hover); }
.row-link:hover td { background: var(--row-hover) !important; }

/* ═══ табулятор (реестр) — как Google Sheets, но закруглённый ═══ */
#shipments-table.tabulator {
  background: #fffdf8;
  border: 1px solid var(--border-soft);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
#shipments-table .tabulator-header {
  background: #faf6ec !important;
  border-bottom: 1px solid var(--border);
}
#shipments-table .tabulator-header .tabulator-col {
  background: #faf6ec;
  border-right: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border);
  color: #6b6455;
}
#shipments-table .tabulator-header .tabulator-col:hover { background: #f5efe2; }
#shipments-table .tabulator-colgroup-row { background: #faf6ec; }
#shipments-table .tabulator-col-group {
  background: #faf6ec;
  border-right: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border);
}
#shipments-table .group-title { color: var(--muted); }
#shipments-table .tabulator-row {
  background: #fffdf8;
  border-bottom: 1px solid var(--border-soft);
  color: var(--text);
}
#shipments-table .tabulator-row.tabulator-row-even { background: #fcf9f2; }
#shipments-table .tabulator-row:hover { background: var(--row-hover) !important; }
#shipments-table .tabulator-row .tabulator-cell {
  background: transparent;
  border-right: 1px solid var(--border-soft);
  color: var(--text);
}
#shipments-table .tabulator-row.row-needs-ttn .tabulator-cell { background: #fff8e1; }
#shipments-table .tabulator-cell.tabulator-frozen,
#shipments-table .tabulator-col.tabulator-frozen {
  background: #fffdf8;
}
#shipments-table .tabulator-col.col-rownum,
#shipments-table .tabulator-col.col-actions,
#shipments-table .col-actions {
  background: #faf6ec !important;
}
#shipments-table .tabulator-cell.col-actions { background: #faf6ec !important; }
#shipments-table .tabulator-cell.tabulator-range-selected,
#shipments-table .tabulator-cell.tabulator-range-only-cell-selected {
  background: #e8f0fe !important;
}
#shipments-table .tabulator-cell.tabulator-editing { background: #fffdf8 !important; }
#shipments-table .tabulator-header-filter input,
#shipments-table .tabulator-header-filter select {
  background: #fffdf8 !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
#shipments-table .tabulator-cell.tabulator-editing input,
#shipments-table .tabulator-cell.tabulator-editing select {
  background: #fffdf8 !important;
  border: 1px solid var(--primary) !important;
  color: var(--text) !important;
}
#shipments-table .tabulator-tableholder::-webkit-scrollbar-track { background: #faf6ec; }
#shipments-table .tabulator-tableholder::-webkit-scrollbar-thumb { background: #d6ccb8; }
#shipments-table .tabulator-tableholder::-webkit-scrollbar-thumb:hover { background: #a49b86; }
#shipments-table .tabulator-placeholder { background: transparent; color: var(--muted); }
#shipments-table .partner-link { color: var(--primary); }
#shipments-table .col-rownum { color: var(--faint); }
#shipments-table .margin-pos { color: var(--green); }
#shipments-table .margin-neg { color: var(--danger); }
#shipments-table .date-today { background: #eff6ff; }

/* списки редактирования и календарь */
.tabulator-edit-list {
  background: #fffdf8 !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-lg);
}
.tabulator-edit-list-item { color: var(--text); }
.tabulator-edit-list-item:hover { background: var(--row-hover); }
.tabulator-edit-list-item.active { background: var(--sel); color: var(--primary-deep); }
.date-editor input[type="text"] {
  background: #fffdf8 !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
.date-editor input.invalid { border-color: var(--danger) !important; }
.date-cal-btn { background: #fffdf8; border: 1px solid var(--border); color: var(--text); }
.date-cal-btn:hover { background: var(--primary-soft); }
.date-cal-overlay {
  background: #fffdf8 !important;
  border: 1px solid var(--border);
}
.check-square { border-color: #a49b86; background: #fffdf8; }
.check-square.checked { background: var(--green); border-color: var(--green); }
.check-square:hover { border-color: var(--primary); }

/* ═══ KPI-карточки ═══ */
.stat { border-radius: 18px; }
.stat-icon {
  box-shadow: 0 6px 16px rgba(16, 24, 40, .12);
}
.stat-value { color: var(--ink); font-weight: 800; }
.stat-label { color: var(--faint); }

/* ═══ модалки ═══ */
.modal-backdrop {
  background: rgba(15, 23, 42, .45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.modal { border-radius: 18px; }

/* ═══ прогресс заявки ═══ */
.progress-bar { background: #efe8d8; }
.progress-fill {
  background: linear-gradient(90deg, #3b82f6, #7c3aed, #ec4899);
}

/* ═══ карта ═══ */
.mini-map { border-radius: 18px; overflow: hidden; }

/* ═══ дерево договоров ═══ */
#contracts-tree tr.ctr-spec td { background: #faf6ec; }
#contracts-tree tr.ctr-spec:hover td { background: #f5efe2; }
#contracts-tree .tree-toggle {
  background: #fffdf8;
  border-color: var(--border);
  color: var(--text);
}
#contracts-tree .tree-count { color: var(--muted); }

/* ═══ страница входа ═══ */
.login-body {
  background:
    radial-gradient(1000px 520px at 15% -10%, var(--glow-a), transparent 60%),
    radial-gradient(800px 460px at 90% 110%, var(--glow-b), transparent 55%),
    var(--bg) !important;
}
.login-card {
  border-radius: 20px;
  box-shadow: var(--shadow-lg);
}

/* ═══ прочее ═══ */
.checkbox-item { color: var(--text); }
#items-table th { background: #faf6ec; color: var(--muted); }
#items-table td { border-bottom-color: var(--border-soft); }
.statusbar { color: var(--muted); }
.partner-dialog::backdrop {
  background: rgba(15, 23, 42, .4);
  backdrop-filter: blur(3px);
}
.section-text { color: var(--text); }
.kbd { background: #f5efe2; border-color: var(--border); color: var(--muted); }

/* ═══ анимация появления ═══ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; }
}
.content > .toolbar, .content > .statusbar, .content > .page-topbar,
.content > .card-page, .content > .pane, .content > .card-sections,
.content > .settings-page, .content > .grid {
  animation: fadeUp .35s ease backwards;
}

/* ═══ скроллбары ═══ */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #e7decc; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #c9bda3; }

/* ═══ контакты приёмки в заявке ═══ */
#req-contacts-list { display: flex; flex-direction: column; gap: 8px; }
#req-contacts-list .contact-row {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #faf6ec;
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  padding: 8px 12px;
}
#req-contacts-list .contact-info { flex: 1; min-width: 0; }
#req-contacts-list .contact-phone { color: var(--primary-deep); font-weight: 600; }

/* ── Раздел «Сверка» ─────────────────────────────────────────── */
.simple-table { border-collapse: collapse; font-size: 13px; }
.simple-table th, .simple-table td {
  border: 1px solid var(--border-soft); padding: 7px 10px; text-align: left;
  vertical-align: top; background: #fff;
}
.simple-table th { background: var(--bg-soft, #faf6ec); font-weight: 600; color: #6b6455; }
.simple-table tr:hover td { background: #f5efe2; }
.table-scroll { overflow-x: auto; max-width: 100%; }
.pkg-cell { max-width: 260px; word-break: break-word; }
.badge-ok { background: #dcfce7; color: #166534; }
.badge-warn { background: #fef3c7; color: #92400e; }
.badge-err { background: #fee2e2; color: #991b1b; }
.badge-info { background: #dbeafe; color: #1e40af; }
.row-hold td { background: #fefce8 !important; }
.row-hold { box-shadow: inset 4px 0 0 #f59e0b; }
.muted { color: #7a7261; font-size: 13px; }
.recon-big { font-size: 14px; padding: 12px 18px; display: inline-flex; flex-direction: column; gap: 4px; align-items: center; }
.recon-big .bulk-count { background: #eef2ff; color: #4338ca; border-radius: 10px; padding: 1px 8px; font-size: 12px; }
/* Раздел «Сверка»: карточки во всю ширину, без деления на колонки */
.card-sections.single { grid-template-columns: 1fr; max-width: 100%; }
/* Карточки (контрагент, заявка, объект и пр.) — на всю ширину рабочей зоны, как остальные разделы */
.card-page { max-width: none; }
.partner-card-form { max-width: none; }
/* Селекты-фильтры в тулбарах (Бухгалтерия, На контроле) */
select.filter-select {
  padding: 7px 10px;
  border: 1px solid #e7decc;
  border-radius: 10px;
  background: #fff;
  font: inherit;
  font-size: 13px;
  color: #2d2a24;
}
/* Табы-ссылки в разделе «Сверка» */
.tabs a.tab { text-decoration: none; }
.tab .bulk-count { background: #eef2ff; color: #4338ca; border-radius: 10px; padding: 1px 8px; font-size: 12px; margin-left: 4px; }
.group-head td { background: #e7decc !important; font-weight: 700; }
.group-sub td { background: #f5efe2 !important; font-weight: 600; }
/* Финансы */
.text-err { color: #dc2626; }
.text-warn { color: #d97706; }
.text-ok { color: #166534; }
.ok-cell { color: #166534; background: #f0fdf4; }
.warn-cell { color: #92400e; background: #fffbeb; }
tr.cp-row { cursor: pointer; }
tr.cp-row:hover td { background: #eef2ff; }

/* ══════════════════════════════════════════════════════════
   Полировка UX: микро-анимации, плавные состояния, скроллбары
   ══════════════════════════════════════════════════════════ */

/* страница мягко проявляется при открытии */
main, .page {
  animation: pageIn .35s cubic-bezier(.22, .9, .3, 1) backwards;
}
@keyframes pageIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* кнопки: подъём при наведении и нажатие */
.btn {
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease,
              border-color .16s ease, color .16s ease, opacity .16s ease;
}
.btn:hover:not(:disabled) { transform: translateY(-1px); }
.btn:active:not(:disabled) { transform: translateY(0) scale(.98); }
.btn.primary:hover:not(:disabled) {
  box-shadow: 0 8px 20px -6px var(--btn-shadow, var(--shadow-primary));
}

/* карточки: мягкая тень при наведении */
.card-section, .card-page, .panel {
  transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}
.card-section:hover, .card-page:hover, .panel:hover {
  box-shadow: var(--shadow-md);
}

/* пункты меню — индикатор плавно подъезжает */
.sidebar nav a {
  position: relative;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.sidebar nav a:hover { transform: translateX(2px); }
.sidebar nav a.active::before {
  content: "";
  position: absolute;
  left: -12px; top: 50%;
  transform: translateY(-50%);
  width: 4px; height: 60%;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--primary-light), var(--primary));
  animation: navDot .25s ease both;
}
@keyframes navDot {
  from { opacity: 0; transform: translateY(-50%) scaleY(.3); }
  to   { opacity: 1; transform: translateY(-50%) scaleY(1); }
}

/* строки таблиц — плавное выделение */
.list-table tbody tr, .tabulator-row {
  transition: background .14s ease;
}

/* ссылки — плавное подчёркивание */
a { transition: color .16s ease; }

/* инпуты/селекты — единый плавный фокус */
input, select, textarea {
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

/* скроллбары — аккуратные */
* { scrollbar-width: thin; scrollbar-color: #d6ccb8 transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #d6ccb8;
  border-radius: 8px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: #a49b86; }

/* верхняя панель: лёгкое свечение */
.topbar {
  box-shadow: 0 1px 0 rgba(255, 255, 255, .06), 0 8px 24px -12px rgba(2, 6, 23, .5);
}

/* переключатель компаний — плавная смена */
.company-item {
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}
.company-item:hover { transform: translateY(-1px); }

/* бейджи статусов — мягче */
.badge { transition: transform .16s ease; }
.badge:hover { transform: translateY(-1px); }

/* модалки появляются с лёгким масштабированием */
.modal {
  animation: modalIn .22s cubic-bezier(.22, .9, .3, 1) both;
}
@keyframes modalIn {
  from { opacity: 0; transform: translateY(14px) scale(.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ══════════════════════════════════════════════════════════
   Загрузка реестра: спиннер и скелетон-анимация
   ══════════════════════════════════════════════════════════ */

.spinner {
  width: 14px; height: 14px;
  border: 2px solid var(--border);
  border-top-color: var(--primary);
  border-radius: 50%;
  display: inline-block;
  vertical-align: -2px;
  margin-right: 8px;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
#status { display: inline-flex; align-items: center; }

.table-wrap { position: relative; }
.table-loading {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 16px;
  background: var(--bg);
  border-radius: var(--r-lg);
  overflow: hidden;
  transition: opacity .3s ease;
}
.table-loading.hidden { opacity: 0; pointer-events: none; }
.skeleton-row {
  height: 34px;
  border-radius: 10px;
  background: linear-gradient(90deg, #efe8d8 25%, #faf5ea 40%, #efe8d8 60%);
  background-size: 300% 100%;
  animation: skeleton 1.3s ease infinite;
}
.skeleton-row.w-35 { width: 35%; }
.skeleton-row.w-50 { width: 50%; }
.skeleton-row.w-70 { width: 70%; }
.skeleton-row.w-80 { width: 80%; }
.skeleton-row.w-45 { width: 45%; }
@keyframes skeleton {
  0%   { background-position: 120% 0; }
  100% { background-position: -80% 0; }
}

/* ══════════════════════════════════════════════════════════
   Выпадающие списки — новый стиль с анимацией
   ══════════════════════════════════════════════════════════ */

/* нативные select: своя стрелка, плавный фокус, приподнимаются */
select:not([multiple]) {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23a49b86' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  padding-right: 34px !important;
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease,
              transform .15s ease, color .15s ease;
}
select:hover {
  border-color: #d6ccb8 !important;
  transform: translateY(-1px);
}
select:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 4px var(--ring) !important;
  background-color: #fffdf8 !important;
  transform: translateY(-1px);
}
select option {
  padding: 8px 12px;
  background: #fffdf8;
  color: var(--text);
}

/* выпадающие списки Tabulator (редактирование ячеек) */
.tabulator-edit-list {
  border-radius: 12px !important;
  overflow: hidden;
  animation: editListIn .18s cubic-bezier(.22, .9, .3, 1) both;
}
@keyframes editListIn {
  from { opacity: 0; transform: translateY(-6px) scale(.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.tabulator-edit-list-item {
  padding: 8px 13px !important;
  transition: background .12s ease, padding-left .12s ease;
}
.tabulator-edit-list-item:hover {
  background: var(--row-hover) !important;
  padding-left: 16px !important;
}
.tabulator-edit-list-item.active {
  background: var(--sel) !important;
  color: var(--primary-deep) !important;
}

/* ══════════════════════════════════════════════════════════
   Исправления выпадающих списков
   ══════════════════════════════════════════════════════════ */

/* селекты в таблицах (спецификации и др.): стрелка, которую перекрывало
   правило с background-шорткатом */
#items-table select,
.contract-row select,
.contact-row select,
.user-row select,
.settings-row select,
.pool-info select {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23a49b86' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  padding-right: 34px;
}

/* список редактирования Tabulator: не шире экрана и не уезжает вбок */
.tabulator-edit-list {
  min-width: 160px !important;
  max-width: 440px;
  white-space: normal;
}
.tabulator-edit-list .tabulator-edit-list-item {
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.35;
}
/* наведение и активный пункт — тёмный текст на тёплом фоне (читаемо) */
.tabulator-edit-list .tabulator-edit-list-item:hover {
  background: var(--row-hover) !important;
  color: var(--text) !important;
}
.tabulator-edit-list .tabulator-edit-list-item.active {
  background: var(--sel) !important;
  color: var(--primary-deep) !important;
}

/* ═══ чекбоксы выбора строк (колонка слева от №) ═══ */
#shipments-table .col-sel input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--primary);
  cursor: pointer;
  vertical-align: middle;
  transition: transform .12s ease;
}
#shipments-table .col-sel input[type="checkbox"]:hover {
  transform: scale(1.18);
}
#shipments-table .col-sel .tabulator-col-title #sel-all-cb {
  pointer-events: none; /* клик ловим по ячейке шапки, состояние — в JS */
}
#shipments-table .col-sel .tabulator-col-title {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0;
  cursor: pointer;
}