/* ==========================================================================
   Portal UI polish (additive)
   - Sidebar: grouped look, consistent spacing
   - Emoji hidden, modern icons via CSS mask (no CDN)
   - Tabulator: readable dark skin
   ========================================================================== */

:root{
  --p-panel: rgba(255,255,255,.04);
  --p-border: rgba(255,255,255,.10);
  --p-text: rgba(255,255,255,.92);
  --p-muted: rgba(255,255,255,.65);
  --p-accent-2: rgba(47,107,255,.16);
}

/* ===== Sidebar layout ===== */
.sidebar__nav{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.nav-group, .nav-section{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.nav-group__title, .nav-section__title{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: var(--p-muted);
  padding: 0 10px;
  margin-top: 8px;
  opacity:.95;
}
.nav-item{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:8px 10px;
  border-radius:12px;
}
.nav-item:hover{ background: var(--p-panel); }
.nav-item.is-active{
  background: var(--p-accent-2);
  outline: 1px solid rgba(47,107,255,.35);
}

/* Hide emoji spans if template uses them */
.nav-item > span:first-child{ display:none !important; }

/* Add icon via ::before using CSS mask */
.nav-item::before{
  content:"";
  width:18px;
  height:18px;
  flex:0 0 18px;
  background: currentColor;
  opacity:.95;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:contain;
}

/* Minimal icon set as inline SVG masks (no CDN) */
:root{
  --ico-dashboard: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h7v7H4V4zm9 0h7v4h-7V4zM4 13h4v7H4v-7zm6 0h10v7H10v-7z'/%3E%3C/svg%3E");
  --ico-inbound: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 7h16v2H4V7zm2 2h12v10H6V9zm5-6h2v4h-2V3zm-2 9 3-3 3 3-1.4 1.4L12 11.3l-1.6 1.6L9 12z'/%3E%3C/svg%3E");
  --ico-outbound: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 7h16v2H4V7zm2 2h12v10H6V9zm5 12h2v-4h-2v4zm-2-5 3 3 3-3-1.4-1.4L12 16.7l-1.6-1.6L9 16z'/%3E%3C/svg%3E");
  --ico-trips: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 6h14l2 6v6h-2a3 3 0 1 1-6 0H11a3 3 0 1 1-6 0H3v-6l2-6zm1.4 2-1.1 3H18.7l-1.1-3H6.4zM8 19a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm8 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z'/%3E%3C/svg%3E");
  --ico-inventory: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 5h14v2H5V5zm0 4h14v10H5V9zm3 3h4v2H8v-2zm6-1 4 4-1.4 1.4-2.6-2.6-1.6 1.6L11 14l3-3z'/%3E%3C/svg%3E");
  --ico-sku: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2 4 6v12l8 4 8-4V6l-8-4zm0 2.2 6 3.2-6 3.2-6-3.2 6-3.2zm-6 5.6 6 3.2v6.5L6 16.3V9.8zm12 6.5-6 3.2v-6.5l6-3.2v6.5z'/%3E%3C/svg%3E");
  --ico-items: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 3h10l2 4H5l2-4zm-2 6h14v10H5V9zm3 3h3v2H8v-2zm5 0h3v2h-3v-2z'/%3E%3C/svg%3E");
  --ico-report: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h10l4 4v12H4V4zm9 1.5V9h3.5L13 5.5zM7 12h10v2H7v-2zm0 4h10v2H7v-2z'/%3E%3C/svg%3E");
}

/* Map icons to routes by href substring */
.nav-item[href*="/app/receivings"]::before{ -webkit-mask-image: var(--ico-inbound); mask-image: var(--ico-inbound); }
.nav-item[href*="/app/shipments"]::before{ -webkit-mask-image: var(--ico-outbound); mask-image: var(--ico-outbound); }
.nav-item[href*="/app/trips"]::before{ -webkit-mask-image: var(--ico-trips); mask-image: var(--ico-trips); }
.nav-item[href*="/app/cycle-counts"]::before{ -webkit-mask-image: var(--ico-inventory); mask-image: var(--ico-inventory); }
.nav-item[href*="/app/sku"]::before{ -webkit-mask-image: var(--ico-sku); mask-image: var(--ico-sku); }
.nav-item[href*="/app/items"]::before{ -webkit-mask-image: var(--ico-items); mask-image: var(--ico-items); }
.nav-item[href*="/app/reports"]::before{ -webkit-mask-image: var(--ico-report); mask-image: var(--ico-report); }
.nav-item[href="/app/"]::before, .nav-item[href*="dashboard"]::before{ -webkit-mask-image: var(--ico-dashboard); mask-image: var(--ico-dashboard); }

/* ===== Tabulator dark skin ===== */
.tabulator{
  background: rgba(10, 18, 32, .75) !important;
  border: 1px solid var(--p-border) !important;
  border-radius: 14px !important;
  overflow:hidden !important;
  color: var(--p-text) !important;
}
.tabulator .tabulator-header{
  background: rgba(255,255,255,.06) !important;
  border-bottom: 1px solid var(--p-border) !important;
}
.tabulator .tabulator-header .tabulator-col{
  background: transparent !important;
  color: var(--p-muted) !important;
  border-right: 1px solid rgba(255,255,255,.06) !important;
}
.tabulator .tabulator-header .tabulator-col .tabulator-header-filter{
  padding:6px 8px 8px 8px !important;
}
.tabulator .tabulator-header .tabulator-col input,
.tabulator .tabulator-header .tabulator-col select{
  width:100%;
  height:32px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.22);
  color: var(--p-text);
  padding: 6px 10px;
  outline:none;
}
.tabulator .tabulator-row{
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}
.tabulator .tabulator-row:nth-child(2n){
  background: rgba(255,255,255,.02) !important;
}
.tabulator .tabulator-row.tabulator-selectable:hover{
  background: rgba(47,107,255,.10) !important;
}
.tabulator .tabulator-cell{
  border-right: 1px solid rgba(255,255,255,.04) !important;
  color: var(--p-text) !important;
}
.tabulator .tabulator-footer{
  background: rgba(255,255,255,.04) !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  color: var(--p-muted) !important;
}

/* ==========================================================================
   Enterprise WMS design code
   Dense, high-contrast operational UI for back-office warehouse work.
   ========================================================================== */

:root{
  --bg: #080b10;
  --panel: #10151d;
  --panel-2: #151b25;
  --surface-raised: #18202b;
  --text: #f1f5f9;
  --muted: #9aa6b2;
  --border: #2a3544;
  --ring: rgba(37, 99, 235, .38);
  --primary: #2f6bff;
  --primary-600: #2457d6;
  --danger: #dc2626;
  --warning: #d97706;
  --success: #059669;
  --radius: 8px;
  --shadow: 0 1px 0 rgba(255,255,255,.03), 0 16px 34px rgba(0,0,0,.28);
}

html{ background: var(--bg); }
body{
  background: var(--bg) !important;
  color: var(--text);
  font-size: 13px;
  letter-spacing: 0;
}

.sidebar{
  background: #0c1118;
  border-right-color: #263140;
  backdrop-filter: none;
}
.sidebar__brand{
  min-height: 52px;
  padding: 12px 14px;
  border-bottom-color: #263140;
}
.brand-badge{
  border-radius: 6px;
  background: #1b2636;
  border-color: #334155;
  box-shadow: none;
}
.brand-title strong{ font-size: 12px; letter-spacing: .05em; }
.brand-title span{ color: #8b98a7; }
.nav-group__title, .nav-section__title{
  color: #7f8b99;
  letter-spacing: .10em;
}
.nav-item{
  min-height: 34px;
  border-radius: 6px;
  color: #d7dee8;
}
.nav-item:hover{
  background: #151c27;
  border-color: #2d3848;
}
.nav-item.is-active{
  background: #17243a;
  border-color: #2f6bff;
  outline: 0;
  box-shadow: inset 3px 0 0 #2f6bff;
}

.topbar{
  min-height: 56px;
  background: #0b1017;
  border-bottom-color: #263140;
  backdrop-filter: none;
  padding: 10px 18px;
}
.content{ padding: 18px; }
.crumbs{ color: #8b98a7; }
.crumbs a{ color: #d7dee8; }
.user-pill{
  border-radius: 8px;
  background: #111821;
  border-color: #2a3544;
  padding: 6px 8px;
}
.avatar{ border-radius: 6px; background: #1d2735; }
.icon-btn{
  border-radius: 6px;
  background: #111821;
  border-color: #2a3544;
}

.card{
  background: var(--panel);
  border-color: var(--border);
  border-radius: 8px;
  box-shadow: var(--shadow);
}
.card__header{
  min-height: 44px;
  padding: 11px 14px;
  background: #121923;
  border-bottom-color: #2a3544;
}
.card__body{ padding: 12px 14px; }
.card__title, .title{
  font-weight: 800;
  letter-spacing: 0;
  color: #f8fafc;
}
.subtitle, .subtle, .muted{ color: var(--muted); }
.h1{ font-size: 22px; letter-spacing: 0; }

.btn{
  min-height: 34px;
  border-radius: 6px;
  border-color: #334155;
  background: #151d28;
  color: #eef3f8;
  padding: 7px 11px;
  font-weight: 700;
  line-height: 1.15;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
.btn:hover{
  background: #1a2431;
  border-color: #4b5f78;
  color: #fff;
}
.btn-primary{
  background: #2457d6;
  border-color: #3670ff;
  color: #fff;
}
.btn-primary:hover{ background: #2f6bff; }
.btn-danger{
  background: #3a1518;
  border-color: #b91c1c;
  color: #fee2e2;
}
.btn-success{
  background: #0f2d24;
  border-color: #059669;
  color: #d1fae5;
}
.btn-warning{
  background: #352511;
  border-color: #d97706;
  color: #ffedd5;
}
.btn-sm{ min-height: 30px; border-radius: 6px; padding: 6px 9px; }
.btn-xs{ min-height: 26px; border-radius: 5px; padding: 4px 7px; }

.input,
.tabulator .tabulator-header .tabulator-col input,
.tabulator .tabulator-header .tabulator-col select{
  border-radius: 6px;
  border-color: #334155;
  background: #0b1119;
  color: #f1f5f9;
}
.input:focus{
  border-color: #2f6bff;
  box-shadow: 0 0 0 3px var(--ring);
}

.badge{
  border-radius: 5px;
  padding: 3px 7px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .01em;
}
.badge-danger, .badge.danger{
  background: rgba(220,38,38,.18);
  border-color: rgba(248,113,113,.55);
  color: #fecaca;
}
.badge-warning, .badge.warn{
  background: rgba(217,119,6,.18);
  border-color: rgba(251,191,36,.55);
  color: #fde68a;
}
.badge-success, .badge.ok{
  background: rgba(5,150,105,.18);
  border-color: rgba(52,211,153,.48);
  color: #bbf7d0;
}
.badge-blue, .badge.blue{
  background: rgba(47,107,255,.18);
  border-color: rgba(96,165,250,.50);
  color: #bfdbfe;
}

.table-wrapper{
  width: 100%;
  overflow: auto;
  border: 1px solid #2a3544;
  border-radius: 8px;
  background: #0c1118;
}
.content table{
  border: 0;
  border-radius: 0;
  font-size: 12px;
}
.content table thead th{
  background: #121923;
  color: #aeb8c5;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.content table th,
.content table td{
  padding: 8px 10px;
  border-bottom-color: #253142;
}
.content table tbody tr td{ background: #0f151e; }
.content table tbody tr:nth-child(2n) td{ background: #111923; }
.content table tbody tr:hover td{ background: #162235; }

.tabulator{
  border-color: #2a3544 !important;
  border-radius: 8px !important;
  background: #0c1118 !important;
}
.tabulator .tabulator-header{
  background: #121923 !important;
  border-bottom-color: #2a3544 !important;
}
.tabulator .tabulator-row,
.tabulator .tabulator-row.tabulator-row-even{
  background: #0f151e !important;
  border-bottom-color: #253142 !important;
}
.tabulator .tabulator-row.tabulator-row-even{ background: #111923 !important; }
.tabulator .tabulator-row:hover{ background: #162235 !important; }
.tabulator .tabulator-cell{
  color: #edf2f7 !important;
  border-right-color: #253142 !important;
}
.tabulator .tabulator-footer{
  background: #121923 !important;
  border-top-color: #2a3544 !important;
}

/* ===== Theme toggle ===== */
.theme-toggle {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid #334155;
  border-radius: 6px;
  background: #151d28;
  color: #eef3f8;
  padding: 5px 9px;
  cursor: pointer;
  font-weight: 800;
  font-size: 12px;
}
.theme-toggle:hover { border-color: #4b5f78; background: #1a2431; }
.theme-toggle__icon {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: linear-gradient(90deg, #f8fafc 0 50%, #111827 50% 100%);
  border: 1px solid currentColor;
}

/* ===== Light theme ===== */
html[data-theme="light"] {
  --bg: #eef2f7;
  --panel: #ffffff;
  --panel-2: #f8fafc;
  --surface-raised: #ffffff;
  --text: #111827;
  --muted: #64748b;
  --border: #cbd5e1;
  --ring: rgba(37, 99, 235, .20);
  --primary: #1d4ed8;
  --primary-600: #1e40af;
  --danger: #b91c1c;
  --warning: #b45309;
  --success: #047857;
  --shadow: 0 1px 2px rgba(15,23,42,.05), 0 14px 28px rgba(15,23,42,.10);
  --p-panel: rgba(15,23,42,.04);
  --p-border: rgba(15,23,42,.12);
  --p-text: #111827;
  --p-muted: #64748b;
  --p-accent-2: rgba(37,99,235,.10);
}

html[data-theme="light"],
html[data-theme="light"] body {
  background: #eef2f7 !important;
  color: #111827;
}

html[data-theme="light"] .sidebar {
  background: #ffffff;
  border-right-color: #cbd5e1;
}
html[data-theme="light"] .sidebar__brand {
  border-bottom-color: #d8e0ea;
}
html[data-theme="light"] .brand-badge {
  background: #e8eef7;
  border-color: #cbd5e1;
  color: #0f172a;
}
html[data-theme="light"] .brand-title strong,
html[data-theme="light"] .crumbs a,
html[data-theme="light"] .nav-item {
  color: #1f2937;
}
html[data-theme="light"] .brand-title span,
html[data-theme="light"] .nav-group__title,
html[data-theme="light"] .nav-section__title,
html[data-theme="light"] .crumbs,
html[data-theme="light"] .subtitle,
html[data-theme="light"] .subtle,
html[data-theme="light"] .muted {
  color: #64748b;
}
html[data-theme="light"] .nav-item:hover {
  background: #f1f5f9;
  border-color: #cbd5e1;
}
html[data-theme="light"] .nav-item.is-active {
  background: #e8f0ff;
  border-color: #2563eb;
  box-shadow: inset 3px 0 0 #2563eb;
  color: #0f172a;
}
html[data-theme="light"] .topbar {
  background: #ffffff;
  border-bottom-color: #cbd5e1;
}
html[data-theme="light"] .user-pill,
html[data-theme="light"] .icon-btn,
html[data-theme="light"] .theme-toggle {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #1f2937;
}
html[data-theme="light"] .theme-toggle:hover,
html[data-theme="light"] .icon-btn:hover {
  background: #eef2f7;
  border-color: #94a3b8;
}
html[data-theme="light"] .avatar {
  background: #e2e8f0;
  border-color: #cbd5e1;
  color: #0f172a;
}
html[data-theme="light"] .card {
  background: #ffffff;
  border-color: #cbd5e1;
}
html[data-theme="light"] .card__header {
  background: #f8fafc;
  border-bottom-color: #d8e0ea;
}
html[data-theme="light"] .card__title,
html[data-theme="light"] .title,
html[data-theme="light"] .h1 {
  color: #0f172a;
}
html[data-theme="light"] .btn {
  background: #ffffff;
  border-color: #cbd5e1;
  color: #1f2937;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65);
}
html[data-theme="light"] .btn:hover {
  background: #f8fafc;
  border-color: #94a3b8;
  color: #0f172a;
}
html[data-theme="light"] .btn-primary {
  background: #2563eb;
  border-color: #1d4ed8;
  color: #ffffff;
}
html[data-theme="light"] .btn-primary:hover { background: #1d4ed8; color:#fff; }
html[data-theme="light"] .btn-success {
  background: #ecfdf5;
  border-color: #10b981;
  color: #065f46;
}
html[data-theme="light"] .btn-warning {
  background: #fffbeb;
  border-color: #f59e0b;
  color: #92400e;
}
html[data-theme="light"] .btn-danger {
  background: #fef2f2;
  border-color: #ef4444;
  color: #991b1b;
}
html[data-theme="light"] .input,
html[data-theme="light"] .tabulator .tabulator-header .tabulator-col input,
html[data-theme="light"] .tabulator .tabulator-header .tabulator-col select {
  background: #ffffff;
  border-color: #cbd5e1;
  color: #111827;
}
html[data-theme="light"] .input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 3px var(--ring);
}
html[data-theme="light"] .table-wrapper {
  background: #ffffff;
  border-color: #cbd5e1;
}
html[data-theme="light"] .content table {
  color: #111827;
}
html[data-theme="light"] .content table thead th {
  background: #f1f5f9;
  color: #475569;
}
html[data-theme="light"] .content table th,
html[data-theme="light"] .content table td {
  border-bottom-color: #e2e8f0;
}
html[data-theme="light"] .content table tbody tr td { background: #ffffff; }
html[data-theme="light"] .content table tbody tr:nth-child(2n) td { background: #f8fafc; }
html[data-theme="light"] .content table tbody tr:hover td { background: #eff6ff; }
html[data-theme="light"] .tabulator {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #111827 !important;
}
html[data-theme="light"] .tabulator .tabulator-header,
html[data-theme="light"] .tabulator .tabulator-footer {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #475569 !important;
}
html[data-theme="light"] .tabulator .tabulator-header .tabulator-col {
  border-right-color: #e2e8f0 !important;
}
html[data-theme="light"] .tabulator .tabulator-header .tabulator-col .tabulator-col-title {
  color: #475569 !important;
}
html[data-theme="light"] .tabulator .tabulator-row,
html[data-theme="light"] .tabulator .tabulator-row.tabulator-row-even {
  background: #ffffff !important;
  border-bottom-color: #e2e8f0 !important;
}
html[data-theme="light"] .tabulator .tabulator-row.tabulator-row-even { background: #f8fafc !important; }
html[data-theme="light"] .tabulator .tabulator-row:hover { background: #eff6ff !important; }
html[data-theme="light"] .tabulator .tabulator-cell {
  color: #111827 !important;
  border-right-color: #e2e8f0 !important;
}
html[data-theme="light"] .tabulator-menu,
html[data-theme="light"] .toast {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #111827 !important;
}
html[data-theme="light"] .badge {
  color: #1f2937;
  border-color: #cbd5e1;
}
html[data-theme="light"] .badge-danger,
html[data-theme="light"] .badge.danger {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #991b1b;
}
html[data-theme="light"] .badge-warning,
html[data-theme="light"] .badge.warn {
  background: #fffbeb;
  border-color: #fcd34d;
  color: #92400e;
}
html[data-theme="light"] .badge-success,
html[data-theme="light"] .badge.ok {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #065f46;
}
html[data-theme="light"] .badge-blue,
html[data-theme="light"] .badge.blue {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1e40af;
}

/* ==========================================================================
   Enterprise spread layer
   Makes the billing-grade visual language the default for the whole app.
   ========================================================================== */

:root {
  --ops-bg: #070a0f;
  --ops-shell: #0b1017;
  --ops-panel: #101720;
  --ops-panel-soft: #131b26;
  --ops-panel-strong: #182231;
  --ops-border: #2a3544;
  --ops-border-soft: #223044;
  --ops-text: #f6f8fb;
  --ops-muted: #8b98a7;
  --ops-muted-2: #b3bfcc;
  --ops-blue: #2f6bff;
  --ops-blue-dark: #1e4fc7;
  --ops-green: #059669;
  --ops-amber: #d97706;
  --ops-red: #dc2626;
  --ops-radius: 7px;
  --ops-radius-sm: 5px;
  --ops-shadow: 0 1px 0 rgba(255,255,255,.03), 0 18px 42px rgba(0,0,0,.34);
}

html,
body {
  background:
    linear-gradient(180deg, #090d13 0%, #070a0f 100%) !important;
}

.content {
  padding: 18px 18px 26px;
}

.stack {
  gap: 14px;
}

.page-header {
  position: relative;
  align-items: stretch;
  min-height: 66px;
  padding: 13px 14px;
  border: 1px solid var(--ops-border);
  border-left: 4px solid var(--ops-blue);
  border-radius: var(--ops-radius);
  background:
    linear-gradient(180deg, rgba(24,34,49,.96), rgba(15,23,34,.96));
  box-shadow: var(--ops-shadow);
}

.page-header__left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

.page-header__title,
.page-header .h1,
.h1 {
  font-size: 21px;
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: 0;
  color: var(--ops-text);
}

.page-header .subtle,
.page-header__meta {
  font-size: 12px;
  color: var(--ops-muted-2);
}

.page-header__actions {
  align-self: center;
  gap: 8px;
}

.page-header__actions .btn {
  white-space: nowrap;
}

.toolbar {
  gap: 8px;
}

.toolbar__left,
.toolbar__right,
.btn-row {
  gap: 8px;
}

.card > .card__header .toolbar {
  min-height: 32px;
}

.card__header .label,
.info-label,
.label,
label > span.subtle {
  color: var(--ops-muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.card {
  border-radius: var(--ops-radius);
  background: var(--ops-panel);
  border-color: var(--ops-border);
  box-shadow: var(--ops-shadow);
}

.card__header {
  min-height: 46px;
  background:
    linear-gradient(180deg, #151e2a 0%, #111923 100%);
  border-bottom-color: var(--ops-border);
  padding: 10px 13px;
}

.card__body {
  padding: 13px;
}

.card__body--flush {
  padding: 0;
}

.card__title {
  font-size: 14px;
  font-weight: 900;
  color: var(--ops-text);
}

.grid-2,
.grid-3,
.grid-4,
.kpi-grid {
  gap: 10px;
}

.grid-4 > .card,
.kpi-grid > .card,
.billing-metric,
.card-grid > .card {
  position: relative;
  border-top: 3px solid #334155;
}

.grid-4 > .card:nth-child(4n+1),
.kpi-grid > .card:nth-child(4n+1) {
  border-top-color: var(--ops-blue);
}

.grid-4 > .card:nth-child(4n+2),
.kpi-grid > .card:nth-child(4n+2) {
  border-top-color: var(--ops-green);
}

.grid-4 > .card:nth-child(4n+3),
.kpi-grid > .card:nth-child(4n+3) {
  border-top-color: var(--ops-amber);
}

.grid-4 > .card:nth-child(4n+4),
.kpi-grid > .card:nth-child(4n+4) {
  border-top-color: #64748b;
}

.kpi-title,
.grid-4 .subtle:first-child,
.kpi-grid .subtle:first-child {
  color: var(--ops-muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.kpi-value {
  margin-top: 5px;
  color: var(--ops-text);
  font-size: 25px;
  line-height: 1;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
}

.kpi-actions {
  margin-top: 11px;
}

.btn {
  min-height: 32px;
  border-radius: var(--ops-radius-sm);
  border-color: #334155;
  background: #151d28;
  color: #eef3f8;
  padding: 7px 10px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.btn:hover {
  background: #1a2431;
  border-color: #52647c;
}

.btn-primary {
  background: var(--ops-blue-dark);
  border-color: #3974ff;
  color: #fff;
}

.btn-primary:hover {
  background: var(--ops-blue);
}

.btn-sm {
  min-height: 28px;
  padding: 5px 8px;
  border-radius: var(--ops-radius-sm);
}

.btn-xs {
  min-height: 24px;
  padding: 3px 7px;
  border-radius: var(--ops-radius-sm);
}

.btn-link {
  color: #9cc2ff;
}

.input,
select.input,
textarea.input,
input[type="text"],
input[type="number"],
input[type="date"],
input[type="datetime-local"],
input[type="search"],
input[type="email"],
input[type="password"],
select,
textarea {
  border-radius: var(--ops-radius-sm);
  border-color: #334155;
  background: #0b1119;
  color: var(--ops-text);
}

textarea {
  min-height: 82px;
}

.input::placeholder,
input::placeholder,
textarea::placeholder {
  color: #6f7d8e;
}

.input:focus,
input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--ops-blue);
  box-shadow: 0 0 0 3px rgba(47,107,255,.28);
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--ops-blue);
}

.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--ops-border);
  border-radius: var(--ops-radius);
  background: #0b1119;
}

.tab-btn {
  min-height: 32px;
  border: 1px solid transparent;
  border-radius: var(--ops-radius-sm);
  background: transparent;
  color: #cbd5e1;
  padding: 7px 10px;
  font-weight: 850;
  cursor: pointer;
}

.tab-btn:hover {
  background: #151d28;
  border-color: #334155;
}

.tab-btn.is-active {
  background: #1e4fc7;
  border-color: #3974ff;
  color: #fff;
  box-shadow: none;
}

.tab-panel {
  margin-top: 12px;
}

.table-wrapper,
.billing-table-wrap {
  border-radius: var(--ops-radius);
  border-color: var(--ops-border);
  background: #0b1119;
}

.content table {
  font-size: 12px;
}

.content table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #111923;
  color: #9aa6b2;
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .06em;
}

.content table th,
.content table td {
  padding: 7px 9px;
  border-bottom-color: #253142;
}

.content table tbody tr td {
  background: #0f151e;
}

.content table tbody tr:nth-child(2n) td {
  background: #111923;
}

.content table tbody tr:hover td {
  background: #17243a;
}

.badge,
.ship-task-badge,
.ship-cal-item,
.tb-menu-check,
.alloc-a,
.alloc-r {
  border-radius: var(--ops-radius-sm);
}

.badge {
  min-height: 22px;
  padding: 2px 7px;
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.messages {
  margin: 0 0 14px;
}

.alert {
  border-radius: var(--ops-radius);
  border-color: var(--ops-border);
  padding: 10px 12px;
  font-weight: 750;
}

details.card > summary.card__header,
details.card > summary {
  list-style: none;
  user-select: none;
}

details.card > summary::-webkit-details-marker {
  display: none;
}

details.card > summary::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  opacity: .7;
  margin-left: auto;
}

details.card[open] > summary::after {
  transform: rotate(225deg);
}

dialog {
  border-radius: var(--ops-radius);
  border: 1px solid var(--ops-border);
  background: var(--ops-panel);
  color: var(--ops-text);
  box-shadow: 0 28px 90px rgba(0,0,0,.72);
}

dialog::backdrop {
  background: rgba(2,6,23,.64);
  backdrop-filter: blur(2px);
}

.ship-view-switch,
.ship-cal-scale-switch {
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--ops-border);
  border-radius: var(--ops-radius);
  background: #0b1119;
}

.ship-view-switch .btn,
.ship-cal-scale-switch .btn {
  border-color: transparent;
  background: transparent;
}

.ship-view-switch__btn.is-active,
.ship-cal-scale-switch__btn.is-active {
  background: #1e4fc7;
  border-color: #3974ff;
  color: #fff;
}

.ship-kanban-col,
.ship-calendar-grid,
.ship-cal-week-col,
.ship-unscheduled-box {
  border-radius: var(--ops-radius);
  border-color: var(--ops-border);
  background: #0b1119;
}

.ship-card,
.ship-cal-item {
  border-radius: var(--ops-radius);
  background: #101720;
  border-color: #2a3544;
}

.ship-card:hover,
.ship-cal-item:hover {
  border-color: var(--ops-blue);
  background: #162235;
}

.ship-cal-controls {
  border-bottom-color: var(--ops-border);
  background: #0f151e;
}

.tabulator,
.grid-host .tabulator {
  border-radius: 0 !important;
}

.card:not(.billing-command) .grid-host:first-child .tabulator,
.card__body--flush > .grid-host .tabulator {
  border: 0 !important;
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-title {
  font-size: 10.5px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tabulator .tabulator-row {
  min-height: 34px;
}

.tabulator .tabulator-cell {
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

.tabulator .tabulator-footer .tabulator-page,
.tabulator .tabulator-footer .tabulator-page-size {
  border-radius: var(--ops-radius-sm) !important;
}

.sku-suggest,
.tabulator-menu,
.toast {
  border-radius: var(--ops-radius) !important;
  border-color: var(--ops-border) !important;
  background: #101720 !important;
}

.card-grid > .card {
  min-height: 88px;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
}

.card-grid > .card:hover {
  border-color: var(--ops-blue);
  background: #162235;
  transform: translateY(-1px);
}

.theme-toggle__text {
  display: none;
}

.user-pill {
  border-radius: var(--ops-radius);
}

.avatar {
  border-radius: var(--ops-radius-sm);
}

/* Extra nav icons for routes that were still falling back to a square. */
:root {
  --ico-billing: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h12v18H6V3zm2 2v3h8V5H8zm0 5v2h2v-2H8zm4 0v2h2v-2h-2zm-4 4v2h2v-2H8zm4 0v2h2v-2h-2zm4-4v6h-2v-6h2zM8 18h8v1H8v-1z'/%3E%3C/svg%3E");
  --ico-market: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 5h14l1 5v9H4v-9l1-5zm2 2-.4 2h10.8L17 7H7zm-1 4v6h12v-6H6zm2 1h3v3H8v-3z'/%3E%3C/svg%3E");
  --ico-service: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M19.4 13.5a7.8 7.8 0 0 0 0-3l2-1.5-2-3.5-2.4 1a8 8 0 0 0-2.6-1.5L14 2h-4l-.4 3a8 8 0 0 0-2.6 1.5l-2.4-1-2 3.5 2 1.5a7.8 7.8 0 0 0 0 3l-2 1.5 2 3.5 2.4-1a8 8 0 0 0 2.6 1.5l.4 3h4l.4-3a8 8 0 0 0 2.6-1.5l2.4 1 2-3.5-2-1.5zM12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6z'/%3E%3C/svg%3E");
}
.nav-item[href*="/app/billing"]::before{ -webkit-mask-image: var(--ico-billing); mask-image: var(--ico-billing); }
.nav-item[href*="/app/wb-fbs-orders"]::before,
.nav-item[href*="/app/ozon-fbo-supplies"]::before{ -webkit-mask-image: var(--ico-market); mask-image: var(--ico-market); }
.nav-item[href*="/app/service"]::before{ -webkit-mask-image: var(--ico-service); mask-image: var(--ico-service); }

@media (max-width: 900px) {
  .content {
    padding: 12px;
  }
  .page-header {
    padding: 12px;
  }
  .page-header__actions {
    align-self: stretch;
  }
  .page-header__actions .btn {
    flex: 1 1 160px;
    justify-content: center;
  }
  .tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .tab-btn {
    white-space: nowrap;
  }
}

html[data-theme="light"] {
  --ops-bg: #eef2f7;
  --ops-shell: #ffffff;
  --ops-panel: #ffffff;
  --ops-panel-soft: #f8fafc;
  --ops-panel-strong: #eef2f7;
  --ops-border: #cbd5e1;
  --ops-border-soft: #e2e8f0;
  --ops-text: #0f172a;
  --ops-muted: #64748b;
  --ops-muted-2: #475569;
  --ops-shadow: 0 1px 2px rgba(15,23,42,.05), 0 14px 28px rgba(15,23,42,.10);
}

html[data-theme="light"] .page-header {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-color: #cbd5e1;
  border-left-color: #2563eb;
}

html[data-theme="light"] .page-header__title,
html[data-theme="light"] .page-header .h1,
html[data-theme="light"] .h1,
html[data-theme="light"] .card__title,
html[data-theme="light"] .kpi-value {
  color: #0f172a;
}

html[data-theme="light"] .card__header {
  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  border-bottom-color: #d8e0ea;
}

html[data-theme="light"] .grid-4 > .card,
html[data-theme="light"] .kpi-grid > .card,
html[data-theme="light"] .billing-metric,
html[data-theme="light"] .card-grid > .card {
  background: #ffffff;
}

html[data-theme="light"] .tabs,
html[data-theme="light"] .ship-view-switch,
html[data-theme="light"] .ship-cal-scale-switch,
html[data-theme="light"] .ship-kanban-col,
html[data-theme="light"] .ship-calendar-grid,
html[data-theme="light"] .ship-cal-week-col,
html[data-theme="light"] .ship-unscheduled-box,
html[data-theme="light"] .table-wrapper,
html[data-theme="light"] .billing-table-wrap {
  background: #ffffff;
  border-color: #cbd5e1;
}

html[data-theme="light"] .tab-btn {
  color: #334155;
}

html[data-theme="light"] .tab-btn:hover,
html[data-theme="light"] .ship-card:hover,
html[data-theme="light"] .ship-cal-item:hover,
html[data-theme="light"] .card-grid > .card:hover {
  background: #eff6ff;
}

html[data-theme="light"] .tab-btn.is-active,
html[data-theme="light"] .ship-view-switch__btn.is-active,
html[data-theme="light"] .ship-cal-scale-switch__btn.is-active {
  background: #2563eb;
  border-color: #1d4ed8;
  color: #fff;
}

html[data-theme="light"] .ship-card,
html[data-theme="light"] .ship-cal-item,
html[data-theme="light"] .ship-cal-controls {
  background: #f8fafc;
  border-color: #cbd5e1;
}

html[data-theme="light"] dialog,
html[data-theme="light"] .sku-suggest,
html[data-theme="light"] .tabulator-menu,
html[data-theme="light"] .toast {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

/* ==========================================================================
   Premium light theme
   A first-class operational theme, not a pale inversion of dark UI.
   Keep this at the end: it intentionally wins over page-specific dark CSS.
   ========================================================================== */

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f3f6fb;
  --panel: #ffffff;
  --panel-2: #f8fafc;
  --surface-raised: #ffffff;
  --text: #101828;
  --muted: #475467;
  --border: #b9c4d4;
  --ring: rgba(29,78,216,.20);
  --primary: #1d4ed8;
  --primary-600: #1e40af;
  --danger: #b42318;
  --warning: #b54708;
  --success: #067647;
  --shadow: 0 1px 2px rgba(16,24,40,.06), 0 14px 34px rgba(16,24,40,.10);
  --ops-bg: #f3f6fb;
  --ops-shell: #ffffff;
  --ops-panel: #ffffff;
  --ops-panel-soft: #f8fafc;
  --ops-panel-strong: #eef4ff;
  --ops-border: #b9c4d4;
  --ops-border-soft: #d6deea;
  --ops-text: #101828;
  --ops-muted: #526174;
  --ops-muted-2: #344054;
  --ops-blue: #1d4ed8;
  --ops-blue-dark: #1e40af;
  --ops-green: #067647;
  --ops-amber: #b54708;
  --ops-red: #b42318;
  --ops-shadow: 0 1px 2px rgba(16,24,40,.06), 0 16px 34px rgba(16,24,40,.10);
}

html[data-theme="light"],
html[data-theme="light"] body {
  background: linear-gradient(180deg, #f8fbff 0%, #edf2f8 100%) !important;
  color: #101828 !important;
}

html[data-theme="light"] .content {
  background: transparent;
}

html[data-theme="light"] .sidebar,
html[data-theme="light"] .topbar {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
  box-shadow: 0 1px 0 rgba(16,24,40,.04);
}

html[data-theme="light"] .sidebar__brand,
html[data-theme="light"] .card__header,
html[data-theme="light"] .ship-kanban-col__head,
html[data-theme="light"] .ship-cal-week-col__head,
html[data-theme="light"] .ship-unscheduled-box__title,
html[data-theme="light"] .ship-cal-controls,
html[data-theme="light"] .row-drawer-head {
  background: linear-gradient(180deg, #f8fafc 0%, #eef3f8 100%) !important;
  border-color: #cbd5e1 !important;
  color: #101828 !important;
}

html[data-theme="light"] .brand-badge,
html[data-theme="light"] .avatar,
html[data-theme="light"] .icon-btn,
html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .user-pill {
  background: #f2f6fb !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
}

html[data-theme="light"] .nav-group__title,
html[data-theme="light"] .nav-section__title,
html[data-theme="light"] .crumbs,
html[data-theme="light"] .brand-title span {
  color: #526174 !important;
}

html[data-theme="light"] .nav-item {
  color: #1d2735 !important;
}

html[data-theme="light"] .nav-item:hover {
  background: #eef4ff !important;
  border-color: #9fb3d1 !important;
  color: #0f172a !important;
}

html[data-theme="light"] .nav-item.is-active {
  background: #dbeafe !important;
  border-color: #1d4ed8 !important;
  color: #0f172a !important;
  box-shadow: inset 3px 0 0 #1d4ed8 !important;
}

html[data-theme="light"] .page-header,
html[data-theme="light"] .billing-command {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border-color: #b9c4d4 !important;
  border-left-color: #1d4ed8 !important;
  box-shadow: var(--ops-shadow) !important;
}

html[data-theme="light"] .card,
html[data-theme="light"] details.card,
html[data-theme="light"] .billing-metric,
html[data-theme="light"] .billing-invoice-card,
html[data-theme="light"] .billing-period-status,
html[data-theme="light"] .billing-quality-item,
html[data-theme="light"] .billing-proof,
html[data-theme="light"] .billing-service-category,
html[data-theme="light"] .ship-card,
html[data-theme="light"] .ship-kanban-col,
html[data-theme="light"] .ship-calendar-grid,
html[data-theme="light"] .ship-cal-week-col,
html[data-theme="light"] .ship-unscheduled-box,
html[data-theme="light"] .ship-cal-item,
html[data-theme="light"] .zone-tree__zone,
html[data-theme="light"] .zone-tree__rack,
html[data-theme="light"] .zone-tree__row,
html[data-theme="light"] .zone-tree__level,
html[data-theme="light"] .receiving-page .sku-suggest,
html[data-theme="light"] .shipment-page .sku-suggest {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
  box-shadow: var(--ops-shadow);
}

html[data-theme="light"] .card__title,
html[data-theme="light"] .title,
html[data-theme="light"] .h1,
html[data-theme="light"] .page-header__title,
html[data-theme="light"] .page-header .h1,
html[data-theme="light"] .billing-title,
html[data-theme="light"] .billing-pay-amount,
html[data-theme="light"] .billing-metric__value,
html[data-theme="light"] .billing-quality-item__value,
html[data-theme="light"] .billing-proof__num,
html[data-theme="light"] .billing-period-status__title,
html[data-theme="light"] .billing-service-category__amount,
html[data-theme="light"] .kpi-value,
html[data-theme="light"] .drawer-title,
html[data-theme="light"] .warn-title,
html[data-theme="light"] .ship-card__code,
html[data-theme="light"] .zone-tree__title,
html[data-theme="light"] b,
html[data-theme="light"] strong {
  color: #101828 !important;
}

html[data-theme="light"] .subtle,
html[data-theme="light"] .muted,
html[data-theme="light"] .subtitle,
html[data-theme="light"] .page-header__meta,
html[data-theme="light"] .page-header .subtle,
html[data-theme="light"] .billing-eyebrow,
html[data-theme="light"] .billing-pay-label,
html[data-theme="light"] .billing-pay-note,
html[data-theme="light"] .billing-metric__label,
html[data-theme="light"] .billing-metric__note,
html[data-theme="light"] .billing-quality-item__label,
html[data-theme="light"] .billing-proof__label,
html[data-theme="light"] .billing-section-kicker,
html[data-theme="light"] .billing-service-category__label,
html[data-theme="light"] .billing-service-category__meta,
html[data-theme="light"] .kpi-title,
html[data-theme="light"] .ship-card__meta,
html[data-theme="light"] .ship-card__meta span,
html[data-theme="light"] .ship-card__meta-grid,
html[data-theme="light"] .ship-card__meta-grid span,
html[data-theme="light"] .ship-card__comment,
html[data-theme="light"] .ship-cal-day__num,
html[data-theme="light"] .ship-cal-item__time,
html[data-theme="light"] .ship-unscheduled-item__meta,
html[data-theme="light"] .shipment-page .mode-select label,
html[data-theme="light"] .shipment-page .units-hint,
html[data-theme="light"] .shipment-page .uom-hint,
html[data-theme="light"] .receiving-page .sku-suggest__barcode {
  color: #475467 !important;
}

html[data-theme="light"] .info-label,
html[data-theme="light"] .label,
html[data-theme="light"] .card__header .label,
html[data-theme="light"] label > span.subtle {
  color: #344054 !important;
}

html[data-theme="light"] a:not(.btn):not(.nav-item) {
  color: #175cd3;
}

html[data-theme="light"] a:not(.btn):not(.nav-item):hover {
  color: #1849a9;
}

html[data-theme="light"] .btn {
  background: #ffffff !important;
  border-color: #98a8bd !important;
  color: #182230 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 1px 1px rgba(16,24,40,.04);
}

html[data-theme="light"] .btn:hover {
  background: #eef4ff !important;
  border-color: #667f9f !important;
  color: #101828 !important;
}

html[data-theme="light"] .btn-primary {
  background: #1d4ed8 !important;
  border-color: #1849a9 !important;
  color: #ffffff !important;
}

html[data-theme="light"] .btn-primary:hover {
  background: #1849a9 !important;
  color: #ffffff !important;
}

html[data-theme="light"] .btn-success {
  background: #dcfae6 !important;
  border-color: #17b26a !important;
  color: #074d31 !important;
}

html[data-theme="light"] .btn-warning {
  background: #fef0c7 !important;
  border-color: #f79009 !important;
  color: #7a2e0e !important;
}

html[data-theme="light"] .btn-danger {
  background: #fee4e2 !important;
  border-color: #f04438 !important;
  color: #7a271a !important;
}

html[data-theme="light"] .input,
html[data-theme="light"] select.input,
html[data-theme="light"] textarea.input,
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="date"],
html[data-theme="light"] input[type="datetime-local"],
html[data-theme="light"] input[type="search"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="light"] .tabulator .tabulator-header-filter input,
html[data-theme="light"] .tabulator .tabulator-header-filter select {
  background: #ffffff !important;
  border-color: #98a8bd !important;
  color: #101828 !important;
  box-shadow: inset 0 1px 2px rgba(16,24,40,.04);
}

html[data-theme="light"] .input::placeholder,
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder,
html[data-theme="light"] .tabulator .tabulator-header-filter input::placeholder {
  color: #667085 !important;
}

html[data-theme="light"] .input:focus,
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] .tabulator .tabulator-header-filter input:focus,
html[data-theme="light"] .tabulator .tabulator-header-filter select:focus {
  border-color: #1d4ed8 !important;
  box-shadow: 0 0 0 3px rgba(29,78,216,.18) !important;
}

html[data-theme="light"] .tabs,
html[data-theme="light"] .billing-tabs__nav,
html[data-theme="light"] .ship-view-switch,
html[data-theme="light"] .ship-cal-scale-switch {
  background: #eaf0f7 !important;
  border-color: #b9c4d4 !important;
}

html[data-theme="light"] .tab-btn,
html[data-theme="light"] .billing-tabs__label,
html[data-theme="light"] .ship-view-switch .btn,
html[data-theme="light"] .ship-cal-scale-switch .btn {
  background: transparent !important;
  border-color: transparent !important;
  color: #344054 !important;
}

html[data-theme="light"] .tab-btn:hover,
html[data-theme="light"] .billing-tabs__label:hover,
html[data-theme="light"] .ship-view-switch .btn:hover,
html[data-theme="light"] .ship-cal-scale-switch .btn:hover {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
}

html[data-theme="light"] .tab-btn.is-active,
html[data-theme="light"] #billing-tab-docs:checked ~ .billing-tabs__nav label[for="billing-tab-docs"],
html[data-theme="light"] #billing-tab-services:checked ~ .billing-tabs__nav label[for="billing-tab-services"],
html[data-theme="light"] .ship-view-switch__btn.is-active,
html[data-theme="light"] .ship-cal-scale-switch__btn.is-active {
  background: #1d4ed8 !important;
  border-color: #1849a9 !important;
  color: #ffffff !important;
}

html[data-theme="light"] .table-wrapper,
html[data-theme="light"] .billing-table-wrap,
html[data-theme="light"] .receiving-page .tabulator-host,
html[data-theme="light"] .wms-grid {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
}

html[data-theme="light"] .content table,
html[data-theme="light"] .billing-table,
html[data-theme="light"] .shipment-page table {
  color: #101828 !important;
  border-color: #b9c4d4 !important;
}

html[data-theme="light"] .content table thead th,
html[data-theme="light"] .billing-table th,
html[data-theme="light"] .shipment-page table th {
  background: #eaf0f7 !important;
  color: #344054 !important;
  border-color: #cbd5e1 !important;
}

html[data-theme="light"] .content table td,
html[data-theme="light"] .content table th,
html[data-theme="light"] .billing-table td,
html[data-theme="light"] .billing-table th,
html[data-theme="light"] .shipment-page table td,
html[data-theme="light"] .shipment-page table th {
  border-bottom-color: #d6deea !important;
}

html[data-theme="light"] .content table tbody tr td,
html[data-theme="light"] .billing-table tbody tr td,
html[data-theme="light"] .shipment-page table tbody tr td {
  background: #ffffff !important;
  color: #101828 !important;
}

html[data-theme="light"] .content table tbody tr:nth-child(2n) td,
html[data-theme="light"] .billing-table tbody tr:nth-child(2n) td,
html[data-theme="light"] .shipment-page table tbody tr:nth-child(2n) td {
  background: #f8fafc !important;
}

html[data-theme="light"] .content table tbody tr:hover td,
html[data-theme="light"] .billing-table tbody tr:hover td,
html[data-theme="light"] .shipment-page table tbody tr:hover td {
  background: #eef4ff !important;
}

html[data-theme="light"] .tabulator,
html[data-theme="light"] .wms-grid .tabulator {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
}

html[data-theme="light"] .tabulator .tabulator-tableholder,
html[data-theme="light"] .tabulator .tabulator-tableholder .tabulator-table,
html[data-theme="light"] .tabulator .tabulator-table {
  background: #ffffff !important;
  color: #101828 !important;
}

html[data-theme="light"] .tabulator .tabulator-header,
html[data-theme="light"] .wms-grid .tabulator-header,
html[data-theme="light"] .tabulator .tabulator-footer {
  background: #eaf0f7 !important;
  border-color: #b9c4d4 !important;
  color: #344054 !important;
}

html[data-theme="light"] .tabulator .tabulator-header .tabulator-col,
html[data-theme="light"] .wms-grid .tabulator-header .tabulator-col {
  background: transparent !important;
  border-color: #cbd5e1 !important;
}

html[data-theme="light"] .tabulator .tabulator-header .tabulator-col .tabulator-col-title,
html[data-theme="light"] .wms-grid .tabulator-header .tabulator-col .tabulator-col-title,
html[data-theme="light"] .tabulator .tabulator-footer label {
  color: #344054 !important;
}

html[data-theme="light"] .tabulator .tabulator-row,
html[data-theme="light"] .wms-grid .tabulator-row {
  background: #ffffff !important;
  border-color: #d6deea !important;
}

html[data-theme="light"] .tabulator .tabulator-row.tabulator-row-even,
html[data-theme="light"] .wms-grid .tabulator-row.tabulator-row-even {
  background: #f8fafc !important;
}

html[data-theme="light"] .tabulator .tabulator-row:hover,
html[data-theme="light"] .wms-grid .tabulator-row:hover {
  background: #eef4ff !important;
}

html[data-theme="light"] .tabulator .tabulator-row.tabulator-selected,
html[data-theme="light"] .wms-grid .tabulator-row.tabulator-selected {
  background: #dbeafe !important;
  color: #0f172a !important;
}

html[data-theme="light"] .tabulator .tabulator-cell,
html[data-theme="light"] .wms-grid .tabulator-cell {
  color: #101828 !important;
  border-color: #d6deea !important;
}

html[data-theme="light"] .tabulator .tabulator-placeholder {
  color: #475467 !important;
}

html[data-theme="light"] .tabulator .tabulator-footer .tabulator-page,
html[data-theme="light"] .tabulator .tabulator-footer .tabulator-page-size {
  background: #ffffff !important;
  border-color: #98a8bd !important;
  color: #101828 !important;
}

html[data-theme="light"] .tabulator .tabulator-footer .tabulator-page.active {
  background: #1d4ed8 !important;
  border-color: #1849a9 !important;
  color: #ffffff !important;
}

html[data-theme="light"] .tabulator-menu,
html[data-theme="light"] .tabulator-menu .tabulator-menu-item,
html[data-theme="light"] .toast,
html[data-theme="light"] .sku-suggest,
html[data-theme="light"] .tb-menu-check {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
}

html[data-theme="light"] .tabulator-menu .tabulator-menu-item:hover,
html[data-theme="light"] .sku-suggest__item:hover,
html[data-theme="light"] .receiving-page .sku-suggest__item:hover {
  background: #eef4ff !important;
}

html[data-theme="light"] .tb-menu-check.is-on {
  background: #dbeafe !important;
  border-color: #1d4ed8 !important;
  color: #1e40af !important;
}

html[data-theme="light"] .badge,
html[data-theme="light"] .ship-task-badge,
html[data-theme="light"] .billing-doc-type,
html[data-theme="light"] .billing-client-chip,
html[data-theme="light"] .billing-share,
html[data-theme="light"] .doc-status,
html[data-theme="light"] .alloc-a,
html[data-theme="light"] .alloc-r {
  background: #f2f6fb !important;
  border-color: #b9c4d4 !important;
  color: #1d2735 !important;
}

html[data-theme="light"] .badge-danger,
html[data-theme="light"] .badge.danger,
html[data-theme="light"] .doc-status.status-missing {
  background: #fee4e2 !important;
  border-color: #f04438 !important;
  color: #7a271a !important;
}

html[data-theme="light"] .badge-warning,
html[data-theme="light"] .badge.warn,
html[data-theme="light"] .doc-status.status-draft {
  background: #fef0c7 !important;
  border-color: #f79009 !important;
  color: #7a2e0e !important;
}

html[data-theme="light"] .badge-success,
html[data-theme="light"] .badge.ok,
html[data-theme="light"] .doc-status.status-approved,
html[data-theme="light"] .alloc-a {
  background: #dcfae6 !important;
  border-color: #17b26a !important;
  color: #074d31 !important;
}

html[data-theme="light"] .badge-blue,
html[data-theme="light"] .badge.blue,
html[data-theme="light"] .doc-status.status-partial,
html[data-theme="light"] .ship-task-badge.is-blue {
  background: #dbeafe !important;
  border-color: #60a5fa !important;
  color: #1849a9 !important;
}

html[data-theme="light"] .ship-task-badge.is-danger {
  background: #fee4e2 !important;
  border-color: #f04438 !important;
  color: #7a271a !important;
}

html[data-theme="light"] .billing-readiness.is-ok,
html[data-theme="light"] .billing-quality-item.is-ok,
html[data-theme="light"] .billing-proof.is-ok {
  background: #ecfdf3 !important;
  border-color: #17b26a !important;
  color: #074d31 !important;
}

html[data-theme="light"] .billing-readiness.is-warning,
html[data-theme="light"] .billing-quality-item.is-warning,
html[data-theme="light"] .billing-proof.is-warning {
  background: #fffaeb !important;
  border-color: #f79009 !important;
  color: #7a2e0e !important;
}

html[data-theme="light"] .billing-readiness.is-critical,
html[data-theme="light"] .billing-quality-item.is-danger,
html[data-theme="light"] .billing-proof.is-danger {
  background: #fef3f2 !important;
  border-color: #f04438 !important;
  color: #7a271a !important;
}

html[data-theme="light"] .billing-command__top,
html[data-theme="light"] .billing-command__filters,
html[data-theme="light"] .billing-invoice-card__head,
html[data-theme="light"] .billing-tabs__nav,
html[data-theme="light"] .billing-doc-dialog__head,
html[data-theme="light"] .billing-table-note {
  background: #f2f6fb !important;
  border-color: #cbd5e1 !important;
  color: #344054 !important;
}

html[data-theme="light"] .billing-doc-dialog {
  background: #ffffff !important;
  border-color: #98a8bd !important;
  color: #101828 !important;
}

html[data-theme="light"] .billing-doc-dialog::backdrop,
html[data-theme="light"] dialog::backdrop {
  background: rgba(16,24,40,.30) !important;
  backdrop-filter: blur(2px);
}

html[data-theme="light"] .billing-doc-row.status-missing td { box-shadow: inset 3px 0 0 #d92d20 !important; }
html[data-theme="light"] .billing-doc-row.status-draft td { box-shadow: inset 3px 0 0 #dc6803 !important; }
html[data-theme="light"] .billing-doc-row.status-partial td { box-shadow: inset 3px 0 0 #2563eb !important; }
html[data-theme="light"] .billing-doc-row.status-approved td { box-shadow: inset 3px 0 0 #079455 !important; }
html[data-theme="light"] .billing-doc-row.status-closed td { box-shadow: inset 3px 0 0 #667085 !important; }

html[data-theme="light"] .alert,
html[data-theme="light"] .toast {
  color: #101828 !important;
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
}

html[data-theme="light"] .alert-success,
html[data-theme="light"] .toast.ok {
  background: #ecfdf3 !important;
  border-color: #17b26a !important;
  color: #074d31 !important;
}

html[data-theme="light"] .alert-warning,
html[data-theme="light"] .toast.warn {
  background: #fffaeb !important;
  border-color: #f79009 !important;
  color: #7a2e0e !important;
}

html[data-theme="light"] .alert-error,
html[data-theme="light"] .alert-danger,
html[data-theme="light"] .toast.danger {
  background: #fef3f2 !important;
  border-color: #f04438 !important;
  color: #7a271a !important;
}

html[data-theme="light"] .alert-info {
  background: #eff8ff !important;
  border-color: #2e90fa !important;
  color: #1849a9 !important;
}

html[data-theme="light"] .backdrop {
  background: rgba(16,24,40,.28) !important;
}

html[data-theme="light"] .pallet-drawer,
html[data-theme="light"] .shipment-page .pallet-card,
html[data-theme="light"] .shipment-page .pallet-summary,
html[data-theme="light"] .shipment-page .billing-panel,
html[data-theme="light"] .shipment-page .billing-empty,
html[data-theme="light"] .receiving-page .media-card,
html[data-theme="light"] .media-gallery,
html[data-theme="light"] .media-modal,
html[data-theme="light"] .service-express-inventory-runs .card {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
}

html[data-theme="light"] .wms-grid .tabulator-cell.is-editable {
  background-color: #fff7e6 !important;
  box-shadow: inset 0 -1px 0 #f59e0b !important;
}

html[data-theme="light"] .wms-grid .tabulator .editable-head,
html[data-theme="light"] .wms-grid .tabulator .editable-head__icon {
  color: #92400e !important;
}

html[data-theme="light"] ::selection {
  background: rgba(29,78,216,.24);
  color: #101828;
}

/* Light theme hardening for legacy screens and vendor widgets. */
html[data-theme="light"] .toolbar,
html[data-theme="light"] .tab-toolbar,
html[data-theme="light"] .tasks-toolbar,
html[data-theme="light"] .zone-tree__filters,
html[data-theme="light"] .report-movement-page .mov-filter,
html[data-theme="light"] .billing-price-summary,
html[data-theme="light"] .ozon-workspace,
html[data-theme="light"] .ozon-control-panel,
html[data-theme="light"] .ozon-draft-panel {
  background: #ffffff !important;
  border-color: #b9c4d4 !important;
  color: #101828 !important;
}

html[data-theme="light"] .toolbar,
html[data-theme="light"] .tab-toolbar,
html[data-theme="light"] .tasks-toolbar {
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}

html[data-theme="light"] .field,
html[data-theme="light"] .tasks-filter,
html[data-theme="light"] .zone-filter,
html[data-theme="light"] .mode-select,
html[data-theme="light"] .shipment-page .units-row,
html[data-theme="light"] .shipment-page .alloc-row,
html[data-theme="light"] .receiving-page .media-chip,
html[data-theme="light"] .sku-suggest__item,
html[data-theme="light"] .ship-unscheduled-item,
html[data-theme="light"] .ship-cal-day,
html[data-theme="light"] .ship-cal-day-list__empty,
html[data-theme="light"] .ship-kanban-col__empty,
html[data-theme="light"] .ship-cal-week-col__empty,
html[data-theme="light"] .ozon-control-tile,
html[data-theme="light"] .ozon-import-card,
html[data-theme="light"] .ozon-selected-import,
html[data-theme="light"] .ozon-mode-card {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #101828 !important;
}

html[data-theme="light"] .ship-cal-day.is-empty {
  background: #eef3f8 !important;
}

html[data-theme="light"] .ship-kanban-col__count,
html[data-theme="light"] .badge-muted,
html[data-theme="light"] .pill,
html[data-theme="light"] .chip,
html[data-theme="light"] .impact-pill,
html[data-theme="light"] .status-pill,
html[data-theme="light"] .kpi-breakdown summary,
html[data-theme="light"] .dashboard-shipment summary,
html[data-theme="light"] .tab-panel[data-panel="trip"] .trip-details > summary,
html[data-theme="light"] .tab-panel[data-panel="trip"] .trip-advanced > summary {
  background: #f2f6fb !important;
  border-color: #b9c4d4 !important;
  color: #1d2735 !important;
}

html[data-theme="light"] .card.warning,
html[data-theme="light"] .ozon-control-tile--warn {
  background: #fffaeb !important;
  border-color: #f79009 !important;
  color: #7a2e0e !important;
}

html[data-theme="light"] .ozon-control-tile--bad {
  background: #fef3f2 !important;
  border-color: #f04438 !important;
  color: #7a271a !important;
}

html[data-theme="light"] .ozon-control-tile--ok {
  background: #ecfdf3 !important;
  border-color: #17b26a !important;
  color: #074d31 !important;
}

html[data-theme="light"] .modal,
html[data-theme="light"] .wms-modal,
html[data-theme="light"] .ozon-modal-backdrop,
html[data-theme="light"] .trip-drawer-backdrop,
html[data-theme="light"] .wms-modal-backdrop {
  background: rgba(16,24,40,.28) !important;
  backdrop-filter: blur(2px);
}

html[data-theme="light"] .modal-card,
html[data-theme="light"] .wms-modal__card,
html[data-theme="light"] .wms-modal .card,
html[data-theme="light"] .ozon-modal,
html[data-theme="light"] .trip-drawer {
  background: #ffffff !important;
  border-color: #98a8bd !important;
  color: #101828 !important;
  box-shadow: 0 18px 50px rgba(16,24,40,.22) !important;
}

html[data-theme="light"] .modal-title,
html[data-theme="light"] .wms-modal__title,
html[data-theme="light"] .wms-modal .card__title,
html[data-theme="light"] .ozon-modal__head,
html[data-theme="light"] .trip-drawer__title,
html[data-theme="light"] .trip-details__summary-title {
  color: #101828 !important;
}

html[data-theme="light"] .wms-modal .card__header,
html[data-theme="light"] .ozon-modal__head,
html[data-theme="light"] .trip-drawer__header {
  background: #f2f6fb !important;
  border-color: #cbd5e1 !important;
}

html[data-theme="light"] .btn-link {
  background: transparent !important;
  border-color: transparent !important;
  color: #175cd3 !important;
  box-shadow: none !important;
}

html[data-theme="light"] .theme-toggle__icon {
  background: linear-gradient(135deg, #facc15 0 46%, #ffffff 47% 100%) !important;
  border-color: #b54708 !important;
}

html[data-theme="light"] .flatpickr-calendar {
  background: #ffffff !important;
  border: 1px solid #98a8bd !important;
  box-shadow: 0 18px 50px rgba(16,24,40,.22) !important;
  color: #101828 !important;
}

html[data-theme="light"] .flatpickr-months,
html[data-theme="light"] .flatpickr-month,
html[data-theme="light"] .flatpickr-current-month,
html[data-theme="light"] .flatpickr-weekdays,
html[data-theme="light"] .flatpickr-weekday {
  background: #f2f6fb !important;
  color: #344054 !important;
  fill: #344054 !important;
}

html[data-theme="light"] .flatpickr-day {
  color: #101828 !important;
  border-color: transparent !important;
}

html[data-theme="light"] .flatpickr-day:hover,
html[data-theme="light"] .flatpickr-day:focus {
  background: #eef4ff !important;
  border-color: #9fb3d1 !important;
}

html[data-theme="light"] .flatpickr-day.today {
  border-color: #1d4ed8 !important;
}

html[data-theme="light"] .flatpickr-day.selected,
html[data-theme="light"] .flatpickr-day.startRange,
html[data-theme="light"] .flatpickr-day.endRange {
  background: #1d4ed8 !important;
  border-color: #1849a9 !important;
  color: #ffffff !important;
}

html[data-theme="light"] .flatpickr-day.prevMonthDay,
html[data-theme="light"] .flatpickr-day.nextMonthDay,
html[data-theme="light"] .flatpickr-day.flatpickr-disabled {
  color: #98a2b3 !important;
}

html[data-theme="light"] * {
  scrollbar-color: #98a8bd #eef3f8;
}

html[data-theme="light"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html[data-theme="light"] ::-webkit-scrollbar-track {
  background: #eef3f8;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: #98a8bd;
  border: 2px solid #eef3f8;
  border-radius: 999px;
}

html[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
  background: #667f9f;
}

/* ==========================================================================
   Enterprise accent layer
   Adds stronger hierarchy across the app without changing page templates.
   ========================================================================== */

:root{
  --wms-accent: #4f8cff;
  --wms-accent-strong: #2f6bff;
  --wms-accent-soft: rgba(79,140,255,.16);
  --wms-cyan: #22d3ee;
  --wms-amber: #f59e0b;
  --wms-green: #22c55e;
  --wms-red: #ef4444;
}

.content .card,
.content details.card,
.tabulator,
.wms-grid .tabulator,
.table-wrapper,
.billing-table-wrap{
  border-color: rgba(148,163,184,.24) !important;
}

.content .card,
.content details.card{
  position: relative;
  overflow: visible;
}

.content .card::before,
.content details.card::before{
  content: "";
  position: absolute;
  left: -1px;
  top: 12px;
  bottom: 12px;
  width: 3px;
  border-radius: 0 4px 4px 0;
  background: linear-gradient(180deg, var(--wms-accent), rgba(34,211,238,.72));
  opacity: .55;
  pointer-events: none;
}

.content .card.warning::before,
.content .card.is-warning::before{
  background: linear-gradient(180deg, var(--wms-amber), rgba(245,158,11,.42));
  opacity: .9;
}

.content .card.danger::before,
.content .card.is-danger::before{
  background: linear-gradient(180deg, var(--wms-red), rgba(239,68,68,.42));
  opacity: .9;
}

.card__header{
  border-color: rgba(148,163,184,.22) !important;
  background:
    linear-gradient(90deg, rgba(79,140,255,.10), transparent 38%),
    rgba(15,23,42,.42) !important;
}

.toolbar,
.tab-toolbar,
.tasks-toolbar{
  border-color: rgba(148,163,184,.22) !important;
}

.card__title::after,
.page-header__title::after,
.tab-context-title strong::after{
  content: "";
  display: block;
  width: 38px;
  height: 2px;
  margin-top: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--wms-accent), var(--wms-cyan));
  opacity: .9;
}

.btn{
  border-color: rgba(148,163,184,.32);
  background: rgba(15,23,42,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.btn:hover{
  border-color: rgba(79,140,255,.54);
  background: rgba(37,99,235,.16);
  color: #fff;
}

.btn-primary{
  border-color: rgba(79,140,255,.82) !important;
  background: linear-gradient(180deg, #3b82f6, #2457d6) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(37,99,235,.24), inset 0 1px 0 rgba(255,255,255,.16);
}

.btn-primary:hover{
  background: linear-gradient(180deg, #4f8cff, #2f6bff) !important;
  box-shadow: 0 12px 28px rgba(37,99,235,.32), inset 0 1px 0 rgba(255,255,255,.18);
}

.btn-success{
  border-color: rgba(34,197,94,.58) !important;
  background: rgba(34,197,94,.18) !important;
}

.btn-warning{
  border-color: rgba(245,158,11,.62) !important;
  background: rgba(245,158,11,.18) !important;
}

.btn-danger{
  border-color: rgba(239,68,68,.62) !important;
  background: rgba(239,68,68,.18) !important;
}

.tabs,
.billing-tabs__nav,
.ship-view-switch,
.ship-cal-scale-switch{
  border-color: rgba(148,163,184,.24) !important;
  background: rgba(2,6,23,.44) !important;
}

.tab-btn.is-active,
#billing-tab-docs:checked ~ .billing-tabs__nav label[for="billing-tab-docs"],
#billing-tab-services:checked ~ .billing-tabs__nav label[for="billing-tab-services"],
.ship-view-switch__btn.is-active,
.ship-cal-scale-switch__btn.is-active{
  border-color: rgba(79,140,255,.72) !important;
  background:
    linear-gradient(180deg, rgba(79,140,255,.30), rgba(37,99,235,.20)) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--wms-accent), 0 0 0 1px rgba(79,140,255,.18);
}

.nav-item.is-active{
  background: rgba(37,99,235,.22) !important;
  border-color: rgba(79,140,255,.64) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 var(--wms-accent), 0 0 0 1px rgba(79,140,255,.12);
}

.badge,
.ship-task-badge,
.billing-doc-type,
.doc-status,
.status-pill{
  border-width: 1px;
  font-weight: 850;
}

.badge-muted,
.badge.muted{
  border-color: rgba(148,163,184,.34) !important;
  background: rgba(148,163,184,.12) !important;
  color: rgba(226,232,240,.86) !important;
}

.badge-success,
.badge.ok,
.doc-status.status-approved,
.alloc-a{
  border-color: rgba(34,197,94,.48) !important;
  background: rgba(34,197,94,.14) !important;
  color: #bbf7d0 !important;
}

.badge-warning,
.badge.warn,
.doc-status.status-draft{
  border-color: rgba(245,158,11,.52) !important;
  background: rgba(245,158,11,.16) !important;
  color: #fde68a !important;
}

.badge-danger,
.badge.danger,
.doc-status.status-missing{
  border-color: rgba(239,68,68,.52) !important;
  background: rgba(239,68,68,.16) !important;
  color: #fecaca !important;
}

.badge-blue,
.badge.blue,
.doc-status.status-partial{
  border-color: rgba(79,140,255,.54) !important;
  background: rgba(79,140,255,.16) !important;
  color: #bfdbfe !important;
}

.tabulator .tabulator-header,
.wms-grid .tabulator-header,
.content table thead th,
.billing-table th,
.shipment-page table th{
  background:
    linear-gradient(180deg, rgba(79,140,255,.13), rgba(15,23,42,.62)) !important;
  color: rgba(226,232,240,.92) !important;
  border-bottom-color: rgba(79,140,255,.22) !important;
}

.tabulator .tabulator-row.tabulator-selected,
.wms-grid .tabulator-row.tabulator-selected{
  background: rgba(37,99,235,.22) !important;
  box-shadow: inset 3px 0 0 var(--wms-accent);
}

.content table tbody tr:hover td,
.billing-table tbody tr:hover td,
.shipment-page table tbody tr:hover td,
.tabulator .tabulator-row:hover,
.wms-grid .tabulator-row:hover{
  background: rgba(79,140,255,.10) !important;
}

.input:focus,
input:focus,
select:focus,
textarea:focus,
.tabulator .tabulator-header-filter input:focus,
.tabulator .tabulator-header-filter select:focus{
  border-color: rgba(79,140,255,.76) !important;
  box-shadow: 0 0 0 3px rgba(79,140,255,.18) !important;
}

html[data-theme="light"] .content .card::before,
html[data-theme="light"] .content details.card::before{
  opacity: .78;
}

html[data-theme="light"] .card__header{
  background:
    linear-gradient(90deg, rgba(37,99,235,.09), transparent 42%),
    #f8fafc !important;
}

html[data-theme="light"] .btn{
  border-color: #cbd5e1;
  background: #fff;
  color: #1e293b;
}

html[data-theme="light"] .btn:hover{
  border-color: #3b82f6;
  background: #eff6ff;
  color: #0f172a;
}

html[data-theme="light"] .tabs,
html[data-theme="light"] .billing-tabs__nav,
html[data-theme="light"] .ship-view-switch,
html[data-theme="light"] .ship-cal-scale-switch{
  background: #f1f5f9 !important;
}

html[data-theme="light"] .tab-btn.is-active,
html[data-theme="light"] #billing-tab-docs:checked ~ .billing-tabs__nav label[for="billing-tab-docs"],
html[data-theme="light"] #billing-tab-services:checked ~ .billing-tabs__nav label[for="billing-tab-services"],
html[data-theme="light"] .ship-view-switch__btn.is-active,
html[data-theme="light"] .ship-cal-scale-switch__btn.is-active{
  background: #dbeafe !important;
  color: #1e3a8a !important;
}

html[data-theme="light"] .tabulator .tabulator-header,
html[data-theme="light"] .wms-grid .tabulator-header,
html[data-theme="light"] .content table thead th,
html[data-theme="light"] .billing-table th,
html[data-theme="light"] .shipment-page table th{
  background: linear-gradient(180deg, #eaf2ff, #f8fafc) !important;
  color: #334155 !important;
}

html[data-theme="light"] .badge-muted,
html[data-theme="light"] .badge.muted{
  color: #475569 !important;
}

/* Pickup screens: explicit dark and light treatments. */
html[data-theme="dark"] .main:has(.pickup-page),
html[data-theme="dark"] .content:has(.pickup-page){
  background:
    radial-gradient(circle at 18% 0%, rgba(37,99,235,.13), transparent 34rem),
    linear-gradient(180deg, #070b13 0%, #05080f 100%) !important;
  color: #f8fafc !important;
}

html[data-theme="dark"] .pickup-page,
html[data-theme="dark"] .pickup-page *{
  color-scheme: dark;
}

html[data-theme="dark"] .pickup-page{
  color: #f8fafc !important;
}

html[data-theme="dark"] .pickup-panel{
  border-color: rgba(79,140,255,.24) !important;
  background:
    linear-gradient(180deg, rgba(17,24,39,.96), rgba(7,11,19,.98)),
    #080d17 !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.32) !important;
}

html[data-theme="dark"] .pickup-fact,
html[data-theme="dark"] .pickup-filter-bar,
html[data-theme="dark"] .pickup-line-card,
html[data-theme="dark"] .pickup-mobile-card,
html[data-theme="dark"] .pickup-mobile-card__metric,
html[data-theme="dark"] .pickup-note-list li,
html[data-theme="dark"] .pickup-share-card{
  border-color: rgba(71,85,105,.72) !important;
  background: rgba(2,6,23,.58) !important;
}

html[data-theme="dark"] .pickup-page input:not([type="hidden"]),
html[data-theme="dark"] .pickup-page select,
html[data-theme="dark"] .pickup-page textarea,
html[data-theme="dark"] .pickup-page .input,
html[data-theme="dark"] .pickup-filter-bar select,
html[data-theme="dark"] .pickup-public-link input{
  background: #050b16 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  border-color: rgba(71,85,105,.88) !important;
  box-shadow: none;
}

html[data-theme="dark"] .pickup-page input::placeholder,
html[data-theme="dark"] .pickup-page textarea::placeholder{
  color: rgba(148,163,184,.74) !important;
  -webkit-text-fill-color: rgba(148,163,184,.74) !important;
}

html[data-theme="dark"] .pickup-page input:focus,
html[data-theme="dark"] .pickup-page select:focus,
html[data-theme="dark"] .pickup-page textarea:focus{
  border-color: rgba(96,165,250,.92) !important;
  box-shadow: 0 0 0 3px rgba(59,130,246,.22) !important;
}

html[data-theme="dark"] .pickup-page select option{
  background: #0b1220 !important;
  color: #f8fafc !important;
}

html[data-theme="dark"] .pickup-page .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.btn-warning){
  background: rgba(15,23,42,.82) !important;
  color: #f8fafc !important;
  border-color: rgba(71,85,105,.9) !important;
}

html[data-theme="dark"] .pickup-page .muted,
html[data-theme="dark"] .pickup-sub,
html[data-theme="dark"] .pickup-hint,
html[data-theme="dark"] .pickup-source,
html[data-theme="dark"] .pickup-fact span,
html[data-theme="dark"] .pickup-field label,
html[data-theme="dark"] .pickup-lines-label,
html[data-theme="dark"] .pickup-filter-field label,
html[data-theme="dark"] .pickup-mobile-card__metric span{
  color: #94a3b8 !important;
}

html[data-theme="dark"] .pickup-lines-table th{
  background: linear-gradient(180deg, rgba(37,99,235,.20), rgba(15,23,42,.88)) !important;
  color: #b6c2d4 !important;
}

html[data-theme="dark"] .pickup-lines-table td{
  background: rgba(5,10,20,.58) !important;
  color: #f8fafc !important;
}

html[data-theme="light"] .main:has(.pickup-page),
html[data-theme="light"] .content:has(.pickup-page){
  background:
    radial-gradient(circle at 16% 0%, rgba(37,99,235,.10), transparent 34rem),
    linear-gradient(180deg, #f4f7fb 0%, #e9eef6 100%) !important;
  color: #111827 !important;
}

html[data-theme="light"] .pickup-page,
html[data-theme="light"] .pickup-page *{
  color-scheme: light;
}

html[data-theme="light"] .pickup-page{
  color: #111827 !important;
}

html[data-theme="light"] .pickup-panel{
  border-color: #c8d4e4 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.98)),
    #ffffff !important;
  box-shadow: 0 12px 30px rgba(15,23,42,.09) !important;
}

html[data-theme="light"] .pickup-panel::before{
  opacity: .7;
}

html[data-theme="light"] .pickup-fact,
html[data-theme="light"] .pickup-filter-bar,
html[data-theme="light"] .pickup-line-card,
html[data-theme="light"] .pickup-mobile-card,
html[data-theme="light"] .pickup-mobile-card__metric,
html[data-theme="light"] .pickup-note-list li,
html[data-theme="light"] .pickup-share-card{
  border-color: #d4deea !important;
  background: #ffffff !important;
}

html[data-theme="light"] .pickup-share-card{
  background: linear-gradient(135deg, #eef5ff, #ffffff) !important;
}

html[data-theme="light"] .pickup-danger-zone{
  border-color: #fca5a5 !important;
  background: linear-gradient(180deg, #fff7f7, #ffffff) !important;
}

html[data-theme="light"] .pickup-page input:not([type="hidden"]),
html[data-theme="light"] .pickup-page select,
html[data-theme="light"] .pickup-page textarea,
html[data-theme="light"] .pickup-page .input,
html[data-theme="light"] .pickup-filter-bar select,
html[data-theme="light"] .pickup-public-link input{
  background: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: #b8c5d6 !important;
  box-shadow: inset 0 1px 1px rgba(15,23,42,.03) !important;
}

html[data-theme="light"] .pickup-recipient-inline:not(.is-editing) .pickup-inline-input{
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] .pickup-page input::placeholder,
html[data-theme="light"] .pickup-page textarea::placeholder{
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
}

html[data-theme="light"] .pickup-page input:focus,
html[data-theme="light"] .pickup-page select:focus,
html[data-theme="light"] .pickup-page textarea:focus{
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.16) !important;
}

html[data-theme="light"] .pickup-page select option{
  background: #ffffff !important;
  color: #111827 !important;
}

html[data-theme="light"] .pickup-page .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.btn-warning){
  background: #ffffff !important;
  color: #172033 !important;
  border-color: #b8c5d6 !important;
}

html[data-theme="light"] .pickup-page .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.btn-warning):hover{
  background: #eef5ff !important;
  border-color: #3b82f6 !important;
}

html[data-theme="light"] .pickup-page .muted,
html[data-theme="light"] .pickup-sub,
html[data-theme="light"] .pickup-hint,
html[data-theme="light"] .pickup-source,
html[data-theme="light"] .pickup-fact span,
html[data-theme="light"] .pickup-field label,
html[data-theme="light"] .pickup-lines-label,
html[data-theme="light"] .pickup-filter-field label,
html[data-theme="light"] .pickup-mobile-card__metric span{
  color: #5f6f85 !important;
}

html[data-theme="light"] .pickup-fact b,
html[data-theme="light"] .pickup-line-title,
html[data-theme="light"] .pickup-main-title,
html[data-theme="light"] .pickup-title,
html[data-theme="light"] .pickup-side-card-title,
html[data-theme="light"] .pickup-picked strong,
html[data-theme="light"] .pickup-code{
  color: #0f172a !important;
}

html[data-theme="light"] .pickup-lines-table th{
  background: linear-gradient(180deg, #eaf2ff, #f8fafc) !important;
  color: #344054 !important;
  border-bottom-color: #c8d4e4 !important;
}

html[data-theme="light"] .pickup-lines-table td{
  background: #ffffff !important;
  color: #111827 !important;
  border-bottom-color: #e4eaf2 !important;
}

html[data-theme="light"] .pickup-progress{
  background: #e4eaf2 !important;
}

html[data-theme="light"] .pickup-qr{
  background: #ffffff !important;
  border-color: #c8d4e4 !important;
}

html[data-theme="light"] .pickup-status{
  background: #f8fafc !important;
  color: #172033 !important;
  border-color: #c8d4e4 !important;
}

html[data-theme="light"] .pickup-status.is-good{
  background: #ecfdf3 !important;
  color: #067647 !important;
  border-color: #86efac !important;
}

html[data-theme="light"] .pickup-status.is-warn{
  background: #fffbeb !important;
  color: #b54708 !important;
  border-color: #fbbf24 !important;
}

html[data-theme="light"] .pickup-status.is-bad{
  background: #fef3f2 !important;
  color: #b42318 !important;
  border-color: #fca5a5 !important;
}

/* Native select popups are rendered by the browser/OS on some devices.
   These global rules keep dropdown text readable across Chromium, Safari and
   embedded warehouse browsers as much as native controls allow. */
html[data-theme="dark"]{
  color-scheme: dark;
}

html[data-theme="dark"] select,
html[data-theme="dark"] .input:is(select),
html[data-theme="dark"] .tabulator .tabulator-header .tabulator-col select{
  background-color: #050b16 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  border-color: rgba(71,85,105,.88) !important;
}

html[data-theme="dark"] select option,
html[data-theme="dark"] select optgroup,
html[data-theme="dark"] .input:is(select) option,
html[data-theme="dark"] .input:is(select) optgroup{
  background-color: #0b1220 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] select option:checked,
html[data-theme="dark"] .input:is(select) option:checked{
  background-color: #2563eb !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="dark"] select option:disabled,
html[data-theme="dark"] .input:is(select) option:disabled{
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

html[data-theme="light"] select,
html[data-theme="light"] .input:is(select),
html[data-theme="light"] .tabulator .tabulator-header .tabulator-col select{
  background-color: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: #b8c5d6 !important;
}

html[data-theme="light"] select option,
html[data-theme="light"] select optgroup,
html[data-theme="light"] .input:is(select) option,
html[data-theme="light"] .input:is(select) optgroup{
  background-color: #ffffff !important;
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
}

html[data-theme="light"] select option:checked,
html[data-theme="light"] .input:is(select) option:checked{
  background-color: #dbeafe !important;
  color: #1e3a8a !important;
  -webkit-text-fill-color: #1e3a8a !important;
}

html[data-theme="light"] select option:disabled,
html[data-theme="light"] .input:is(select) option:disabled{
  color: #667085 !important;
  -webkit-text-fill-color: #667085 !important;
}

/* Enterprise service case queues: no-stock and lost pallet operations. */
.service-case-page{
  display:grid;
  gap:14px;
}

.service-case-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}

.service-case-header h1{
  margin:0;
}

.service-case-meta{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.service-case-stats{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap:10px;
}

.service-case-stat{
  min-width:0;
  padding:11px 12px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background: rgba(15,23,42,.22);
}

.service-case-stat__label{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.service-case-stat__value{
  margin-top:5px;
  color:var(--text);
  font-size:22px;
  font-weight:850;
  line-height:1;
}

.service-case-filter{
  display:grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr)) auto;
  gap:12px;
  align-items:end;
}

.service-case-filter .field,
.service-case-filter .input{
  min-width:0;
  width:100%;
}

.service-case-actions{
  position:sticky;
  top:8px;
  z-index:24;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background: color-mix(in srgb, var(--panel, #10151d) 94%, transparent);
  box-shadow: 0 12px 32px rgba(0,0,0,.18);
}

.service-case-actions .input{
  flex:1 1 280px;
  min-width:220px;
}

.service-case-table{
  min-width:100%;
}

.service-case-table th{
  white-space:nowrap;
}

.service-case-table td{
  vertical-align:top;
}

.service-case-table .case-main{
  min-width:220px;
}

.service-case-table .case-message{
  min-width:260px;
  max-width:420px;
}

.service-case-table .case-actions{
  min-width:300px;
}

.service-case-table .case-inline-form{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.service-case-table .case-inline-form .input{
  min-width:110px;
  width:auto;
}

.case-status{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.28);
  background:rgba(148,163,184,.12);
  color:var(--muted);
  font-size:11px;
  font-weight:850;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.case-status--open,
.case-status--missing{
  border-color:rgba(245,158,11,.46);
  background:rgba(245,158,11,.14);
  color:#fbbf24;
}

.case-status--ack{
  border-color:rgba(59,130,246,.44);
  background:rgba(59,130,246,.14);
  color:#93c5fd;
}

.case-status--closed,
.case-status--found,
.case-status--printed{
  border-color:rgba(34,197,94,.44);
  background:rgba(34,197,94,.14);
  color:#86efac;
}

.case-status--offsystem{
  border-color:rgba(148,163,184,.4);
  background:rgba(148,163,184,.14);
  color:#cbd5e1;
}

.case-row--issue td{
  background:rgba(245,158,11,.06);
}

.case-issue{
  margin-top:4px;
  color:#fca5a5;
  font-size:12px;
  font-weight:700;
}

html[data-theme="light"] .service-case-stat,
html[data-theme="light"] .service-case-actions{
  background:#ffffff;
  border-color:#cbd5e1;
}

html[data-theme="light"] .case-status--open,
html[data-theme="light"] .case-status--missing{
  color:#b54708;
  background:#fffaeb;
  border-color:#fbbf24;
}

html[data-theme="light"] .case-status--ack{
  color:#1849a9;
  background:#eff8ff;
  border-color:#84caff;
}

html[data-theme="light"] .case-status--closed,
html[data-theme="light"] .case-status--found,
html[data-theme="light"] .case-status--printed{
  color:#067647;
  background:#ecfdf3;
  border-color:#86efac;
}

html[data-theme="light"] .case-status--offsystem{
  color:#475467;
  background:#f2f4f7;
  border-color:#cbd5e1;
}

html[data-theme="light"] .case-row--issue td{
  background:#fffaeb;
}

html[data-theme="light"] .case-issue{
  color:#b42318;
}

@media (max-width: 980px){
  .service-case-header{
    display:grid;
  }

  .service-case-meta{
    justify-content:flex-start;
  }

  .service-case-filter{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-case-filter .btn{
    width:100%;
  }
}

@media (max-width: 620px){
  .service-case-filter{
    grid-template-columns:1fr;
  }

  .service-case-actions{
    position:relative;
    top:auto;
  }

  .service-case-actions .btn,
  .service-case-actions .input{
    width:100%;
    min-width:0;
  }
}

/* ==========================================================================
   Enterprise containment guardrails
   Keep operational forms, toolbars and TSD-sized screens inside the viewport.
   ========================================================================== */

.main,
.content,
.content *,
.wms-modal,
.wms-modal *,
.login-card,
.login-card *{
  box-sizing:border-box;
}

.main,
.content,
.content > *,
.page-header,
.page-header__left,
.page-header__actions,
.toolbar,
.toolbar__left,
.toolbar__right,
.btn-row,
.card,
details.card,
.card__header,
.card__body,
.grid-host,
.table-wrapper,
.wms-table-shell,
.login-card,
.login-field,
.login-actions{
  min-width:0;
  max-width:100%;
}

.content :where(form, fieldset, label, .field, .form-field, .form-row, .form-grid, .grid-2, .grid-3, .grid-4, .kpi-grid, .card-grid){
  min-width:0;
  max-width:100%;
}

.content :where(.page-header__title, .card__title, .title, .h1, .subtle, label, .alert, .badge, .status-pill, .case-status),
.login-title,
.login-field label,
.login-actions .btn{
  overflow-wrap:anywhere;
}

.content :where(.toolbar, .toolbar__left, .toolbar__right, .btn-row, .page-header__actions) > *,
.login-actions > *{
  min-width:0;
}

.content :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea, .input),
.login-input,
.login-btn{
  min-width:0;
  max-width:100%;
}

.content :where(input[type="file"]){
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.content :where(input[type="file"])::file-selector-button{
  max-width:100%;
  margin-right:10px;
  border:1px solid rgba(148,163,184,.32);
  border-radius:var(--ops-radius-sm, 5px);
  background:rgba(148,163,184,.18);
  color:inherit;
  font:inherit;
  font-weight:800;
  padding:6px 10px;
}

.content :where(.btn, .tab-btn, button, [role="button"]){
  max-width:100%;
}

.content :where(.table-wrapper, .grid-host, .wms-table-shell){
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

@media (max-width: 760px){
  .main,
  .content{
    max-width:100vw;
  }

  .content{
    overflow-x:hidden;
  }

  .content .card,
  .content details.card,
  .page-header{
    overflow:hidden;
  }

  .content .card::before,
  .content details.card::before{
    left:0;
  }

  .card__header,
  .page-header,
  .toolbar,
  .toolbar__left,
  .toolbar__right,
  .btn-row,
  .page-header__actions{
    align-items:stretch;
  }

  .content :where(.toolbar, .toolbar__left, .toolbar__right, .btn-row, .page-header__actions) :where(.btn, button, select, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), .input){
    flex:1 1 160px;
    min-width:0;
  }

  .content :where(.btn, button, [role="button"]){
    justify-content:center;
  }

  .content :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea, .input),
  .login-input{
    font-size:16px;
  }
}

@media (max-width: 480px){
  .content{
    padding-inline:10px;
  }

  .content :where(.grid-2, .grid-3, .grid-4, .kpi-grid, .card-grid){
    grid-template-columns:minmax(0, 1fr) !important;
  }

  .content :where(.toolbar, .toolbar__left, .toolbar__right, .btn-row, .page-header__actions) :where(.btn, button, select, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), .input){
    flex-basis:100%;
  }

  .content :where(input[type="file"]){
    white-space:normal;
  }
}

/* ==========================================================================
   Operational report frame
   ========================================================================== */

.report-ops-page{
  gap:14px;
}

.report-page-header .page-header__actions{
  align-self:center;
}

.report-page-header .page-header__left{
  min-width:0;
}

.report-link-actions{
  gap:8px;
  justify-content:flex-end;
  min-width:0;
}

.report-link-actions .btn{
  white-space:nowrap;
}

.report-filter-card{
  overflow:hidden;
}

.report-filter-card > .card__header{
  padding:10px 12px;
}

.report-filter-toolbar{
  width:100%;
  gap:10px;
}

.report-table-help{
  min-width:0;
  display:grid;
  gap:3px;
}

.report-table-help .h3{
  margin:0;
  font-size:15px;
  line-height:1.2;
}

.report-table-help .subtle{
  overflow-wrap:anywhere;
}

.report-filter-grid{
  display:grid;
  grid-template-columns:minmax(150px, .8fr) minmax(150px, .8fr) minmax(220px, 1.4fr) auto;
  gap:10px;
  align-items:end;
  flex:1 1 auto;
  min-width:0;
}

.report-filter-grid .field{
  min-width:0;
  width:100%;
}

.report-range-buttons{
  gap:8px;
  justify-content:flex-end;
  flex:0 0 auto;
}

.report-kpi-grid{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:12px;
}

.report-kpi-grid--four{
  grid-template-columns:repeat(4, minmax(0, 1fr));
}

.report-kpi-card{
  min-width:0;
  padding:12px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.32);
  box-shadow:0 10px 24px rgba(2,6,23,.18);
}

.report-kpi-card .subtle{
  overflow-wrap:anywhere;
}

.report-kpi-card .h2{
  margin-top:6px;
  line-height:1.05;
  font-variant-numeric:tabular-nums;
}

.report-split-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  margin-top:12px;
}

.report-table-card{
  min-width:0;
  padding:12px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.28);
  overflow:hidden;
}

.report-table-card--full{
  margin-top:12px;
}

.report-table-card .h3{
  margin:0 0 8px;
  font-size:15px;
  line-height:1.2;
}

.report-table-note{
  margin-bottom:8px;
}

.report-inline-metric{
  display:flex;
  gap:12px;
  align-items:baseline;
  flex-wrap:wrap;
  margin:8px 0;
  min-width:0;
}

.report-inline-metric .h2{
  margin:0;
}

.report-table-card table{
  width:100%;
}

.report-table-card td:first-child,
.report-table-card th:first-child{
  max-width:360px;
  overflow-wrap:anywhere;
}

.report-company-filter{
  min-width:220px;
}

.report-grid-card > .card__body{
  padding:0;
}

.report-grid-host{
  min-width:0;
  width:100%;
}

.report-grid-host .tabulator{
  border-radius:0;
}

.report-grid-card .wms-table-shell{
  border-radius:0;
  border-left:0;
  border-right:0;
  border-bottom:0;
}

@media (max-width: 1280px){
  .report-kpi-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px){
  .report-filter-toolbar{
    display:grid;
  }

  .report-link-actions{
    justify-content:flex-start;
  }

  .report-link-actions .btn{
    flex:1 1 160px;
    justify-content:center;
  }

  .report-filter-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .report-filter-grid__wide{
    grid-column:1 / -1;
  }

  .report-filter-grid .btn-primary{
    width:100%;
  }

  .report-range-buttons{
    justify-content:flex-start;
  }

  .report-split-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 620px){
  .report-filter-grid,
  .report-kpi-grid{
    grid-template-columns:1fr;
  }

  .report-company-filter{
    min-width:0;
    width:100%;
  }

  .report-range-buttons .btn{
    flex:1 1 120px;
  }
}

/* ==========================================================================
   Operational list/catalog frame
   ========================================================================== */

.ops-list-page{
  gap:14px;
}

.ops-list-header{
  align-items:center;
}

.ops-list-header .page-header__left{
  min-width:0;
}

.ops-list-actions{
  align-items:center;
  gap:8px;
}

.ops-list-actions .btn{
  white-space:nowrap;
}

.ops-list-card{
  overflow:hidden;
}

.ops-list-card > .card__header{
  padding:10px 12px;
}

.ops-list-toolbar{
  width:100%;
  align-items:center;
  gap:10px;
}

.ops-list-filter{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.ops-filter-label{
  margin:0;
  flex:0 0 auto;
}

.ops-list-filter .input,
.ops-list-filter select{
  width:auto;
  max-width:100%;
}

.ops-list-view{
  justify-content:flex-end;
  min-width:0;
}

.ops-list-view .ship-view-switch,
.ops-list-view .ship-cal-scale-switch{
  flex-wrap:wrap;
  justify-content:flex-end;
}

.ops-list-help{
  min-width:0;
}

.ops-list-help .subtle{
  overflow-wrap:anywhere;
}

.ops-selection-actions{
  gap:8px;
}

.ops-selection-actions .btn[disabled]{
  opacity:.52;
}

.ops-grid-host{
  min-width:0;
  width:100%;
}

.ops-grid-host .tabulator{
  border-radius:0;
}

.ops-list-card .wms-table-shell{
  border-radius:0;
  border-left:0;
  border-right:0;
  border-bottom:0;
}

.ops-list-card .wms-table-toolbar{
  border-left:0;
  border-right:0;
}

.ops-list-card .tabulator-footer{
  min-width:0;
}

.ops-list-card .tabulator-footer .tabulator-paginator{
  max-width:100%;
}

@media (min-width: 981px){
  .ops-list-actions{
    justify-content:flex-end;
  }

  .ops-list-card > .card__body{
    padding:0;
  }

  .ops-list-card > .card__body:not(.card__body--flush){
    padding-top:0;
  }
}

@media (max-width: 980px){
  .ops-list-header{
    display:grid;
    align-items:stretch;
  }

  .ops-list-actions{
    justify-content:flex-start;
  }

  .ops-list-actions .btn{
    flex:1 1 170px;
    justify-content:center;
  }

  .ops-list-toolbar{
    display:grid;
    align-items:stretch;
  }

  .ops-list-filter{
    display:grid;
    grid-template-columns:minmax(76px, auto) minmax(0, 1fr);
  }

  .ops-list-filter .input,
  .ops-list-filter select{
    width:100%;
    min-width:0 !important;
  }

  .ops-list-view{
    justify-content:flex-start;
  }

  .ops-list-view .ship-view-switch,
  .ops-list-view .ship-cal-scale-switch{
    width:100%;
    justify-content:stretch;
  }

  .ops-list-view .ship-view-switch__btn,
  .ops-list-view .ship-cal-scale-switch__btn{
    flex:1 1 0;
  }

  .ops-selection-actions{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .ops-selection-actions .btn{
    width:100%;
    justify-content:center;
  }
}

@media (max-width: 620px){
  .ops-list-actions,
  .ops-selection-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .ops-list-filter{
    grid-template-columns:1fr;
  }

  .ops-filter-label{
    font-size:11px;
  }

  .ops-list-view .ship-view-switch{
    display:grid;
    grid-template-columns:1fr;
  }

  .ops-list-card > .card__header{
    padding:10px;
  }
}

/* ==========================================================================
   Cycle count operations
   ========================================================================== */

.cycle-create-page,
.cycle-view-page{
  gap:14px;
}

.cycle-create-header,
.cycle-view-header{
  align-items:center;
}

.cycle-form-card{
  overflow:hidden;
}

.cycle-form-card > .card__header{
  align-items:flex-start;
}

.cycle-form-card__title{
  display:grid;
  gap:3px;
  min-width:0;
}

.cycle-form-grid{
  display:grid;
  gap:10px;
  min-width:0;
}

.cycle-form-grid--two{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.cycle-form-grid--three{
  grid-template-columns:1fr 1.2fr 1.4fr;
}

.cycle-form-field{
  display:grid;
  gap:6px;
  margin:0;
  min-width:0;
  align-content:start;
}

.cycle-form-field .field__label{
  color:var(--ops-muted);
  font-size:11px;
  font-weight:850;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.cycle-form-field .input{
  width:100%;
  min-height:38px;
}

.cycle-mode-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
}

.cycle-mode-summary__item{
  min-width:0;
  padding:9px 10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.24);
}

.cycle-mode-summary__item span{
  display:block;
  color:var(--ops-muted);
  font-size:10px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.cycle-mode-summary__item strong{
  display:block;
  margin-top:3px;
  color:var(--ops-text);
  font-size:13px;
  line-height:1.2;
  overflow-wrap:anywhere;
}

.cycle-mode-summary__item.is-active{
  border-color:rgba(47,107,255,.7);
  background:linear-gradient(180deg, rgba(47,107,255,.20), rgba(15,23,42,.28));
  box-shadow:0 0 0 1px rgba(47,107,255,.16) inset;
}

.cycle-dynamic-block{
  display:grid;
  grid-template-columns:minmax(220px, 1fr) minmax(220px, .85fr);
  gap:10px;
  align-items:end;
  min-width:0;
  padding:10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.22);
}

.cycle-dynamic-block--two{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.cc-hidden{
  display:none !important;
}

.cycle-hint{
  min-width:0;
  color:var(--ops-muted-2);
  font-size:12px;
  line-height:1.35;
  overflow-wrap:anywhere;
}

.cycle-form-footer{
  display:grid;
  grid-template-columns:auto minmax(220px, 1fr) auto;
  gap:10px;
  align-items:center;
  min-width:0;
}

.cycle-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
  margin:0;
  color:var(--ops-text);
  font-weight:800;
}

.cycle-preview{
  min-height:34px;
  display:flex;
  align-items:center;
  min-width:0;
  padding:8px 10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.24);
  color:var(--ops-muted-2);
  font-size:13px;
  font-weight:850;
  overflow-wrap:anywhere;
}

.cycle-preview.is-loading{
  color:#bfdbfe;
  border-color:rgba(59,130,246,.42);
  background:rgba(37,99,235,.14);
}

.cycle-preview.is-ready{
  color:#bbf7d0;
  border-color:rgba(34,197,94,.42);
  background:rgba(22,163,74,.14);
}

.cycle-preview.is-error{
  color:#fecaca;
  border-color:rgba(239,68,68,.5);
  background:rgba(239,68,68,.13);
}

.cycle-form-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
  min-width:0;
}

.cycle-form-actions .btn{
  white-space:nowrap;
}

.sku-suggest{
  position:fixed;
  z-index:2500;
  max-width:min(620px, calc(100vw - 20px));
  border:1px solid rgba(148,163,184,.25);
  background:rgba(9,14,24,.98);
  box-shadow:0 18px 40px rgba(0,0,0,.45);
  backdrop-filter:blur(8px);
}

.sku-suggest__item{
  display:grid;
  gap:6px;
  padding:10px 12px;
  border-bottom:1px solid rgba(148,163,184,.2);
  cursor:pointer;
}

.sku-suggest__item.is-active,
.sku-suggest__item:hover{
  background:rgba(59,130,246,.12);
}

.sku-suggest__article{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  font-weight:800;
}

.sku-suggest__meta{
  display:grid;
  gap:4px;
  color:var(--ops-muted-2);
  font-size:12px;
}

.sku-suggest__badge{
  padding:2px 6px;
  border-radius:999px;
  background:rgba(148,163,184,.2);
  font-size:11px;
}

.sku-suggest__badges{
  display:inline-flex;
  flex-wrap:wrap;
  gap:6px;
}

.sku-suggest__hl{
  padding:0 2px;
  border-radius:4px;
  background:rgba(59,130,246,.2);
}

.cycle-kpi-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.cycle-detail-card,
.cycle-next-card{
  overflow:hidden;
}

.cycle-detail-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.cycle-detail-item{
  min-width:0;
  padding:9px 10px;
  border:1px solid rgba(148,163,184,.18);
  border-radius:8px;
  background:rgba(15,23,42,.20);
}

.cycle-detail-item span{
  display:block;
  color:var(--ops-muted);
  font-size:11px;
  font-weight:850;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.cycle-detail-item strong{
  display:block;
  margin-top:4px;
  color:var(--ops-text);
  font-size:14px;
  line-height:1.25;
  overflow-wrap:anywhere;
}

.cycle-step-list{
  display:grid;
  gap:8px;
}

.cycle-step{
  display:grid;
  grid-template-columns:28px minmax(0, 1fr);
  gap:8px;
  align-items:start;
}

.cycle-step span{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border:1px solid rgba(59,130,246,.36);
  border-radius:7px;
  background:rgba(37,99,235,.16);
  color:#bfdbfe;
  font-weight:900;
}

.cycle-step strong{
  color:var(--ops-muted-2);
  font-size:13px;
  line-height:1.35;
  overflow-wrap:anywhere;
}

html[data-theme="light"] .cycle-mode-summary__item,
html[data-theme="light"] .cycle-dynamic-block,
html[data-theme="light"] .cycle-preview,
html[data-theme="light"] .cycle-detail-item{
  background:#f8fafc;
  border-color:#cbd5e1;
}

html[data-theme="light"] .cycle-mode-summary__item.is-active{
  background:#eff6ff;
  border-color:#3b82f6;
}

html[data-theme="light"] .cycle-preview.is-loading{
  background:#eff6ff;
  color:#1d4ed8;
}

html[data-theme="light"] .cycle-preview.is-ready{
  background:#ecfdf3;
  color:#027a48;
}

html[data-theme="light"] .cycle-preview.is-error{
  background:#fef3f2;
  color:#b42318;
}

html[data-theme="light"] .sku-suggest{
  background:rgba(255,255,255,.98);
  border-color:#cbd5e1;
}

html[data-theme="light"] .sku-suggest__item.is-active,
html[data-theme="light"] .sku-suggest__item:hover{
  background:#eff6ff;
}

@media (max-width: 980px){
  .cycle-create-header,
  .cycle-view-header{
    display:grid;
    align-items:stretch;
  }

  .cycle-form-grid--three,
  .cycle-form-footer{
    grid-template-columns:1fr;
  }

  .cycle-form-actions{
    justify-content:stretch;
  }

  .cycle-form-actions .btn{
    flex:1 1 160px;
    justify-content:center;
  }
}

@media (max-width: 720px){
  .cycle-form-grid--two,
  .cycle-dynamic-block,
  .cycle-dynamic-block--two,
  .cycle-mode-summary,
  .cycle-kpi-grid,
  .cycle-detail-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 480px){
  .cycle-dynamic-block{
    padding:8px;
  }

  .cycle-form-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .cycle-preview{
    font-size:12px;
  }
}

/* ==========================================================================
   Catalog operations
   ========================================================================== */

.catalog-edit-page{
  gap:14px;
}

.catalog-edit-header{
  align-items:center;
}

.catalog-edit-actions{
  gap:8px;
}

.catalog-edit-actions .btn{
  white-space:nowrap;
}

.catalog-form-card,
.catalog-table-card{
  overflow:hidden;
}

.catalog-card-title{
  display:grid;
  gap:3px;
  min-width:0;
}

.catalog-form-grid{
  display:grid;
  gap:10px;
  min-width:0;
}

.catalog-form-grid--one{
  grid-template-columns:minmax(0, min(100%, 420px));
}

.catalog-form-grid--three{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

.catalog-form-grid--actions{
  align-items:end;
}

.catalog-form-field{
  display:grid;
  gap:6px;
  min-width:0;
  margin:0;
  align-content:start;
}

.catalog-form-field--compact{
  max-width:260px;
}

.catalog-form-field .field__label{
  color:var(--ops-muted);
  font-size:11px;
  font-weight:850;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.catalog-form-field :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .input){
  width:100%;
  min-height:38px;
}

.catalog-sku-picker{
  display:grid;
  gap:8px;
  min-width:0;
}

.catalog-sku-picker__search,
.catalog-sku-picked{
  display:none;
}

.catalog-sku-picker.is-enhanced .catalog-sku-native{
  display:none;
}

.catalog-sku-picker.is-enhanced .catalog-sku-picker__search{
  display:block;
}

.catalog-sku-picked{
  min-width:0;
  padding:8px 10px;
  border:1px solid rgba(96,165,250,.24);
  border-radius:8px;
  background:rgba(30,64,175,.14);
}

.catalog-sku-picker.is-enhanced .catalog-sku-picked:not([hidden]){
  display:grid;
  gap:2px;
}

.catalog-sku-picked__label{
  color:var(--ops-text);
  font-weight:850;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.catalog-sku-picked__meta{
  color:var(--ops-muted-2);
  font-size:12px;
}

.catalog-section-label{
  margin-top:2px;
  padding-top:6px;
  border-top:1px solid rgba(148,163,184,.16);
  color:#93c5fd;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.catalog-toggle-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  min-width:0;
}

.catalog-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:36px;
  margin:0;
  padding:8px 10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:8px;
  background:rgba(15,23,42,.22);
  color:var(--ops-text);
  font-weight:850;
  overflow-wrap:anywhere;
}

.catalog-form-actions,
.catalog-inline-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  min-width:0;
}

.catalog-form-actions{
  justify-content:flex-start;
}

.catalog-inline-actions{
  justify-content:flex-start;
}

.catalog-inline-actions--cell{
  gap:6px;
}

.catalog-inline-actions--editor{
  width:100%;
}

.catalog-inline-actions--editor .input{
  flex:1 1 220px;
  min-width:0;
}

.catalog-form-error{
  color:#fecaca;
  font-size:12px;
  font-weight:800;
  overflow-wrap:anywhere;
}

.catalog-note{
  margin-top:8px;
  color:var(--ops-muted-2);
  font-size:12px;
  line-height:1.35;
  overflow-wrap:anywhere;
}

.catalog-table-wrap{
  margin-top:10px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.catalog-table{
  min-width:680px;
}

.catalog-table th,
.catalog-table td{
  vertical-align:middle;
}

.catalog-table th{
  white-space:nowrap;
}

.catalog-table td{
  overflow-wrap:anywhere;
}

.catalog-table-actions{
  text-align:right;
  white-space:nowrap;
}

.ops-list-page--catalog .ops-list-actions{
  max-width:100%;
}

.ops-list-page--catalog .ops-list-actions .btn{
  flex:0 1 auto;
}

.sku-barcode-cell{
  min-width:0;
}

html[data-theme="light"] .catalog-toggle{
  background:#f8fafc;
  border-color:#cbd5e1;
}

html[data-theme="light"] .catalog-section-label{
  color:#175cd3;
}

html[data-theme="light"] .catalog-sku-picked{
  background:#eff6ff;
  border-color:#bfdbfe;
}

html[data-theme="light"] .catalog-form-error{
  color:#b42318;
}

@media (max-width: 1180px){
  .ops-list-page--catalog .ops-list-actions{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .ops-list-page--catalog .ops-list-actions .btn{
    width:100%;
    justify-content:center;
  }
}

@media (max-width: 980px){
  .catalog-edit-header{
    display:grid;
    align-items:stretch;
  }

  .catalog-edit-actions{
    justify-content:flex-start;
  }

  .catalog-edit-actions .btn{
    flex:1 1 170px;
    justify-content:center;
  }

  .catalog-form-grid--three{
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px){
  .ops-list-page--catalog .ops-list-actions{
    grid-template-columns:1fr;
  }

  .catalog-form-grid--one{
    grid-template-columns:1fr;
  }

  .catalog-form-field--compact{
    max-width:none;
  }

  .catalog-toggle-row,
  .catalog-form-actions,
  .catalog-inline-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .catalog-toggle,
  .catalog-form-actions .btn,
  .catalog-inline-actions .btn{
    width:100%;
    justify-content:center;
  }

  .catalog-sku-picked__label{
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .catalog-inline-actions--editor .input{
    flex-basis:100%;
  }
}

/* ==========================================================================
   Service hub
   ========================================================================== */

.service-hub{
  gap:16px;
}

.service-hub-header{
  align-items:center;
}

.service-hub-header__actions{
  gap:8px;
}

.service-hub-section{
  display:grid;
  gap:10px;
}

.service-hub-section__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:12px;
  min-width:0;
}

.service-hub-section__head h2{
  margin:0;
  color:var(--text);
  font-size:18px;
  line-height:1.2;
  letter-spacing:0;
}

.service-hub-eyebrow{
  margin-bottom:4px;
  color:var(--ops-muted, var(--muted));
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.service-hub-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap:12px;
}

.service-hub-grid--compact{
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.service-hub-card{
  display:grid;
  align-content:start;
  gap:8px;
  min-height:128px;
  padding:14px;
  text-decoration:none;
  color:inherit;
  overflow:hidden;
}

.service-hub-card:hover{
  transform:translateY(-1px);
}

.service-hub-card strong{
  color:var(--text);
  font-size:16px;
  line-height:1.16;
  overflow-wrap:anywhere;
}

.service-hub-card span:not(.service-hub-card__tag){
  color:var(--muted);
  font-size:13px;
  line-height:1.32;
}

.service-hub-card__tag{
  justify-self:start;
  min-height:22px;
  padding:3px 7px;
  border:1px solid rgba(148,163,184,.28);
  border-radius:999px;
  background:rgba(148,163,184,.12);
  color:#cbd5e1;
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1.2;
  text-transform:uppercase;
}

.service-hub-card--danger{
  border-color:rgba(239,68,68,.4) !important;
}

.service-hub-card--danger .service-hub-card__tag{
  border-color:rgba(239,68,68,.48);
  background:rgba(239,68,68,.16);
  color:#fecaca;
}

.service-hub-card--warn{
  border-color:rgba(245,158,11,.42) !important;
}

.service-hub-card--warn .service-hub-card__tag{
  border-color:rgba(245,158,11,.52);
  background:rgba(245,158,11,.16);
  color:#fde68a;
}

html[data-theme="light"] .service-hub-card__tag{
  background:#f8fafc;
  color:#475569;
  border-color:#cbd5e1;
}

html[data-theme="light"] .service-hub-card--danger .service-hub-card__tag{
  background:#fef3f2;
  color:#b42318;
  border-color:#fda29b;
}

html[data-theme="light"] .service-hub-card--warn .service-hub-card__tag{
  background:#fffaeb;
  color:#b54708;
  border-color:#fbbf24;
}

@media (max-width: 760px){
  .service-hub-section__head,
  .service-hub-header{
    display:grid;
    align-items:stretch;
  }

  .service-hub-header__actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .service-hub-card{
    min-height:0;
  }
}

/* ==========================================================================
   Recovery service command page
   ========================================================================== */

.service-recovery-page{
  gap:14px;
}

.service-recovery-header{
  align-items:center;
  flex-wrap:wrap;
}

.service-recovery-header .page-header__left{
  flex:1 1 520px;
}

.service-recovery-header .page-header__actions{
  flex:0 0 auto;
  justify-content:flex-end;
}

.service-recovery-header .page-header__actions .btn{
  max-width:100%;
  text-align:center;
  white-space:normal;
}

.service-recovery-command{
  max-width:980px;
}

.service-recovery-command,
.service-recovery-context,
.service-recovery-result,
.service-recovery-table-card{
  overflow:hidden;
}

.service-recovery-form{
  display:grid;
  gap:12px;
}

.service-recovery-form__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap:12px;
}

.service-recovery-radio-row{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  align-items:center;
}

.service-recovery-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.service-recovery-result__head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.service-recovery-kpis{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  gap:8px;
}

.service-recovery-kpis > div{
  min-width:0;
  padding:8px 9px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:7px;
  background:rgba(15,23,42,.22);
  overflow-wrap:anywhere;
}

.service-recovery-blockers{
  margin-top:10px;
  padding:10px;
  border:1px solid rgba(239,68,68,.48);
  border-radius:8px;
  background:rgba(239,68,68,.12);
  color:#fecaca;
}

.service-recovery-blockers__title{
  margin-bottom:6px;
  font-weight:850;
}

.service-recovery-table-wrap{
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.service-recovery-table{
  min-width:1280px;
}

.service-recovery-table th{
  white-space:nowrap;
}

.service-recovery-table td{
  vertical-align:top;
}

.service-recovery-table td:nth-child(4),
.service-recovery-table td:last-child{
  min-width:260px;
}

html[data-theme="light"] .service-recovery-kpis > div{
  background:#f8fafc;
  border-color:#d0d5dd;
}

html[data-theme="light"] .service-recovery-blockers{
  background:#fef3f2;
  border-color:#fda29b;
  color:#b42318;
}

@media (max-width: 760px){
  .service-recovery-header{
    display:grid;
    align-items:stretch;
  }

  .service-recovery-actions .btn,
  .service-recovery-header .btn{
    flex:1 1 100%;
    justify-content:center;
  }

  .service-recovery-radio-row{
    display:grid;
    gap:10px;
  }
}

/* Native sidebar entry for the administrator CRM. */
.nav-item[href^="/app/crm/"]::before{--crm-nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.4 8.4 0 0 1-3.8-.9L3 21l1.9-5.7a8.4 8.4 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.4 8.4 0 0 1 3.8-.9h.5a8.5 8.5 0 0 1 8 8v.5Z'/%3E%3Cpath d='M8 9h8M8 13h5'/%3E%3C/svg%3E");-webkit-mask-image:var(--crm-nav-icon);mask-image:var(--crm-nav-icon)}
