/* ══════════════════════════════════════════════════════
   STOCKLENS — Modern Theme
   Uses html[data-theme="modern"] for high specificity
══════════════════════════════════════════════════════ */

html[data-theme="modern"] {
  --brand: #c0622e;
  --brand-dark: #a8511f;
  --brand-light: rgba(192,98,46,0.10);
  --brand-glow: rgba(192,98,46,0.20);
  --bg: #f3f1ee;
  --surface: #faf9f7;
  --surface-2: #f3f1ee;
  --surface-3: #eae7e2;
  --surface-4: #dddad4;
  --surface-card: #ffffff;
  --border: rgba(20,15,10,0.09);
  --border-2: rgba(20,15,10,0.15);
  --border-3: rgba(20,15,10,0.24);
  --text: #0f0e0d;
  --text-muted: rgba(15,14,13,0.52);
  --text-light: rgba(15,14,13,0.30);
  --success: #2e6b4f;
  --success-bg: rgba(46,107,79,0.10);
  --warning: #9a6b00;
  --warning-bg: rgba(154,107,0,0.10);
  --danger: #b03030;
  --danger-bg: rgba(176,48,48,0.08);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.07);
  --shadow-md: 0 3px 12px rgba(0,0,0,0.09);
  --shadow-lg: 0 10px 32px rgba(0,0,0,0.11);
  --radius: 10px;
  --radius-sm: 7px;
  --radius-xs: 5px;
}

/* PAGE */
html[data-theme="modern"] body { background: #f3f1ee !important; }
html[data-theme="modern"] .main { background: #f3f1ee !important; }

/* ════ TOPBAR ════════════════════════════════════════ */
html[data-theme="modern"] .topbar {
  background: #ffffff !important;
  border-bottom: 1px solid #e0ddd8 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
html[data-theme="modern"] .topbar-title {
  color: #0f0e0d !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: -.3px !important;
}
html[data-theme="modern"] .topbar-menu-btn { color: #0f0e0d !important; }
html[data-theme="modern"] .topbar-menu-btn:hover { background: #f3f1ee !important; box-shadow: none !important; }
html[data-theme="modern"] .topbar-avatar { background: #c0622e !important; }
html[data-theme="modern"] .topbar-user { color: #3d3a35 !important; }
html[data-theme="modern"] .topbar-user-pill { background: #f8f6f3 !important; border: 1px solid #e0ddd8 !important; }

/* ════ SIDEBAR — DARK CHARCOAL ═══════════════════════ */
html[data-theme="modern"] .sidebar {
  background: #131211 !important;
  border-right: none !important;
  box-shadow: 2px 0 12px rgba(0,0,0,0.15) !important;
}
html[data-theme="modern"] .sidebar-scroll { padding: 6px 0 !important; }
html[data-theme="modern"] .sidebar-footer {
  background: #131211 !important;
  border-top: 1px solid #252320 !important;
}
html[data-theme="modern"] .sidebar-version-text { color: #2e2c29 !important; }

/* Nav section labels */
html[data-theme="modern"] .nav-label {
  color: #38352f !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  padding: 16px 18px 5px !important;
  text-transform: uppercase !important;
}

/* Nav items — flat, no radius */
html[data-theme="modern"] .nav-item {
  background: transparent !important;
  color: #6b6760 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 9px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-left: 2px solid transparent !important;
  letter-spacing: -.1px !important;
  transition: all .12s !important;
}
html[data-theme="modern"] .nav-item:hover {
  background: rgba(255,255,255,0.05) !important;
  color: #c8c4be !important;
  border-radius: 0 !important;
  border-left-color: transparent !important;
}
html[data-theme="modern"] .nav-item.active {
  background: rgba(192,98,46,0.12) !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  border-left: 2px solid #c0622e !important;
  padding-left: 16px !important;
}
html[data-theme="modern"] .nav-item .nav-icon { opacity: .40 !important; }
html[data-theme="modern"] .nav-item:hover .nav-icon { opacity: .65 !important; }
html[data-theme="modern"] .nav-item.active .nav-icon { opacity: 1 !important; }
html[data-theme="modern"] .nav-badge {
  background: #c0622e !important;
  color: #fff !important;
}
html[data-theme="modern"] .sidebar-overlay { background: rgba(0,0,0,0.65) !important; }

/* ════ BUTTONS ═══════════════════════════════════════ */
html[data-theme="modern"] .btn-primary {
  background: #131211 !important;
  border-color: #131211 !important;
  box-shadow: none !important;
  border-radius: 6px !important;
}
html[data-theme="modern"] .btn-primary:hover:not(:disabled) {
  background: #2c2a27 !important;
  filter: none !important;
  box-shadow: none !important;
}
html[data-theme="modern"] .btn { border-radius: 6px !important; box-shadow: none !important; }
html[data-theme="modern"] .btn-ghost { border-color: #dddad4 !important; color: var(--text) !important; }
html[data-theme="modern"] .btn-ghost:hover { background: #f3f1ee !important; }
html[data-theme="modern"] .btn-danger { border-radius: 6px !important; box-shadow: none !important; }

/* ════ VIEW HEADERS ══════════════════════════════════ */
html[data-theme="modern"] .view-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -.5px !important;
  color: #0f0e0d !important;
}
html[data-theme="modern"] .view-sub { font-size: 12px !important; color: #7a7670 !important; }

/* ════ STAT CARDS ════════════════════════════════════ */
html[data-theme="modern"] .dash-stat-card {
  background: #ffffff !important;
  border: 1px solid #e0ddd8 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
/* Hide icons in modern mode */
html[data-theme="modern"] .dash-stat-icon { display: none !important; }

/* Modern stat cards */
html[data-theme="modern"] .modern-stat {
  padding: 16px 18px !important;
  overflow: hidden !important;
  position: relative !important;
}
html[data-theme="modern"] .modern-stat-label {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .09em !important;
  color: #9a9590 !important;
  margin-bottom: 8px !important;
}
html[data-theme="modern"] .modern-stat-value {
  font-size: 26px !important;
  font-weight: 700 !important;
  letter-spacing: -.6px !important;
  color: #0f0e0d !important;
  line-height: 1.1 !important;
}

/* ════ PANELS & CARDS ════════════════════════════════ */
html[data-theme="modern"] .dash-panel,
html[data-theme="modern"] .settings-card,
html[data-theme="modern"] .session-card,
html[data-theme="modern"] .location-card,
html[data-theme="modern"] .waybill-card,
html[data-theme="modern"] .catalogue-card,
html[data-theme="modern"] .balance-row-clickable {
  background: #ffffff !important;
  border-color: #e0ddd8 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-theme="modern"] .dash-panel-head {
  background: transparent !important;
  border-bottom: 1px solid #f0ede8 !important;
}
html[data-theme="modern"] .dash-panel-head h3 {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: -.2px !important;
}
html[data-theme="modern"] .dash-list-row { border-bottom: 1px solid #f5f3f0 !important; }
html[data-theme="modern"] .dash-list-row:hover { background: #faf9f7 !important; }
html[data-theme="modern"] .dash-list-time { color: #b0ada6 !important; font-size: 11px !important; }
html[data-theme="modern"] .dash-list-sub { color: #9a9590 !important; }

/* ════ MODALS ════════════════════════════════════════ */
html[data-theme="modern"] .modal {
  background: #ffffff !important;
  border: 1px solid #e0ddd8 !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 40px rgba(0,0,0,0.16) !important;
}
html[data-theme="modern"] .modal-head { border-bottom: 1px solid #f0ede8 !important; }
html[data-theme="modern"] .modal-foot { border-top: 1px solid #f0ede8 !important; background: #faf9f7 !important; }
html[data-theme="modern"] .modal-backdrop { background: rgba(10,9,8,0.6) !important; }

/* ════ TABLES ════════════════════════════════════════ */
html[data-theme="modern"] table thead tr th,
html[data-theme="modern"] .summary-table-wrap table thead tr th {
  background: #f5f3f0 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .09em !important;
  color: #9a9590 !important;
  border-bottom: 1px solid #e0ddd8 !important;
}
html[data-theme="modern"] table tbody td { border-bottom: 1px solid #f5f3f0 !important; }
html[data-theme="modern"] table tbody tr:hover td { background: #faf9f7 !important; }

/* ════ INPUTS ════════════════════════════════════════ */
html[data-theme="modern"] .input,
html[data-theme="modern"] input.input,
html[data-theme="modern"] .select-sm,
html[data-theme="modern"] select {
  background: #ffffff !important;
  border: 1px solid #dddad4 !important;
  border-radius: 6px !important;
  color: #0f0e0d !important;
}
html[data-theme="modern"] .input:focus,
html[data-theme="modern"] select:focus {
  border-color: #c0622e !important;
  box-shadow: 0 0 0 3px rgba(192,98,46,0.12) !important;
}
html[data-theme="modern"] .search-wrap {
  background: #ffffff !important;
  border: 1px solid #dddad4 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
html[data-theme="modern"] .search-wrap:focus-within {
  border-color: #c0622e !important;
  box-shadow: 0 0 0 3px rgba(192,98,46,0.10) !important;
}