:root {
  --brand-dark: #16324a;
  --brand-green: #2e7d32;
  --brand-orange: #e65100;
  --sidebar-w: 260px;
  --bg-soft: #f4f6f8;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg-soft);
  font-family: 'Segoe UI', Roboto, Arial, sans-serif;
  color: #1f2d3d;
}

.app-wrapper { display: flex; min-height: 100vh; }

/* Sidebar */
.sidebar {
  width: var(--sidebar-w);
  background: var(--brand-dark);
  color: #dfe9f0;
  flex-shrink: 0;
  position: fixed;
  top: 0; bottom: 0; left: 0;
  overflow-y: auto;
  z-index: 1000;
  transition: transform .2s ease;
}
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 18px 16px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.sidebar-brand img { width: 42px; height: 42px; object-fit: contain; background: #fff; border-radius: 6px; padding: 3px; }
.brand-name { font-weight: 700; font-size: .82rem; line-height: 1.2; color: #fff; }
.brand-tag { font-size: .68rem; color: #9fb3c2; }
.brand-tag-badge {
  display: inline-block; margin-top: 4px; font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; color: #fff;
  background: rgba(255,255,255,.15); border-radius: 4px; padding: 2px 6px;
}

.sidebar-nav { display: flex; flex-direction: column; padding: 10px 0; }
.sidebar-nav a {
  color: #c7d6e0;
  text-decoration: none;
  padding: 10px 18px;
  font-size: .875rem;
  display: flex;
  align-items: center;
  gap: 10px;
  border-left: 3px solid transparent;
}
.sidebar-nav a i { font-size: 1rem; width: 18px; text-align: center; }
.sidebar-nav a:hover { background: rgba(255,255,255,.06); color: #fff; }
.sidebar-nav a.active {
  background: rgba(46,125,50,.25);
  border-left-color: var(--brand-green);
  color: #fff;
  font-weight: 600;
}

.sidebar-section-label {
  text-transform: uppercase;
  font-size: .68rem;
  letter-spacing: .06em;
  color: #7c95a8;
  font-weight: 700;
  padding: 14px 18px 6px;
}
.sidebar-nav-quick a { font-size: .82rem; padding: 7px 18px; }
.sidebar-filter-form { padding: 0 18px 16px; }
.sidebar-filter-form select { background: rgba(255,255,255,.06); color: #dfe9f0; border-color: rgba(255,255,255,.15); }
.sidebar-filter-form select option { color: #1f2d3d; }

/* Main content */
.main-content { margin-left: var(--sidebar-w); flex: 1; display: flex; flex-direction: column; min-width: 0; }

.topbar {
  background: #fff;
  border-bottom: 1px solid #e3e8ec;
  padding: 12px 22px;
  display: flex;
  align-items: center;
  gap: 14px;
  position: sticky;
  top: 0;
  z-index: 100;
}
.page-title { font-size: 1.15rem; font-weight: 700; margin: 0; color: var(--brand-dark); flex: 1; }
.topbar-right { display: flex; align-items: center; gap: 14px; }
.location-filter select { min-width: 200px; }
.user-chip { background: #f0f3f5; border: 1px solid #e3e8ec; text-align: left; line-height: 1.1; }

.page-body { padding: 22px; flex: 1; }
.page-footer { text-align: center; font-size: .78rem; color: #8a97a3; padding: 14px; }

/* KPI cards */
.kpi-card {
  background: #fff;
  border-radius: 10px;
  padding: 16px 18px;
  border: 1px solid #e9edf0;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
  height: 100%;
}
.kpi-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #7c8894; font-weight: 600; }
.kpi-value { font-size: 1.5rem; font-weight: 700; color: var(--brand-dark); margin-top: 4px; }
.kpi-sub { font-size: .78rem; color: #8a97a3; margin-top: 2px; }
.kpi-trend-up { color: var(--brand-green); font-weight: 600; }
.kpi-trend-down { color: #c62828; font-weight: 600; }

.kpi-icon-card { display: flex; align-items: flex-start; gap: 12px; }
.kpi-icon-wrap {
  width: 40px; height: 40px; min-width: 40px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; color: #fff;
}
.bg-icon-green  { background: #2e7d32; }
.bg-icon-green2 { background: #388e3c; }
.bg-icon-blue   { background: #1565c0; }
.bg-icon-blue2  { background: #0277bd; }
.bg-icon-blue3  { background: #1976d2; }
.bg-icon-orange { background: #ef6c00; }
.bg-icon-orange2{ background: #f57c00; }
.bg-icon-red    { background: #c62828; }

.dispatch-icon {
  width: 46px; height: 46px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.2rem; color: #fff;
}

/* Panels */
.panel {
  background: #fff;
  border-radius: 10px;
  border: 1px solid #e9edf0;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
  padding: 16px 18px;
  margin-bottom: 20px;
  height: auto;
}
.panel-title {
  font-size: .82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--brand-dark);
  margin-bottom: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

table.erp-table { width: 100%; font-size: .82rem; }
table.erp-table th { background: #f4f6f8; font-weight: 600; color: #55626d; white-space: nowrap; }
table.erp-table td, table.erp-table th { padding: 8px 10px; vertical-align: middle; }

/* Fallback for any status badge that doesn't have a specific color below -
   prevents the "white text, no background" invisibility bug (Bootstrap's
   base .badge defaults to white text assuming a bg-* class supplies the
   background, which our badge-status-* classes normally do). */
[class*="badge-status-"] {
  background: #eceff1 !important;
  color: #37474f !important;
  border: 1px solid #cfd8dc;
  font-weight: 700;
  letter-spacing: .01em;
  min-width: 68px;
  padding: .42em .70em;
  text-align: center;
}

.badge-status-running { background: #e3f2fd !important; color: #1565c0 !important; border-color:#90caf9; }
.badge-status-completed { background: #e8f5e9 !important; color: #2e7d32 !important; border-color:#a5d6a7; }
.badge-status-planned { background: #fff3e0 !important; color: #e65100 !important; border-color:#ffcc80; }
.badge-status-passed { background: #e8f5e9 !important; color: #2e7d32 !important; border-color:#a5d6a7; }
.badge-status-pending { background: #fff3e0 !important; color: #e65100 !important; border-color:#ffb74d; }
.badge-status-accepted { background: #e8f5e9 !important; color: #1b5e20 !important; border-color:#81c784; }
.badge-status-modified { background: #e3f2fd !important; color: #0d47a1 !important; border-color:#64b5f6; }
.badge-status-rejected { background: #ffebee !important; color: #b71c1c !important; border-color:#ef9a9a; }
.badge-status-unloadedunderdeviation { background: #ede7f6; color: #5e35b1; }
.badge-status-active { background: #e8f5e9; color: #2e7d32; }
.badge-status-inactive { background: #eceff1; color: #607d8b; }
.badge-status-onhold { background: #ffebee; color: #c62828; }
.badge-status-loading { background: #e3f2fd; color: #1565c0; }
.badge-status-ready { background: #fff3e0; color: #ef6c00; }
.badge-status-dispatched { background: #e8f5e9; color: #2e7d32; }

.login-wrapper {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--brand-dark), #23425f);
}
.login-card {
  background: #fff;
  border-radius: 14px;
  padding: 36px 32px;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 10px 40px rgba(0,0,0,.25);
}
.login-card img { width: 72px; display: block; margin: 0 auto 10px; }

@media (max-width: 991px) {
  .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .main-content { margin-left: 0; }
}

/* ================================================================
   GLOBAL STATUS VISIBILITY + PROFESSIONAL TABLE TOOLS
   Applied ERP-wide so Bootstrap's default .badge white text can never
   make a custom status unreadable, and table controls look consistent.
   ================================================================ */
.badge[class*="badge-status-"] {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background-color: #eceff1 !important;
  color: #37474f !important;
  border: 1px solid #cfd8dc !important;
  font-weight: 700 !important;
  line-height: 1.15;
  min-width: 68px;
  padding: .42em .70em;
  border-radius: 999px;
  text-shadow: none !important;
  opacity: 1 !important;
}
.badge-status-running    { background-color:#e3f2fd !important; color:#0d47a1 !important; border-color:#90caf9 !important; }
.badge-status-completed,
.badge-status-passed,
.badge-status-accepted,
.badge-status-active,
.badge-status-healthy,
.badge-status-dispatched { background-color:#e8f5e9 !important; color:#1b5e20 !important; border-color:#81c784 !important; }
.badge-status-planned,
.badge-status-pending,
.badge-status-ready,
.badge-status-medium     { background-color:#fff3e0 !important; color:#bf4b00 !important; border-color:#ffb74d !important; }
.badge-status-modified,
.badge-status-loading    { background-color:#e3f2fd !important; color:#0d47a1 !important; border-color:#64b5f6 !important; }
.badge-status-rejected,
.badge-status-failed,
.badge-status-onhold,
.badge-status-low,
.badge-status-high       { background-color:#ffebee !important; color:#b71c1c !important; border-color:#ef9a9a !important; }
.badge-status-inactive   { background-color:#eceff1 !important; color:#455a64 !important; border-color:#b0bec5 !important; }
.badge-status-unloadedunderdeviation { background-color:#ede7f6 !important; color:#4527a0 !important; border-color:#b39ddb !important; }

/* Reusable table controls injected by erp-table-tools.js */
.erp-table-tool-host { position: relative; }
.erp-table-tools-bar {
  display:flex; justify-content:flex-end; align-items:center; gap:6px;
  margin:0 0 8px 0;
}
.erp-table-tools-bar .btn { white-space:nowrap; }
.erp-global-table-sticky thead th { position:sticky; top:0; z-index:4; box-shadow:0 1px 0 #dfe5ea; }
.erp-global-table .erp-global-pinned { position:sticky; z-index:3; background:#fff !important; box-shadow:1px 0 0 #dfe5ea; }
.erp-global-table thead .erp-global-pinned { z-index:6; background:#f4f6f8 !important; }
.erp-global-table tbody tr:hover .erp-global-pinned { background:#f8fafb !important; }
.erp-global-table.erp-global-compact td,
.erp-global-table.erp-global-compact th { padding:5px 7px !important; }
.erp-global-settings-list .form-check {
  background:#f8f9fa; border:1px solid #e7ebef; border-radius:8px;
  padding:8px 10px 8px 34px; height:100%;
}
.erp-global-pin-select { max-width:100%; }

/* ERP-wide professional status pills - final safety layer. JavaScript also
   applies the selected status palette inline so framework classes cannot
   override status text/background colors. */
.erp-status-badge,
.badge[class*="badge-status-"] {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:88px;
  padding:.38rem .65rem !important;
  border:1px solid currentColor !important;
  border-radius:999px !important;
  font-size:.72rem !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  letter-spacing:.01em;
  white-space:nowrap;
  opacity:1 !important;
  box-shadow:0 1px 2px rgba(16,24,40,.08);
}

/* ================================================================
   PREMIUM ERP UI/UX THEME LAYER — 2026
   Global visual upgrade without changing business logic.
   ================================================================ */
:root {
  --ui-accent: #16a34a;
  --ui-accent-rgb: 22, 163, 74;
  --ui-accent-2: #0ea5e9;
  --ui-surface: #ffffff;
  --ui-surface-2: #f8fafc;
  --ui-border: #e2e8f0;
  --ui-text: #0f172a;
  --ui-muted: #64748b;
  --ui-radius: 16px;
  --ui-shadow: 0 8px 24px rgba(15,23,42,.07);
  --ui-shadow-hover: 0 16px 40px rgba(15,23,42,.12);
}

body {
  background:
    radial-gradient(circle at 92% 2%, rgba(var(--ui-accent-rgb),.07), transparent 28rem),
    linear-gradient(180deg, #f8fafc 0%, #f3f6f9 100%);
  color: var(--ui-text);
  -webkit-font-smoothing: antialiased;
}

/* Premium sidebar */
.sidebar {
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.08), transparent 16rem),
    linear-gradient(180deg, var(--brand-dark) 0%, #10283b 100%);
  box-shadow: 10px 0 30px rgba(15,23,42,.08);
}
.sidebar-brand { padding:20px 16px; }
.sidebar-brand img { box-shadow:0 8px 22px rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.22); }
.sidebar-nav a {
  margin:2px 10px;
  border-radius:10px;
  border-left:0;
  padding:10px 12px;
  transition:background .18s ease, transform .18s ease, color .18s ease;
}
.sidebar-nav a:hover { transform:translateX(2px); background:rgba(255,255,255,.075); }
.sidebar-nav a.active {
  background:linear-gradient(90deg, rgba(var(--ui-accent-rgb),.28), rgba(var(--ui-accent-rgb),.10));
  box-shadow:inset 3px 0 0 var(--ui-accent), 0 6px 18px rgba(0,0,0,.08);
  border-left:0;
}
.sidebar-nav a.active i { color:#fff; filter:drop-shadow(0 2px 6px rgba(0,0,0,.2)); }

/* Glassy topbar */
.topbar {
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(226,232,240,.9);
  box-shadow:0 4px 18px rgba(15,23,42,.035);
  padding:14px 22px;
}
.page-title { font-size:1.28rem; letter-spacing:-.02em; }
.topbar .form-select, .user-chip { border-radius:10px; }
.user-chip { background:rgba(248,250,252,.9); transition:.18s ease; }
.user-chip:hover { background:#fff; border-color:#cbd5e1; box-shadow:0 6px 18px rgba(15,23,42,.08); }

.ui-theme-btn {
  width:38px; height:38px; padding:0; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; border:1px solid var(--ui-border); color:var(--ui-text);
  box-shadow:0 3px 10px rgba(15,23,42,.05);
}
.ui-theme-btn:hover { color:var(--ui-accent); border-color:rgba(var(--ui-accent-rgb),.35); }

.page-body { padding:24px; }

/* Premium cards and widgets */
.kpi-card, .panel, .settings-card {
  border-radius:var(--ui-radius) !important;
  border:1px solid rgba(226,232,240,.9) !important;
  background:linear-gradient(145deg, rgba(255,255,255,.98), rgba(248,250,252,.94)) !important;
  box-shadow:var(--ui-shadow) !important;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.kpi-card:hover, .panel:hover, .settings-card:hover {
  transform:translateY(-2px);
  box-shadow:var(--ui-shadow-hover) !important;
  border-color:rgba(var(--ui-accent-rgb),.20) !important;
}
.panel { padding:18px 20px; }
.panel-title {
  font-size:.78rem;
  letter-spacing:.055em;
  margin-bottom:14px;
}
.panel-title::before {
  content:""; width:4px; height:16px; border-radius:999px;
  background:linear-gradient(180deg,var(--ui-accent),var(--ui-accent-2));
  display:inline-block; margin-right:8px; vertical-align:-3px;
}

.kpi-card {
  position:relative;
  overflow:hidden;
  padding:17px 17px 16px;
  min-height:118px;
}
.kpi-card::after {
  content:""; position:absolute; width:100px; height:100px; right:-42px; top:-46px;
  border-radius:50%; background:rgba(var(--ui-accent-rgb),.07); pointer-events:none;
}
.kpi-card::before {
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg,var(--widget-accent,var(--ui-accent)),transparent 90%);
}
.kpi-label { color:var(--ui-muted); font-size:.69rem; letter-spacing:.065em; }
.kpi-value { color:var(--ui-text); font-size:1.42rem; letter-spacing:-.025em; }
.kpi-sub { color:var(--ui-muted); }
.erp-kpi-head { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; }
.erp-kpi-icon {
  width:34px; height:34px; min-width:34px; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--widget-accent,var(--ui-accent));
  background:color-mix(in srgb, var(--widget-accent,var(--ui-accent)) 11%, white);
  border:1px solid color-mix(in srgb, var(--widget-accent,var(--ui-accent)) 18%, white);
  font-size:.98rem;
}

/* Forms */
.form-control, .form-select, .input-group-text {
  border-radius:10px;
  border-color:#dbe3ea;
  min-height:40px;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.form-control:focus, .form-select:focus {
  border-color:rgba(var(--ui-accent-rgb),.62);
  box-shadow:0 0 0 .22rem rgba(var(--ui-accent-rgb),.11);
}
.form-label, label { color:#334155; }
.btn { border-radius:9px; font-weight:600; }
.btn-primary, .btn-success {
  border-color:transparent;
  box-shadow:0 5px 14px rgba(var(--ui-accent-rgb),.18);
}
.btn-primary:hover, .btn-success:hover { transform:translateY(-1px); }

/* Tables */
.table-responsive { border-radius:12px; }
table.erp-table { border-collapse:separate; border-spacing:0; }
table.erp-table th {
  background:#f8fafc;
  color:#526174;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.035em;
  border-bottom:1px solid #dfe7ef;
}
table.erp-table td { border-bottom-color:#edf1f5; }
table.erp-table tbody tr { transition:background .15s ease; }
table.erp-table tbody tr:hover > * { background:rgba(var(--ui-accent-rgb),.035) !important; }
table.erp-table thead th:first-child { border-top-left-radius:10px; }
table.erp-table thead th:last-child { border-top-right-radius:10px; }

/* Alerts, dropdowns, modal/offcanvas */
.alert { border-radius:12px; }
.dropdown-menu { border-radius:12px; border-color:#e2e8f0; box-shadow:0 14px 36px rgba(15,23,42,.12); padding:7px; }
.dropdown-item { border-radius:8px; }
.modal-content, .offcanvas { border:0; box-shadow:0 24px 60px rgba(15,23,42,.18); }
.modal-content { border-radius:18px; }

/* Appearance panel */
.erp-theme-offcanvas { width:min(390px, 92vw) !important; background:#f8fafc; }
.erp-theme-offcanvas .offcanvas-header { background:#fff; border-bottom:1px solid #e8edf2; }
.erp-theme-section { background:#fff; border:1px solid #e4eaf0; border-radius:14px; padding:14px; margin-bottom:14px; box-shadow:0 4px 14px rgba(15,23,42,.04); }
.erp-theme-section-title { font-size:.72rem; text-transform:uppercase; letter-spacing:.055em; color:#64748b; font-weight:800; margin-bottom:10px; }
.erp-theme-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.erp-theme-choice {
  border:1px solid #e2e8f0; background:#fff; border-radius:12px; padding:10px;
  text-align:left; cursor:pointer; transition:.16s ease;
}
.erp-theme-choice:hover { transform:translateY(-1px); box-shadow:0 7px 18px rgba(15,23,42,.08); }
.erp-theme-choice.active { border-color:var(--ui-accent); box-shadow:0 0 0 3px rgba(var(--ui-accent-rgb),.09); }
.erp-theme-swatches { display:flex; gap:5px; margin-bottom:7px; }
.erp-theme-swatches span { width:18px; height:18px; border-radius:6px; display:block; }
.erp-theme-name { font-size:.78rem; font-weight:700; color:#334155; }
.erp-segment { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.erp-segment button { border:1px solid #e2e8f0; background:#f8fafc; border-radius:9px; padding:7px 5px; font-size:.73rem; color:#475569; }
.erp-segment button.active { background:rgba(var(--ui-accent-rgb),.10); border-color:rgba(var(--ui-accent-rgb),.42); color:var(--ui-accent); font-weight:700; }

/* Theme presets */
body[data-erp-theme="fresh"] { --ui-accent:#16a34a; --ui-accent-rgb:22,163,74; --ui-accent-2:#06b6d4; }
body[data-erp-theme="ocean"] { --ui-accent:#0f67d8; --ui-accent-rgb:15,103,216; --ui-accent-2:#06b6d4; }
body[data-erp-theme="violet"] { --ui-accent:#7c3aed; --ui-accent-rgb:124,58,237; --ui-accent-2:#ec4899; }
body[data-erp-theme="graphite"] { --ui-accent:#475569; --ui-accent-rgb:71,85,105; --ui-accent-2:#0f172a; }
body[data-erp-theme="sunrise"] { --ui-accent:#ea580c; --ui-accent-rgb:234,88,12; --ui-accent-2:#f59e0b; }

body[data-erp-radius="compact"] { --ui-radius:10px; }
body[data-erp-radius="soft"] { --ui-radius:16px; }
body[data-erp-radius="round"] { --ui-radius:22px; }
body[data-erp-shadow="flat"] { --ui-shadow:0 1px 2px rgba(15,23,42,.04); --ui-shadow-hover:0 5px 16px rgba(15,23,42,.08); }
body[data-erp-shadow="soft"] { --ui-shadow:0 8px 24px rgba(15,23,42,.07); --ui-shadow-hover:0 16px 40px rgba(15,23,42,.12); }
body[data-erp-shadow="strong"] { --ui-shadow:0 12px 30px rgba(15,23,42,.12); --ui-shadow-hover:0 22px 50px rgba(15,23,42,.16); }
body[data-erp-density="compact"] .page-body { padding:16px; }
body[data-erp-density="compact"] .panel { padding:13px 15px; }
body[data-erp-density="compact"] .kpi-card { padding:13px 14px; min-height:102px; }

/* Dark theme */
body[data-erp-theme="dark"] {
  --ui-accent:#22c55e; --ui-accent-rgb:34,197,94; --ui-accent-2:#38bdf8;
  --ui-surface:#111827; --ui-surface-2:#0f172a; --ui-border:#293548; --ui-text:#e5edf6; --ui-muted:#94a3b8;
  background:radial-gradient(circle at 90% 0%, rgba(34,197,94,.10), transparent 28rem), #0b1220;
  color:var(--ui-text);
}
body[data-erp-theme="dark"] .main-content, body[data-erp-theme="dark"] .page-body { background:transparent; }
body[data-erp-theme="dark"] .topbar { background:rgba(15,23,42,.88); border-bottom-color:#243044; }
body[data-erp-theme="dark"] .page-title, body[data-erp-theme="dark"] .kpi-value, body[data-erp-theme="dark"] .panel-title { color:#f1f5f9 !important; }
body[data-erp-theme="dark"] .kpi-card,
body[data-erp-theme="dark"] .panel,
body[data-erp-theme="dark"] .settings-card,
body[data-erp-theme="dark"] .erp-theme-section { background:linear-gradient(145deg,#111827,#0f172a) !important; border-color:#263246 !important; }
body[data-erp-theme="dark"] .form-control,
body[data-erp-theme="dark"] .form-select,
body[data-erp-theme="dark"] .input-group-text,
body[data-erp-theme="dark"] .user-chip,
body[data-erp-theme="dark"] .ui-theme-btn { background:#111827; color:#e5edf6; border-color:#334155; }
body[data-erp-theme="dark"] table.erp-table th { background:#172033; color:#a8b5c6; border-bottom-color:#334155; }
body[data-erp-theme="dark"] table.erp-table td { color:#dbe4ee; border-bottom-color:#243044; background:#111827; }
body[data-erp-theme="dark"] table.erp-table tbody tr:hover > * { background:#172033 !important; }
body[data-erp-theme="dark"] .erp-global-table .erp-global-pinned { background:#111827 !important; }
body[data-erp-theme="dark"] .erp-global-table thead .erp-global-pinned { background:#172033 !important; }
body[data-erp-theme="dark"] .dropdown-menu { background:#111827; border-color:#334155; }
body[data-erp-theme="dark"] .dropdown-item { color:#e2e8f0; }
body[data-erp-theme="dark"] .dropdown-item:hover { background:#1e293b; }
body[data-erp-theme="dark"] .erp-theme-offcanvas { background:#0b1220; color:#e5edf6; }
body[data-erp-theme="dark"] .erp-theme-offcanvas .offcanvas-header { background:#111827; border-bottom-color:#263246; }
body[data-erp-theme="dark"] .erp-theme-choice { background:#172033; border-color:#334155; }
body[data-erp-theme="dark"] .erp-theme-name, body[data-erp-theme="dark"] .form-label, body[data-erp-theme="dark"] label { color:#dbe4ee; }
body[data-erp-theme="dark"] .text-muted { color:#94a3b8 !important; }
body[data-erp-theme="dark"] .page-footer { color:#7f8ea3; }

/* Small-screen polish */
@media (max-width: 767px) {
  .page-body { padding:14px; }
  .topbar { padding:10px 12px; flex-wrap:wrap; }
  .page-title { font-size:1.05rem; }
  .topbar-right { gap:7px; margin-left:auto; }
  .location-filter select { min-width:130px; max-width:170px; }
  .user-chip .small { display:none; }
  .kpi-card { min-height:108px; }
  .panel { padding:14px; }
}


/* ===== Reports & Analytics visibility / widgets ===== */
.panel { height:auto !important; }
.report-filter-panel { position:relative; overflow:visible; }
.report-kpi-card { min-height:122px; }
.report-kpi-card .report-unit { font-size:.72rem; color:var(--ui-muted,#64748b); font-weight:600; }
.report-toolbar { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.report-widget-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:16px; }
.report-widget-7 { grid-column:span 7; }
.report-widget-5 { grid-column:span 5; }
.report-chart { display:flex; align-items:flex-end; gap:7px; min-height:210px; padding:18px 8px 4px; overflow-x:auto; }
.report-bar-group { min-width:42px; flex:1; max-width:72px; text-align:center; }
.report-bar-track { height:160px; display:flex; align-items:flex-end; justify-content:center; gap:3px; }
.report-bar { width:10px; min-height:2px; border-radius:5px 5px 2px 2px; background:var(--ui-accent,#16a34a); }
.report-bar.secondary { background:#2563eb; }
.report-bar.tertiary { background:#f59e0b; }
.report-bar-label { font-size:.66rem; color:var(--ui-muted,#64748b); white-space:nowrap; margin-top:7px; }
.report-legend { display:flex; gap:14px; flex-wrap:wrap; font-size:.75rem; color:var(--ui-muted,#64748b); }
.report-legend span::before { content:""; width:9px; height:9px; display:inline-block; border-radius:3px; margin-right:5px; background:var(--legend); }
.report-progress { height:8px; border-radius:999px; background:#e9eef3; overflow:hidden; }
.report-progress > span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--ui-accent,#16a34a),var(--ui-accent-2,#22c55e)); }
.report-download-card { border:1px solid var(--ui-border,#e2e8f0); border-radius:14px; padding:15px; height:100%; background:rgba(255,255,255,.72); transition:.18s ease; }
.report-download-card:hover { transform:translateY(-2px); border-color:rgba(var(--ui-accent-rgb,22,163,74),.28); box-shadow:0 8px 24px rgba(15,23,42,.08); }
.report-empty { padding:32px 16px; text-align:center; color:var(--ui-muted,#64748b); }
@media (max-width:991.98px){ .report-widget-7,.report-widget-5{grid-column:span 12;} }
@media print { .sidebar,.topbar,.report-filter-panel,.report-downloads,.ui-theme-btn,.page-footer { display:none !important; } .main-content{margin:0!important;} .page-body{padding:0!important;} .panel,.kpi-card{box-shadow:none!important;break-inside:avoid;} }

/* SKU Master auto-fill: subtle visual confirmation across all entry forms. */
.sku-autofill-complete[readonly] {
  background: color-mix(in srgb, var(--bs-success, #198754) 7%, #fff) !important;
  border-color: color-mix(in srgb, var(--bs-success, #198754) 35%, #dee2e6) !important;
}