@import url('https://fonts.googleapis.com/css2?family=Alef:wght@400;700&family=Cairo:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700;800;900&family=Roboto:wght@700;900&display=swap');


/* v119.19 startup gate: hide the partially initialized Classic workspace until first render completes. */
body.app-starting { overflow: hidden; }
body.app-starting > .app-shell,
body.app-starting > .site-footer { visibility: hidden; }
.startup-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: #f4f7fb;
  color: #182230;
  opacity: 1;
  visibility: visible;
  transition: opacity .2s ease, visibility .2s ease;
}
html[data-startup-theme="dark"] .startup-overlay {
  background: #0b1220;
  color: #f8fafc;
}
.startup-overlay.is-ready {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.startup-loader-card {
  width: min(420px, 92vw);
  display: grid;
  grid-template-columns: 52px 1fr;
  gap: 14px 16px;
  align-items: center;
  padding: 20px;
  border: 1px solid #dbe3ee;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .14);
}
html[data-startup-theme="dark"] .startup-loader-card {
  border-color: #273449;
  background: #111827;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .35);
}
.startup-loader-brand {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #172554;
  color: #fff;
  font-weight: 900;
  letter-spacing: -.05em;
}
.startup-loader-copy { min-width: 0; }
.startup-loader-copy strong { display: block; font-size: 17px; line-height: 1.25; }
.startup-loader-copy span { display: block; margin-top: 4px; color: #64748b; font-size: 13px; }
html[data-startup-theme="dark"] .startup-loader-copy span { color: #94a3b8; }
.startup-progress {
  grid-column: 1 / -1;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: #e2e8f0;
}
html[data-startup-theme="dark"] .startup-progress { background: #263247; }
.startup-progress span {
  display: block;
  width: 38%;
  height: 100%;
  border-radius: inherit;
  background: #2563eb;
  animation: odafim-startup-progress 1.05s ease-in-out infinite;
}
@keyframes odafim-startup-progress {
  0% { transform: translateX(-115%); }
  55% { transform: translateX(105%); }
  100% { transform: translateX(290%); }
}
@media (prefers-reduced-motion: reduce) {
  .startup-progress span { animation: none; width: 100%; opacity: .65; }
  .startup-overlay { transition: none; }
}

/* v30: CSS extracted from index.html for easier design experiments.
   Edit this file for fonts, colors, spacing, contrast, and print styling. */
:root {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --text: #182230;
  --muted: #64748b;
  --line: #e2e8f0;
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --danger: #dc2626;
  --danger-bg: #fef2f2;
  --warning: #d97706;
  --warning-bg: #fffbeb;
  --success: #16a34a;
  --success-bg: #f0fdf4;
  --shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
  --radius: 18px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}

button, input, select { font: inherit; }
button { cursor: pointer; }

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 280px 1fr;
}

.sidebar {
  background: #111827;
  color: #f8fafc;
  padding: 24px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}

.brand { display: flex; gap: 14px; align-items: center; margin-bottom: 26px; }
.brand-mark {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  position: relative;
  padding-bottom: 7px;
  background: linear-gradient(180deg, #172554 0%, #0f172a 100%);
  border: 1px solid rgba(147, 197, 253, .28);
  border-radius: 14px;
  color: #fff;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -.06em;
  line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 24px rgba(0,0,0,.18);
}
.brand-mark::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  height: 3px;
  border-radius: 999px;
  background: #3b82f6;
}
.brand h1 { font-size: 18px; line-height: 1.2; margin: 0; }
.brand p { margin: 5px 0 0; color: #94a3b8; font-size: 12px; line-height: 1.25; }

.nav { display: grid; gap: 8px; }
.nav-item {
  border: 0;
  background: transparent;
  color: #cbd5e1;
  text-align: left;
  padding: 12px 14px;
  border-radius: 12px;
}
.nav-item:hover { background: #1f2937; color: #fff; }
.nav-item.active { background: #2563eb; color: #fff; }

.sidebar-card {
  margin-top: 24px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  padding: 16px;
  background: rgba(255,255,255,.04);
}
.sidebar-card p { color: #cbd5e1; font-size: 12px; line-height: 1.45; margin-bottom: 0; }
.muted-label { color: #94a3b8; font-size: 12px; margin-bottom: 6px; text-transform: uppercase; letter-spacing: .05em; }
.conversion-line { font-size: 15px; }

/* v41: sidebar data status replaces the low-value conversion card and duplicated topbar status. */
.sidebar-status-card {
  padding: 14px;
}
.sidebar-status-list {
  display: grid;
  gap: 9px;
}
.sidebar-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
  color: #cbd5e1;
}
.sidebar-status-row span:first-child {
  color: #94a3b8;
}
.sidebar-status-row strong {
  min-width: 0;
  max-width: 145px;
  color: #f8fafc;
  font-size: 12px;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sidebar-status-cloud strong {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}
.sidebar-status-card .cloud-status-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 auto;
}
html[dir="rtl"] .sidebar-status-row strong {
  text-align: left;
}
html[dir="rtl"] .sidebar-status-cloud strong {
  justify-content: flex-start;
}

.main { padding: 26px; min-width: 0; }
.topbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 22px; }
.topbar h2 { margin: 0; font-size: 30px; }
.topbar p { margin: 6px 0 0; color: var(--muted); }
.topbar-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.language-select { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; background: #fff; min-width: 150px; }

.btn {
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 10px 14px;
  font-weight: 700;
  background: #e2e8f0;
  color: var(--text);
}
.btn.primary { background: var(--primary); color: #fff; }
.btn.primary:hover { background: var(--primary-dark); }
.btn.secondary { background: #fff; border-color: var(--line); }
.btn.danger { background: var(--danger); color: #fff; }
.btn:disabled { opacity: .45; cursor: not-allowed; }

.view { display: none; }
.view.active { display: block; }

.alert {
  background: var(--warning-bg);
  border: 1px solid #fcd34d;
  color: #92400e;
  padding: 12px 14px;
  border-radius: 14px;
  margin-bottom: 18px;
}
.hidden { display: none !important; }

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(160px, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.kpi-card, .panel, .mini-kpi, .report-card {
  background: var(--panel);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
}
.kpi-card { padding: 18px; }
.kpi-card span, .mini-kpi span { color: var(--muted); font-size: 13px; display: block; margin-bottom: 8px; }
.kpi-card strong { font-size: 30px; display: block; }
.kpi-card small { color: var(--muted); }
.kpi-card.danger { background: linear-gradient(180deg, #fff, var(--danger-bg)); }
.kpi-card.success { background: linear-gradient(180deg, #fff, var(--success-bg)); }

.split-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.panel { padding: 20px; min-width: 0; }
.panel.wide { width: 100%; }
.panel-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 16px; }
.panel-header h3 { margin: 0; font-size: 20px; }
.panel-header p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.table-tools { align-items: center; }

.alerts-list { display: grid; gap: 10px; }
.alert-item { border: 1px solid #fecaca; background: #fff7f7; border-radius: 14px; padding: 12px; }
.alert-item strong { color: var(--danger); }
.alert-item p { margin: 4px 0 0; color: var(--muted); }

.drop-zone {
  position: relative;
  border: 2px dashed #93c5fd;
  background: #eff6ff;
  border-radius: 20px;
  padding: 42px 24px;
  text-align: center;
  transition: .15s ease;
}
.drop-zone.dragover { border-color: var(--primary); background: #dbeafe; transform: scale(1.005); }
.drop-zone input { display: none; }
.drop-zone h3 { margin: 10px 0 6px; }
.drop-zone p { color: var(--muted); margin: 0 0 18px; }
.drop-icon { font-size: 36px; }
.upload-actions { display: flex; gap: 10px; margin: 16px 0; }
.file-list { display: grid; gap: 8px; }
.file-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--line); padding: 10px 12px; border-radius: 12px; }
.file-row span { color: var(--muted); font-size: 13px; }
.file-meta { display: flex; align-items: center; gap: 10px; }
.icon-btn { border: 0; background: #fee2e2; color: #991b1b; border-radius: 999px; width: 30px; height: 30px; font-weight: 900; line-height: 1; }
.icon-btn:hover { background: #fecaca; }
.import-progress { margin: 10px 0 0; color: var(--muted); font-size: 13px; min-height: 20px; }
.import-progress.busy::before { content: "⏳ "; }
.import-progress.ok { color: var(--success); }
.import-progress.error { color: var(--danger); }
.row-action { white-space: nowrap; }
.small-danger { padding: 7px 10px; border-radius: 10px; font-size: 12px; }
.log-panel { margin-top: 14px; display: grid; gap: 8px; }
.log-line { border-radius: 12px; padding: 10px 12px; background: #f8fafc; border: 1px solid var(--line); color: var(--muted); }
.log-line.ok { color: #166534; background: var(--success-bg); border-color: #bbf7d0; }
.log-line.error { color: #991b1b; background: var(--danger-bg); border-color: #fecaca; }

.search-input, .select-input, .setting-field input, .setting-field select {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  background: #fff;
  min-width: 260px;
}

.table-scroll { overflow: auto; border: 1px solid var(--line); border-radius: 14px; }
.compact-scroll { max-height: 420px; }
.data-table { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; }
.data-table th, .data-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.data-table th { position: sticky; top: 0; background: #f8fafc; color: #334155; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; z-index: 1; }
.data-table th[data-sort] { cursor: pointer; }
.data-table tr:hover td { background: #f8fafc; }
.data-table td.description-cell { max-width: 420px; white-space: normal; }
.data-table.compact th, .data-table.compact td { padding: 8px 10px; }

.badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 4px 9px; font-weight: 700; font-size: 12px; }
.badge.critical { color: #991b1b; background: #fee2e2; }
.badge.warning { color: #92400e; background: #fef3c7; }
.badge.healthy { color: #166534; background: #dcfce7; }
.badge.hibernating { color: #3730a3; background: #e0e7ff; }
.badge.unknown { color: #475569; background: #e2e8f0; }
.badge.abc-a { color: #1d4ed8; background: #dbeafe; }
.badge.abc-b { color: #7c3aed; background: #ede9fe; }
.badge.abc-c { color: #475569; background: #e2e8f0; }

.empty-state { color: var(--muted); background: #f8fafc; border: 1px dashed var(--line); padding: 14px; border-radius: 12px; }
.mini-kpi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 18px; }
.mini-kpi { padding: 14px; box-shadow: none; }
.mini-kpi strong { font-size: 22px; }
.top-gap { margin-top: 18px; }

.trend-list {
  display: grid;
  gap: 10px;
  min-height: 160px;
}
.trend-row {
  display: grid;
  grid-template-columns: 96px minmax(140px, 1fr) 96px;
  gap: 12px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.trend-label {
  color: #334155;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.trend-track {
  height: 14px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.trend-fill {
  height: 100%;
  border-radius: 999px;
  background: var(--primary);
}
.trend-value {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.trend-value strong {
  display: block;
  line-height: 1;
}
.trend-value small {
  color: var(--muted);
  font-size: 11px;
}
.trend-list.compact .trend-row { padding: 7px 8px; }


.report-grid { display: grid; grid-template-columns: repeat(4, minmax(170px, 1fr)); gap: 14px; }
.report-card { text-align: left; padding: 18px; border: 1px solid var(--line); }
.report-card strong { display: block; font-size: 20px; margin-bottom: 8px; }
.report-card span { color: var(--muted); line-height: 1.35; }
.report-card:hover { border-color: #93c5fd; }

.settings-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.setting-field { display: grid; gap: 7px; background: #f8fafc; border: 1px solid var(--line); border-radius: 14px; padding: 14px; }
.setting-field span { font-weight: 700; }
.setting-field small { color: var(--muted); line-height: 1.35; }
.setting-field input, .setting-field select { min-width: 0; width: 100%; }
.section-label { margin: 4px 0 12px; }
.section-label h4 { margin: 0; font-size: 16px; }
.section-label p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.35; }
.database-actions { display: flex; gap: 10px; margin: 16px 0; }
.data-management { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 18px; }
.group-manager { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 18px; }
.group-form { display: grid; grid-template-columns: 0.8fr 2fr 0.7fr 0.7fr 1.2fr; gap: 12px; align-items: end; margin: 14px 0; }
.group-flags { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; font-size: 13px; }
.group-flags label { display: inline-flex; align-items: center; gap: 6px; }
.group-note { color: var(--muted); font-size: 12px; line-height: 1.35; }
.db-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 10px; }
.db-summary div { background: #f8fafc; border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.db-summary strong { display: block; font-size: 22px; }
.db-summary span { color: var(--muted); font-size: 12px; }

.priority-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 72px; border-radius: 999px; padding: 4px 9px; font-size: 12px; font-weight: 900; border: 1px solid transparent; }
.priority-badge.urgency-critical { color: #991b1b; background: #fee2e2; border-color: #fecaca; }
.priority-badge.urgency-high { color: #9a3412; background: #ffedd5; border-color: #fed7aa; }
.priority-badge.urgency-medium { color: #854d0e; background: #fef3c7; border-color: #fde68a; }
.priority-badge.urgency-low { color: #075985; background: #e0f2fe; border-color: #bae6fd; }
.location-cell { max-width: 150px; font-weight: 800; white-space: normal; line-height: 1.25; }
.panel-subnote { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.35; }
.number { text-align: right; font-variant-numeric: tabular-nums; }
.rtl { direction: rtl; unicode-bidi: plaintext; }


.shipping-manager, .store-directory-manager { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 18px; }
.store-directory-form { display: grid; grid-template-columns: 0.7fr 1.1fr 1.6fr 1.2fr auto; gap: 10px; align-items: end; margin: 12px 0; }
.store-directory-form input, .store-directory-form select { min-width: 0; width: 100%; }
.unmapped-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 3px 8px; font-size: 11px; font-weight: 800; color: #92400e; background: #fef3c7; margin-left: 6px; }
.store-source-note { color: var(--muted); font-size: 12px; line-height: 1.35; }
.shipping-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 4px 9px; font-weight: 900; font-size: 12px; min-width: 48px; }
.shipping-badge.katz { color: #1d4ed8; background: #dbeafe; }
.shipping-badge.driver { color: #92400e; background: #fef3c7; }
.shipping-badge.other { color: #475569; background: #e2e8f0; }
.order-controls { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.order-controls .select-input { min-width: 360px; }
.history-controls { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
.history-controls .select-input { min-width: 220px; }
.history-mode-note { color: var(--muted); font-size: 13px; margin: 8px 0 0; }
.print-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.print-kpi { background: #f8fafc; border: 1px solid var(--line); border-radius: 14px; padding: 14px; }
.print-kpi span { color: var(--muted); font-size: 12px; display: block; margin-bottom: 6px; }
.print-kpi strong { font-size: 24px; display: block; }
.print-note { color: var(--muted); line-height: 1.45; font-size: 13px; margin: 8px 0 0; }
.order-dispatch-editor { margin: 0 0 18px; border: 1px solid var(--line); border-radius: 16px; padding: 14px; background: #f8fafc; }
.order-dispatch-editor h4 { margin: 0 0 6px; font-size: 15px; }
.order-dispatch-editor p { margin: 0 0 12px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.order-dispatch-actions { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0 0; }
.order-dispatch-table select, .order-dispatch-table input { min-width: 90px; width: 100%; }
.order-matrix th, .order-matrix td { padding: 4px 5px; line-height: 1.15; }
.order-matrix th.matrix-category { min-width: 62px; }
.order-matrix th.store-header strong { display: block; font-size: 10.5px; line-height: 1.1; }
.order-matrix th.store-header .store-id-line { display: block; font-size: 12px; font-weight: 900; }
.print-section { margin-top: 18px; }
.print-section h4 { margin: 0 0 8px; font-size: 16px; }
.order-matrix th.store-header { min-width: 78px; vertical-align: top; }
.order-matrix th.store-header small { display: block; color: var(--muted); font-size: 10px; margin-top: 3px; text-transform: none; letter-spacing: 0; }
.order-matrix tfoot td, .order-matrix tfoot th { font-weight: 900; background: #f8fafc; }
.order-matrix .ship-katz { background: #eff6ff; }
.order-matrix .ship-driver { background: #fffbeb; }
.print-only { display: none; }

@media (max-width: 1180px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { position: relative; height: auto; }
  .nav { grid-template-columns: repeat(4, 1fr); }
  .store-directory-form { grid-template-columns: repeat(2, 1fr); }
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .split-grid { grid-template-columns: 1fr; }
  .settings-grid, .report-grid, .group-form, .print-summary-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 720px) {
  .main { padding: 16px; }
  .topbar { flex-direction: column; }
  .topbar-actions, .upload-actions, .database-actions { flex-wrap: wrap; }
  .nav { grid-template-columns: repeat(2, 1fr); }
  .kpi-grid, .mini-kpi-grid, .settings-grid, .report-grid, .group-form, .db-summary, .print-summary-grid, .store-directory-form { grid-template-columns: 1fr; }
  .panel-header { flex-direction: column; }
  .search-input, .select-input { min-width: 100%; width: 100%; }
}

@media (max-width: 720px) {
  .trend-row { grid-template-columns: 74px 1fr 78px; gap: 8px; }
}



@media print {
  @page { size: landscape; margin: 10mm; }
  body { background: #fff; color: #000; }
  .sidebar, .topbar, #dependencyWarning, .no-print { display: none !important; }
  .app-shell { display: block; min-height: auto; }
  .main { padding: 0; }
  .view { display: none !important; }
  #orderprint { display: block !important; }
  .panel { box-shadow: none; border: 0; border-radius: 0; padding: 0; }
  .print-only { display: block; }
  .print-only h1 { margin: 0 0 6px; font-size: 26px; font-weight: 900; color: #000; }
  .print-only p { margin: 0 0 12px; color: #111827; font-size: 15px; font-weight: 700; }
  .table-scroll { overflow: visible; border: 0; border-radius: 0; max-height: none; }
  .data-table { font-size: 13px; color: #000; }
  .data-table th, .data-table td { padding: 6px 7px; border: 1.5px solid #374151; font-weight: 650; }
  .data-table th { position: static; background: #e5e7eb; color: #000; font-size: 12px; font-weight: 900; }
  .data-table.compact th, .data-table.compact td { padding: 6px 7px; }
  .data-table.compact.order-matrix th, .data-table.compact.order-matrix td { padding: 3px 4px; line-height: 1.08; }
  .order-matrix { font-size: 13px; border-collapse: collapse; }
  .order-matrix th.store-header { min-width: 64px; max-width: 82px; }
  .order-matrix th.store-header strong { font-size: 11px; color: #000; }
  .order-matrix th.store-header .store-id-line { font-size: 14px; color: #000; }
  .order-matrix th.store-header small { font-size: 11px; color: #000; font-weight: 900; margin-top: 1px; }
  .order-matrix td.number, .order-matrix th.matrix-category { font-size: 13px; font-weight: 900; }
  .print-section { break-inside: avoid; page-break-inside: avoid; }
  .print-section h4 { font-size: 18px; font-weight: 900; color: #000; }
  .print-summary-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .print-kpi { box-shadow: none; border: 1.5px solid #374151; padding: 10px; }
  .print-kpi span { color: #000; font-size: 13px; font-weight: 800; }
  .print-kpi strong { font-size: 24px; color: #000; }
  .print-note { color: #000; font-size: 14px; font-weight: 700; }
}

/* v15 print readability: shaded category column and totals */
.order-matrix .matrix-category-cell { background: #eef2f7; font-weight: 900; color: #0f172a; }
.order-matrix .total-col, .order-matrix .total-row th, .order-matrix .total-row-cell { background: #e2e8f0; font-weight: 900; color: #0f172a; }
.order-matrix tbody tr:nth-child(even) .matrix-category-cell { background: #e5ebf3; }
.order-matrix tbody tr:nth-child(even) td:not(.total-col) { background: #fafafa; }
.order-matrix tbody td.total-col { background: #dbe4f0; }
.order-matrix thead th.total-col { background: #cbd5e1; }
@media print {
  .order-matrix, .order-matrix * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .order-matrix .matrix-category-cell { background: #d9e2ef !important; color: #000 !important; }
  .order-matrix .total-col, .order-matrix .total-row th, .order-matrix .total-row-cell { background: #cbd5e1 !important; color: #000 !important; }
  .order-matrix tbody tr:nth-child(even) td:not(.total-col) { background: #f3f4f6 !important; }
  .order-matrix tbody tr:nth-child(even) .matrix-category-cell { background: #cbd5e1 !important; }
}



/* v16: visually separate נהג store columns in order print matrix */
.order-matrix th.ship-driver {
  background: #fed7aa !important;
  color: #7c2d12;
  border-left: 3px solid #b45309 !important;
  border-right: 3px solid #b45309 !important;
}
.order-matrix th.ship-driver small {
  color: #7c2d12;
  font-weight: 900;
}
.order-matrix td.ship-driver-col,
.order-matrix th.ship-driver-col {
  background: #fff7ed;
  border-left: 3px solid #b45309 !important;
  border-right: 3px solid #b45309 !important;
}
.order-matrix tbody tr:nth-child(even) td.ship-driver-col {
  background: #ffedd5;
}
.order-matrix td.ship-driver-col:not(:empty) {
  color: #7c2d12;
  font-weight: 900;
}
.order-matrix .total-row-cell.ship-driver-col {
  background: #fdba74;
  color: #7c2d12;
}
.order-matrix .ship-driver .store-id-line::before {
  content: "נהג • ";
  font-size: 10px;
  font-weight: 900;
}
@media print {
  .order-matrix th.ship-driver {
    background: #fdba74 !important;
    color: #000 !important;
    border-left: 3px solid #9a3412 !important;
    border-right: 3px solid #9a3412 !important;
  }
  .order-matrix td.ship-driver-col,
  .order-matrix th.ship-driver-col {
    background: #ffedd5 !important;
    color: #000 !important;
    border-left: 3px solid #9a3412 !important;
    border-right: 3px solid #9a3412 !important;
  }
  .order-matrix tbody tr:nth-child(even) td.ship-driver-col {
    background: #fed7aa !important;
  }
  .order-matrix .total-row-cell.ship-driver-col {
    background: #fb923c !important;
    color: #000 !important;
  }
}


/* v17: stock allocation / shortage marking for order print */
.print-summary-grid { grid-template-columns: repeat(5, 1fr); }
.stock-warning-note { margin: 8px 0 12px; padding: 9px 11px; border: 1.5px solid #f59e0b; background: #fffbeb; color: #78350f; border-radius: 10px; font-weight: 800; }
.matrix-legend { display: flex; gap: 10px; flex-wrap: wrap; margin: 6px 0 10px; font-size: 12px; font-weight: 800; color: var(--muted); }
.legend-chip { display: inline-flex; align-items: center; gap: 5px; }
.legend-swatch { width: 18px; height: 12px; border: 1px solid #94a3b8; display: inline-block; border-radius: 3px; }
.legend-swatch.shortage-none { background: #fee2e2; border-color: #dc2626; }
.legend-swatch.shortage-partial { background: #fef3c7; border-color: #d97706; }
.order-matrix td.shortage-none, .order-matrix tbody tr:nth-child(even) td.shortage-none { background: #fee2e2 !important; color: #991b1b; font-weight: 900; }
.order-matrix td.shortage-partial, .order-matrix tbody tr:nth-child(even) td.shortage-partial { background: #fef3c7 !important; color: #92400e; font-weight: 900; }
.order-matrix tr.category-shortage .matrix-category-cell { background: #fee2e2 !important; color: #991b1b; }
.order-matrix .cell-sub, .total-sub { display: block; font-size: 10px; line-height: 1; font-weight: 900; opacity: .9; }
.order-matrix .cell-collect { display: block; font-size: 13px; line-height: 1.05; font-weight: 950; }
.order-matrix .cell-requested { display: block; margin-top: 2px; padding-top: 1px; border-top: 1px solid rgba(0,0,0,.18); font-size: 10.5px; line-height: 1.05; font-weight: 950; color: #111827; white-space: nowrap; }
.order-matrix td.shortage-none .cell-requested { color: #7f1d1d; }
.order-matrix td.shortage-partial .cell-requested { color: #78350f; }
.shortage-badge { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 2px 7px; margin-inline-start: 4px; font-size: 10px; font-weight: 900; background: #fee2e2; color: #991b1b; border: 1px solid #ef4444; }
.shortage-row { background: #fff7ed; }
@media print {
  .print-summary-grid { grid-template-columns: repeat(5, 1fr); }
  .stock-warning-note { color: #000 !important; background: #ffedd5 !important; border: 1.5px solid #9a3412 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .matrix-legend { color: #000 !important; font-size: 11px; }
  .order-matrix td.shortage-none, .order-matrix tbody tr:nth-child(even) td.shortage-none { background: #fecaca !important; color: #000 !important; }
  .order-matrix td.shortage-partial, .order-matrix tbody tr:nth-child(even) td.shortage-partial { background: #fde68a !important; color: #000 !important; }
  .order-matrix tr.category-shortage .matrix-category-cell { background: #fecaca !important; color: #000 !important; }
  .order-matrix .cell-sub, .total-sub { font-size: 9px; color: #000 !important; }
  .order-matrix .cell-collect { font-size: 12px; color: #000 !important; }
  .order-matrix .cell-requested { font-size: 10px; color: #000 !important; border-top: 1px solid #000 !important; }
  .shortage-badge { background: #fecaca !important; color: #000 !important; border-color: #991b1b !important; }
}


/* v18: full-page pallet label print pages */
.pallet-label-preview { margin-top: 18px; }
.pallet-label-preview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.pallet-label-preview-card { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; background: #fff; }
.pallet-label-preview-card.driver { background: #fff7ed; border-color: #fdba74; }
.pallet-label-preview-card.katz { background: #eff6ff; border-color: #93c5fd; }
.pallet-label-preview-card strong { display: block; font-size: 15px; }
.pallet-label-preview-card span { display: block; color: var(--muted); font-size: 12px; margin-top: 4px; }
.pallet-label-pages { display: none; }

@media print {
  .pallet-label-preview { display: none !important; }
  .pallet-label-pages { display: block !important; }
  .pallet-label-page {
    break-before: page;
    page-break-before: always;
    min-height: 178mm;
    border: 8px solid #000;
    padding: 16mm;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #000 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .pallet-label-page.driver { background: #fff7ed !important; }
  .pallet-label-page.katz { background: #eff6ff !important; }
  .pallet-label-method {
    font-size: 96px;
    line-height: 1;
    font-weight: 1000;
    letter-spacing: 2px;
    margin-bottom: 12mm;
  }
  .pallet-label-store-name {
    font-size: 74px;
    line-height: 1.05;
    font-weight: 1000;
    max-width: 100%;
    margin-bottom: 8mm;
  }
  .pallet-label-store-code {
    font-size: 46px;
    line-height: 1;
    font-weight: 900;
    margin-bottom: 10mm;
  }
  .pallet-label-pallet-no {
    font-size: 42px;
    line-height: 1;
    font-weight: 900;
    margin-bottom: 6mm;
  }
  .pallet-label-cartons {
    font-size: 30px;
    line-height: 1.2;
    font-weight: 900;
  }
  .pallet-label-order-source {
    position: absolute;
    bottom: 10mm;
    left: 12mm;
    right: 12mm;
    font-size: 16px;
    font-weight: 800;
    color: #111 !important;
  }
  .pallet-label-page.katz .pallet-label-method {
    font-size: 150px;
    margin-bottom: 0;
  }
}



/* v21: print section selector and demand history sorting */
@media print {
  .print-exclude { display: none !important; }
}
.print-page-options {
  margin: 12px 0 16px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8fafc;
}
.print-page-options h4 { margin: 0 0 8px; }
.print-page-options-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px 12px;
}
.print-page-option {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
  color: var(--text);
}
.print-page-option input { width: 16px; height: 16px; }
th.sortable { cursor: pointer; user-select: none; }
th.sortable::after { content: ' ⇅'; font-size: 11px; color: var(--muted); }
th.sortable.sorted-asc::after { content: ' ↑'; color: var(--accent); }
th.sortable.sorted-desc::after { content: ' ↓'; color: var(--accent); }



/* v22: grayscale print palette and modern interface buttons */
:root {
  --primary: #1f4fd7;
  --primary-dark: #173ca8;
  --accent: #1f4fd7;
  --button-shadow: 0 8px 18px rgba(15, 23, 42, 0.10);
  --button-shadow-hover: 0 12px 24px rgba(15, 23, 42, 0.16);
}

.btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  border-radius: 999px;
  padding: 9px 16px;
  border: 1px solid #d7dee9;
  background: linear-gradient(180deg, #ffffff 0%, #f3f6fb 100%);
  color: #182230;
  font-weight: 850;
  letter-spacing: .005em;
  box-shadow: 0 1px 0 rgba(255,255,255,.85) inset, var(--button-shadow);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}
.btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(255,255,255,.85) inset, var(--button-shadow-hover);
  border-color: #b8c4d6;
}
.btn:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 4px 10px rgba(15, 23, 42, 0.12);
}
.btn.primary {
  border-color: #1f4fd7;
  background: linear-gradient(180deg, #3b6df2 0%, #1f4fd7 100%);
  color: #fff;
  box-shadow: 0 1px 0 rgba(255,255,255,.20) inset, 0 10px 22px rgba(31, 79, 215, .28);
}
.btn.primary:hover:not(:disabled) {
  background: linear-gradient(180deg, #2f60e4 0%, #173ca8 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.18) inset, 0 12px 26px rgba(31, 79, 215, .34);
}
.btn.secondary {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-color: #cbd5e1;
  color: #243247;
}
.btn.danger {
  border-color: #b91c1c;
  background: linear-gradient(180deg, #ef4444 0%, #b91c1c 100%);
  color: #fff;
  box-shadow: 0 1px 0 rgba(255,255,255,.18) inset, 0 10px 20px rgba(185, 28, 28, .22);
}
.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #fecaca;
  background: linear-gradient(180deg, #fff5f5 0%, #fee2e2 100%);
  color: #991b1b;
  box-shadow: 0 5px 14px rgba(153, 27, 27, .10);
}
.icon-btn:hover {
  background: linear-gradient(180deg, #fee2e2 0%, #fecaca 100%);
  transform: translateY(-1px);
}
.nav-item {
  font-weight: 800;
  letter-spacing: .01em;
  transition: background .12s ease, color .12s ease, transform .12s ease;
}
.nav-item:hover { transform: translateX(2px); }
.nav-item.active {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  box-shadow: 0 10px 22px rgba(37, 99, 235, .22);
}
.language-select, .search-input, .select-input, .setting-field input, .setting-field select {
  border-radius: 14px;
  border-color: #cbd5e1;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 4px 12px rgba(15,23,42,.04);
}
.language-select:focus, .search-input:focus, .select-input:focus, .setting-field input:focus, .setting-field select:focus {
  outline: 3px solid rgba(31, 79, 215, .14);
  border-color: #1f4fd7;
}

/* Screen preview also avoids relying only on color. */
.order-matrix th.ship-driver, .order-matrix td.ship-driver-col, .order-matrix th.ship-driver-col {
  background-image: repeating-linear-gradient(135deg, rgba(15,23,42,.08) 0 4px, rgba(255,255,255,0) 4px 9px);
}
.order-matrix th.ship-katz, .order-matrix td.ship-katz {
  background-image: repeating-linear-gradient(0deg, rgba(15,23,42,.045) 0 3px, rgba(255,255,255,0) 3px 8px);
}

@media print {
  body, #orderprint {
    font-family: Arial, Helvetica, "DejaVu Sans", sans-serif !important;
    color: #000 !important;
  }
  .btn, .print-page-options, .order-dispatch-editor, .pallet-label-preview, .no-print {
    display: none !important;
  }
  .print-only h1 {
    font-family: Arial, Helvetica, "DejaVu Sans", sans-serif !important;
    font-size: 25px !important;
    letter-spacing: .01em;
  }
  .print-only p, .print-note, .stock-warning-note, .matrix-legend {
    font-family: Arial, Helvetica, "DejaVu Sans", sans-serif !important;
  }
  .print-kpi {
    background: #f2f3f5 !important;
    border: 2px solid #111 !important;
  }
  .print-kpi:nth-child(even) { background: #e6e8eb !important; }
  .print-kpi span { color: #111 !important; }
  .data-table, .order-matrix {
    font-family: "Arial Narrow", Arial, Helvetica, "DejaVu Sans", sans-serif !important;
    color: #000 !important;
  }
  .data-table th {
    background: #d9d9d9 !important;
    color: #000 !important;
    border: 1.8px solid #111 !important;
  }
  .data-table td {
    border: 1.4px solid #222 !important;
  }
  .order-matrix th.store-header {
    background: #d8dadd !important;
    color: #000 !important;
  }
  .order-matrix th.store-header strong,
  .order-matrix th.store-header small,
  .order-matrix th.store-header .store-id-line {
    color: #000 !important;
  }
  .order-matrix .matrix-category-cell,
  .order-matrix th.matrix-category {
    background: #cfd3d8 !important;
    color: #000 !important;
    border-right: 3px solid #000 !important;
  }
  .order-matrix .total-col,
  .order-matrix .total-row th,
  .order-matrix .total-row-cell {
    background: #bfc3c8 !important;
    color: #000 !important;
    border-left: 3px solid #000 !important;
    border-top: 2px solid #000 !important;
  }
  .order-matrix tbody tr:nth-child(even) td:not(.total-col):not(.ship-driver-col):not(.shortage-none):not(.shortage-partial) {
    background: #eeeeee !important;
  }
  .order-matrix th.ship-driver,
  .order-matrix td.ship-driver-col,
  .order-matrix th.ship-driver-col {
    background-color: #dadada !important;
    background-image: repeating-linear-gradient(135deg, #b7b7b7 0 3px, #ededed 3px 8px) !important;
    color: #000 !important;
    border-left: 4px solid #000 !important;
    border-right: 4px solid #000 !important;
  }
  .order-matrix tbody tr:nth-child(even) td.ship-driver-col {
    background-color: #d0d0d0 !important;
    background-image: repeating-linear-gradient(135deg, #adadad 0 3px, #e8e8e8 3px 8px) !important;
  }
  .order-matrix th.ship-katz,
  .order-matrix td.ship-katz {
    background-color: #f3f3f3 !important;
    background-image: repeating-linear-gradient(0deg, #d7d7d7 0 1px, #f7f7f7 1px 7px) !important;
  }
  .order-matrix td.shortage-none,
  .order-matrix tbody tr:nth-child(even) td.shortage-none {
    background-color: #c9c9c9 !important;
    background-image: repeating-linear-gradient(45deg, #9b9b9b 0 4px, #dedede 4px 9px) !important;
    color: #000 !important;
    border: 2px solid #000 !important;
  }
  .order-matrix td.shortage-partial,
  .order-matrix tbody tr:nth-child(even) td.shortage-partial {
    background-color: #dedede !important;
    background-image: repeating-linear-gradient(-45deg, #b5b5b5 0 3px, #eeeeee 3px 8px) !important;
    color: #000 !important;
    border: 2px solid #111 !important;
  }
  .legend-swatch.shortage-none {
    background-image: repeating-linear-gradient(45deg, #999 0 4px, #ddd 4px 9px) !important;
    border-color: #000 !important;
  }
  .legend-swatch.shortage-partial {
    background-image: repeating-linear-gradient(-45deg, #aaa 0 3px, #eee 3px 8px) !important;
    border-color: #000 !important;
  }
  .pallet-label-page {
    font-family: Arial, Helvetica, "DejaVu Sans", sans-serif !important;
    background: #fff !important;
    border: 10px solid #000 !important;
    box-shadow: inset 0 0 0 6px #fff, inset 0 0 0 10px #000;
  }
  .pallet-label-page.driver {
    background: #fff !important;
    background-image: repeating-linear-gradient(135deg, #e5e5e5 0 9px, #ffffff 9px 22px) !important;
  }
  .pallet-label-page.katz {
    background: #fff !important;
    background-image: repeating-linear-gradient(0deg, #ededed 0 5px, #ffffff 5px 18px) !important;
    border-style: double !important;
  }
  .pallet-label-method, .pallet-label-store-name, .pallet-label-store-code, .pallet-label-pallet-no {
    color: #000 !important;
    text-shadow: none !important;
  }
  .pallet-label-page.driver .pallet-label-method {
    border: 6px solid #000;
    padding: 8mm 16mm;
    background: #fff !important;
  }
  .pallet-label-page.katz .pallet-label-method {
    border: 10px solid #000;
    padding: 14mm 24mm;
    background: #fff !important;
  }
  .pallet-label-store-name, .pallet-label-store-code, .pallet-label-pallet-no, .pallet-label-order-source {
    background: rgba(255,255,255,.92);
    padding: 2mm 5mm;
  }
}



/* v24: Tesla-inspired interface skin - screen only, print remains warehouse grayscale */
@media screen {
  :root {
    color-scheme: dark;
    --bg: #07080a;
    --panel: rgba(18, 20, 23, 0.86);
    --panel-solid: #121417;
    --text: #f4f5f5;
    --muted: #9ca3af;
    --line: rgba(255, 255, 255, 0.10);
    --primary: #e82127;
    --primary-dark: #b91c1c;
    --accent: #e82127;
    --danger: #ff4d4f;
    --danger-bg: rgba(232, 33, 39, 0.12);
    --warning: #f5c542;
    --warning-bg: rgba(245, 197, 66, 0.11);
    --success: #39d98a;
    --success-bg: rgba(57, 217, 138, 0.10);
    --shadow: 0 24px 80px rgba(0, 0, 0, 0.42);
    --radius: 22px;
    --button-shadow: 0 12px 30px rgba(0,0,0,.28);
    --button-shadow-hover: 0 18px 38px rgba(0,0,0,.38);
  }

  html { background: #07080a; }
  body {
    background:
      radial-gradient(circle at 25% -10%, rgba(255,255,255,.11), transparent 28%),
      radial-gradient(circle at 82% 4%, rgba(232,33,39,.16), transparent 24%),
      linear-gradient(135deg, #050607 0%, #0b0d10 45%, #111317 100%);
    color: var(--text);
    letter-spacing: -0.01em;
  }

  body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
      linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent 82%);
    z-index: 0;
  }

  .app-shell, .main, .sidebar { position: relative; z-index: 1; }
  .app-shell { grid-template-columns: 268px minmax(0, 1fr); }

  .sidebar {
    background: rgba(5, 6, 8, 0.74);
    border-right: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(26px) saturate(140%);
    box-shadow: inset -1px 0 0 rgba(255,255,255,.04);
  }

  .brand { margin-bottom: 30px; }
  .brand-mark {
    background: linear-gradient(135deg, #f5f5f5, #9ca3af);
    color: #050607;
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgba(255,255,255,.18), 0 14px 40px rgba(255,255,255,.08);
  }
  .brand h1 { color: #fff; font-weight: 900; letter-spacing: -0.035em; }
  .brand p { color: #8d929b; }

  .nav { gap: 6px; }
  .nav-item {
    color: #adb3bc;
    border-radius: 999px;
    padding: 11px 14px;
    font-weight: 760;
    background: transparent;
  }
  .nav-item:hover {
    background: rgba(255,255,255,.07);
    color: #fff;
    transform: translateX(0);
  }
  .nav-item.active {
    background: rgba(255,255,255,.92);
    color: #050607;
    box-shadow: 0 10px 32px rgba(255,255,255,.12);
  }

  .sidebar-card {
    background: rgba(255,255,255,.055);
    border: 1px solid rgba(255,255,255,.09);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  }
  .sidebar-card p { color: #aeb4bd; }
  .muted-label { color: #777e89; }

  .main { padding: 30px 34px 38px; }
  .topbar {
    align-items: center;
    margin-bottom: 24px;
    padding: 6px 2px;
  }
  .topbar h2 {
    color: #fff;
    font-size: clamp(28px, 3vw, 44px);
    line-height: 1;
    font-weight: 860;
    letter-spacing: -0.055em;
  }
  .topbar p { color: #8e959f; font-size: 14px; }
  .topbar-actions { gap: 8px; }

  .kpi-card, .panel, .mini-kpi, .report-card, .print-kpi, .order-dispatch-editor, .print-page-options, .setting-field, .db-summary div, .drop-zone, .file-row, .log-line, .empty-state, .pallet-label-preview-card {
    background: linear-gradient(180deg, rgba(255,255,255,.078), rgba(255,255,255,.045));
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.055);
    backdrop-filter: blur(20px) saturate(145%);
  }

  .panel {
    padding: 22px;
    border-radius: 26px;
  }
  .panel-header h3, .section-label h4, .print-section h4 { color: #fff; font-weight: 850; letter-spacing: -0.03em; }
  .panel-header p, .section-label p, .print-note, .history-mode-note, .store-source-note, .group-note { color: #979da7; }

  .kpi-grid { gap: 12px; }
  .kpi-card {
    padding: 18px 18px 16px;
    border-radius: 24px;
  }
  .kpi-card span, .mini-kpi span, .print-kpi span, .db-summary span { color: #8f969f; text-transform: none; letter-spacing: -0.005em; }
  .kpi-card strong, .mini-kpi strong, .print-kpi strong, .db-summary strong {
    color: #fff;
    font-weight: 880;
    letter-spacing: -0.055em;
  }
  .kpi-card.danger { background: linear-gradient(180deg, rgba(232,33,39,.18), rgba(255,255,255,.045)); }
  .kpi-card.success { background: linear-gradient(180deg, rgba(57,217,138,.14), rgba(255,255,255,.045)); }

  .btn {
    min-height: 40px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.10);
    color: #f6f7f8;
    box-shadow: none;
    font-weight: 820;
    letter-spacing: -0.01em;
    padding: 9px 17px;
  }
  .btn:hover:not(:disabled) {
    transform: translateY(-1px);
    background: rgba(255,255,255,.16);
    border-color: rgba(255,255,255,.20);
    box-shadow: 0 12px 30px rgba(0,0,0,.24);
  }
  .btn:active:not(:disabled) { transform: translateY(0); box-shadow: none; }
  .btn.primary {
    background: #f5f5f5;
    color: #050607;
    border-color: #f5f5f5;
    box-shadow: 0 16px 34px rgba(255,255,255,.10);
  }
  .btn.primary:hover:not(:disabled) { background: #fff; box-shadow: 0 18px 40px rgba(255,255,255,.15); }
  .btn.secondary {
    background: rgba(255,255,255,.08);
    color: #f6f7f8;
    border-color: rgba(255,255,255,.13);
  }
  .btn.danger {
    background: rgba(232,33,39,.18);
    color: #fff;
    border-color: rgba(232,33,39,.48);
    box-shadow: none;
  }
  .btn.danger:hover:not(:disabled) { background: rgba(232,33,39,.28); }
  .icon-btn {
    background: rgba(232,33,39,.16);
    border: 1px solid rgba(232,33,39,.35);
    color: #ffb4b6;
    box-shadow: none;
  }

  .language-select, .search-input, .select-input, .setting-field input, .setting-field select, .store-directory-form input, .store-directory-form select, .order-dispatch-table select, .order-dispatch-table input {
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.12);
    color: #f6f7f8;
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  }
  select option { background: #111317; color: #f6f7f8; }
  input::placeholder { color: #747b86; }
  .language-select:focus, .search-input:focus, .select-input:focus, .setting-field input:focus, .setting-field select:focus, .store-directory-form input:focus, .store-directory-form select:focus {
    outline: 3px solid rgba(255,255,255,.10);
    border-color: rgba(255,255,255,.30);
  }

  .drop-zone {
    border: 1.5px dashed rgba(255,255,255,.22);
    background:
      linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
      radial-gradient(circle at 50% 0, rgba(232,33,39,.13), transparent 42%);
  }
  .drop-zone.dragover {
    border-color: rgba(255,255,255,.55);
    background: rgba(255,255,255,.10);
    transform: scale(1.003);
  }
  .drop-zone h3 { color: #fff; }
  .drop-zone p, .file-row span, .import-progress { color: #9299a4; }

  .alert {
    background: rgba(245, 197, 66, .10);
    border: 1px solid rgba(245, 197, 66, .26);
    color: #f9d876;
  }
  .alert-item {
    background: rgba(232,33,39,.10);
    border: 1px solid rgba(232,33,39,.25);
  }
  .alert-item strong { color: #ff767a; }
  .alert-item p { color: #aeb4bd; }

  .table-scroll {
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    background: rgba(255,255,255,.035);
  }
  .data-table {
    background: transparent;
    color: #eceff2;
  }
  .data-table th, .data-table td {
    border-bottom: 1px solid rgba(255,255,255,.075);
  }
  .data-table th {
    background: rgba(255,255,255,.085);
    color: #c5cad1;
  }
  .data-table tr:hover td { background: rgba(255,255,255,.055); }
  .data-table td.description-cell { color: #d7dbe0; }
  .number { color: #f8f9fa; }

  .badge {
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  }
  .badge.critical { color: #ffb4b6; background: rgba(232,33,39,.16); }
  .badge.warning { color: #ffe09a; background: rgba(245,197,66,.13); }
  .badge.healthy { color: #a8f2cc; background: rgba(57,217,138,.12); }
  .badge.hibernating { color: #c7d2fe; background: rgba(99,102,241,.16); }
  .badge.unknown, .badge.abc-c { color: #cbd5e1; background: rgba(255,255,255,.10); }
  .badge.abc-a { color: #f5f5f5; background: rgba(255,255,255,.17); }
  .badge.abc-b { color: #d8b4fe; background: rgba(168,85,247,.15); }

  .trend-row {
    background: rgba(255,255,255,.045);
    border-color: rgba(255,255,255,.09);
  }
  .trend-label { color: #d4d8dd; }
  .trend-track { background: rgba(255,255,255,.10); }
  .trend-fill { background: linear-gradient(90deg, #f4f4f5, #aeb4bd); }
  .trend-value small { color: #89909a; }

  .report-card:hover, .kpi-card:hover, .mini-kpi:hover {
    border-color: rgba(255,255,255,.19);
    transform: translateY(-1px);
  }
  .report-card, .kpi-card, .mini-kpi { transition: transform .14s ease, border-color .14s ease, background .14s ease; }

  .setting-field { background: rgba(255,255,255,.05); }
  .db-summary div { background: rgba(255,255,255,.05); }
  .empty-state {
    background: rgba(255,255,255,.035);
    border-color: rgba(255,255,255,.12);
    color: #9da4ae;
  }
  .log-line { background: rgba(255,255,255,.045); color: #aeb4bd; }
  .log-line.ok { color: #a8f2cc; background: rgba(57,217,138,.10); border-color: rgba(57,217,138,.25); }
  .log-line.error { color: #ffb4b6; background: rgba(232,33,39,.12); border-color: rgba(232,33,39,.32); }

  .shipping-badge.katz { color: #f5f5f5; background: rgba(255,255,255,.16); }
  .shipping-badge.driver { color: #ffe09a; background: rgba(245,197,66,.14); }
  .shipping-badge.other { color: #cbd5e1; background: rgba(255,255,255,.10); }
  .unmapped-badge { color: #ffe09a; background: rgba(245,197,66,.14); border: 1px solid rgba(245,197,66,.25); }

  .order-matrix .matrix-category-cell { background: rgba(255,255,255,.13); color: #fff; }
  .order-matrix .total-col, .order-matrix .total-row th, .order-matrix .total-row-cell { background: rgba(255,255,255,.17); color: #fff; }
  .order-matrix tbody tr:nth-child(even) td:not(.total-col) { background: rgba(255,255,255,.025); }
  .order-matrix tbody tr:nth-child(even) .matrix-category-cell { background: rgba(255,255,255,.15); }
  .order-matrix th.ship-driver { background: rgba(245,197,66,.18) !important; color: #fff2bf; border-left-color: rgba(245,197,66,.8) !important; border-right-color: rgba(245,197,66,.8) !important; }
  .order-matrix td.ship-driver-col, .order-matrix th.ship-driver-col { background-color: rgba(245,197,66,.08); border-left-color: rgba(245,197,66,.65) !important; border-right-color: rgba(245,197,66,.65) !important; }
  .order-matrix td.ship-driver-col:not(:empty) { color: #fff2bf; }
  .order-matrix td.shortage-none, .order-matrix tbody tr:nth-child(even) td.shortage-none { background: rgba(232,33,39,.25) !important; color: #ffd7d8; }
  .order-matrix td.shortage-partial, .order-matrix tbody tr:nth-child(even) td.shortage-partial { background: rgba(245,197,66,.20) !important; color: #ffe09a; }
  .order-matrix tr.category-shortage .matrix-category-cell { background: rgba(232,33,39,.25) !important; color: #ffb4b6; }
  .cell-requested { color: #f5f5f5 !important; border-top-color: rgba(255,255,255,.20) !important; }

  .print-page-options, .order-dispatch-editor { background: rgba(255,255,255,.045); }
  .print-page-option { color: #eef1f4; }
  .stock-warning-note { background: rgba(245,197,66,.12); color: #ffe09a; border-color: rgba(245,197,66,.35); }
  .matrix-legend { color: #b8bec7; }
  .legend-swatch { border-color: rgba(255,255,255,.35); }

  .pallet-label-preview-card.driver { background: rgba(245,197,66,.10); border-color: rgba(245,197,66,.28); }
  .pallet-label-preview-card.katz { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.16); }
  .pallet-label-preview-card span { color: #9aa1ab; }

  ::selection { background: rgba(232,33,39,.35); color: #fff; }

  @media (max-width: 1180px) {
    .app-shell { grid-template-columns: 1fr; }
    .sidebar { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  }
}



/* v25: clean printouts, light/dark theme switch, expanded table layout */
@media screen {
  body[data-theme="light"] {
    color-scheme: light;
    --bg: #f5f6f8;
    --panel: #ffffff;
    --panel-solid: #ffffff;
    --text: #171a20;
    --muted: #5c6673;
    --line: #d9dee7;
    --primary: #171a20;
    --primary-dark: #000000;
    --accent: #171a20;
    --danger: #b42318;
    --danger-bg: #fff1f0;
    --warning: #9a5b00;
    --warning-bg: #fff8e6;
    --success: #087443;
    --success-bg: #ecfdf3;
    --shadow: 0 12px 34px rgba(23, 26, 32, 0.08);
    background: linear-gradient(180deg, #ffffff 0%, #f5f6f8 38%, #eef1f5 100%) !important;
    color: var(--text) !important;
  }
  body[data-theme="light"]::before { display: none !important; }
  body[data-theme="light"] .sidebar {
    background: rgba(255,255,255,.88);
    color: #171a20;
    border-right: 1px solid #e1e5ec;
    box-shadow: 1px 0 22px rgba(23,26,32,.06);
  }
  body[data-theme="light"] .brand h1,
  body[data-theme="light"] .topbar h2,
  body[data-theme="light"] .panel-header h3,
  body[data-theme="light"] .section-label h4,
  body[data-theme="light"] .print-section h4,
  body[data-theme="light"] .kpi-card strong,
  body[data-theme="light"] .mini-kpi strong,
  body[data-theme="light"] .print-kpi strong,
  body[data-theme="light"] .db-summary strong { color: #171a20; }
  body[data-theme="light"] .brand p,
  body[data-theme="light"] .topbar p,
  body[data-theme="light"] .panel-header p,
  body[data-theme="light"] .section-label p,
  body[data-theme="light"] .muted-label,
  body[data-theme="light"] .sidebar-card p,
  body[data-theme="light"] .print-note,
  body[data-theme="light"] .history-mode-note,
  body[data-theme="light"] .store-source-note,
  body[data-theme="light"] .group-note { color: #667085; }
  body[data-theme="light"] .brand-mark {
    background: #171a20;
    color: #ffffff;
    box-shadow: none;
  }
  body[data-theme="light"] .nav-item { color: #475467; }
  body[data-theme="light"] .nav-item:hover { background: #f0f2f5; color: #171a20; }
  body[data-theme="light"] .nav-item.active {
    background: #171a20;
    color: #ffffff;
    box-shadow: 0 10px 26px rgba(23,26,32,.14);
  }
  body[data-theme="light"] .sidebar-card,
  body[data-theme="light"] .kpi-card,
  body[data-theme="light"] .panel,
  body[data-theme="light"] .mini-kpi,
  body[data-theme="light"] .report-card,
  body[data-theme="light"] .print-kpi,
  body[data-theme="light"] .order-dispatch-editor,
  body[data-theme="light"] .print-page-options,
  body[data-theme="light"] .setting-field,
  body[data-theme="light"] .db-summary div,
  body[data-theme="light"] .drop-zone,
  body[data-theme="light"] .file-row,
  body[data-theme="light"] .log-line,
  body[data-theme="light"] .empty-state,
  body[data-theme="light"] .pallet-label-preview-card {
    background: #ffffff;
    border-color: #e1e5ec;
    box-shadow: var(--shadow);
    backdrop-filter: none;
  }
  body[data-theme="light"] .btn {
    background: #f3f4f6;
    color: #171a20;
    border-color: #d0d5dd;
    box-shadow: none;
  }
  body[data-theme="light"] .btn:hover:not(:disabled) { background: #e9edf3; box-shadow: none; }
  body[data-theme="light"] .btn.primary { background: #171a20; color: #fff; border-color: #171a20; box-shadow: none; }
  body[data-theme="light"] .btn.secondary { background: #ffffff; color: #171a20; border-color: #d0d5dd; }
  body[data-theme="light"] .btn.danger { background: #b42318; border-color: #b42318; color: #fff; }
  body[data-theme="light"] .language-select,
  body[data-theme="light"] .search-input,
  body[data-theme="light"] .select-input,
  body[data-theme="light"] .setting-field input,
  body[data-theme="light"] .setting-field select,
  body[data-theme="light"] .store-directory-form input,
  body[data-theme="light"] .store-directory-form select,
  body[data-theme="light"] .order-dispatch-table select,
  body[data-theme="light"] .order-dispatch-table input {
    background: #ffffff;
    color: #171a20;
    border-color: #d0d5dd;
    box-shadow: none;
  }
  body[data-theme="light"] select option { background: #ffffff; color: #171a20; }
  body[data-theme="light"] .table-scroll { background: transparent; border-color: #e1e5ec; }
  body[data-theme="light"] .data-table { background: #ffffff; color: #171a20; }
  body[data-theme="light"] .data-table th { background: #f2f4f7; color: #475467; }
  body[data-theme="light"] .data-table th,
  body[data-theme="light"] .data-table td { border-bottom-color: #e4e7ec; }
  body[data-theme="light"] .data-table tr:hover td { background: #f9fafb; }
  body[data-theme="light"] .number { color: #171a20; }
  body[data-theme="light"] .trend-row { background: #ffffff; border-color: #e1e5ec; }
  body[data-theme="light"] .trend-label { color: #344054; }
  body[data-theme="light"] .trend-track { background: #e4e7ec; }
  body[data-theme="light"] .trend-fill { background: #171a20; }

  body[data-table-layout="expanded"] .table-scroll {
    overflow: visible !important;
    max-height: none !important;
  }
  body[data-table-layout="expanded"] .compact-scroll { max-height: none !important; }
  body[data-table-layout="expanded"] .panel,
  body[data-table-layout="expanded"] .view { overflow: visible !important; }
  body[data-table-layout="expanded"] .data-table { min-width: 100%; }
  body[data-table-layout="contained"] .table-scroll { overflow: auto; }
  .ui-pref-select { min-width: 118px; }
}

@media print {
  body, #orderprint, .data-table, .order-matrix, .pallet-label-page {
    font-family: Arial, Helvetica, "Noto Sans", "DejaVu Sans", sans-serif !important;
  }
  body::before,
  .app-shell::before,
  .main::before,
  .panel::before { display: none !important; }
  *, *::before, *::after {
    text-shadow: none !important;
    box-shadow: none !important;
  }
  .order-matrix th.ship-driver,
  .order-matrix td.ship-driver-col,
  .order-matrix th.ship-driver-col,
  .order-matrix th.ship-katz,
  .order-matrix td.ship-katz,
  .order-matrix td.shortage-none,
  .order-matrix tbody tr:nth-child(even) td.shortage-none,
  .order-matrix td.shortage-partial,
  .order-matrix tbody tr:nth-child(even) td.shortage-partial,
  .pallet-label-page.driver,
  .pallet-label-page.katz,
  .legend-swatch.shortage-none,
  .legend-swatch.shortage-partial {
    background-image: none !important;
  }
  .print-kpi,
  .stock-warning-note,
  .pallet-label-store-name,
  .pallet-label-store-code,
  .pallet-label-pallet-no,
  .pallet-label-order-source {
    background-image: none !important;
  }
  .pallet-label-page {
    border: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
    min-height: 180mm;
    padding: 18mm;
  }
  .pallet-label-page.driver .pallet-label-method,
  .pallet-label-page.katz .pallet-label-method {
    border: 0 !important;
    background: #fff !important;
    padding: 0 !important;
  }
  .pallet-label-store-name,
  .pallet-label-store-code,
  .pallet-label-pallet-no,
  .pallet-label-order-source {
    background: #fff !important;
    padding: 0 !important;
  }
  .data-table th { background: #efefef !important; }
  .order-matrix .matrix-category-cell,
  .order-matrix th.matrix-category { background: #efefef !important; }
  .order-matrix .total-col,
  .order-matrix .total-row th,
  .order-matrix .total-row-cell { background: #e3e3e3 !important; }
  .order-matrix th.ship-driver,
  .order-matrix td.ship-driver-col,
  .order-matrix th.ship-driver-col {
    background: #f1f1f1 !important;
    border-left: 3px solid #000 !important;
    border-right: 3px solid #000 !important;
  }
  .order-matrix th.ship-katz,
  .order-matrix td.ship-katz { background: #fff !important; }
  .order-matrix td.shortage-none,
  .order-matrix tbody tr:nth-child(even) td.shortage-none {
    background: #e0e0e0 !important;
    border: 2px solid #000 !important;
  }
  .order-matrix td.shortage-partial,
  .order-matrix tbody tr:nth-child(even) td.shortage-partial {
    background: #eeeeee !important;
    border: 2px solid #111 !important;
  }
}



/* v27: cleaner print matrix + light mode contrast fixes */
@media screen {
  body[data-theme="light"] label,
  body[data-theme="light"] .print-page-option,
  body[data-theme="light"] .print-page-option span,
  body[data-theme="light"] .order-dispatch-editor,
  body[data-theme="light"] .order-dispatch-editor p,
  body[data-theme="light"] .order-dispatch-table,
  body[data-theme="light"] .order-dispatch-table th,
  body[data-theme="light"] .order-dispatch-table td,
  body[data-theme="light"] .print-page-options,
  body[data-theme="light"] .print-page-options h4,
  body[data-theme="light"] .checkbox-label,
  body[data-theme="light"] .setting-field label,
  body[data-theme="light"] .report-card,
  body[data-theme="light"] .report-card strong,
  body[data-theme="light"] .pallet-label-preview-card,
  body[data-theme="light"] .pallet-label-preview-card strong {
    color: #171a20 !important;
  }

  body[data-theme="light"] .order-dispatch-editor p,
  body[data-theme="light"] .report-card span,
  body[data-theme="light"] .pallet-label-preview-card span,
  body[data-theme="light"] .matrix-legend,
  body[data-theme="light"] .legend-chip,
  body[data-theme="light"] .print-note,
  body[data-theme="light"] .order-matrix th.store-header small {
    color: #344054 !important;
  }

  body[data-theme="light"] .stock-warning-note {
    background: #fff8e6 !important;
    color: #704300 !important;
    border-color: #d6a10f !important;
  }

  body[data-theme="light"] .shipping-badge.driver,
  body[data-theme="light"] .badge.warning,
  body[data-theme="light"] .unmapped-badge {
    color: #704300 !important;
    background: #fff4cc !important;
    border: 1px solid #e0b43c !important;
  }

  body[data-theme="light"] .shipping-badge.katz,
  body[data-theme="light"] .shipping-badge.other {
    color: #1f2937 !important;
    background: #f2f4f7 !important;
    border: 1px solid #d0d5dd !important;
  }

  body[data-theme="light"] .badge.critical { color: #912018 !important; background: #ffe4e2 !important; }
  body[data-theme="light"] .badge.healthy { color: #05603a !important; background: #dcfae6 !important; }
  body[data-theme="light"] .badge.hibernating { color: #3538cd !important; background: #e0eaff !important; }
  body[data-theme="light"] .badge.unknown,
  body[data-theme="light"] .badge.abc-c { color: #344054 !important; background: #eaecf0 !important; }

  body[data-theme="light"] .order-matrix th.ship-driver,
  body[data-theme="light"] .order-matrix td.ship-driver-col,
  body[data-theme="light"] .order-matrix th.ship-driver-col {
    background-image: none !important;
    color: #171a20 !important;
  }

  body[data-theme="light"] .order-matrix th.ship-driver {
    background: #f2f4f7 !important;
    border-left: 1px solid #c9ced6 !important;
    border-right: 1px solid #c9ced6 !important;
  }

  body[data-theme="light"] .order-matrix td.ship-driver-col,
  body[data-theme="light"] .order-matrix th.ship-driver-col {
    background: #ffffff !important;
    border-left: 1px solid #e4e7ec !important;
    border-right: 1px solid #e4e7ec !important;
  }

  body[data-theme="light"] .order-matrix tbody tr:nth-child(even) td.ship-driver-col {
    background: #f9fafb !important;
  }

  body[data-theme="light"] .order-matrix td.shortage-none,
  body[data-theme="light"] .order-matrix tbody tr:nth-child(even) td.shortage-none {
    background: #fff1f0 !important;
    color: #912018 !important;
  }

  body[data-theme="light"] .order-matrix td.shortage-partial,
  body[data-theme="light"] .order-matrix tbody tr:nth-child(even) td.shortage-partial {
    background: #fff8e6 !important;
    color: #704300 !important;
  }

  body[data-theme="light"] .order-matrix .cell-requested,
  body[data-theme="light"] .order-matrix td.shortage-none .cell-requested,
  body[data-theme="light"] .order-matrix td.shortage-partial .cell-requested {
    color: #171a20 !important;
    border-top-color: rgba(23, 26, 32, .25) !important;
  }

  body[data-theme="light"] input[type="checkbox"] { accent-color: #171a20; }
}

@media print {
  /* Keep the printed order matrix plain: no decorative lines/patterns, no driver side bands. */
  .order-matrix th.ship-driver,
  .order-matrix td.ship-driver-col,
  .order-matrix th.ship-driver-col,
  .order-matrix th.ship-katz,
  .order-matrix td.ship-katz,
  .order-matrix td.shortage-none,
  .order-matrix tbody tr:nth-child(even) td.shortage-none,
  .order-matrix td.shortage-partial,
  .order-matrix tbody tr:nth-child(even) td.shortage-partial,
  .pallet-label-page.driver,
  .pallet-label-page.katz,
  .legend-swatch.shortage-none,
  .legend-swatch.shortage-partial {
    background-image: none !important;
  }

  .order-matrix th.ship-driver,
  .order-matrix td.ship-driver-col,
  .order-matrix th.ship-driver-col {
    background: #ffffff !important;
    color: #000000 !important;
    border-left: 1px solid #333333 !important;
    border-right: 1px solid #333333 !important;
  }

  .order-matrix tbody tr:nth-child(even) td.ship-driver-col {
    background: #ffffff !important;
  }

  .order-matrix th.ship-driver {
    font-weight: 900 !important;
  }

  /* Remove explanatory shortage text from printout while keeping requested quantities inside cells. */
  .matrix-legend,
  .stock-warning-note,
  .shortage-badge {
    display: none !important;
  }

  .order-matrix td.shortage-none,
  .order-matrix tbody tr:nth-child(even) td.shortage-none,
  .order-matrix td.shortage-partial,
  .order-matrix tbody tr:nth-child(even) td.shortage-partial {
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #333333 !important;
  }

  .order-matrix tr.category-shortage .matrix-category-cell {
    background: #efefef !important;
    color: #000000 !important;
  }

  .order-matrix .cell-collect,
  .order-matrix .cell-requested,
  .order-matrix .cell-sub,
  .total-sub {
    color: #000000 !important;
  }

  .order-matrix .cell-requested {
    border-top: 1px solid #000000 !important;
  }

  .pallet-label-page,
  .pallet-label-page.driver,
  .pallet-label-page.katz {
    background: #ffffff !important;
    border: 0 !important;
    box-shadow: none !important;
  }
}


/* v28: optional free hosted sharing via Supabase */
.cloud-status-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}
.cloud-status-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #94a3b8;
  display: inline-block;
}
.cloud-status-dot.ok { background: var(--success); }
.cloud-status-dot.busy { background: var(--warning); }
.cloud-status-dot.error { background: var(--danger); }
.cloud-sharing-panel {
  margin-top: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel);
  padding: 18px;
}
.cloud-sharing-panel .panel-header { margin-bottom: 14px; }
.cloud-sharing-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.cloud-sharing-grid .wide { grid-column: 1 / -1; }
.cloud-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.cloud-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.cloud-status-box {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8fafc;
  color: #334155;
  font-size: 13px;
}
.cloud-conflict-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(180, 83, 9, .35);
  border-radius: 14px;
  background: #fff7ed;
  color: #7c2d12;
  font-size: 13px;
}
.cloud-conflict-panel[hidden] { display: none; }
.cloud-conflict-panel p {
  margin: 4px 0 0;
  color: inherit;
  opacity: .9;
}
.cloud-conflict-panel .btn { white-space: nowrap; }
body[data-theme="dark"] .cloud-status-bar,
body[data-theme="dark"] .cloud-status-box {
  background: rgba(255,255,255,.055);
  color: #d7dce3;
}
body[data-theme="dark"] .cloud-conflict-panel {
  background: rgba(251, 146, 60, .12);
  border-color: rgba(251, 146, 60, .35);
  color: #fed7aa;
}
body[data-theme="dark"] .cloud-sharing-panel {
  background: rgba(255,255,255,.04);
}
@media (max-width: 900px) {
  .cloud-sharing-grid { grid-template-columns: 1fr; }
  .cloud-status-bar { width: 100%; justify-content: flex-start; }
}
@media print {
  .cloud-status-bar, .cloud-sharing-panel { display: none !important; }
}


/* v30: Hebrew-friendly typography + stronger light-mode contrast. */
:root {
  --font-ui: Inter, Alef, "Noto Sans Hebrew", "Segoe UI", Arial, sans-serif;
  --font-heading: Roboto, Inter, Alef, "Noto Sans Hebrew", "Segoe UI", Arial, sans-serif;
  --text: #111827;
  --muted: #4b5563;
  --line: #cfd8e3;
  --primary: #1f3f8f;
  --primary-dark: #172f6a;
  --warning: #7a4300;
  --success: #067647;
  --danger: #b42318;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font-ui);
}

h1,
h2,
h3,
h4,
h5,
h6,
.brand h1,
.topbar h2,
.panel-header h3,
.section-label h4,
.drop-zone h3,
.order-dispatch-editor h4,
.print-section h4,
.print-page-options h4 {
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.015em;
}

body {
  line-height: 1.45;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

label,
.setting-field label,
.checkbox-label,
.data-table th,
.order-matrix th,
.btn {
  font-weight: 700;
}

.data-table td,
.order-matrix td,
.setting-field small,
.panel-header p,
.section-label p,
.topbar p,
.print-note,
.history-mode-note,
.group-note,
.store-source-note {
  color: #374151;
}

.search-input,
.select-input,
.language-select,
.setting-field input,
.setting-field select,
.store-directory-form input,
.store-directory-form select,
.order-dispatch-table select,
.order-dispatch-table input {
  color: #111827;
  border-color: #b8c2cf;
}

.search-input::placeholder,
.setting-field input::placeholder {
  color: #6b7280;
}

.btn.secondary {
  color: #111827;
  border-color: #b8c2cf;
}

.badge.warning,
.shipping-badge.driver,
.unmapped-badge {
  color: #5f3400;
}

@media screen {
  body[data-theme="light"] {
    --text: #111827;
    --muted: #475467;
    --line: #cfd8e3;
    --primary: #111827;
    --primary-dark: #000000;
  }

  body[data-theme="light"] .data-table th,
  body[data-theme="light"] .order-matrix th {
    color: #263142 !important;
    background: #eef2f7 !important;
  }

  body[data-theme="light"] .data-table td,
  body[data-theme="light"] .order-matrix td {
    color: #111827 !important;
  }

  body[data-theme="light"] .topbar p,
  body[data-theme="light"] .panel-header p,
  body[data-theme="light"] .section-label p,
  body[data-theme="light"] .setting-field small,
  body[data-theme="light"] .print-note,
  body[data-theme="light"] .history-mode-note,
  body[data-theme="light"] .group-note,
  body[data-theme="light"] .store-source-note,
  body[data-theme="light"] .db-summary span,
  body[data-theme="light"] .kpi-card small,
  body[data-theme="light"] .kpi-card span,
  body[data-theme="light"] .mini-kpi span {
    color: #374151 !important;
  }

  body[data-theme="light"] .search-input,
  body[data-theme="light"] .select-input,
  body[data-theme="light"] .language-select,
  body[data-theme="light"] .setting-field input,
  body[data-theme="light"] .setting-field select,
  body[data-theme="light"] .store-directory-form input,
  body[data-theme="light"] .store-directory-form select,
  body[data-theme="light"] .order-dispatch-table select,
  body[data-theme="light"] .order-dispatch-table input {
    color: #111827 !important;
    border-color: #b8c2cf !important;
  }
}


body[data-theme="dark"] .priority-badge.urgency-critical { color: #fecaca; background: rgba(153, 27, 27, 0.35); border-color: rgba(248, 113, 113, 0.55); }
body[data-theme="dark"] .priority-badge.urgency-high { color: #fed7aa; background: rgba(154, 52, 18, 0.35); border-color: rgba(251, 146, 60, 0.55); }
body[data-theme="dark"] .priority-badge.urgency-medium { color: #fde68a; background: rgba(133, 77, 14, 0.35); border-color: rgba(250, 204, 21, 0.5); }
body[data-theme="dark"] .priority-badge.urgency-low { color: #bae6fd; background: rgba(7, 89, 133, 0.35); border-color: rgba(56, 189, 248, 0.5); }

/* v38: readability/accessibility cleanup — compact navigation, clearer fields, calmer hierarchy. */
@media screen {
  :root {
    --focus-ring: rgba(37, 99, 235, 0.28);
  }

  .app-shell {
    grid-template-columns: 248px minmax(0, 1fr);
  }

  .sidebar {
    padding: 18px 16px;
  }

  .brand {
    gap: 11px;
    margin-bottom: 18px;
  }

  .brand-mark {
    width: 38px;
    height: 38px;
    font-size: 20px;
    border-radius: 12px;
  }

  .brand h1 {
    font-size: 16px;
    line-height: 1.18;
    font-weight: 750;
  }

  .brand p {
    font-size: 12px;
    margin-top: 3px;
  }

  .nav {
    gap: 5px;
  }

  .nav-item {
    min-height: 38px;
    padding: 8px 11px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 650;
    letter-spacing: 0;
  }

  .sidebar-card {
    margin-top: 16px;
    padding: 12px;
    border-radius: 13px;
  }

  .main {
    padding: 22px 26px 30px;
  }

  .topbar {
    margin-bottom: 18px;
  }

  .topbar h2 {
    font-size: clamp(26px, 2.5vw, 36px);
    font-weight: 760;
    letter-spacing: -0.035em;
  }

  .panel {
    padding: 18px;
    border-radius: 18px;
  }

  .panel-header {
    margin-bottom: 13px;
  }

  .panel-header h3 {
    font-size: 18px;
    font-weight: 730;
  }

  .section-label h4,
  .print-section h4,
  .order-dispatch-editor h4,
  .print-page-options h4 {
    font-weight: 720;
  }

  .panel-header p,
  .section-label p,
  .setting-field small,
  .print-note,
  .history-mode-note,
  .group-note,
  .store-source-note,
  .cloud-note {
    font-size: 13px;
    line-height: 1.42;
  }

  .kpi-grid,
  .split-grid,
  .report-grid,
  .settings-grid,
  .mini-kpi-grid,
  .print-summary-grid {
    gap: 12px;
  }

  .kpi-card,
  .mini-kpi,
  .report-card,
  .print-kpi {
    border-radius: 16px;
  }

  .kpi-card {
    padding: 15px;
  }

  .kpi-card strong {
    font-size: 26px;
    font-weight: 760;
  }

  .mini-kpi strong,
  .print-kpi strong,
  .db-summary strong {
    font-weight: 750;
  }

  label,
  .setting-field span,
  .setting-field label,
  .checkbox-label,
  .print-page-option,
  .group-flags label {
    font-weight: 620;
  }

  .btn {
    min-height: 36px;
    padding: 7px 13px;
    font-size: 13.5px;
    font-weight: 650;
    letter-spacing: 0;
    box-shadow: none;
  }

  .btn:hover:not(:disabled) {
    transform: none;
  }

  .language-select,
  .search-input,
  .select-input,
  .setting-field input,
  .setting-field select,
  .store-directory-form input,
  .store-directory-form select,
  .order-dispatch-table select,
  .order-dispatch-table input {
    min-height: 38px;
    padding: 8px 11px;
    border-radius: 10px;
    font-size: 14px;
  }

  .setting-field {
    padding: 12px;
    border-radius: 12px;
    gap: 6px;
  }

  .table-scroll {
    border-radius: 12px;
  }

  .data-table {
    font-size: 13.5px;
  }

  .data-table th,
  .data-table td {
    padding: 8px 10px;
  }

  .data-table th {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .025em;
  }

  .data-table.compact th,
  .data-table.compact td {
    padding: 6px 8px;
  }

  .badge,
  .shipping-badge,
  .priority-badge,
  .unmapped-badge {
    font-weight: 700;
  }

  .cloud-status-bar {
    padding: 7px 10px;
    font-size: 12.5px;
  }

  button:focus-visible,
  input:focus-visible,
  select:focus-visible,
  textarea:focus-visible,
  .nav-item:focus-visible {
    outline: 3px solid var(--focus-ring) !important;
    outline-offset: 2px;
  }

  body[data-theme="light"] {
    --bg: #f6f7f9;
    --panel: #ffffff;
    --text: #111827;
    --muted: #3f4a5a;
    --line: #c9d2df;
    --focus-ring: rgba(17, 24, 39, 0.24);
  }

  body[data-theme="light"] .sidebar {
    background: #ffffff;
    border-right: 1px solid #d7dee8;
  }

  body[data-theme="light"] .nav-item {
    color: #374151;
  }

  body[data-theme="light"] .nav-item:hover {
    background: #eef2f7;
    color: #111827;
  }

  body[data-theme="light"] .nav-item.active {
    background: #111827;
    color: #ffffff;
    box-shadow: none;
  }

  body[data-theme="light"] .panel,
  body[data-theme="light"] .kpi-card,
  body[data-theme="light"] .mini-kpi,
  body[data-theme="light"] .report-card,
  body[data-theme="light"] .setting-field,
  body[data-theme="light"] .print-kpi,
  body[data-theme="light"] .order-dispatch-editor,
  body[data-theme="light"] .print-page-options,
  body[data-theme="light"] .cloud-sharing-panel,
  body[data-theme="light"] .cloud-status-box,
  body[data-theme="light"] .db-summary div,
  body[data-theme="light"] .file-row,
  body[data-theme="light"] .log-line,
  body[data-theme="light"] .empty-state {
    border-color: #d7dee8;
    box-shadow: 0 8px 22px rgba(17, 24, 39, 0.055);
  }

  body[data-theme="light"] .setting-field,
  body[data-theme="light"] .order-dispatch-editor,
  body[data-theme="light"] .print-page-options,
  body[data-theme="light"] .cloud-status-box,
  body[data-theme="light"] .print-kpi,
  body[data-theme="light"] .db-summary div {
    background: #f8fafc !important;
  }

  body[data-theme="light"] .language-select,
  body[data-theme="light"] .search-input,
  body[data-theme="light"] .select-input,
  body[data-theme="light"] .setting-field input,
  body[data-theme="light"] .setting-field select,
  body[data-theme="light"] .store-directory-form input,
  body[data-theme="light"] .store-directory-form select,
  body[data-theme="light"] .order-dispatch-table select,
  body[data-theme="light"] .order-dispatch-table input {
    background: #ffffff !important;
    border-color: #9eaabc !important;
    color: #111827 !important;
  }

  body[data-theme="light"] .language-select:hover,
  body[data-theme="light"] .search-input:hover,
  body[data-theme="light"] .select-input:hover,
  body[data-theme="light"] .setting-field input:hover,
  body[data-theme="light"] .setting-field select:hover {
    border-color: #6b778a !important;
  }

  body[data-theme="light"] .data-table th {
    background: #e8edf4 !important;
    color: #1f2937 !important;
  }

  body[data-theme="light"] .data-table td,
  body[data-theme="light"] .order-matrix td {
    color: #111827 !important;
  }

  body[data-theme="light"] .data-table tr:hover td {
    background: #f1f5f9 !important;
  }

  body[data-theme="light"] .alert,
  body[data-theme="light"] .stock-warning-note {
    background: #fff7d6 !important;
    color: #5f3b00 !important;
    border-color: #d6a10f !important;
  }

  body[data-theme="dark"] {
    --text: #f3f4f6;
    --muted: #c3cad4;
    --line: rgba(255, 255, 255, 0.17);
    --focus-ring: rgba(255, 255, 255, 0.28);
  }

  body[data-theme="dark"] .panel,
  body[data-theme="dark"] .kpi-card,
  body[data-theme="dark"] .mini-kpi,
  body[data-theme="dark"] .report-card,
  body[data-theme="dark"] .setting-field,
  body[data-theme="dark"] .print-kpi,
  body[data-theme="dark"] .order-dispatch-editor,
  body[data-theme="dark"] .print-page-options,
  body[data-theme="dark"] .cloud-sharing-panel,
  body[data-theme="dark"] .cloud-status-box,
  body[data-theme="dark"] .db-summary div,
  body[data-theme="dark"] .file-row,
  body[data-theme="dark"] .log-line,
  body[data-theme="dark"] .empty-state {
    border-color: rgba(255,255,255,.16);
    background: rgba(255,255,255,.065);
  }

  body[data-theme="dark"] .panel-header p,
  body[data-theme="dark"] .section-label p,
  body[data-theme="dark"] .setting-field small,
  body[data-theme="dark"] .topbar p,
  body[data-theme="dark"] .print-note,
  body[data-theme="dark"] .history-mode-note,
  body[data-theme="dark"] .group-note,
  body[data-theme="dark"] .store-source-note,
  body[data-theme="dark"] .cloud-note,
  body[data-theme="dark"] .kpi-card span,
  body[data-theme="dark"] .kpi-card small,
  body[data-theme="dark"] .mini-kpi span,
  body[data-theme="dark"] .db-summary span {
    color: #c3cad4 !important;
  }

  body[data-theme="dark"] .language-select,
  body[data-theme="dark"] .search-input,
  body[data-theme="dark"] .select-input,
  body[data-theme="dark"] .setting-field input,
  body[data-theme="dark"] .setting-field select,
  body[data-theme="dark"] .store-directory-form input,
  body[data-theme="dark"] .store-directory-form select,
  body[data-theme="dark"] .order-dispatch-table select,
  body[data-theme="dark"] .order-dispatch-table input {
    background: rgba(255,255,255,.10) !important;
    border-color: rgba(255,255,255,.24) !important;
    color: #f9fafb !important;
  }

  body[data-theme="dark"] .language-select:hover,
  body[data-theme="dark"] .search-input:hover,
  body[data-theme="dark"] .select-input:hover,
  body[data-theme="dark"] .setting-field input:hover,
  body[data-theme="dark"] .setting-field select:hover {
    border-color: rgba(255,255,255,.38) !important;
  }

  body[data-theme="dark"] .data-table th {
    background: rgba(255,255,255,.13) !important;
    color: #e5e7eb !important;
  }

  body[data-theme="dark"] .data-table td,
  body[data-theme="dark"] .order-matrix td {
    color: #f3f4f6 !important;
  }

  body[data-theme="dark"] .data-table tr:hover td {
    background: rgba(255,255,255,.08) !important;
  }

  body[data-theme="dark"] .btn.secondary {
    color: #f9fafb;
    border-color: rgba(255,255,255,.24);
  }
}

@media (max-width: 1180px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { padding: 14px; }
  .nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .nav-item { text-align: center; }
}

@media (max-width: 720px) {
  .main { padding: 14px; }
  .topbar h2 { font-size: 25px; }
  .panel { padding: 14px; }
  .nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v39: compact tables and shorter visible headers.
   Full meanings stay in title/aria-label attributes for primary table headers. */
.fit-table {
  table-layout: auto;
  font-size: 13px;
}

.fit-table th,
.fit-table td {
  padding: 5px 7px !important;
  vertical-align: top;
}

.fit-table th {
  white-space: normal !important;
  line-height: 1.12;
  font-size: 10px !important;
  letter-spacing: .018em !important;
  text-align: center;
  min-width: 44px;
}

.fit-table td {
  line-height: 1.18;
}

.fit-table td.number {
  text-align: right;
  min-width: 52px;
}

.fit-table .description-cell {
  max-width: 280px;
  white-space: normal !important;
  line-height: 1.2;
}

.fit-table .location-cell {
  max-width: 138px;
  white-space: normal !important;
  line-height: 1.18;
}

.fit-table .recommendation-cell,
.fit-table .reason-cell {
  max-width: 220px;
  white-space: normal !important;
  line-height: 1.2;
}

.fit-table .recommendation-cell small,
.fit-table td small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.1;
}

.category-fit-table th:nth-child(1),
.category-fit-table td:nth-child(1) { min-width: 54px; }
.category-fit-table th:nth-child(2),
.category-fit-table td:nth-child(2) { min-width: 92px; }
.category-fit-table th:nth-child(3),
.category-fit-table td:nth-child(3) { min-width: 180px; }
.category-fit-table th:nth-child(4),
.category-fit-table th:nth-child(5),
.category-fit-table th:nth-child(6),
.category-fit-table th:nth-child(7),
.category-fit-table th:nth-child(8),
.category-fit-table td:nth-child(4),
.category-fit-table td:nth-child(5),
.category-fit-table td:nth-child(6),
.category-fit-table td:nth-child(7),
.category-fit-table td:nth-child(8) { min-width: 58px; }
.category-fit-table th:nth-child(9),
.category-fit-table td:nth-child(9) { min-width: 82px; }
.category-fit-table th:nth-child(10),
.category-fit-table td:nth-child(10) { min-width: 116px; }
.category-fit-table th:nth-child(11),
.category-fit-table td:nth-child(11) { min-width: 52px; }

.replenishment-fit-table th:nth-child(1),
.replenishment-fit-table td:nth-child(1) { min-width: 74px; }
.replenishment-fit-table th:nth-child(2),
.replenishment-fit-table td:nth-child(2) { min-width: 54px; }
.replenishment-fit-table th:nth-child(3),
.replenishment-fit-table td:nth-child(3) { min-width: 180px; }
.replenishment-fit-table th:nth-child(4),
.replenishment-fit-table th:nth-child(5),
.replenishment-fit-table th:nth-child(6),
.replenishment-fit-table th:nth-child(7),
.replenishment-fit-table th:nth-child(8),
.replenishment-fit-table td:nth-child(4),
.replenishment-fit-table td:nth-child(5),
.replenishment-fit-table td:nth-child(6),
.replenishment-fit-table td:nth-child(7),
.replenishment-fit-table td:nth-child(8) { min-width: 60px; }
.replenishment-fit-table th:nth-child(9),
.replenishment-fit-table td:nth-child(9) { min-width: 180px; }

@media print {
  .fit-table th,
  .fit-table td {
    padding: 3px 5px !important;
    font-size: 10px !important;
  }
  .fit-table th {
    font-size: 9px !important;
    white-space: normal !important;
  }
  .fit-table .description-cell,
  .fit-table .recommendation-cell,
  .fit-table .reason-cell {
    max-width: 180px;
  }
}

/* v42: cloud sync state in sidebar data status */
#sidebarSaveState[data-state="pending"],
#sidebarSaveState[data-state="queued"] {
  color: #fbbf24;
}
#sidebarSaveState[data-state="saving"] {
  color: #fde68a;
}
#sidebarSaveState[data-state="saved"] {
  color: #86efac;
}
#sidebarSaveState[data-state="failed"] {
  color: #fca5a5;
}
body[data-theme="light"] #sidebarSaveState[data-state="pending"],
body[data-theme="light"] #sidebarSaveState[data-state="queued"] {
  color: #a16207;
}
body[data-theme="light"] #sidebarSaveState[data-state="saving"] {
  color: #854d0e;
}
body[data-theme="light"] #sidebarSaveState[data-state="saved"] {
  color: #166534;
}
body[data-theme="light"] #sidebarSaveState[data-state="failed"] {
  color: #b91c1c;
}

/* v43: data freshness state in sidebar status. */
#sidebarFreshness[data-state="ok"] {
  color: #86efac;
}
#sidebarFreshness[data-state="warning"] {
  color: #fbbf24;
}
#sidebarFreshness[data-state="missing"] {
  color: #cbd5e1;
}
body[data-theme="light"] #sidebarFreshness[data-state="ok"] {
  color: #166534;
}
body[data-theme="light"] #sidebarFreshness[data-state="warning"] {
  color: #a16207;
}
body[data-theme="light"] #sidebarFreshness[data-state="missing"] {
  color: #475569;
}

/* v45: Activity Log page. */
.activity-log-content.table-wrap {
  margin-top: 12px;
}
.activity-log-table th,
.activity-log-table td {
  vertical-align: top;
}
.activity-log-table td:first-child {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.activity-log-table td:nth-child(2) {
  max-width: 220px;
  word-break: break-word;
}
.activity-log-table td:nth-child(5) {
  min-width: 280px;
}

/* v47: Activity Log filtering toolbar. */
.activity-log-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface) 74%, var(--field-bg) 26%);
}
.activity-log-toolbar .small-field {
  min-width: 150px;
  margin: 0;
}
.activity-log-toolbar input,
.activity-log-toolbar select {
  min-height: 36px;
}
.activity-log-toolbar .small-status {
  margin-left: auto;
  padding-bottom: 8px;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .activity-log-toolbar .small-field,
  .activity-log-toolbar .btn {
    width: 100%;
  }
  .activity-log-toolbar .small-status {
    margin-left: 0;
    padding-bottom: 0;
  }
}

/* v51: allow long Demand History lists to wrap instead of forcing table overflow. */
#historyTable {
  table-layout: fixed;
  width: 100%;
}

#historyTable .wrap-cell,
#historyTable .history-list-cell {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.35;
  max-width: 34rem;
}

#historyTable th,
#historyTable td {
  vertical-align: top;
}

#historyTable td.number {
  white-space: nowrap;
}

/* v53: cloud sharing workflow simplification. */
.cloud-workflow-card {
  margin-top: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(37, 99, 235, .045);
}
.cloud-workflow-card > strong {
  display: block;
  margin-bottom: 4px;
  color: var(--text);
}
.cloud-workflow-card p {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.cloud-auth-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.cloud-main-actions {
  align-items: center;
}
.cloud-details {
  margin-top: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,.55);
  padding: 0;
}
.cloud-details summary {
  cursor: pointer;
  padding: 10px 12px;
  font-weight: 700;
  color: var(--text);
}
.cloud-details[open] {
  padding-bottom: 12px;
}
.cloud-details[open] > .cloud-sharing-grid,
.cloud-details[open] > .cloud-actions,
.cloud-details[open] > .cloud-note {
  margin-left: 12px;
  margin-right: 12px;
}
.cloud-recovery-details {
  border-color: rgba(220, 38, 38, .25);
}
body[data-theme="dark"] .cloud-workflow-card {
  background: rgba(96, 165, 250, .08);
}
body[data-theme="dark"] .cloud-details {
  background: rgba(255,255,255,.035);
}
@media (max-width: 900px) {
  .cloud-auth-grid { grid-template-columns: 1fr; }
}

/* v54: Dashboard cloud-empty recovery actions. */
.dashboard-cloud-empty {
  display: grid;
  gap: 0.55rem;
  max-width: 42rem;
}
.dashboard-cloud-empty p {
  margin: 0;
}
.inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.btn.small {
  min-height: 2rem;
  padding: 0.35rem 0.65rem;
  font-size: 0.82rem;
}

/* v61: light-theme contrast fixes for muted dynamic text and ABC badges.
   CSS-only change. No data, cloud, import, or render logic changed. */
body[data-theme="light"] {
  --muted: #334155;
}

body[data-theme="light"] .panel-header p,
body[data-theme="light"] .section-label p,
body[data-theme="light"] .setting-field small,
body[data-theme="light"] .topbar p,
body[data-theme="light"] .print-note,
body[data-theme="light"] .history-mode-note,
body[data-theme="light"] .group-note,
body[data-theme="light"] .store-source-note,
body[data-theme="light"] .cloud-note,
body[data-theme="light"] .cloud-status-bar,
body[data-theme="light"] .cloud-status-box,
body[data-theme="light"] .cloud-workflow-card p,
body[data-theme="light"] .kpi-card span,
body[data-theme="light"] .kpi-card small,
body[data-theme="light"] .mini-kpi span,
body[data-theme="light"] .db-summary span,
body[data-theme="light"] .file-row span,
body[data-theme="light"] .import-progress,
body[data-theme="light"] .empty-state,
body[data-theme="light"] .alert-item p,
body[data-theme="light"] .report-card span,
body[data-theme="light"] .store-source-note,
body[data-theme="light"] .activity-log-toolbar .small-status {
  color: #334155 !important;
}

body[data-theme="light"] .cloud-status-box {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
}

body[data-theme="light"] .alert-item {
  background: #fff7ed !important;
  border-color: #fdba74 !important;
}
body[data-theme="light"] .alert-item strong {
  color: #9a3412 !important;
}
body[data-theme="light"] .alert-item p {
  color: #334155 !important;
}

body[data-theme="light"] .badge.abc-a {
  color: #0f172a !important;
  background: #bfdbfe !important;
  border: 1px solid #60a5fa !important;
  font-weight: 900 !important;
}
body[data-theme="light"] .badge.abc-b {
  color: #312e81 !important;
  background: #ddd6fe !important;
  border: 1px solid #a78bfa !important;
  font-weight: 900 !important;
}
body[data-theme="light"] .badge.abc-c {
  color: #111827 !important;
  background: #e5e7eb !important;
  border: 1px solid #9ca3af !important;
  font-weight: 900 !important;
}

body[data-theme="light"] .data-table td.description-cell,
body[data-theme="light"] .recommendation-cell small,
body[data-theme="light"] .data-table small,
body[data-theme="light"] td small {
  color: #334155 !important;
}


/* v62: stronger light-theme readability for sidebar status and muted detail text. */
body[data-theme="light"] .sidebar-card p,
body[data-theme="light"] .sidebar-status-row,
body[data-theme="light"] .sidebar-status-row span,
body[data-theme="light"] .sidebar-status-row span:first-child,
body[data-theme="light"] .sidebar-status-row strong,
body[data-theme="light"] .sidebar-status-cloud strong,
body[data-theme="light"] #sidebarCloudStatusText,
body[data-theme="light"] #sidebarSaveStatusText,
body[data-theme="light"] #sidebarLastSyncText,
body[data-theme="light"] #sidebarFreshnessText,
body[data-theme="light"] #sidebarInventoryText,
body[data-theme="light"] #sidebarOrdersText,
body[data-theme="light"] #sidebarAlertsText {
  color: #898989 !important;
}

body[data-theme="light"] .sidebar-status-card {
  background: #ffffff !important;
  border-color: #d7dee8 !important;
}

body[data-theme="light"] .alert-item p,
body[data-theme="light"] .recommendation-cell small,
body[data-theme="light"] .data-table td.description-cell,
body[data-theme="light"] .data-table small,
body[data-theme="light"] td small,
body[data-theme="light"] .small-status,
body[data-theme="light"] .muted-label {
  color: #898989 !important;
}

/* v65: isolated barcode tools pages. */
.barcode-tool-panel textarea {
  width: 100%;
  min-height: 130px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
  color: var(--text);
  background: var(--panel);
}
.barcode-tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 16px;
}
.barcode-wide-field { grid-column: 1 / -1; }
.barcode-tool-actions { margin-top: 16px; }
.barcode-preview-card {
  margin-top: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  padding: 24px;
  text-align: center;
  overflow-x: auto;
}
.barcode-preview-title {
  color: #111827;
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 18px;
}
.barcode-entry-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
  gap: 16px;
  align-items: end;
}
.barcode-entry-actions {
  display: flex;
  gap: 10px;
  align-items: end;
  padding-bottom: 2px;
}
.barcode-table-wrap {
  margin-top: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: var(--panel);
}
.barcode-table-wrap table {
  width: 100%;
  border-collapse: collapse;
}
.barcode-table-wrap th,
.barcode-table-wrap td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}
.barcode-table-wrap th { color: var(--muted); font-size: 12px; }
.barcode-table-wrap tr:last-child td { border-bottom: 0; }
.barcode-table-wrap .right,
.right { text-align: right; }
.split-actions {
  justify-content: space-between;
  align-items: center;
}
.mini-btn { padding: 6px 10px; border-radius: 10px; font-size: 12px; }
.danger-text { color: var(--danger) !important; }
body[data-theme="dark"] .barcode-preview-card { background: #ffffff; }
@media (max-width: 900px) {
  .barcode-tool-grid,
  .barcode-entry-grid { grid-template-columns: 1fr; }
  .barcode-entry-actions { justify-content: flex-start; }
  .split-actions { align-items: flex-start; gap: 12px; }
}

/* v67: Odafim Planner identity polish — logo, blue/navy palette, theme toggle */
@media screen {
  :root {
    --op-navy-950: #06111f;
    --op-navy-900: #0b1628;
    --op-navy-800: #10213a;
    --op-blue: #2f7df6;
    --op-blue-dark: #1d5fd3;
    --op-ink: #0f172a;
  }

  body {
    background:
      radial-gradient(circle at 18% -10%, rgba(47,125,246,.26), transparent 28%),
      radial-gradient(circle at 88% 6%, rgba(96,165,250,.14), transparent 26%),
      linear-gradient(135deg, #04101f 0%, #07111f 48%, #0c1626 100%);
  }

  body::before {
    background:
      linear-gradient(rgba(96,165,250,.035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(96,165,250,.025) 1px, transparent 1px);
  }

  .sidebar {
    background: linear-gradient(180deg, rgba(6,17,31,.92), rgba(8,17,31,.84));
    border-right-color: rgba(96,165,250,.14);
  }

  .brand { gap: 13px; }
  .brand-mark {
    width: 52px;
    height: 52px;
    padding-bottom: 9px;
    border-radius: 16px;
    background:
      radial-gradient(circle at 35% 18%, rgba(96,165,250,.26), transparent 35%),
      linear-gradient(180deg, #10294d 0%, #06111f 100%) !important;
    color: #ffffff !important;
    border: 1px solid rgba(147,197,253,.34) !important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.12),
      inset 0 -1px 0 rgba(0,0,0,.22),
      0 14px 30px rgba(2,6,23,.28) !important;
    font-size: 19px;
    letter-spacing: -.075em;
    text-shadow: 0 1px 14px rgba(255,255,255,.18);
  }
  .brand-mark::after {
    left: 13px;
    right: 13px;
    bottom: 10px;
    height: 4px;
    background: linear-gradient(90deg, #60a5fa, #2f7df6) !important;
    box-shadow: 0 0 12px rgba(47,125,246,.34);
  }
  .brand h1 { letter-spacing: -0.045em; }
  .brand h1::first-letter { color: inherit; }
  .brand p { color: #93a4ba; }

  .nav-item.active {
    background: linear-gradient(135deg, #2f7df6, #1d5fd3) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 30px rgba(47,125,246,.25) !important;
  }
  .nav-item:hover { background: rgba(96,165,250,.12); }

  .btn.primary {
    background: linear-gradient(135deg, #2f7df6, #1d5fd3) !important;
    color: #ffffff !important;
    border-color: rgba(147,197,253,.35) !important;
    box-shadow: 0 14px 28px rgba(47,125,246,.22) !important;
  }
  .btn.primary:hover:not(:disabled) {
    background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
    box-shadow: 0 18px 38px rgba(47,125,246,.30) !important;
  }
  .btn.danger, .icon-btn {
    border-color: rgba(248,113,113,.42) !important;
  }

  .trend-fill { background: linear-gradient(90deg, #2f7df6, #60a5fa) !important; }
  .topbar h2 { letter-spacing: -0.06em; }

  .theme-toggle {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 6px 12px 6px 7px;
    border-radius: 999px;
    border: 1px solid rgba(147,197,253,.18);
    background: rgba(255,255,255,.075);
    color: #e5eefc;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
    font-weight: 800;
    letter-spacing: -.01em;
  }
  .theme-toggle:hover {
    background: rgba(96,165,250,.13);
    border-color: rgba(147,197,253,.32);
  }
  .theme-toggle-track {
    width: 44px;
    height: 24px;
    border-radius: 999px;
    position: relative;
    display: inline-block;
    background: linear-gradient(180deg, #172554, #07111f);
    border: 1px solid rgba(147,197,253,.24);
    box-shadow: inset 0 1px 4px rgba(0,0,0,.35);
  }
  .theme-toggle-knob {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    background: #f8fafc;
    box-shadow: 0 3px 10px rgba(0,0,0,.35);
    transition: transform .18s ease, background .18s ease;
  }
  .theme-toggle[data-theme="dark"] .theme-toggle-knob { transform: translateX(20px); background: #60a5fa; }
  .theme-toggle-text { min-width: 38px; text-align: left; font-size: 13px; }

  body[data-theme="light"] {
    --primary: #2f7df6;
    --primary-dark: #1d5fd3;
    --accent: #2f7df6;
    background: linear-gradient(180deg, #ffffff 0%, #f4f7fb 42%, #edf3fb 100%) !important;
  }
  body[data-theme="light"] .sidebar {
    background: rgba(255,255,255,.92) !important;
    border-right-color: #dbe7f7 !important;
    box-shadow: 1px 0 24px rgba(15,23,42,.06) !important;
  }
  body[data-theme="light"] .brand-mark {
    background:
      radial-gradient(circle at 35% 18%, rgba(96,165,250,.22), transparent 35%),
      linear-gradient(180deg, #17437d 0%, #0f172a 100%) !important;
    color: #ffffff !important;
    border-color: rgba(29,95,211,.30) !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.18) !important;
  }
  body[data-theme="light"] .brand p { color: #667085 !important; }
  body[data-theme="light"] .nav-item.active {
    background: linear-gradient(135deg, #2f7df6, #1d5fd3) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 26px rgba(47,125,246,.22) !important;
  }
  body[data-theme="light"] .nav-item:hover { background: #eef5ff !important; color: #0f172a !important; }
  body[data-theme="light"] .btn.primary {
    background: linear-gradient(135deg, #2f7df6, #1d5fd3) !important;
    color: #ffffff !important;
    border-color: #2f7df6 !important;
    box-shadow: 0 12px 24px rgba(47,125,246,.18) !important;
  }
  body[data-theme="light"] .trend-fill { background: linear-gradient(90deg, #1d5fd3, #60a5fa) !important; }
  body[data-theme="light"] .theme-toggle {
    background: #ffffff;
    color: #0f172a;
    border-color: #d0ddec;
    box-shadow: 0 8px 20px rgba(15,23,42,.06);
  }
  body[data-theme="light"] .theme-toggle:hover { background: #f3f8ff; border-color: #b7cff2; }
  body[data-theme="light"] .theme-toggle-track {
    background: #e7eef8;
    border-color: #cbd8ea;
    box-shadow: inset 0 1px 3px rgba(15,23,42,.12);
  }
  body[data-theme="light"] .theme-toggle-knob { background: #2f7df6; }
}

/* v69: clearer sidebar navigation states and square OP mark. Visual-only cleanup. */
@media screen {
  .brand-mark {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 10px !important;
    padding: 0 0 6px 0 !important;
    flex: 0 0 42px !important;
    box-shadow: none !important;
  }
  .brand-mark::after {
    left: 11px !important;
    right: 11px !important;
    bottom: 8px !important;
    height: 3px !important;
    opacity: .95;
  }

  .nav-item {
    position: relative;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color .14s ease, border-color .14s ease, color .14s ease !important;
  }
  .nav-item:hover,
  .nav-item:active,
  .nav-item.active:hover,
  .nav-item.active:active {
    transform: none !important;
    box-shadow: none !important;
  }

  .sidebar .nav-item {
    background: transparent !important;
    color: #cbd5e1 !important;
  }
  .sidebar .nav-item:hover {
    background: rgba(59, 130, 246, .12) !important;
    border-color: rgba(147, 197, 253, .20) !important;
    color: #ffffff !important;
  }
  .sidebar .nav-item.active {
    background: #2563eb !important;
    border-color: #3b82f6 !important;
    color: #ffffff !important;
    font-weight: 760 !important;
  }
  .sidebar .nav-item.active:hover {
    background: #1d4ed8 !important;
    border-color: #60a5fa !important;
    color: #ffffff !important;
  }

  body[data-theme="light"] .sidebar {
    box-shadow: none !important;
  }
  body[data-theme="light"] .brand-mark {
    background: linear-gradient(180deg, #172554 0%, #0f172a 100%) !important;
    border-color: rgba(37, 99, 235, .35) !important;
    color: #ffffff !important;
  }
  body[data-theme="light"] .sidebar .nav-item {
    background: transparent !important;
    color: #334155 !important;
  }
  body[data-theme="light"] .sidebar .nav-item:hover {
    background: #eef4ff !important;
    border-color: #c7d7fe !important;
    color: #1e3a8a !important;
  }
  body[data-theme="light"] .sidebar .nav-item.active {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }
  body[data-theme="light"] .sidebar .nav-item.active:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    color: #ffffff !important;
  }

  body[data-theme="dark"] .sidebar {
    box-shadow: none !important;
  }
  body[data-theme="dark"] .sidebar .nav-item:hover {
    background: rgba(96, 165, 250, .13) !important;
    border-color: rgba(147, 197, 253, .24) !important;
  }
  body[data-theme="dark"] .sidebar .nav-item.active {
    background: #2563eb !important;
    border-color: #3b82f6 !important;
  }
  body[data-theme="dark"] .sidebar .nav-item.active:hover {
    background: #1d4ed8 !important;
    border-color: #60a5fa !important;
  }
}

/* v70: tighter interface density. Visual-only spacing pass. */
@media screen {
  :root {
    --radius: 14px;
    --shadow: 0 6px 18px rgba(15, 23, 42, 0.055);
  }

  .app-shell {
    grid-template-columns: 264px 1fr;
  }
  .sidebar {
    padding: 18px 18px;
  }
  .brand {
    gap: 11px;
    margin-bottom: 18px;
  }
  .brand-mark {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    flex-basis: 40px !important;
  }
  .brand h1 {
    font-size: 17px;
  }
  .brand p {
    margin-top: 3px;
    font-size: 11.5px;
  }
  .nav {
    gap: 5px;
  }
  .nav-item {
    padding: 9px 11px !important;
    border-radius: 10px !important;
    font-size: 14px;
  }
  .sidebar-card {
    margin-top: 16px;
    padding: 12px;
    border-radius: 13px;
  }
  .sidebar-status-card {
    padding: 11px 12px;
  }
  .sidebar-status-list {
    gap: 7px;
  }
  .sidebar-status-row {
    gap: 9px;
    font-size: 11.5px;
  }
  .sidebar-status-row strong {
    font-size: 11.5px;
    max-width: 136px;
  }

  .main {
    padding: 20px;
  }
  .topbar {
    gap: 14px;
    margin-bottom: 16px;
  }
  .topbar h2 {
    font-size: 26px;
    line-height: 1.1;
  }
  .topbar p {
    margin-top: 4px;
    font-size: 13.5px;
  }
  .topbar-actions {
    gap: 8px;
  }
  .language-select {
    padding: 8px 10px;
    border-radius: 10px;
    min-width: 138px;
  }
  .theme-toggle {
    padding: 7px 9px !important;
    border-radius: 999px !important;
  }

  .btn {
    padding: 8px 11px;
    border-radius: 10px;
    font-size: 13.5px;
  }
  input, select, textarea {
    min-height: 36px;
  }

  .alert {
    padding: 10px 12px;
    border-radius: 12px;
    margin-bottom: 14px;
  }
  .kpi-grid {
    gap: 10px;
    margin-bottom: 14px;
  }
  .kpi-card {
    padding: 14px;
  }
  .kpi-card span, .mini-kpi span {
    font-size: 12px;
    margin-bottom: 5px;
  }
  .kpi-card strong {
    font-size: 26px;
  }

  .split-grid {
    gap: 14px;
  }
  .panel {
    padding: 16px;
    border-radius: 14px;
  }
  .panel-header {
    gap: 12px;
    margin-bottom: 12px;
  }
  .panel-header h3 {
    font-size: 18px;
  }
  .panel-header p {
    margin-top: 3px;
    font-size: 13px;
  }

  .alerts-list {
    gap: 8px;
  }
  .alert-item {
    padding: 10px;
    border-radius: 12px;
  }
  .alert-item p {
    margin-top: 3px;
    font-size: 13px;
  }

  .drop-zone {
    padding: 30px 20px;
    border-radius: 16px;
  }
  .upload-actions,
  .database-actions,
  .order-controls,
  .history-controls {
    gap: 8px;
  }
  .file-row,
  .log-line {
    padding: 8px 10px;
    border-radius: 10px;
  }

  .table-scroll {
    border-radius: 12px;
  }
  .data-table {
    font-size: 13px;
  }
  .data-table th, .data-table td {
    padding: 8px 10px;
  }
  .data-table.compact th, .data-table.compact td {
    padding: 6px 8px;
  }
  .badge,
  .priority-badge,
  .shipping-badge {
    padding: 3px 8px;
    font-size: 11.5px;
  }
  .empty-state {
    padding: 11px 12px;
    border-radius: 10px;
  }
  .mini-kpi-grid {
    gap: 9px;
    margin-bottom: 14px;
  }
  .mini-kpi {
    padding: 11px;
  }
  .top-gap {
    margin-top: 14px;
  }
  .report-grid {
    gap: 10px;
  }
  .report-card {
    padding: 14px;
    border-radius: 13px;
  }
  .settings-grid {
    gap: 10px;
  }
  .setting-field {
    gap: 5px;
    padding: 11px;
    border-radius: 12px;
  }
  .data-management,
  .group-manager,
  .shipping-manager,
  .store-directory-manager {
    margin-top: 14px;
    padding-top: 14px;
  }
  .group-form,
  .store-directory-form {
    gap: 9px;
    margin: 10px 0;
  }
  .db-summary {
    gap: 8px;
  }
  .db-summary div,
  .print-kpi,
  .order-dispatch-editor,
  .pallet-label-preview-card {
    padding: 10px;
    border-radius: 12px;
  }
  .print-summary-grid {
    gap: 9px;
    margin-bottom: 14px;
  }
  .order-dispatch-editor {
    margin-bottom: 14px;
  }

  .barcode-tool,
  .barcode-card,
  .barcode-panel {
    gap: 10px;
  }
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }
  .main {
    padding: 16px;
  }
}

/* v71: keep demand trend dates compact and on one line. */
.trend-row {
  grid-template-columns: minmax(104px, auto) minmax(160px, 1fr) minmax(58px, auto) !important;
  gap: 10px !important;
}
.trend-label {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
}
.trend-value {
  min-width: 48px !important;
}
.trend-value strong {
  font-size: 16px !important;
}
.trend-value small {
  font-size: 10px !important;
}
.trend-list.compact .trend-row {
  grid-template-columns: minmax(100px, auto) minmax(140px, 1fr) minmax(54px, auto) !important;
}
@media (max-width: 720px) {
  .trend-row {
    grid-template-columns: 96px minmax(90px, 1fr) 54px !important;
    gap: 7px !important;
  }
  .trend-label { font-size: 13px !important; }
}

/* v72: barcode tools workflow improvements */
.barcode-tool-layout {
  display: grid;
  grid-template-columns: minmax(320px, 1.35fr) minmax(280px, .75fr);
  gap: 16px;
  align-items: start;
}
.barcode-main-card,
.barcode-side-card,
.barcode-help-card,
.barcode-validation-card,
.barcode-options-box {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--panel) 94%, var(--accent) 6%);
}
.barcode-main-card,
.barcode-side-card {
  padding: 14px;
}
.barcode-side-card {
  display: grid;
  gap: 12px;
}
.compact-options {
  grid-template-columns: 1fr;
  gap: 10px;
}
.compact-field { margin-top: 8px; }
.barcode-options-box {
  padding: 10px 12px;
}
.check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-size: 13px;
  margin: 5px 0;
}
.check-row input { width: auto; }
.stacked-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 0;
}
.barcode-validation-card {
  margin-top: 10px;
  padding: 10px 12px;
}
.barcode-validation-pills,
.barcode-counts-row,
.barcode-status-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.status-pill {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 12px;
  color: var(--muted);
  background: color-mix(in srgb, var(--panel) 88%, var(--accent) 12%);
}
.status-pill strong { color: var(--text); }
.danger-pill { border-color: color-mix(in srgb, var(--danger) 55%, transparent); }
.barcode-validation-detail {
  margin-top: 8px;
  font-size: 12px;
  color: var(--muted);
}
.barcode-help-card {
  margin-top: 10px;
  padding: 0;
  overflow: hidden;
}
.barcode-help-card summary {
  cursor: pointer;
  padding: 10px 12px;
  font-weight: 700;
  color: var(--text);
}
.barcode-help-body {
  padding: 0 12px 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
.barcode-help-body textarea {
  min-height: 86px;
  margin-top: 8px;
}
.barcode-paste-panel { margin: 12px 0; }
.barcode-status-row {
  justify-content: space-between;
  margin-bottom: 12px;
}
.barcode-mode-status {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  border-radius: 999px;
  padding: 6px 12px;
  font-weight: 800;
  font-size: 13px;
  border: 1px solid var(--line);
}
.barcode-mode-status.ready {
  color: #1d4ed8;
  background: color-mix(in srgb, #3b82f6 12%, var(--panel));
  border-color: color-mix(in srgb, #3b82f6 28%, var(--line));
}
.barcode-mode-status.waiting {
  color: #a16207;
  background: color-mix(in srgb, #f59e0b 13%, var(--panel));
  border-color: color-mix(in srgb, #f59e0b 32%, var(--line));
}
.barcode-mode-status.saved {
  color: #047857;
  background: color-mix(in srgb, #10b981 12%, var(--panel));
  border-color: color-mix(in srgb, #10b981 32%, var(--line));
}
.barcode-mode-status.error {
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 10%, var(--panel));
  border-color: color-mix(in srgb, var(--danger) 35%, var(--line));
}
.scanner-grid {
  grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) auto;
}
.scanner-field input {
  min-height: 46px;
  font-size: 17px;
  font-weight: 650;
}
.recent-category-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.recent-category-buttons {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.recent-category-btn {
  border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line));
  background: color-mix(in srgb, var(--accent) 10%, var(--panel));
  color: var(--text);
  border-radius: 999px;
  padding: 6px 11px;
  cursor: pointer;
  font-weight: 800;
  font-size: 12px;
}
.recent-category-btn:hover { background: color-mix(in srgb, var(--accent) 18%, var(--panel)); }
.barcode-counts-row {
  margin: 12px 0;
}
.barcode-row-actions {
  white-space: nowrap;
}
.barcode-row-actions .mini-btn + .mini-btn { margin-left: 6px; }
body[data-theme="light"] .barcode-main-card,
body[data-theme="light"] .barcode-side-card,
body[data-theme="light"] .barcode-help-card,
body[data-theme="light"] .barcode-validation-card,
body[data-theme="light"] .barcode-options-box {
  background: #ffffff;
}
body[data-theme="light"] .barcode-mode-status.ready { color: #1e40af; }
body[data-theme="light"] .barcode-mode-status.waiting { color: #92400e; }
body[data-theme="light"] .barcode-mode-status.saved { color: #065f46; }
@media (max-width: 1000px) {
  .barcode-tool-layout,
  .scanner-grid { grid-template-columns: 1fr; }
  .barcode-status-row { align-items: flex-start; }
}

/* v74: reduce repetitive page header chrome. Primary context now comes from panel headers. */
.topbar {
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 10px;
  min-height: 38px;
}
.topbar > div:first-child {
  display: none !important;
}
.topbar-actions {
  margin-left: auto;
}
@media (max-width: 760px) {
  .topbar {
    margin-bottom: 8px;
  }
  .topbar-actions {
    width: 100%;
    justify-content: flex-end;
  }
}

/* v75: Barcode PDF label text, preview-all, direct print controls. */
.barcode-text-template-grid {
  display: grid;
  grid-template-columns: minmax(130px, .8fr) minmax(160px, 1.2fr);
  gap: 10px;
  align-items: end;
  margin-bottom: 10px;
}
.barcode-template-help {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  margin-top: 2px;
}
.barcode-preview-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 12px;
  color: var(--text);
}
.barcode-preview-toolbar .muted {
  font-size: 12px;
  text-align: right;
  max-width: 520px;
}
.barcode-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  align-items: start;
}
.barcode-label-preview {
  border: 1px solid #d7dce5;
  background: #ffffff;
  color: #111827;
  border-radius: 12px;
  padding: 12px;
  text-align: center;
  overflow: hidden;
}
.barcode-label-text {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  color: #111827;
  overflow-wrap: anywhere;
}
.barcode-label-text-top {
  font-size: 17px;
  margin-bottom: 8px;
}
.barcode-label-text-bottom {
  font-size: 13px;
  margin-top: 7px;
  font-weight: 600;
}
.barcode-label-svg-wrap svg {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}
body[data-theme="dark"] .barcode-label-preview {
  border-color: rgba(255,255,255,.18);
  box-shadow: none;
}
@media (max-width: 720px) {
  .barcode-text-template-grid { grid-template-columns: 1fr; }
  .barcode-preview-toolbar { display: block; }
  .barcode-preview-toolbar .muted { display: block; text-align: left; margin-top: 4px; }
  .barcode-preview-grid { grid-template-columns: 1fr; }
}


/* v76: compact utility topbar and reduce empty space above page panels. */
.main {
  padding-top: 14px !important;
}
.topbar {
  min-height: 0 !important;
  margin-bottom: 6px !important;
  padding: 0 !important;
  justify-content: flex-end !important;
}
.topbar-actions {
  gap: 7px !important;
  align-items: center !important;
}
.language-select {
  min-width: 74px !important;
  width: 74px !important;
  height: 32px !important;
  padding: 6px 24px 6px 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}
.theme-toggle {
  min-height: 32px !important;
  height: 32px !important;
  padding: 4px 9px 4px 5px !important;
  border-radius: 999px !important;
  gap: 7px !important;
}
.theme-toggle-track {
  width: 34px !important;
  height: 20px !important;
}
.theme-toggle-knob {
  width: 16px !important;
  height: 16px !important;
}
body[data-theme="dark"] .theme-toggle-knob {
  transform: translateX(14px) !important;
}
.theme-toggle-text {
  font-size: 12px !important;
  font-weight: 800 !important;
}
.view.active > .panel:first-child,
.view.active > .kpi-grid:first-child,
.view.active > .dashboard-grid:first-child,
.view.active > .split-grid:first-child,
.view.active > .settings-grid:first-child,
.view.active > .barcode-tool-layout:first-child {
  margin-top: 0 !important;
}
@media (max-width: 760px) {
  .main { padding-top: 10px !important; }
  .topbar { margin-bottom: 6px !important; }
  .topbar-actions { justify-content: flex-end !important; }
}

/* v77: barcode tools clarity pass. */
.barcode-mode-status {
  min-height: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .01em;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--muted) !important;
  gap: 7px;
}
.barcode-mode-status::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 999px;
  flex: 0 0 auto;
  background: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}
.barcode-mode-status.ready::before { background: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,.14); }
.barcode-mode-status.waiting::before { background: #f59e0b; box-shadow: 0 0 0 3px rgba(245,158,11,.16); }
.barcode-mode-status.saved::before { background: #10b981; box-shadow: 0 0 0 3px rgba(16,185,129,.15); }
.barcode-mode-status.error::before { background: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 16%, transparent); }
body[data-theme="light"] .barcode-mode-status { color: #6b7280 !important; }

.barcode-label-text-panel {
  padding: 13px !important;
}
.barcode-options-title {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 10px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--line);
}
.barcode-options-title strong {
  color: var(--text);
  font-size: 13px;
}
.barcode-options-title span {
  color: var(--muted);
  font-size: 11px;
  text-align: right;
}
.barcode-template-section {
  padding: 10px 0;
}
.barcode-template-section + .barcode-template-section {
  border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
}
.barcode-template-section-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 8px;
}
.barcode-template-section-head strong {
  font-size: 12px;
  color: var(--text);
}
.barcode-template-section-head small {
  color: var(--muted);
  font-size: 11px;
  text-align: right;
}
.barcode-template-controls {
  display: grid;
  grid-template-columns: minmax(150px, .78fr) minmax(220px, 1.22fr);
  gap: 10px;
  align-items: end;
}
.barcode-template-controls .setting-field {
  margin: 0;
}
.barcode-template-controls .setting-field span {
  font-size: 11px;
}
.template-input-field input {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
@media (max-width: 780px) {
  .barcode-options-title,
  .barcode-template-section-head {
    display: block;
  }
  .barcode-options-title span,
  .barcode-template-section-head small {
    display: block;
    margin-top: 3px;
    text-align: left;
  }
  .barcode-template-controls {
    grid-template-columns: 1fr;
  }
}

/* v78: clearer language switcher and stronger in-panel page header. UI-only. */
.language-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.language-segment {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  box-shadow: none;
}
.language-segment-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--muted);
  min-width: 34px;
  height: 28px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .035em;
  line-height: 1;
  cursor: pointer;
  transition: background .14s ease, color .14s ease;
}
.language-segment-btn:hover {
  background: rgba(37, 99, 235, .10);
  color: var(--primary);
}
.language-segment-btn.active,
.language-segment-btn[aria-pressed="true"] {
  background: var(--primary);
  color: #fff;
}
body[data-theme="dark"] .language-segment {
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.12);
}
body[data-theme="dark"] .language-segment-btn { color: #aab2c0; }
body[data-theme="dark"] .language-segment-btn:hover {
  background: rgba(96,165,250,.16);
  color: #dbeafe;
}
body[data-theme="dark"] .language-segment-btn.active,
body[data-theme="dark"] .language-segment-btn[aria-pressed="true"] {
  background: #2f6fed;
  color: #fff;
}

/* Top-level panels use their first header as the page title. */
.view.active > .panel:first-child > .panel-header:first-child,
.view.active > .database-section:first-child > .panel-header:first-child,
.view.active > .barcode-panel:first-child > .panel-header:first-child {
  display: block;
  margin: -2px 0 18px;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--line);
}
.view.active > .panel:first-child > .panel-header:first-child h3,
.view.active > .database-section:first-child > .panel-header:first-child h3,
.view.active > .barcode-panel:first-child > .panel-header:first-child h3 {
  font-size: clamp(22px, 2.1vw, 30px);
  line-height: 1.08;
  font-weight: 820;
  letter-spacing: -0.04em;
  margin: 0;
}
.view.active > .panel:first-child > .panel-header:first-child p,
.view.active > .database-section:first-child > .panel-header:first-child p,
.view.active > .barcode-panel:first-child > .panel-header:first-child p {
  max-width: 78ch;
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.42;
}

/* Secondary panel headers stay lighter so they do not compete with the page header. */
.split-grid .panel .panel-header h3,
.dashboard-grid .panel .panel-header h3,
.panel:not(:first-child) > .panel-header h3 {
  font-size: 18px;
  font-weight: 740;
  letter-spacing: -0.025em;
}
.split-grid .panel .panel-header p,
.dashboard-grid .panel .panel-header p,
.panel:not(:first-child) > .panel-header p {
  font-size: 13px;
}

.topbar-actions { gap: 9px !important; }
.theme-toggle { height: 34px !important; }
@media (max-width: 760px) {
  .language-segment-btn { min-width: 31px; padding: 0 7px; font-size: 11px; }
  .view.active > .panel:first-child > .panel-header:first-child h3,
  .view.active > .database-section:first-child > .panel-header:first-child h3,
  .view.active > .barcode-panel:first-child > .panel-header:first-child h3 { font-size: 22px; }
}


/* v79: native language labels and lighter page canvas. UI-only. */
.language-segment {
  gap: 3px;
  padding: 3px;
  border-radius: 16px;
}
.language-segment-btn {
  min-width: auto;
  height: 30px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 760;
  letter-spacing: 0;
}
.language-segment-btn[data-language="he"],
.language-segment-btn[data-language="ar"] {
  font-family: Alef, "Noto Sans Hebrew", Inter, system-ui, sans-serif;
}
.language-segment-btn[data-language="ru"] {
  font-family: Inter, Roboto, system-ui, sans-serif;
}

/* Remove the large page-level frame; keep inner cards/tables as the visual structure. */
.view > .panel.wide {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
body[data-theme="light"] .view > .panel.wide,
body[data-theme="dark"] .view > .panel.wide {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.view > .panel.wide > .panel-header:first-child {
  margin: 0 0 16px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--line);
}
.view > .panel.wide > .panel-header:first-child h3 {
  font-size: clamp(24px, 2.2vw, 31px);
}
.view > .panel.wide > .panel-header:first-child p {
  max-width: 82ch;
}

/* Since the outer panel frame is gone, give full-width tables/forms their own clean surface. */
.view > .panel.wide > .table-scroll,
.view > .panel.wide > .history-table-wrap,
.view > .panel.wide > .log-panel,
.view > .panel.wide > .file-list,
.view > .panel.wide > .barcode-preview-panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
}
body[data-theme="dark"] .view > .panel.wide > .table-scroll,
body[data-theme="dark"] .view > .panel.wide > .history-table-wrap,
body[data-theme="dark"] .view > .panel.wide > .log-panel,
body[data-theme="dark"] .view > .panel.wide > .file-list,
body[data-theme="dark"] .view > .panel.wide > .barcode-preview-panel {
  background: var(--panel);
  border-color: var(--line);
}

@media (max-width: 900px) {
  .language-segment { flex-wrap: wrap; justify-content: flex-end; max-width: 265px; }
  .language-segment-btn { height: 28px; padding: 0 8px; font-size: 11px; }
}
@media (max-width: 640px) {
  .language-segment-btn { padding: 0 7px; }
  .language-segment-btn[data-language="en"] { max-width: 48px; overflow: hidden; text-overflow: ellipsis; }
  .language-segment-btn[data-language="ru"] { max-width: 62px; overflow: hidden; text-overflow: ellipsis; }
}

/* v80: workspace hierarchy polish. UI-only. */
@media screen {
  .main {
    padding-top: 12px !important;
  }

  .topbar {
    margin-bottom: 8px !important;
  }

  /* Page title should identify the page without becoming another boxed panel. */
  .view > .panel.wide > .panel-header:first-child {
    margin: 0 0 12px !important;
    padding: 0 !important;
    border-bottom: 0 !important;
  }

  .view > .panel.wide > .panel-header:first-child h3 {
    font-size: clamp(22px, 1.9vw, 28px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.045em !important;
  }

  .view > .panel.wide > .panel-header:first-child p {
    margin-top: 4px !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    max-width: 74ch !important;
    color: var(--muted) !important;
  }

  /* Inner surfaces should carry the structure now that the outer frame is removed. */
  .panel:not(.wide),
  .kpi-card,
  .report-card,
  .mini-kpi,
  .setting-field,
  .db-summary div,
  .barcode-main-card,
  .barcode-side-card,
  .barcode-help-card,
  .barcode-validation-card,
  .barcode-options-box,
  .cloud-sharing-panel {
    box-shadow: 0 4px 14px rgba(15, 23, 42, .045) !important;
  }

  body[data-theme="dark"] .panel:not(.wide),
  body[data-theme="dark"] .kpi-card,
  body[data-theme="dark"] .report-card,
  body[data-theme="dark"] .mini-kpi,
  body[data-theme="dark"] .setting-field,
  body[data-theme="dark"] .db-summary div,
  body[data-theme="dark"] .barcode-main-card,
  body[data-theme="dark"] .barcode-side-card,
  body[data-theme="dark"] .barcode-help-card,
  body[data-theme="dark"] .barcode-validation-card,
  body[data-theme="dark"] .barcode-options-box,
  body[data-theme="dark"] .cloud-sharing-panel {
    box-shadow: none !important;
  }

  .panel:not(.wide) > .panel-header:first-child {
    margin-bottom: 10px !important;
  }

  .panel:not(.wide) > .panel-header:first-child h3,
  .section-label h4,
  .print-section h4 {
    font-size: 17px !important;
    line-height: 1.15 !important;
    letter-spacing: -0.03em !important;
  }

  .panel:not(.wide) > .panel-header:first-child p,
  .section-label p,
  .panel-subnote {
    font-size: 12.5px !important;
    line-height: 1.34 !important;
  }

  .settings-grid {
    gap: 9px !important;
  }

  .setting-field {
    padding: 10px 11px !important;
    gap: 5px !important;
  }

  .setting-field strong,
  .setting-field label:first-child,
  .setting-field > span:first-child {
    line-height: 1.18 !important;
  }

  .setting-field small,
  .setting-field .hint,
  .setting-field p {
    line-height: 1.28 !important;
  }

  .data-management,
  .group-manager,
  .shipping-manager,
  .store-directory-manager,
  .cloud-sharing-panel {
    margin-top: 12px !important;
  }

  .kpi-grid {
    gap: 9px !important;
  }

  .split-grid,
  .dashboard-grid {
    gap: 12px !important;
  }

  .table-scroll,
  .history-table-wrap,
  .activity-log-content.table-wrap {
    border-radius: 14px !important;
  }

  .data-table th {
    font-size: 11.5px !important;
  }

  .data-table th,
  .data-table td {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
  }

  .language-segment {
    border-radius: 14px !important;
  }

  .language-segment-btn {
    height: 28px !important;
    padding: 0 9px !important;
    font-size: 11.5px !important;
  }

  .theme-toggle {
    height: 32px !important;
  }

  .view > .panel.wide > .table-scroll,
  .view > .panel.wide > .history-table-wrap,
  .view > .panel.wide > .log-panel,
  .view > .panel.wide > .file-list,
  .view > .panel.wide > .barcode-preview-panel {
    margin-top: 8px !important;
  }

  @media (max-width: 900px) {
    .main { padding: 10px 12px 16px !important; }
    .view > .panel.wide > .panel-header:first-child h3 { font-size: 22px !important; }
  }
}

/* v81: sidebar scroll refinement. Visual/layout only. */
@media screen and (min-width: 901px) {
  .sidebar {
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .sidebar::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }
  .nav {
    gap: 2px;
  }
  .nav-item {
    min-height: 34px;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .sidebar-status-card {
    padding: 12px;
    margin-top: 12px;
  }
  .sidebar-status-list {
    gap: 5px;
  }
  .sidebar-status-row {
    min-height: 18px;
    font-size: 11px;
  }
  .sidebar-card h3,
  .sidebar-status-card h3 {
    margin-bottom: 8px;
  }
}

@media screen and (min-width: 901px) and (min-height: 760px) {
  .sidebar {
    overflow-y: hidden;
  }
}

@media screen and (min-width: 901px) and (max-height: 759px) {
  .sidebar {
    overflow-y: auto;
  }
}

/* v82: keep table headers inside rounded table corners, especially in expanded layout. */
.table-scroll {
  background: var(--card);
  overflow: hidden;
}

body[data-table-layout="expanded"] .table-scroll {
  overflow: visible !important;
}

.data-table {
  border-collapse: separate;
  border-spacing: 0;
}

.data-table thead th:first-child {
  border-top-left-radius: 12px;
}

.data-table thead th:last-child {
  border-top-right-radius: 12px;
}

.data-table thead th {
  background-clip: padding-box;
}

body[data-theme="light"] .table-scroll {
  background: #ffffff;
}

body[data-theme="dark"] .table-scroll {
  background: rgba(15, 23, 42, .72);
}

/* v83: Barcode PDF label text layout rebalance. UI-only. */
.barcode-tool-layout {
  grid-template-columns: minmax(380px, 1.15fr) minmax(320px, .85fr) !important;
  gap: 14px !important;
}
.barcode-label-wide-card {
  grid-column: 1 / -1;
}
.barcode-label-text-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(320px, 1fr));
  gap: 14px 16px;
  padding: 15px !important;
}
.barcode-label-text-layout .barcode-options-title {
  grid-column: 1 / -1;
  margin-bottom: 0 !important;
}
.barcode-label-text-layout .barcode-template-section {
  padding: 12px !important;
  border: 1px solid color-mix(in srgb, var(--line) 76%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--panel) 92%, var(--accent) 8%);
}
.barcode-label-text-layout .barcode-template-section + .barcode-template-section {
  border-top: 1px solid color-mix(in srgb, var(--line) 76%, transparent) !important;
}
.barcode-label-text-layout .barcode-template-section-head {
  display: block !important;
  margin-bottom: 10px !important;
}
.barcode-label-text-layout .barcode-template-section-head strong {
  display: block;
  font-size: 13px !important;
  margin-bottom: 3px;
}
.barcode-label-text-layout .barcode-template-section-head small {
  display: block;
  text-align: left !important;
  font-size: 12px !important;
  line-height: 1.35;
}
.barcode-label-text-layout .barcode-template-controls {
  grid-template-columns: minmax(150px, 180px) minmax(260px, 1fr) !important;
  gap: 12px !important;
  align-items: end !important;
}
.barcode-label-text-layout .template-input-field input {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  font-size: 14px;
}
.barcode-label-text-layout .select-input {
  min-height: 42px;
}
.barcode-label-text-layout .setting-field {
  box-shadow: none !important;
}
body[data-theme="light"] .barcode-label-text-layout .barcode-template-section {
  background: #fff;
}
body[data-theme="dark"] .barcode-label-text-layout .barcode-template-section {
  background: rgba(255,255,255,.035);
}
@media (max-width: 1120px) {
  .barcode-label-text-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 840px) {
  .barcode-tool-layout {
    grid-template-columns: 1fr !important;
  }
  .barcode-label-text-layout .barcode-template-controls {
    grid-template-columns: 1fr !important;
  }
}

/* v84 patch: stronger rounded table clipping for sticky headers. */
@media screen {
  .table-scroll,
  .view > .panel.wide > .table-scroll {
    overflow: clip !important;
    border-radius: 14px !important;
    clip-path: inset(0 round 14px);
    isolation: isolate;
  }
  body[data-table-layout="expanded"] .table-scroll,
  body[data-table-layout="expanded"] .view > .panel.wide > .table-scroll {
    overflow: clip !important;
  }
  .data-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }
  .data-table thead th:first-child {
    border-top-left-radius: 14px !important;
  }
  .data-table thead th:last-child {
    border-top-right-radius: 14px !important;
  }
  .data-table thead th {
    background-clip: padding-box !important;
  }
}

/* v85: header sync chip should show timely shared-data risk, not generic local/setup status. */
.topbar-sync {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  max-width: min(48vw, 460px);
  padding: 5px 9px;
  border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  color: var(--text);
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: none !important;
}
.topbar-sync #topbarCloudMain {
  font-weight: 700;
}
.topbar-sync #topbarCloudMeta {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.topbar-sync.ok {
  border-color: color-mix(in srgb, var(--success) 22%, var(--line));
}
.topbar-sync.busy,
.topbar-sync.warning {
  border-color: color-mix(in srgb, var(--warning) 38%, var(--line));
  background: color-mix(in srgb, var(--warning) 8%, var(--panel));
}
.topbar-sync.error {
  border-color: color-mix(in srgb, var(--danger) 42%, var(--line));
  background: color-mix(in srgb, var(--danger) 8%, var(--panel));
}
.topbar-sync-action {
  height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  border: 0;
  background: var(--accent);
  color: #fff;
  box-shadow: none;
}
@media (max-width: 1180px) {
  .topbar-sync { max-width: 34vw; }
  .topbar-sync #topbarCloudMeta { max-width: 190px; }
}
@media (max-width: 900px) {
  .topbar-sync { order: 2; max-width: 100%; }
}


/* v88: Arabic uses Cairo; final table corner clipping for RTL/LTR. */
:root {
  --font-arabic: Cairo, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
html[lang="ar"],
html[lang="ar"] body,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] select,
html[lang="ar"] textarea,
html[lang="ar"] .nav-item,
html[lang="ar"] .panel,
html[lang="ar"] .data-table,
html[lang="ar"] .badge,
html[lang="ar"] .status-pill,
html[lang="ar"] .language-segment-btn[data-language="ar"] {
  font-family: var(--font-arabic) !important;
}
html[lang="ar"] .brand-mark {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}

@media screen {
  .table-scroll,
  .history-table-wrap,
  .activity-log-content.table-wrap {
    overflow: hidden !important;
    border-radius: 14px !important;
    background: var(--panel) !important;
    clip-path: inset(0 round 14px);
    isolation: isolate;
  }
  body[data-table-layout="expanded"] .table-scroll,
  body[data-table-layout="expanded"] .history-table-wrap,
  body[data-table-layout="expanded"] .activity-log-content.table-wrap {
    overflow: hidden !important;
    max-height: none !important;
  }
  .data-table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden;
  }
  .data-table thead,
  .data-table thead tr,
  .data-table thead th {
    background-clip: padding-box !important;
  }
  .data-table thead tr:first-child th:first-child {
    border-start-start-radius: 14px !important;
    border-top-left-radius: 14px !important;
    border-top-right-radius: 0 !important;
  }
  .data-table thead tr:first-child th:last-child {
    border-start-end-radius: 14px !important;
    border-top-right-radius: 14px !important;
    border-top-left-radius: 0 !important;
  }
  html[dir="rtl"] .data-table thead tr:first-child th:first-child {
    border-top-right-radius: 14px !important;
    border-top-left-radius: 0 !important;
  }
  html[dir="rtl"] .data-table thead tr:first-child th:last-child {
    border-top-left-radius: 14px !important;
    border-top-right-radius: 0 !important;
  }
  .data-table tbody tr:last-child td:first-child {
    border-end-start-radius: 14px;
  }
  .data-table tbody tr:last-child td:last-child {
    border-end-end-radius: 14px;
  }
}

/* Header sync chip should never show data-freshness fallbacks. */
.topbar-sync.hidden,
.topbar-sync[hidden] {
  display: none !important;
}

/* v89/v90: 76 appearance option, cleaner alert colors, and three-way style selector. */
@media screen {
  .appearance-segment {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    height: 34px;
    padding: 3px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
    background: color-mix(in srgb, var(--panel) 88%, transparent);
    box-shadow: none;
  }
  .appearance-segment-btn {
    appearance: none;
    height: 26px;
    min-width: 48px;
    padding: 0 10px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    box-shadow: none;
  }
  .appearance-segment-btn:hover {
    background: color-mix(in srgb, var(--primary) 9%, transparent);
    color: var(--text);
  }
  .appearance-segment-btn.active,
  .appearance-segment-btn[aria-pressed="true"] {
    background: var(--primary);
    color: #fff;
  }

  /* Replace beige critical alert cards with theme-aware red/blue system colors. */
  .alert-item {
    background: color-mix(in srgb, var(--danger) 5%, var(--panel)) !important;
    border-color: color-mix(in srgb, var(--danger) 36%, var(--line)) !important;
  }
  .alert-item strong { color: #991b1b !important; }
  .alert-item p { color: #6b7280 !important; }
  body[data-theme="dark"] .alert-item {
    background: color-mix(in srgb, var(--danger) 12%, rgba(255,255,255,.055)) !important;
    border-color: color-mix(in srgb, var(--danger) 45%, rgba(255,255,255,.16)) !important;
  }
  body[data-theme="dark"] .alert-item strong { color: #fecaca !important; }
  body[data-theme="dark"] .alert-item p { color: #c3cad4 !important; }

  body[data-theme="apple"] {
    --bg: #f5f5f7;
    --panel: rgba(255,255,255,.78);
    --text: #1d1d1f;
    --muted: #6e6e73;
    --line: rgba(60,60,67,.18);
    --primary: #007aff;
    --primary-dark: #0066d6;
    --accent: #007aff;
    --danger: #ff3b30;
    --danger-bg: rgba(255,59,48,.08);
    --warning: #ff9500;
    --warning-bg: rgba(255,149,0,.10);
    --success: #34c759;
    --success-bg: rgba(52,199,89,.10);
    --shadow: 0 18px 50px rgba(0,0,0,.08);
    background:
      radial-gradient(circle at 18% 0%, rgba(0,122,255,.10), transparent 36%),
      linear-gradient(180deg, #fbfbfd 0%, #f5f5f7 48%, #eef2f7 100%) !important;
    color: var(--text);
  }
  body[data-theme="apple"] .sidebar {
    background: rgba(255,255,255,.72) !important;
    border-right: 1px solid rgba(60,60,67,.14) !important;
    color: #1d1d1f !important;
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    box-shadow: none !important;
  }
  body[data-theme="apple"] .brand h1,
  body[data-theme="apple"] .nav-item { color: #1d1d1f !important; }
  body[data-theme="apple"] .brand p,
  body[data-theme="apple"] .sidebar-status-row,
  body[data-theme="apple"] .muted-label { color: #6e6e73 !important; }
  body[data-theme="apple"] .brand-mark {
    background: linear-gradient(180deg, #0a84ff 0%, #0057d9 100%) !important;
    border-color: rgba(255,255,255,.42) !important;
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(0,122,255,.26) !important;
  }
  body[data-theme="apple"] .brand-mark::after { background: rgba(255,255,255,.86) !important; box-shadow: none !important; }
  body[data-theme="apple"] .nav-item:hover {
    background: rgba(0,122,255,.08) !important;
    color: #1d1d1f !important;
  }
  body[data-theme="apple"] .nav-item.active,
  body[data-theme="apple"] .nav-item.active:hover {
    background: #007aff !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .sidebar-card,
  body[data-theme="apple"] .panel,
  body[data-theme="apple"] .kpi-card,
  body[data-theme="apple"] .report-card,
  body[data-theme="apple"] .mini-kpi,
  body[data-theme="apple"] .setting-field,
  body[data-theme="apple"] .barcode-preview-panel,
  body[data-theme="apple"] .barcode-preview-card,
  body[data-theme="apple"] .cloud-sharing-panel,
  body[data-theme="apple"] .cloud-workflow-card,
  body[data-theme="apple"] .cloud-details,
  body[data-theme="apple"] .db-summary div,
  body[data-theme="apple"] .file-row,
  body[data-theme="apple"] .log-line,
  body[data-theme="apple"] .empty-state,
  body[data-theme="apple"] .table-scroll {
    background: rgba(255,255,255,.78) !important;
    border-color: rgba(60,60,67,.16) !important;
    box-shadow: none !important;
    backdrop-filter: saturate(180%) blur(16px);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
  }
  body[data-theme="apple"] .data-table th {
    background: rgba(242,242,247,.92) !important;
    color: #1d1d1f !important;
  }
  body[data-theme="apple"] .data-table td,
  body[data-theme="apple"] .order-matrix td { color: #1d1d1f !important; }
  body[data-theme="apple"] .data-table tr:hover td { background: rgba(0,122,255,.045) !important; }
  body[data-theme="apple"] .search-input,
  body[data-theme="apple"] .select-input,
  body[data-theme="apple"] .setting-field input,
  body[data-theme="apple"] .setting-field select,
  body[data-theme="apple"] textarea {
    background: rgba(255,255,255,.88) !important;
    border-color: rgba(60,60,67,.24) !important;
    color: #1d1d1f !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .btn.primary,
  body[data-theme="apple"] .appearance-segment-btn.active,
  body[data-theme="apple"] .appearance-segment-btn[aria-pressed="true"] {
    background: #007aff !important;
    border-color: #007aff !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .btn.secondary,
  body[data-theme="apple"] .icon-btn {
    background: rgba(255,255,255,.70) !important;
    border-color: rgba(60,60,67,.18) !important;
    color: #1d1d1f !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .trend-fill { background: linear-gradient(90deg, #007aff, #64d2ff) !important; }
  body[data-theme="apple"] .topbar-sync,
  body[data-theme="apple"] .language-segment,
  body[data-theme="apple"] .appearance-segment {
    background: rgba(255,255,255,.78) !important;
    border-color: rgba(60,60,67,.18) !important;
    color: #1d1d1f !important;
    box-shadow: none !important;
    backdrop-filter: saturate(180%) blur(16px);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
  }
  body[data-theme="apple"] .language-segment-btn { color: #6e6e73 !important; }
  body[data-theme="apple"] .language-segment-btn.active,
  body[data-theme="apple"] .language-segment-btn[aria-pressed="true"] {
    background: #007aff !important;
    color: #fff !important;
  }
  body[data-theme="apple"] .alert-item {
    background: rgba(255,59,48,.055) !important;
    border-color: rgba(255,59,48,.28) !important;
  }
  body[data-theme="apple"] .alert-item strong { color: #b42318 !important; }
  body[data-theme="apple"] .alert-item p { color: #6e6e73 !important; }
}

@media (max-width: 980px) {
  .appearance-segment-btn { min-width: 40px; padding: 0 8px; font-size: 11px; }
}


/* v90: rename Apple option visually to 76, make 76 style closer to modern Apple OS, remove redundant sync tooltip feel. */
@media screen {
  .topbar-sync { cursor: default; }
  .topbar-sync[title] { pointer-events: auto; }

  body[data-theme="apple"] {
    --bg: #f5f5f7;
    --panel: rgba(255,255,255,.74);
    --text: #1d1d1f;
    --muted: #6e6e73;
    --line: rgba(60,60,67,.14);
    --primary: #007aff;
    --primary-dark: #006edb;
    --accent: #007aff;
    --shadow: 0 10px 30px rgba(0,0,0,.055);
    background:
      radial-gradient(circle at 20% -10%, rgba(0,122,255,.12), transparent 38%),
      radial-gradient(circle at 86% 8%, rgba(90,200,250,.10), transparent 34%),
      linear-gradient(180deg, #fbfbfd 0%, #f5f5f7 58%, #eff3f8 100%) !important;
  }
  body[data-theme="apple"] .app-shell {
    background: transparent !important;
  }
  body[data-theme="apple"] .topbar {
    background: rgba(255,255,255,.54) !important;
    border-bottom-color: rgba(60,60,67,.10) !important;
    backdrop-filter: saturate(180%) blur(22px);
    -webkit-backdrop-filter: saturate(180%) blur(22px);
  }
  body[data-theme="apple"] .sidebar {
    background: rgba(255,255,255,.60) !important;
    backdrop-filter: saturate(180%) blur(24px);
    -webkit-backdrop-filter: saturate(180%) blur(24px);
  }
  body[data-theme="apple"] .panel,
  body[data-theme="apple"] .kpi-card,
  body[data-theme="apple"] .report-card,
  body[data-theme="apple"] .mini-kpi,
  body[data-theme="apple"] .setting-field,
  body[data-theme="apple"] .barcode-preview-panel,
  body[data-theme="apple"] .barcode-preview-card,
  body[data-theme="apple"] .cloud-sharing-panel,
  body[data-theme="apple"] .cloud-workflow-card,
  body[data-theme="apple"] .cloud-details,
  body[data-theme="apple"] .db-summary div,
  body[data-theme="apple"] .file-row,
  body[data-theme="apple"] .log-line,
  body[data-theme="apple"] .empty-state,
  body[data-theme="apple"] .table-scroll,
  body[data-theme="apple"] .sidebar-card {
    background: rgba(255,255,255,.68) !important;
    border-color: rgba(60,60,67,.13) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.75) inset, 0 12px 28px rgba(0,0,0,.045) !important;
    backdrop-filter: saturate(180%) blur(18px);
    -webkit-backdrop-filter: saturate(180%) blur(18px);
  }
  body[data-theme="apple"] .nav-item {
    border-radius: 12px !important;
  }
  body[data-theme="apple"] .nav-item:hover {
    background: rgba(0,122,255,.075) !important;
  }
  body[data-theme="apple"] .nav-item.active,
  body[data-theme="apple"] .nav-item.active:hover {
    background: rgba(0,122,255,.96) !important;
    color: #fff !important;
  }
  body[data-theme="apple"] .language-segment,
  body[data-theme="apple"] .appearance-segment,
  body[data-theme="apple"] .topbar-sync {
    background: rgba(255,255,255,.62) !important;
    border-color: rgba(60,60,67,.14) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 8px 20px rgba(0,0,0,.05) !important;
  }
  body[data-theme="apple"] .appearance-segment-btn.active,
  body[data-theme="apple"] .appearance-segment-btn[aria-pressed="true"],
  body[data-theme="apple"] .language-segment-btn.active,
  body[data-theme="apple"] .language-segment-btn[aria-pressed="true"] {
    background: #007aff !important;
    color: #fff !important;
  }
  body[data-theme="apple"] .data-table th {
    background: rgba(242,242,247,.88) !important;
  }
  body[data-theme="apple"] .search-input,
  body[data-theme="apple"] .select-input,
  body[data-theme="apple"] .setting-field input,
  body[data-theme="apple"] .setting-field select,
  body[data-theme="apple"] textarea {
    background: rgba(255,255,255,.72) !important;
    border-color: rgba(60,60,67,.22) !important;
  }
}

/* v91: Roboto heading letter spacing reset. Typography-only. */
h1,
h2,
h3,
h4,
h5,
h6,
.brand h1,
.topbar h2,
.panel-header h3,
.section-label h4,
.drop-zone h3,
.order-dispatch-editor h4,
.print-section h4,
.print-page-options h4,
.kpi-card strong,
.mini-kpi strong,
.print-kpi strong,
.db-summary strong,
.view > .panel.wide > .panel-header:first-child h3,
.panel:not(.wide) > .panel-header:first-child h3 {
  letter-spacing: 0 !important;
}

/* v92: replace the failed 76 look with a clean macOS-like light interface. UI-only. */
@media screen {
  body[data-theme="apple"] {
    --bg: #f5f5f7 !important;
    --panel: #ffffff !important;
    --text: #1d1d1f !important;
    --muted: #6e6e73 !important;
    --line: rgba(60, 60, 67, .18) !important;
    --primary: #007aff !important;
    --primary-dark: #006bd6 !important;
    --accent: #007aff !important;
    --danger: #ff3b30 !important;
    --danger-bg: rgba(255, 59, 48, .085) !important;
    --warning: #ff9500 !important;
    --warning-bg: rgba(255, 149, 0, .10) !important;
    --success: #34c759 !important;
    --success-bg: rgba(52, 199, 89, .10) !important;
    --shadow: 0 1px 2px rgba(0,0,0,.035), 0 10px 26px rgba(0,0,0,.045) !important;
    background: #f5f5f7 !important;
    color: #1d1d1f !important;
  }

  body[data-theme="apple"] .app-shell,
  body[data-theme="apple"] .main {
    background: #f5f5f7 !important;
    color: #1d1d1f !important;
  }

  body[data-theme="apple"] .sidebar {
    background: rgba(242,242,247,.86) !important;
    border-right: 1px solid rgba(60,60,67,.16) !important;
    box-shadow: none !important;
    backdrop-filter: saturate(180%) blur(18px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(18px) !important;
  }

  body[data-theme="apple"] .topbar {
    background: transparent !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    color: #1d1d1f !important;
  }

  body[data-theme="apple"] h1,
  body[data-theme="apple"] h2,
  body[data-theme="apple"] h3,
  body[data-theme="apple"] h4,
  body[data-theme="apple"] h5,
  body[data-theme="apple"] h6,
  body[data-theme="apple"] .topbar h2,
  body[data-theme="apple"] .panel-header h3,
  body[data-theme="apple"] .section-label h4,
  body[data-theme="apple"] .print-section h4,
  body[data-theme="apple"] .brand h1 {
    color: #1d1d1f !important;
    text-shadow: none !important;
  }

  body[data-theme="apple"] p,
  body[data-theme="apple"] small,
  body[data-theme="apple"] .topbar p,
  body[data-theme="apple"] .panel-header p,
  body[data-theme="apple"] .section-label p,
  body[data-theme="apple"] .brand p,
  body[data-theme="apple"] .muted-label,
  body[data-theme="apple"] .sidebar-status-row,
  body[data-theme="apple"] .panel-subnote,
  body[data-theme="apple"] .print-note,
  body[data-theme="apple"] .history-mode-note,
  body[data-theme="apple"] .store-source-note,
  body[data-theme="apple"] .group-note {
    color: #6e6e73 !important;
    text-shadow: none !important;
  }

  body[data-theme="apple"] .panel,
  body[data-theme="apple"] .panel:not(.wide),
  body[data-theme="apple"] .kpi-card,
  body[data-theme="apple"] .report-card,
  body[data-theme="apple"] .mini-kpi,
  body[data-theme="apple"] .print-kpi,
  body[data-theme="apple"] .setting-field,
  body[data-theme="apple"] .barcode-main-card,
  body[data-theme="apple"] .barcode-side-card,
  body[data-theme="apple"] .barcode-help-card,
  body[data-theme="apple"] .barcode-validation-card,
  body[data-theme="apple"] .barcode-options-box,
  body[data-theme="apple"] .barcode-preview-panel,
  body[data-theme="apple"] .barcode-preview-card,
  body[data-theme="apple"] .cloud-sharing-panel,
  body[data-theme="apple"] .cloud-workflow-card,
  body[data-theme="apple"] .cloud-details,
  body[data-theme="apple"] .db-summary div,
  body[data-theme="apple"] .file-row,
  body[data-theme="apple"] .log-line,
  body[data-theme="apple"] .empty-state,
  body[data-theme="apple"] .table-scroll,
  body[data-theme="apple"] .history-table-wrap,
  body[data-theme="apple"] .activity-log-content.table-wrap,
  body[data-theme="apple"] .drop-zone,
  body[data-theme="apple"] .print-page-options,
  body[data-theme="apple"] .order-dispatch-editor,
  body[data-theme="apple"] .sidebar-card {
    background: #ffffff !important;
    border-color: rgba(60,60,67,.16) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.035), 0 8px 22px rgba(0,0,0,.045) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body[data-theme="apple"] .view > .panel.wide {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  body[data-theme="apple"] .view > .panel.wide > .table-scroll,
  body[data-theme="apple"] .view > .panel.wide > .history-table-wrap,
  body[data-theme="apple"] .view > .panel.wide > .log-panel,
  body[data-theme="apple"] .view > .panel.wide > .file-list,
  body[data-theme="apple"] .view > .panel.wide > .barcode-preview-panel {
    background: #ffffff !important;
    border-color: rgba(60,60,67,.16) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.035), 0 8px 22px rgba(0,0,0,.045) !important;
  }

  body[data-theme="apple"] .nav-item {
    color: #1d1d1f !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .nav-item:hover {
    background: rgba(0,122,255,.10) !important;
    color: #0b63ce !important;
    box-shadow: none !important;
    transform: none !important;
  }
  body[data-theme="apple"] .nav-item.active,
  body[data-theme="apple"] .nav-item.active:hover {
    background: #007aff !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }

  body[data-theme="apple"] .brand-mark {
    background: linear-gradient(180deg, #0a84ff 0%, #0066d6 100%) !important;
    border: 1px solid rgba(255,255,255,.55) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(0,122,255,.24) !important;
  }
  body[data-theme="apple"] .brand-mark::after {
    background: rgba(255,255,255,.90) !important;
    box-shadow: none !important;
  }

  body[data-theme="apple"] .language-segment,
  body[data-theme="apple"] .appearance-segment,
  body[data-theme="apple"] .topbar-sync {
    background: #ffffff !important;
    border: 1px solid rgba(60,60,67,.16) !important;
    border-radius: 999px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.035), 0 6px 16px rgba(0,0,0,.045) !important;
    overflow: hidden !important;
    color: #1d1d1f !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body[data-theme="apple"] .language-segment-btn,
  body[data-theme="apple"] .appearance-segment-btn {
    color: #3a3a3c !important;
    background: transparent !important;
    border-radius: 999px !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .language-segment-btn:hover,
  body[data-theme="apple"] .appearance-segment-btn:hover {
    background: rgba(0,122,255,.08) !important;
    color: #0b63ce !important;
  }
  body[data-theme="apple"] .language-segment-btn.active,
  body[data-theme="apple"] .language-segment-btn[aria-pressed="true"],
  body[data-theme="apple"] .appearance-segment-btn.active,
  body[data-theme="apple"] .appearance-segment-btn[aria-pressed="true"] {
    background: #007aff !important;
    color: #ffffff !important;
  }

  body[data-theme="apple"] .btn.primary {
    background: #007aff !important;
    border-color: #007aff !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .btn.secondary,
  body[data-theme="apple"] .icon-btn,
  body[data-theme="apple"] button.ghost {
    background: #ffffff !important;
    border-color: rgba(60,60,67,.20) !important;
    color: #1d1d1f !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .btn.danger,
  body[data-theme="apple"] button.danger {
    background: #ff3b30 !important;
    border-color: #ff3b30 !important;
    color: #ffffff !important;
  }

  body[data-theme="apple"] .search-input,
  body[data-theme="apple"] .select-input,
  body[data-theme="apple"] input,
  body[data-theme="apple"] select,
  body[data-theme="apple"] textarea,
  body[data-theme="apple"] .setting-field input,
  body[data-theme="apple"] .setting-field select {
    background: #ffffff !important;
    border-color: rgba(60,60,67,.26) !important;
    color: #1d1d1f !important;
    box-shadow: none !important;
  }

  body[data-theme="apple"] .data-table th,
  body[data-theme="apple"] .order-matrix th {
    background: #f2f2f7 !important;
    color: #1d1d1f !important;
  }
  body[data-theme="apple"] .data-table td,
  body[data-theme="apple"] .order-matrix td,
  body[data-theme="apple"] .table-scroll td {
    color: #1d1d1f !important;
    background-clip: padding-box !important;
  }
  body[data-theme="apple"] .data-table tr:hover td {
    background: rgba(0,122,255,.045) !important;
  }

  body[data-theme="apple"] .kpi-card span,
  body[data-theme="apple"] .mini-kpi span,
  body[data-theme="apple"] .print-kpi span,
  body[data-theme="apple"] .db-summary span {
    color: #6e6e73 !important;
  }
  body[data-theme="apple"] .kpi-card strong,
  body[data-theme="apple"] .mini-kpi strong,
  body[data-theme="apple"] .print-kpi strong,
  body[data-theme="apple"] .db-summary strong {
    color: #1d1d1f !important;
  }

  body[data-theme="apple"] .alert-item {
    background: rgba(255,59,48,.075) !important;
    border-color: rgba(255,59,48,.26) !important;
    box-shadow: none !important;
  }
  body[data-theme="apple"] .alert-item strong { color: #b42318 !important; }
  body[data-theme="apple"] .alert-item p { color: #515154 !important; }

  body[data-theme="apple"] .alert.warning,
  body[data-theme="apple"] .print-warning {
    background: rgba(255,149,0,.10) !important;
    border-color: rgba(255,149,0,.30) !important;
    color: #7a4d00 !important;
  }

  body[data-theme="apple"] .trend-track { background: #e5e5ea !important; }
  body[data-theme="apple"] .trend-fill { background: #007aff !important; }

  body[data-theme="apple"] .topbar-sync #topbarCloudMain,
  body[data-theme="apple"] .topbar-sync strong {
    color: #1d1d1f !important;
  }
  body[data-theme="apple"] .topbar-sync #topbarCloudMeta {
    color: #6e6e73 !important;
  }
}

/* v93: theme contrast tokens and safety layer.
   Keep color decisions centralized here so light/dark/76 contrast problems are easier to find.
   Use these tokens for readable text/surfaces instead of one-off hard-coded pale colors. */
@media screen {
  :root,
  body[data-theme="light"] {
    --op-page-bg: #f5f7fb;
    --op-surface: #ffffff;
    --op-surface-soft: #f8fafc;
    --op-surface-muted: #eef2f7;
    --op-text: #111827;
    --op-text-muted: #475467;
    --op-text-subtle: #667085;
    --op-text-disabled: #667085;
    --op-border: #d6deea;
    --op-border-strong: #b9c5d6;
    --op-track: #e4e7ec;
    --op-primary: #0b7cff;
    --op-primary-strong: #006ee6;
    --op-danger-text: #9f1f12;
    --op-danger-bg: #fff5f3;
    --op-danger-border: #ffb3aa;
    --op-warning-text: #7a4d00;
    --op-warning-bg: #fff8e6;
    --op-warning-border: #f6c86d;
  }

  body[data-theme="dark"] {
    --op-page-bg: #0b1220;
    --op-surface: #111827;
    --op-surface-soft: #172033;
    --op-surface-muted: #1f2937;
    --op-text: #f8fafc;
    --op-text-muted: #cbd5e1;
    --op-text-subtle: #94a3b8;
    --op-text-disabled: #a7b0bf;
    --op-border: rgba(226,232,240,.18);
    --op-border-strong: rgba(226,232,240,.28);
    --op-track: rgba(255,255,255,.14);
    --op-primary: #60a5fa;
    --op-primary-strong: #93c5fd;
    --op-danger-text: #fecaca;
    --op-danger-bg: rgba(127,29,29,.32);
    --op-danger-border: rgba(248,113,113,.52);
    --op-warning-text: #fde68a;
    --op-warning-bg: rgba(133,77,14,.30);
    --op-warning-border: rgba(245,158,11,.54);
  }

  body[data-theme="apple"] {
    --op-page-bg: #f5f5f7;
    --op-surface: #ffffff;
    --op-surface-soft: #fbfbfd;
    --op-surface-muted: #f2f2f7;
    --op-text: #1d1d1f;
    --op-text-muted: #515154;
    --op-text-subtle: #6e6e73;
    --op-text-disabled: #6e6e73;
    --op-border: rgba(60,60,67,.18);
    --op-border-strong: rgba(60,60,67,.28);
    --op-track: #e5e5ea;
    --op-primary: #007aff;
    --op-primary-strong: #0066d6;
    --op-danger-text: #b42318;
    --op-danger-bg: rgba(255,59,48,.075);
    --op-danger-border: rgba(255,59,48,.30);
    --op-warning-text: #7a4d00;
    --op-warning-bg: rgba(255,149,0,.12);
    --op-warning-border: rgba(255,149,0,.34);
  }

  body[data-theme="light"],
  body[data-theme="dark"],
  body[data-theme="apple"] {
    background: var(--op-page-bg);
    color: var(--op-text);
  }

  /* Generic readable text rules. */
  body[data-theme] .panel,
  body[data-theme] .kpi-card,
  body[data-theme] .mini-kpi,
  body[data-theme] .report-card,
  body[data-theme] .setting-field,
  body[data-theme] .print-page-options,
  body[data-theme] .order-dispatch-editor,
  body[data-theme] .barcode-preview-panel,
  body[data-theme] .barcode-preview-card,
  body[data-theme] .barcode-card,
  body[data-theme] .cloud-sharing-panel,
  body[data-theme] .cloud-workflow-card,
  body[data-theme] .cloud-details,
  body[data-theme] .db-summary div,
  body[data-theme] .file-row,
  body[data-theme] .log-line,
  body[data-theme] .empty-state,
  body[data-theme] .table-scroll,
  body[data-theme] .history-table-wrap,
  body[data-theme] .activity-log-content.table-wrap {
    color: var(--op-text) !important;
    border-color: var(--op-border) !important;
  }

  body[data-theme] .panel-header h3,
  body[data-theme] .section-label h4,
  body[data-theme] .print-page-options h4,
  body[data-theme] .print-section h4,
  body[data-theme] .order-dispatch-editor h4,
  body[data-theme] .report-card strong,
  body[data-theme] .barcode-card-title,
  body[data-theme] .setting-field span,
  body[data-theme] label,
  body[data-theme] .checkbox-label,
  body[data-theme] .print-page-option,
  body[data-theme] .data-table td strong,
  body[data-theme] .mini-kpi strong,
  body[data-theme] .kpi-card strong,
  body[data-theme] .print-kpi strong,
  body[data-theme] .db-summary strong {
    color: var(--op-text) !important;
    opacity: 1 !important;
  }

  body[data-theme] .panel-header p,
  body[data-theme] .section-label p,
  body[data-theme] .report-card span,
  body[data-theme] .report-card p,
  body[data-theme] .setting-field small,
  body[data-theme] .print-note,
  body[data-theme] .history-mode-note,
  body[data-theme] .group-note,
  body[data-theme] .store-source-note,
  body[data-theme] .cloud-note,
  body[data-theme] .muted,
  body[data-theme] .small-status,
  body[data-theme] .trend-value small,
  body[data-theme] .db-summary span,
  body[data-theme] .kpi-card span,
  body[data-theme] .mini-kpi span,
  body[data-theme] .print-kpi span {
    color: var(--op-text-muted) !important;
    opacity: 1 !important;
  }

  /* Disabled controls are still readable; state comes from checkbox opacity, not invisible labels. */
  body[data-theme] input:disabled,
  body[data-theme] select:disabled,
  body[data-theme] textarea:disabled,
  body[data-theme] button:disabled {
    opacity: .72 !important;
  }
  body[data-theme] .print-page-option,
  body[data-theme] .print-page-option span,
  body[data-theme] label:has(input:disabled),
  body[data-theme] label:has(input:disabled) span {
    color: var(--op-text-muted) !important;
    opacity: 1 !important;
  }
  body[data-theme] .print-page-option input[type="checkbox"] {
    accent-color: var(--op-primary) !important;
  }

  /* Inputs and dropdowns. */
  body[data-theme] input,
  body[data-theme] select,
  body[data-theme] textarea,
  body[data-theme] .search-input,
  body[data-theme] .select-input,
  body[data-theme] .setting-field input,
  body[data-theme] .setting-field select,
  body[data-theme] .order-dispatch-table select,
  body[data-theme] .order-dispatch-table input {
    background: var(--op-surface) !important;
    color: var(--op-text) !important;
    border-color: var(--op-border-strong) !important;
  }
  body[data-theme] input::placeholder,
  body[data-theme] textarea::placeholder,
  body[data-theme] .search-input::placeholder {
    color: var(--op-text-subtle) !important;
    opacity: 1 !important;
  }

  /* Demand trend is a visualization, but dates and numbers must remain legible. */
  body[data-theme] .trend-row {
    color: var(--op-text) !important;
    background: var(--op-surface) !important;
    border-color: var(--op-border) !important;
  }
  body[data-theme] .trend-label,
  body[data-theme] .trend-value strong {
    color: var(--op-text) !important;
    opacity: 1 !important;
  }
  body[data-theme] .trend-track { background: var(--op-track) !important; }
  body[data-theme] .trend-fill { background: var(--op-primary) !important; }

  /* Tables. */
  body[data-theme] .data-table th,
  body[data-theme] .order-matrix th {
    background: var(--op-surface-muted) !important;
    color: var(--op-text) !important;
    border-color: var(--op-border) !important;
  }
  body[data-theme] .data-table td,
  body[data-theme] .order-matrix td {
    color: var(--op-text) !important;
    border-color: var(--op-border) !important;
  }

  /* Alerts and warnings: no beige washout, no pale text. */
  body[data-theme] .alert-item {
    background: var(--op-danger-bg) !important;
    border-color: var(--op-danger-border) !important;
  }
  body[data-theme] .alert-item strong { color: var(--op-danger-text) !important; }
  body[data-theme] .alert-item p { color: var(--op-text-muted) !important; }
  body[data-theme] .alert.warning,
  body[data-theme] .print-warning {
    background: var(--op-warning-bg) !important;
    border-color: var(--op-warning-border) !important;
    color: var(--op-warning-text) !important;
  }
  body[data-theme] .alert.warning *,
  body[data-theme] .print-warning * {
    color: var(--op-warning-text) !important;
  }

  /* Report cards: no white-on-pastel tags. */
  body[data-theme] .report-card {
    background: var(--op-surface) !important;
  }
  body[data-theme] .report-card strong {
    display: inline-block;
    background: transparent !important;
    color: var(--op-text) !important;
    text-shadow: none !important;
  }
  body[data-theme] .report-card:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--op-primary) 34%, transparent);
    outline-offset: 2px;
  }

  /* Buttons: readable in every theme. */
  body[data-theme] .btn.primary,
  body[data-theme] .language-segment-btn.active,
  body[data-theme] .language-segment-btn[aria-pressed="true"],
  body[data-theme] .appearance-segment-btn.active,
  body[data-theme] .appearance-segment-btn[aria-pressed="true"] {
    background: var(--op-primary) !important;
    border-color: var(--op-primary) !important;
    color: #ffffff !important;
  }
  body[data-theme] .btn.secondary,
  body[data-theme] .icon-btn,
  body[data-theme] button.ghost {
    color: var(--op-text) !important;
    border-color: var(--op-border-strong) !important;
  }
}

/* v94: 76 style refinement — cleaner macOS-like rhythm and less warning-card tint. UI-only. */
@media screen {
  body[data-theme="apple"] {
    --radius: 14px !important;
    --radius-sm: 10px !important;
    --shadow: 0 1px 2px rgba(0,0,0,.035), 0 6px 18px rgba(0,0,0,.045) !important;
    --op-page-bg: #f6f6f8 !important;
    --op-surface: #ffffff !important;
    --op-surface-soft: #fbfbfd !important;
    --op-surface-muted: #f2f2f7 !important;
    --op-border: rgba(60,60,67,.14) !important;
    --op-border-strong: rgba(60,60,67,.22) !important;
    --op-danger-text: #b3261e !important;
    --op-danger-bg: #ffffff !important;
    --op-danger-border: rgba(60,60,67,.14) !important;
    background: #f6f6f8 !important;
  }

  body[data-theme="apple"] .main {
    background:
      radial-gradient(900px 440px at 70% -180px, rgba(0,122,255,.08), transparent 60%),
      #f6f6f8 !important;
  }

  body[data-theme="apple"] .view {
    gap: 14px !important;
  }

  body[data-theme="apple"] .panel,
  body[data-theme="apple"] .kpi-card,
  body[data-theme="apple"] .report-card,
  body[data-theme="apple"] .mini-kpi,
  body[data-theme="apple"] .print-kpi,
  body[data-theme="apple"] .setting-field,
  body[data-theme="apple"] .barcode-main-card,
  body[data-theme="apple"] .barcode-side-card,
  body[data-theme="apple"] .barcode-help-card,
  body[data-theme="apple"] .barcode-validation-card,
  body[data-theme="apple"] .barcode-options-box,
  body[data-theme="apple"] .barcode-preview-panel,
  body[data-theme="apple"] .barcode-preview-card,
  body[data-theme="apple"] .cloud-sharing-panel,
  body[data-theme="apple"] .cloud-workflow-card,
  body[data-theme="apple"] .cloud-details,
  body[data-theme="apple"] .db-summary div,
  body[data-theme="apple"] .file-row,
  body[data-theme="apple"] .empty-state,
  body[data-theme="apple"] .table-scroll,
  body[data-theme="apple"] .history-table-wrap,
  body[data-theme="apple"] .activity-log-content.table-wrap,
  body[data-theme="apple"] .drop-zone,
  body[data-theme="apple"] .print-page-options,
  body[data-theme="apple"] .order-dispatch-editor,
  body[data-theme="apple"] .sidebar-card {
    border-radius: 18px !important;
    border-color: rgba(60,60,67,.13) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.035), 0 6px 16px rgba(0,0,0,.04) !important;
  }

  body[data-theme="apple"] .kpi-card,
  body[data-theme="apple"] .mini-kpi,
  body[data-theme="apple"] .print-kpi,
  body[data-theme="apple"] .setting-field,
  body[data-theme="apple"] .report-card {
    background: rgba(255,255,255,.92) !important;
  }

  body[data-theme="apple"] .panel-header h3,
  body[data-theme="apple"] .view > .panel.wide > .panel-header h3,
  body[data-theme="apple"] .section-label h4,
  body[data-theme="apple"] .print-section h4,
  body[data-theme="apple"] .barcode-page-title,
  body[data-theme="apple"] h2,
  body[data-theme="apple"] h3 {
    font-weight: 700 !important;
    letter-spacing: 0 !important;
  }

  body[data-theme="apple"] .panel-header p,
  body[data-theme="apple"] .section-label p,
  body[data-theme="apple"] .panel-subnote,
  body[data-theme="apple"] .print-note,
  body[data-theme="apple"] .muted-label {
    color: #6e6e73 !important;
    font-weight: 450 !important;
  }

  /* Critical alerts should feel like macOS notification/list cards, not pink warning banners. */
  body[data-theme="apple"] .alerts-list {
    gap: 10px !important;
  }

  body[data-theme="apple"] .alert-item {
    position: relative !important;
    background: rgba(255,255,255,.94) !important;
    border: 1px solid rgba(60,60,67,.14) !important;
    border-radius: 16px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.035), 0 5px 14px rgba(0,0,0,.035) !important;
    padding: 12px 14px 12px 18px !important;
    overflow: hidden !important;
  }

  body[data-theme="apple"] .alert-item::before {
    content: "";
    position: absolute;
    inset: 10px auto 10px 0;
    width: 4px;
    border-radius: 999px;
    background: #ff3b30;
  }

  body[data-theme="apple"] .alert-item strong {
    color: #1d1d1f !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
  }

  body[data-theme="apple"] .alert-item p {
    color: #6e6e73 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-top: 6px !important;
  }

  /* Keep non-76 themes readable, but less beige/pink-heavy too. */
  body[data-theme="light"] .alert-item {
    background: #ffffff !important;
    border-color: #e4e7ec !important;
    border-left: 4px solid #dc2626 !important;
    box-shadow: 0 1px 2px rgba(16,24,40,.04) !important;
  }
  body[data-theme="light"] .alert-item strong { color: #111827 !important; }
  body[data-theme="light"] .alert-item p { color: #667085 !important; }

  body[data-theme="dark"] .alert-item {
    background: rgba(17,24,39,.92) !important;
    border-color: rgba(226,232,240,.16) !important;
    border-left: 4px solid #f87171 !important;
    box-shadow: none !important;
  }
  body[data-theme="dark"] .alert-item strong { color: #f8fafc !important; }
  body[data-theme="dark"] .alert-item p { color: #cbd5e1 !important; }

  /* 76 controls: closer to macOS segmented controls without bulky pills. */
  body[data-theme="apple"] .language-segment,
  body[data-theme="apple"] .appearance-segment,
  body[data-theme="apple"] .topbar-sync {
    background: rgba(255,255,255,.86) !important;
    border-color: rgba(60,60,67,.12) !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.04) !important;
    backdrop-filter: saturate(180%) blur(18px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(18px) !important;
  }

  body[data-theme="apple"] .language-segment-btn,
  body[data-theme="apple"] .appearance-segment-btn {
    padding: 6px 10px !important;
    font-size: 12px !important;
    font-weight: 650 !important;
  }

  body[data-theme="apple"] .language-segment-btn.active,
  body[data-theme="apple"] .language-segment-btn[aria-pressed="true"],
  body[data-theme="apple"] .appearance-segment-btn.active,
  body[data-theme="apple"] .appearance-segment-btn[aria-pressed="true"] {
    background: #007aff !important;
    color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.12) !important;
  }

  body[data-theme="apple"] .btn,
  body[data-theme="apple"] button,
  body[data-theme="apple"] input,
  body[data-theme="apple"] select,
  body[data-theme="apple"] textarea {
    border-radius: 12px !important;
  }

  body[data-theme="apple"] .btn.primary {
    background: #007aff !important;
    border-color: #007aff !important;
    box-shadow: 0 1px 2px rgba(0,122,255,.18) !important;
  }

  body[data-theme="apple"] .btn.secondary,
  body[data-theme="apple"] button.ghost,
  body[data-theme="apple"] .icon-btn {
    background: rgba(255,255,255,.9) !important;
    border-color: rgba(60,60,67,.18) !important;
  }

  body[data-theme="apple"] .trend-row,
  body[data-theme="apple"] .file-row,
  body[data-theme="apple"] .log-line {
    border-radius: 14px !important;
  }
}

/* v95: sidebar data snapshot contrast fix.
   Keep snapshot values readable in all themes. This replaces scattered muted rules
   that allowed value text to become almost white on light/76 surfaces. */
.sidebar-status-card .muted-label,
.sidebar-status-card h3 {
  color: var(--op-text-muted, #667085) !important;
}
.sidebar-status-card .sidebar-status-row span:first-child,
.sidebar-status-card .sidebar-status-row span {
  color: var(--op-text-muted, #667085) !important;
}
.sidebar-status-card .sidebar-status-row strong {
  color: var(--op-text, #1f2937) !important;
  opacity: 1 !important;
}
body[data-theme="light"] .sidebar-status-card,
body[data-theme="apple"] .sidebar-status-card {
  background: rgba(255,255,255,.92) !important;
  border-color: rgba(60,60,67,.18) !important;
}
body[data-theme="light"] .sidebar-status-card .muted-label,
body[data-theme="light"] .sidebar-status-card h3,
body[data-theme="light"] .sidebar-status-card .sidebar-status-row span:first-child,
body[data-theme="light"] .sidebar-status-card .sidebar-status-row span {
  color: #667085 !important;
}
body[data-theme="light"] .sidebar-status-card .sidebar-status-row strong {
  color: #111827 !important;
}
body[data-theme="apple"] .sidebar-status-card .muted-label,
body[data-theme="apple"] .sidebar-status-card h3,
body[data-theme="apple"] .sidebar-status-card .sidebar-status-row span:first-child,
body[data-theme="apple"] .sidebar-status-card .sidebar-status-row span {
  color: #6e6e73 !important;
}
body[data-theme="apple"] .sidebar-status-card .sidebar-status-row strong {
  color: #1d1d1f !important;
}
body[data-theme="dark"] .sidebar-status-card {
  background: rgba(15,23,42,.82) !important;
  border-color: rgba(226,232,240,.16) !important;
}
body[data-theme="dark"] .sidebar-status-card .muted-label,
body[data-theme="dark"] .sidebar-status-card h3,
body[data-theme="dark"] .sidebar-status-card .sidebar-status-row span:first-child,
body[data-theme="dark"] .sidebar-status-card .sidebar-status-row span {
  color: #94a3b8 !important;
}
body[data-theme="dark"] .sidebar-status-card .sidebar-status-row strong {
  color: #f8fafc !important;
}

/* v96: HIG-aligned 76 design-system rebuild.
   Principles applied from Apple HIG: platform/system typography, adaptive system colors,
   clear foreground/background contrast, restrained materials, and consistent control metrics.
   This is intentionally a token-driven layer placed last so older one-off color rules do not win. */

:root {
  --hig-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Inter", "Segoe UI", Arial, sans-serif;
  --hig-radius-sm: 8px;
  --hig-radius-md: 10px;
  --hig-radius-lg: 14px;
  --hig-radius-xl: 18px;
  --hig-control-h: 34px;
  --hig-control-pad-x: 12px;
  --hig-gap-xs: 6px;
  --hig-gap-sm: 8px;
  --hig-gap-md: 12px;
  --hig-gap-lg: 16px;
  --hig-gap-xl: 20px;
}

body[data-theme="light"] {
  --hig-bg: #f5f7fb;
  --hig-sidebar: #ffffff;
  --hig-surface: #ffffff;
  --hig-surface-raised: #ffffff;
  --hig-surface-soft: #f8fafc;
  --hig-text: #111827;
  --hig-text-secondary: #344054;
  --hig-text-tertiary: #667085;
  --hig-text-quaternary: #98a2b3;
  --hig-border: #d7dce5;
  --hig-separator: #e5e7eb;
  --hig-blue: #2563eb;
  --hig-blue-hover: #1d4ed8;
  --hig-blue-soft: #eff6ff;
  --hig-red: #dc2626;
  --hig-red-soft: #fff5f5;
  --hig-red-border: #fecaca;
  --hig-orange: #b45309;
  --hig-orange-soft: #fff7ed;
  --hig-orange-border: #fed7aa;
  --hig-green: #15803d;
  --hig-green-soft: #f0fdf4;
  --hig-track: #e5e7eb;
  --hig-shadow: 0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.06);
}

body[data-theme="apple"] {
  /* macOS-like 76: light, translucent sidebars; white content surfaces; system blue; readable text. */
  --hig-bg: #f5f5f7;
  --hig-sidebar: rgba(246, 247, 249, .84);
  --hig-surface: rgba(255,255,255,.82);
  --hig-surface-raised: rgba(255,255,255,.96);
  --hig-surface-soft: rgba(242,242,247,.78);
  --hig-text: #1d1d1f;
  --hig-text-secondary: #3c3c43;
  --hig-text-tertiary: #6e6e73;
  --hig-text-quaternary: #86868b;
  --hig-border: rgba(60,60,67,.18);
  --hig-separator: rgba(60,60,67,.12);
  --hig-blue: #007aff;
  --hig-blue-hover: #006fe6;
  --hig-blue-soft: rgba(0,122,255,.10);
  --hig-red: #d70015;
  --hig-red-soft: rgba(255,59,48,.07);
  --hig-red-border: rgba(255,59,48,.22);
  --hig-orange: #9a5a00;
  --hig-orange-soft: rgba(255,149,0,.10);
  --hig-orange-border: rgba(255,149,0,.28);
  --hig-green: #248a3d;
  --hig-green-soft: rgba(52,199,89,.12);
  --hig-track: rgba(60,60,67,.16);
  --hig-shadow: 0 1px 2px rgba(0,0,0,.045), 0 10px 30px rgba(0,0,0,.055);
}

body[data-theme="dark"] {
  --hig-bg: #0b0f17;
  --hig-sidebar: #0f172a;
  --hig-surface: #111827;
  --hig-surface-raised: #182235;
  --hig-surface-soft: #0f172a;
  --hig-text: #f8fafc;
  --hig-text-secondary: #e2e8f0;
  --hig-text-tertiary: #cbd5e1;
  --hig-text-quaternary: #94a3b8;
  --hig-border: rgba(226,232,240,.18);
  --hig-separator: rgba(226,232,240,.10);
  --hig-blue: #60a5fa;
  --hig-blue-hover: #93c5fd;
  --hig-blue-soft: rgba(96,165,250,.16);
  --hig-red: #fca5a5;
  --hig-red-soft: rgba(248,113,113,.12);
  --hig-red-border: rgba(248,113,113,.30);
  --hig-orange: #fbbf24;
  --hig-orange-soft: rgba(251,191,36,.14);
  --hig-orange-border: rgba(251,191,36,.34);
  --hig-green: #86efac;
  --hig-green-soft: rgba(34,197,94,.14);
  --hig-track: rgba(226,232,240,.14);
  --hig-shadow: none;
}

body,
body[data-theme="apple"],
body[data-theme="light"],
body[data-theme="dark"] {
  font-family: var(--hig-font) !important;
  background: var(--hig-bg) !important;
  color: var(--hig-text) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button, input, select, textarea { font-family: var(--hig-font) !important; }

/* Shell and sidebar: no low-contrast translucency without readable text. */
.sidebar {
  background: var(--hig-sidebar) !important;
  color: var(--hig-text) !important;
  border-right: 1px solid var(--hig-separator) !important;
}
body[data-theme="apple"] .sidebar {
  backdrop-filter: saturate(180%) blur(22px) !important;
  -webkit-backdrop-filter: saturate(180%) blur(22px) !important;
}
.brand h1,
.nav-item,
.panel-header h3,
.section-label h4,
.print-section h4,
.barcode-page-title,
h1, h2, h3, h4 {
  color: var(--hig-text) !important;
  letter-spacing: 0 !important;
}
.brand p,
.panel-header p,
.section-label p,
.panel-subnote,
.print-note,
small,
.muted,
.muted-label,
.helper,
.hint,
.hint-text,
.file-meta,
.report-card span {
  color: var(--hig-text-tertiary) !important;
}

/* Navigation: Apple-like selection, clear hover, no heavy glow. */
.nav { gap: 4px !important; }
.nav-item {
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: var(--hig-text-secondary) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
.nav-item:hover {
  background: var(--hig-surface-soft) !important;
  color: var(--hig-text) !important;
}
.nav-item.active {
  background: var(--hig-blue) !important;
  color: #fff !important;
}
.nav-item.active:hover { background: var(--hig-blue-hover) !important; color: #fff !important; }

/* Surfaces: consistent card metric and readable foregrounds. */
.panel,
.kpi-card,
.mini-kpi,
.print-kpi,
.report-card,
.setting-field,
.db-summary div,
.drop-zone,
.file-row,
.log-line,
.empty-state,
.pallet-label-preview-card,
.barcode-card,
.barcode-tool-panel,
.order-dispatch-editor,
.print-page-options,
.sidebar-card,
.table-wrap,
.tableWrap {
  background: var(--hig-surface-raised) !important;
  color: var(--hig-text) !important;
  border: 1px solid var(--hig-border) !important;
  border-radius: var(--hig-radius-xl) !important;
  box-shadow: var(--hig-shadow) !important;
}
body[data-theme="dark"] .panel,
body[data-theme="dark"] .kpi-card,
body[data-theme="dark"] .mini-kpi,
body[data-theme="dark"] .print-kpi,
body[data-theme="dark"] .report-card,
body[data-theme="dark"] .setting-field,
body[data-theme="dark"] .db-summary div,
body[data-theme="dark"] .drop-zone,
body[data-theme="dark"] .file-row,
body[data-theme="dark"] .log-line,
body[data-theme="dark"] .empty-state,
body[data-theme="dark"] .pallet-label-preview-card,
body[data-theme="dark"] .barcode-card,
body[data-theme="dark"] .barcode-tool-panel,
body[data-theme="dark"] .order-dispatch-editor,
body[data-theme="dark"] .print-page-options,
body[data-theme="dark"] .sidebar-card,
body[data-theme="dark"] .table-wrap,
body[data-theme="dark"] .tableWrap {
  box-shadow: none !important;
}

/* Tables: avoid header leaks and keep all text readable. */
.table-wrap,
.tableWrap,
.table-scroll,
.data-table-shell {
  overflow: hidden !important;
  border-radius: var(--hig-radius-lg) !important;
  background: var(--hig-surface-raised) !important;
}
table, thead, tbody, tr, th, td { border-color: var(--hig-separator) !important; }
thead th,
.table thead th,
.data-table thead th {
  background: var(--hig-surface-soft) !important;
  color: var(--hig-text-secondary) !important;
  font-weight: 700 !important;
}
tbody td,
.table tbody td,
.data-table tbody td {
  color: var(--hig-text) !important;
  background: transparent !important;
}
tbody td small,
tbody td .muted,
.table-cell-muted,
.rec-detail,
.cell-detail { color: var(--hig-text-tertiary) !important; }

/* Inputs and controls: system-like sizes and contrast. */
input,
select,
textarea,
.input,
.select {
  min-height: var(--hig-control-h) !important;
  padding: 6px var(--hig-control-pad-x) !important;
  color: var(--hig-text) !important;
  background: var(--hig-surface-raised) !important;
  border: 1px solid var(--hig-border) !important;
  border-radius: var(--hig-radius-md) !important;
  box-shadow: none !important;
}
input::placeholder,
textarea::placeholder { color: var(--hig-text-quaternary) !important; opacity: 1 !important; }
input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: var(--hig-blue) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--hig-blue) 18%, transparent) !important;
}

.btn,
button:not(.nav-item):not(.language-segment-btn):not(.appearance-segment-btn),
.topbar-sync-action {
  min-height: var(--hig-control-h) !important;
  padding: 6px 12px !important;
  border-radius: var(--hig-radius-md) !important;
  font-weight: 650 !important;
  border: 1px solid var(--hig-border) !important;
  background: var(--hig-surface-raised) !important;
  color: var(--hig-text) !important;
  box-shadow: none !important;
}
.btn.primary,
button.primary,
.topbar-sync-action,
#printOrderBtn,
#printBarcodeBtn {
  background: var(--hig-blue) !important;
  border-color: var(--hig-blue) !important;
  color: #fff !important;
}
.btn.primary:hover,
button.primary:hover,
.topbar-sync-action:hover { background: var(--hig-blue-hover) !important; border-color: var(--hig-blue-hover) !important; }
.btn.danger,
button.danger,
#clearAllDataBtn { background: var(--hig-red) !important; border-color: var(--hig-red) !important; color: #fff !important; }

/* Segmented controls: readable, centered, not crammed. */
.language-segment,
.appearance-segment,
.topbar-sync {
  min-height: 34px !important;
  padding: 3px !important;
  border-radius: 999px !important;
  background: var(--hig-surface-raised) !important;
  border: 1px solid var(--hig-border) !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.04) !important;
}
.language-segment-btn,
.appearance-segment-btn {
  min-height: 28px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  color: var(--hig-text-secondary) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
.language-segment-btn.active,
.language-segment-btn[aria-pressed="true"],
.appearance-segment-btn.active,
.appearance-segment-btn[aria-pressed="true"] {
  background: var(--hig-blue) !important;
  color: #fff !important;
}

/* Warning / error / success components: semantic foregrounds on semantic backgrounds. */
.alert,
.print-warning,
.stock-warning-note,
.warning-note,
.notice.warning {
  background: var(--hig-orange-soft) !important;
  color: var(--hig-orange) !important;
  border: 1px solid var(--hig-orange-border) !important;
  border-radius: var(--hig-radius-lg) !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  text-shadow: none !important;
}
.alert *,
.print-warning *,
.stock-warning-note *,
.warning-note *,
.notice.warning * {
  color: inherit !important;
}
.alert.error,
.notice.error,
.danger-note {
  background: var(--hig-red-soft) !important;
  color: var(--hig-red) !important;
  border-color: var(--hig-red-border) !important;
}

/* Critical alerts: quiet list cards, no pink banners. */
.alerts-list { gap: 10px !important; }
.alert-item {
  position: relative !important;
  background: var(--hig-surface-raised) !important;
  border: 1px solid var(--hig-border) !important;
  border-radius: var(--hig-radius-lg) !important;
  box-shadow: none !important;
  padding: 12px 14px 12px 18px !important;
  overflow: hidden !important;
}
.alert-item::before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 4px;
  border-radius: 999px;
  background: var(--hig-red);
}
.alert-item strong { color: var(--hig-text) !important; font-size: 15px !important; font-weight: 700 !important; }
.alert-item p { color: var(--hig-text-tertiary) !important; font-size: 13px !important; line-height: 1.45 !important; }

/* Demand trend: readable dates and values, no washed-out bars. */
.trend-row {
  background: var(--hig-surface-raised) !important;
  border: 1px solid var(--hig-border) !important;
  border-radius: var(--hig-radius-lg) !important;
  color: var(--hig-text) !important;
}
.trend-date,
.trend-value,
.trend-row strong { color: var(--hig-text) !important; opacity: 1 !important; }
.trend-label,
.trend-row small { color: var(--hig-text-tertiary) !important; opacity: 1 !important; }
.trend-bar,
.trend-track { background: var(--hig-track) !important; }
.trend-fill,
.bar-fill { background: var(--hig-blue) !important; }

/* Disabled content still must be legible as disabled, not invisible. */
:disabled,
.disabled,
[aria-disabled="true"] {
  opacity: .58 !important;
}
.print-page-option,
.print-page-option span,
.print-page-option label,
.checkbox-label,
label {
  color: var(--hig-text-secondary) !important;
}
.print-page-option:has(input:disabled),
.print-page-option input:disabled + span,
.print-page-option input:disabled ~ span {
  color: var(--hig-text-tertiary) !important;
  opacity: .72 !important;
}

/* Reports/cards text and badges. */
.report-card strong,
.kpi-card strong,
.mini-kpi strong,
.print-kpi strong { color: var(--hig-text) !important; }
.report-card span,
.kpi-card span,
.kpi-card small,
.mini-kpi span,
.print-kpi span { color: var(--hig-text-tertiary) !important; }
.badge.warning { background: var(--hig-orange-soft) !important; color: var(--hig-orange) !important; border-color: var(--hig-orange-border) !important; }
.badge.danger,
.badge.critical { background: var(--hig-red-soft) !important; color: var(--hig-red) !important; border-color: var(--hig-red-border) !important; }
.badge.success,
.badge.healthy { background: var(--hig-green-soft) !important; color: var(--hig-green) !important; }

/* Keep Arabic using Cairo, but keep 76 Latin/Hebrew/Russian in system font rhythm. */
html[lang="ar"] body,
body[dir="rtl"]:lang(ar),
body[data-language="ar"] {
  font-family: Cairo, var(--hig-font) !important;
}

/* v96 visual QA marker: if a component uses these token colors, it passed the semantic contrast audit. */

/* v97 Interface QA panel -------------------------------------------------- */
.contrast-check-result {
  margin: 12px 0 20px;
  padding: 12px 14px;
  border-radius: var(--hig-radius-lg, 14px);
  border: 1px solid var(--hig-border, #d6d9df);
  background: var(--hig-surface-raised, #fff);
  color: var(--hig-text, #111827);
}
.contrast-check-result.pass {
  border-color: var(--hig-green-border, rgba(52, 199, 89, .35));
  background: var(--hig-green-soft, rgba(52, 199, 89, .10));
}
.contrast-check-result.warn {
  border-color: var(--hig-orange-border, rgba(255, 149, 0, .38));
  background: var(--hig-orange-soft, rgba(255, 149, 0, .10));
}
.contrast-check-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: baseline;
}
.contrast-check-head strong {
  color: var(--hig-text, #111827);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
}
.contrast-check-head span,
.contrast-check-note {
  color: var(--hig-text-secondary, #4b5563);
  font-size: 12px;
  line-height: 1.4;
}
.contrast-check-list {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}
.contrast-check-item {
  display: grid;
  grid-template-columns: 64px minmax(140px, 1fr) minmax(120px, auto);
  gap: 10px;
  align-items: center;
  padding: 7px 9px;
  border-radius: var(--hig-radius-md, 10px);
  background: color-mix(in srgb, var(--hig-surface-raised, #fff) 82%, var(--hig-orange-soft, #fff4df));
  border: 1px solid var(--hig-separator, #e5e7eb);
}
.contrast-check-item strong {
  color: var(--hig-red, #b42318);
  font-size: 12px;
  font-weight: 700;
}
.contrast-check-item span {
  color: var(--hig-text, #111827);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.contrast-check-item code {
  justify-self: end;
  color: var(--hig-text-tertiary, #6b7280);
  font-size: 11px;
  background: transparent;
}
body[data-appearance="dark"] .contrast-check-result,
body.theme-dark .contrast-check-result {
  background: var(--hig-surface-raised, #1c1c1e);
}
@media (max-width: 900px) {
  .contrast-check-item { grid-template-columns: 60px 1fr; }
  .contrast-check-item code { grid-column: 2; justify-self: start; }
}

/* v98: broader interface QA report. */
.contrast-check-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 4px;
}
.qa-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  border: 1px solid var(--hig-separator, #e5e7eb);
  color: var(--hig-text-secondary, #4b5563);
  background: var(--hig-surface-soft, #f8fafc);
}
.qa-chip.pass {
  color: var(--hig-green, #12805c);
  border-color: color-mix(in srgb, var(--hig-green, #12805c) 28%, transparent);
  background: color-mix(in srgb, var(--hig-green, #12805c) 9%, var(--hig-surface-raised, #fff));
}
.qa-chip.warn {
  color: var(--hig-orange-text, #7a3f00);
  border-color: var(--hig-orange-border, #f4bd50);
  background: var(--hig-orange-soft, #fff4df);
}
body[data-theme="dark"] .qa-chip.warn {
  color: var(--hig-orange-text, #ffd28a);
}

/* v99: Settings page restructure and readability pass.
   Goal: reduce card clutter, lower excessive bold weight, and make settings easier to scan. */
#database.view.active {
  max-width: 1280px;
}

#database .panel.wide {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#database > .panel.wide > .panel-header:first-child {
  margin: 0 0 20px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#database > .panel.wide > .panel-header:first-child h3 {
  font-size: 26px !important;
  line-height: 1.12 !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
  margin-bottom: 6px !important;
}

#database > .panel.wide > .panel-header:first-child p {
  max-width: 640px;
  font-size: 14px !important;
  line-height: 1.42 !important;
  color: var(--op-text-secondary, var(--muted)) !important;
}

#database .section-label {
  margin: 22px 0 10px !important;
  padding-top: 0 !important;
}

#database .section-label h4,
#database .panel-header h3,
#database .cloud-workflow-card strong {
  font-weight: 680 !important;
  letter-spacing: 0 !important;
}

#database .section-label h4 {
  font-size: 16px !important;
  line-height: 1.25 !important;
}

#database .section-label p,
#database .panel-header p,
#database .cloud-workflow-card p {
  font-size: 13px !important;
  line-height: 1.42 !important;
  color: var(--op-text-secondary, var(--muted)) !important;
}

#database .settings-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(320px, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden !important;
  border: 1px solid var(--op-border, var(--line)) !important;
  border-radius: 18px !important;
  background: var(--op-surface, #fff) !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .05) !important;
}

#database .settings-grid .setting-field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(124px, 178px) !important;
  grid-template-rows: auto auto !important;
  column-gap: 18px !important;
  row-gap: 4px !important;
  align-items: center !important;
  min-height: 82px !important;
  padding: 14px 16px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--op-separator, var(--op-border, var(--line))) !important;
}

#database .settings-grid .setting-field:nth-child(odd) {
  border-right: 1px solid var(--op-separator, var(--op-border, var(--line))) !important;
}

#database .settings-grid .setting-field:nth-last-child(-n+2) {
  border-bottom: 0 !important;
}

#database .settings-grid .setting-field > span {
  grid-column: 1 !important;
  grid-row: 1 !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  color: var(--op-text, var(--text)) !important;
}

#database .settings-grid .setting-field > small {
  grid-column: 1 !important;
  grid-row: 2 !important;
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 430 !important;
  color: var(--op-text-secondary, var(--muted)) !important;
}

#database .settings-grid .setting-field > input,
#database .settings-grid .setting-field > select {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  min-height: 36px !important;
  height: 36px !important;
  align-self: center !important;
  font-weight: 560 !important;
}

#database .database-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 16px 0 26px !important;
  padding: 0 !important;
}

#database .database-actions .btn {
  min-height: 34px !important;
  padding: 8px 12px !important;
  font-weight: 620 !important;
}

#database #resetDbBtn {
  margin-left: auto !important;
}

#database .cloud-sharing-panel,
#database .data-management,
#database .group-manager,
#database .shipping-manager,
#database .store-directory-manager {
  margin-top: 28px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--op-separator, var(--line)) !important;
}

#database .cloud-sharing-panel {
  background: transparent !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#database .cloud-workflow-card,
#database .cloud-status-box,
#database .cloud-details,
#database .cloud-conflict-panel,
#database .contrast-check-result {
  border-radius: 16px !important;
  box-shadow: none !important;
}

#database .cloud-auth-grid,
#database .cloud-sharing-grid,
#database .group-form,
#database .store-directory-form {
  gap: 12px !important;
}

#database .cloud-auth-grid .setting-field,
#database .cloud-sharing-grid .setting-field,
#database .group-form .setting-field,
#database .store-directory-form .setting-field {
  border-radius: 14px !important;
  padding: 12px !important;
  background: var(--op-surface, #fff) !important;
}

@media (max-width: 980px) {
  #database .settings-grid {
    grid-template-columns: 1fr !important;
  }
  #database .settings-grid .setting-field,
  #database .settings-grid .setting-field:nth-child(odd) {
    border-right: 0 !important;
    border-bottom: 1px solid var(--op-separator, var(--op-border, var(--line))) !important;
  }
  #database .settings-grid .setting-field:last-child {
    border-bottom: 0 !important;
  }
  #database #resetDbBtn {
    margin-left: 0 !important;
  }
}

@media (max-width: 640px) {
  #database .settings-grid .setting-field {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto !important;
    min-height: 0 !important;
  }
  #database .settings-grid .setting-field > input,
  #database .settings-grid .setting-field > select {
    grid-column: 1 !important;
    grid-row: 2 !important;
    margin-top: 6px !important;
  }
  #database .settings-grid .setting-field > small {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
}

/* v100: QA-driven contrast hardening.
   This final layer targets the exact classes/IDs reported by the all-page contrast scan.
   It avoids visual redesign and only prevents unreadable foreground/background pairs. */
@media screen {
  body[data-theme="light"], body[data-theme="apple"], body[data-theme="dark"] {
    --qa-text: var(--hig-text);
    --qa-text-secondary: var(--hig-text-secondary);
    --qa-text-tertiary: var(--hig-text-tertiary);
    --qa-surface: var(--hig-surface-raised);
    --qa-soft: var(--hig-surface-soft);
    --qa-border: var(--hig-border);
    --qa-blue: var(--hig-blue);
    --qa-green: var(--hig-green);
    --qa-orange: var(--hig-orange);
    --qa-red: var(--hig-red);
  }

  /* KPI cards: previous theme layers could leave labels/numbers invisible in dark. */
  body[data-theme] .kpi-card,
  body[data-theme] .kpi-card * {
    text-shadow: none !important;
  }
  body[data-theme] .kpi-card {
    background: var(--qa-surface) !important;
    color: var(--qa-text) !important;
  }
  body[data-theme] .kpi-card span,
  body[data-theme] .kpi-card .kpi-label {
    color: var(--qa-text-secondary) !important;
    opacity: 1 !important;
  }
  body[data-theme] .kpi-card strong,
  body[data-theme] .kpi-card .kpi-value,
  body[data-theme] #kpiHealth,
  body[data-theme] #kpiCritical,
  body[data-theme] #kpiHealthy,
  body[data-theme] #kpiUtilization,
  body[data-theme] #kpiLastUpdate {
    color: var(--qa-text) !important;
    opacity: 1 !important;
  }
  body[data-theme] #kpiHealthNote,
  body[data-theme] #kpiCriticalNote,
  body[data-theme] #kpiHealthyNote,
  body[data-theme] #kpiUtilizationNote,
  body[data-theme] #kpiImportCount {
    color: var(--qa-text-secondary) !important;
    opacity: 1 !important;
  }

  /* Order matrix and dispatch badges: keep request/collect text readable in all themes. */
  body[data-theme] .order-matrix td,
  body[data-theme] .order-matrix td strong,
  body[data-theme] .order-matrix td.number,
  body[data-theme] .order-dispatch-table td,
  body[data-theme] .order-dispatch-table strong {
    color: var(--qa-text) !important;
    opacity: 1 !important;
  }
  body[data-theme] .order-matrix .cell-requested,
  body[data-theme] .order-matrix td.shortage-none .cell-requested,
  body[data-theme] .order-matrix td.shortage-partial .cell-requested {
    color: var(--qa-text-secondary) !important;
    border-top-color: var(--qa-border) !important;
    opacity: 1 !important;
  }
  body[data-theme] .order-matrix .cell-collect {
    color: var(--qa-text) !important;
    opacity: 1 !important;
  }

  body[data-theme] .shipping-badge {
    border: 1px solid transparent !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }
  body[data-theme="light"] .shipping-badge.katz,
  body[data-theme="apple"] .shipping-badge.katz {
    color: #06448f !important;
    background: #e8f1ff !important;
    border-color: #a9ccff !important;
  }
  body[data-theme="light"] .shipping-badge.driver,
  body[data-theme="apple"] .shipping-badge.driver {
    color: #6f3f00 !important;
    background: #fff3d6 !important;
    border-color: #f4c56a !important;
  }
  body[data-theme="light"] .shipping-badge.other,
  body[data-theme="apple"] .shipping-badge.other {
    color: #334155 !important;
    background: #eef2f7 !important;
    border-color: #cbd5e1 !important;
  }
  body[data-theme="dark"] .shipping-badge.katz {
    color: #dbeafe !important;
    background: rgba(37, 99, 235, .34) !important;
    border-color: rgba(147,197,253,.45) !important;
  }
  body[data-theme="dark"] .shipping-badge.driver {
    color: #fde68a !important;
    background: rgba(146, 64, 14, .36) !important;
    border-color: rgba(251,191,36,.46) !important;
  }
  body[data-theme="dark"] .shipping-badge.other {
    color: #e2e8f0 !important;
    background: rgba(148,163,184,.18) !important;
    border-color: rgba(203,213,225,.28) !important;
  }

  /* Status badges, especially hibernating, were too close to the badge background in 76. */
  body[data-theme] .badge,
  body[data-theme] .status-badge {
    text-shadow: none !important;
    opacity: 1 !important;
  }
  body[data-theme="light"] .badge.hibernating,
  body[data-theme="apple"] .badge.hibernating {
    color: #312e81 !important;
    background: #eef2ff !important;
    border: 1px solid #c7d2fe !important;
  }
  body[data-theme="dark"] .badge.hibernating {
    color: #ddd6fe !important;
    background: rgba(99,102,241,.24) !important;
    border: 1px solid rgba(196,181,253,.36) !important;
  }

  /* Reports: remove decorative label fills that can produce white-on-pastel text. */
  body[data-theme] .report-card,
  body[data-theme] .report-card * {
    text-shadow: none !important;
  }
  body[data-theme] .report-card strong {
    color: var(--qa-text) !important;
    background: transparent !important;
    -webkit-text-fill-color: var(--qa-text) !important;
    opacity: 1 !important;
  }
  body[data-theme] .report-card span,
  body[data-theme] .report-card p {
    color: var(--qa-text-secondary) !important;
    opacity: 1 !important;
  }

  /* Print page options and disabled labels: disabled should be dim, not unreadable. */
  body[data-theme] .print-page-options,
  body[data-theme] .print-page-options * {
    text-shadow: none !important;
  }
  body[data-theme] .print-page-options h4,
  body[data-theme] .print-page-option,
  body[data-theme] .print-page-option label,
  body[data-theme] .print-page-option span,
  body[data-theme] .checkbox-label {
    color: var(--qa-text-secondary) !important;
    opacity: 1 !important;
  }
  body[data-theme] .print-page-option:has(input:disabled),
  body[data-theme] .print-page-option input:disabled + span,
  body[data-theme] .print-page-option input:disabled ~ span,
  body[data-theme] label:has(input:disabled),
  body[data-theme] label:has(input:disabled) span {
    color: var(--qa-text-tertiary) !important;
    opacity: .9 !important;
  }
  body[data-theme] input[type="checkbox"] {
    accent-color: var(--qa-blue) !important;
  }

  /* Warnings: never use pale yellow foreground on pale yellow background. */
  body[data-theme] .alert.warning,
  body[data-theme] .print-warning,
  body[data-theme] .stock-warning-note,
  body[data-theme] .warning-note,
  body[data-theme] .notice.warning {
    background: var(--hig-orange-soft) !important;
    border-color: var(--hig-orange-border) !important;
    color: var(--hig-orange) !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }
  body[data-theme] .alert.warning *,
  body[data-theme] .print-warning *,
  body[data-theme] .stock-warning-note *,
  body[data-theme] .warning-note *,
  body[data-theme] .notice.warning * {
    color: var(--hig-orange) !important;
    text-shadow: none !important;
    opacity: 1 !important;
  }

  /* Barcode preview / helper text. */
  body[data-theme] .barcode-preview-panel strong,
  body[data-theme] .barcode-preview-card strong,
  body[data-theme] .barcode-card strong {
    color: var(--qa-text) !important;
    opacity: 1 !important;
  }
  body[data-theme] .barcode-preview-panel .muted,
  body[data-theme] .barcode-preview-card .muted,
  body[data-theme] .barcode-card .muted {
    color: var(--qa-text-secondary) !important;
    opacity: 1 !important;
  }

  /* Generic safety net for any text that older rules made transparent/washed out inside app surfaces. */
  body[data-theme] .panel :where(.muted, .muted-label, small, .helper, .hint, .hint-text, .cell-detail, .rec-detail),
  body[data-theme] .table-wrap :where(.muted, small, .cell-detail, .rec-detail),
  body[data-theme] .order-dispatch-editor :where(.muted, small, .cell-detail, .rec-detail) {
    color: var(--qa-text-secondary) !important;
    opacity: 1 !important;
  }
}

/* v101: light logo mark for dark theme */
body[data-theme="dark"] .brand-mark {
  background: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%) !important;
  color: #0f172a !important;
  border: 1px solid rgba(226, 232, 240, .92) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 10px 24px rgba(0,0,0,.34) !important;
  text-shadow: none !important;
}
body[data-theme="dark"] .brand-mark::after {
  background: #0a84ff !important;
  box-shadow: none !important;
}
body[data-theme="dark"] .brand h1 {
  color: #f8fafc !important;
}
body[data-theme="dark"] .brand p {
  color: #94a3b8 !important;
}

/* v102: high-specificity contrast corrections and QA-stable selectors.
   Keep this layer last. It targets the remaining repeated QA failures without redesigning layout. */
body[data-theme="light"] {
  --v102-text: #111827;
  --v102-text-secondary: #374151;
  --v102-muted: #4b5563;
  --v102-surface: #ffffff;
  --v102-soft: #f8fafc;
  --v102-border: #d8dee8;
}
body[data-theme="apple"] {
  --v102-text: #111827;
  --v102-text-secondary: #374151;
  --v102-muted: #4b5563;
  --v102-surface: rgba(255,255,255,.92);
  --v102-soft: rgba(248,250,252,.86);
  --v102-border: rgba(148,163,184,.36);
}
body[data-theme="dark"] {
  --v102-text: #f8fafc;
  --v102-text-secondary: #cbd5e1;
  --v102-muted: #94a3b8;
  --v102-surface: #111827;
  --v102-soft: #172033;
  --v102-border: rgba(226,232,240,.18);
}

body[data-theme] .kpi-card,
body[data-theme] .mini-kpi,
body[data-theme] .report-card,
body[data-theme] .print-kpi {
  color: var(--v102-text) !important;
  text-shadow: none !important;
}
body[data-theme] .kpi-card :where(span, strong),
body[data-theme] .mini-kpi :where(span, strong),
body[data-theme] .report-card :where(strong, b),
body[data-theme] .print-kpi :where(span, strong) {
  color: var(--v102-text) !important;
  -webkit-text-fill-color: var(--v102-text) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme] .kpi-card :where(small, .muted),
body[data-theme] .mini-kpi :where(small, .muted),
body[data-theme] .report-card :where(span, p, small, .muted),
body[data-theme] .print-kpi :where(small, .muted) {
  color: var(--v102-text-secondary) !important;
  -webkit-text-fill-color: var(--v102-text-secondary) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme] :where(#kpiHealth, #kpiCritical, #kpiHealthy, #kpiUtilization, #kpiLastUpdate),
body[data-theme] :where(#kpiHealthNote, #kpiCriticalNote, #kpiHealthyNote, #kpiUtilizationNote, #kpiImportCount) {
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme] :where(#kpiHealth, #kpiCritical, #kpiHealthy, #kpiUtilization, #kpiLastUpdate) {
  color: var(--v102-text) !important;
  -webkit-text-fill-color: var(--v102-text) !important;
}
body[data-theme] :where(#kpiHealthNote, #kpiCriticalNote, #kpiHealthyNote, #kpiUtilizationNote, #kpiImportCount) {
  color: var(--v102-text-secondary) !important;
  -webkit-text-fill-color: var(--v102-text-secondary) !important;
}

body[data-theme] .order-matrix,
body[data-theme] .order-dispatch-editor,
body[data-theme] .table-wrap {
  color: var(--v102-text) !important;
}
body[data-theme] .order-matrix :where(td, th, strong, .number, .cell-category, .cell-location),
body[data-theme] .order-dispatch-editor :where(td, th, strong, .number) {
  color: var(--v102-text) !important;
  -webkit-text-fill-color: var(--v102-text) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme] .order-matrix :where(.cell-requested, .cell-detail, .rec-detail),
body[data-theme] .order-dispatch-editor :where(.cell-requested, .cell-detail, .rec-detail) {
  color: var(--v102-text-secondary) !important;
  -webkit-text-fill-color: var(--v102-text-secondary) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme] .order-matrix .cell-requested {
  border-top-color: var(--v102-border) !important;
}
body[data-theme="apple"] .order-matrix .cell-requested,
body[data-theme="light"] .order-matrix .cell-requested {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
}
body[data-theme="dark"] .order-matrix .cell-requested {
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #e2e8f0 !important;
}

body[data-theme] .shipping-badge,
body[data-theme] .badge.hibernating,
body[data-theme] .status-badge {
  opacity: 1 !important;
  text-shadow: none !important;
  -webkit-text-fill-color: currentColor !important;
}
body[data-theme="light"] .shipping-badge.katz,
body[data-theme="apple"] .shipping-badge.katz {
  color: #073b86 !important;
  background: #eaf3ff !important;
  border: 1px solid #93c5fd !important;
}
body[data-theme="light"] .shipping-badge.driver,
body[data-theme="apple"] .shipping-badge.driver {
  color: #713f12 !important;
  background: #fff7e6 !important;
  border: 1px solid #f2bf5e !important;
}
body[data-theme="dark"] .shipping-badge.katz {
  color: #eff6ff !important;
  background: #1d4ed8 !important;
  border: 1px solid #60a5fa !important;
}
body[data-theme="dark"] .shipping-badge.driver {
  color: #fff7ed !important;
  background: #a16207 !important;
  border: 1px solid #facc15 !important;
}
body[data-theme="light"] .badge.hibernating,
body[data-theme="apple"] .badge.hibernating {
  color: #1e1b4b !important;
  background: #eef2ff !important;
  border: 1px solid #a5b4fc !important;
}
body[data-theme="dark"] .badge.hibernating {
  color: #f5f3ff !important;
  background: #4338ca !important;
  border: 1px solid #a78bfa !important;
}

body[data-theme] .barcode-preview-panel :where(strong, b),
body[data-theme] .barcode-preview-card :where(strong, b),
body[data-theme] .barcode-card :where(strong, b) {
  color: var(--v102-text) !important;
  -webkit-text-fill-color: var(--v102-text) !important;
  opacity: 1 !important;
}
body[data-theme] :where(.barcode-preview-panel, .barcode-preview-card, .barcode-card) :where(.muted, small, span.muted, .helper, .hint) {
  color: var(--v102-text-secondary) !important;
  -webkit-text-fill-color: var(--v102-text-secondary) !important;
  opacity: 1 !important;
}

body[data-theme] :where(.alert.warning, .print-warning, .stock-warning-note, .warning-note, .notice.warning) {
  color: #78350f !important;
  -webkit-text-fill-color: #78350f !important;
  background: #fff7ed !important;
  border-color: #fdba74 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme] :where(.alert.warning, .print-warning, .stock-warning-note, .warning-note, .notice.warning) * {
  color: #78350f !important;
  -webkit-text-fill-color: #78350f !important;
  opacity: 1 !important;
}
body[data-theme="dark"] :where(.alert.warning, .print-warning, .stock-warning-note, .warning-note, .notice.warning) {
  color: #fde68a !important;
  -webkit-text-fill-color: #fde68a !important;
  background: rgba(120, 53, 15, .34) !important;
  border-color: rgba(251, 191, 36, .48) !important;
}
body[data-theme="dark"] :where(.alert.warning, .print-warning, .stock-warning-note, .warning-note, .notice.warning) * {
  color: #fde68a !important;
  -webkit-text-fill-color: #fde68a !important;
}

/* v103: targeted remaining contrast failures from all-page QA.
   Keep as the final layer. This is intentionally high-specificity and limited to known problem surfaces. */
body[data-theme="dark"] .order-matrix,
body[data-theme="dark"] .order-matrix :where(td, th) {
  background-color: #101827 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  text-shadow: none !important;
  opacity: 1 !important;
}
body[data-theme="dark"] .order-matrix tbody tr:nth-child(even) td:not(.shortage-none):not(.shortage-partial):not(.total-col):not(.ship-driver-col),
body[data-theme="dark"] .order-matrix tbody tr:nth-child(odd) td:not(.shortage-none):not(.shortage-partial):not(.total-col):not(.ship-driver-col) {
  background-color: #111827 !important;
}
body[data-theme="dark"] .order-matrix :where(td.number, strong, .matrix-category-cell, .total-col, .total-row th, .total-row-cell) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: #172033 !important;
  opacity: 1 !important;
}
body[data-theme="dark"] .order-matrix .matrix-category-cell,
body[data-theme="dark"] .order-matrix tbody tr:nth-child(even) .matrix-category-cell {
  background-color: #1f2937 !important;
}
body[data-theme="dark"] .order-matrix .total-col,
body[data-theme="dark"] .order-matrix .total-row th,
body[data-theme="dark"] .order-matrix .total-row-cell {
  background-color: #263244 !important;
}
body[data-theme="dark"] .order-matrix td.ship-driver-col,
body[data-theme="dark"] .order-matrix th.ship-driver-col,
body[data-theme="dark"] .order-matrix th.ship-driver {
  background-color: #2b2112 !important;
  color: #fff7ed !important;
  -webkit-text-fill-color: #fff7ed !important;
}
body[data-theme="dark"] .order-matrix td.shortage-none,
body[data-theme="dark"] .order-matrix tbody tr:nth-child(even) td.shortage-none {
  background-color: #3a1215 !important;
  color: #fecdd3 !important;
  -webkit-text-fill-color: #fecdd3 !important;
}
body[data-theme="dark"] .order-matrix td.shortage-partial,
body[data-theme="dark"] .order-matrix tbody tr:nth-child(even) td.shortage-partial {
  background-color: #33230a !important;
  color: #fde68a !important;
  -webkit-text-fill-color: #fde68a !important;
}

/* Make requested quantity text a readable chip on colored matrix cells. */
body[data-theme="light"] .order-matrix .cell-requested,
body[data-theme="apple"] .order-matrix .cell-requested,
body[data-theme="dark"] .order-matrix .cell-requested {
  display: inline-block !important;
  margin-top: 3px !important;
  padding: 2px 5px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="light"] .order-matrix .cell-requested,
body[data-theme="apple"] .order-matrix .cell-requested {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  background: rgba(255,255,255,.86) !important;
  border-color: rgba(17,24,39,.16) !important;
}
body[data-theme="dark"] .order-matrix .cell-requested {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  background: #e2e8f0 !important;
  border-color: rgba(255,255,255,.28) !important;
}

/* 76 legend chips and order-print legend. */
body[data-theme="apple"] .legend-chip,
body[data-theme="apple"] .matrix-legend .legend-chip,
body[data-theme="apple"] .print-legend .legend-chip {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  background: rgba(255,255,255,.88) !important;
  border: 1px solid rgba(148,163,184,.46) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] .legend-chip,
body[data-theme="dark"] .matrix-legend .legend-chip,
body[data-theme="dark"] .print-legend .legend-chip {
  color: #e5e7eb !important;
  -webkit-text-fill-color: #e5e7eb !important;
  background: rgba(15,23,42,.92) !important;
  border: 1px solid rgba(226,232,240,.24) !important;
  opacity: 1 !important;
}

/* Dark active segmented controls and primary buttons: avoid low-contrast blue-on-blue. */
body[data-theme="dark"] .language-segment-btn.active,
body[data-theme="dark"] .language-segment-btn[aria-pressed="true"],
body[data-theme="dark"] .appearance-segment-btn.active,
body[data-theme="dark"] .appearance-segment-btn[aria-pressed="true"],
body[data-theme="dark"] button.primary,
body[data-theme="dark"] .btn.primary,
body[data-theme="dark"] #printOrderBtn {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  background: #93c5fd !important;
  border-color: #bfdbfe !important;
  text-shadow: none !important;
  opacity: 1 !important;
}
body[data-theme="dark"] .language-segment-btn.active *,
body[data-theme="dark"] .language-segment-btn[aria-pressed="true"] *,
body[data-theme="dark"] .appearance-segment-btn.active *,
body[data-theme="dark"] .appearance-segment-btn[aria-pressed="true"] *,
body[data-theme="dark"] button.primary *,
body[data-theme="dark"] .btn.primary *,
body[data-theme="dark"] #printOrderBtn * {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

/* Barcode PDF preview in dark theme. */
body[data-theme="dark"] .barcode-preview-panel,
body[data-theme="dark"] .barcode-preview-card,
body[data-theme="dark"] .barcode-card,
body[data-theme="dark"] .label-preview-card,
body[data-theme="dark"] .pallet-label-preview-card {
  background: #111827 !important;
  color: #f8fafc !important;
  border-color: rgba(226,232,240,.22) !important;
}
body[data-theme="dark"] :where(.barcode-preview-panel, .barcode-preview-card, .barcode-card, .label-preview-card, .pallet-label-preview-card) :where(strong, b) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
body[data-theme="dark"] :where(.barcode-preview-panel, .barcode-preview-card, .barcode-card, .label-preview-card, .pallet-label-preview-card) :where(.muted, span.muted, small, .hint, .helper) {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
  opacity: 1 !important;
}

/* Light/76 badges: reduce false low-contrast cases from pastel badge backgrounds. */
body[data-theme="light"] .badge,
body[data-theme="apple"] .badge,
body[data-theme="light"] .status-badge,
body[data-theme="apple"] .status-badge {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="light"] .badge.critical,
body[data-theme="apple"] .badge.critical,
body[data-theme="light"] .badge.urgent,
body[data-theme="apple"] .badge.urgent {
  color: #7f1d1d !important;
  -webkit-text-fill-color: #7f1d1d !important;
  background: #fee2e2 !important;
  border-color: #fecaca !important;
}
body[data-theme="light"] .badge.healthy,
body[data-theme="apple"] .badge.healthy,
body[data-theme="light"] .badge.success,
body[data-theme="apple"] .badge.success {
  color: #14532d !important;
  -webkit-text-fill-color: #14532d !important;
  background: #dcfce7 !important;
  border-color: #bbf7d0 !important;
}
body[data-theme="light"] .badge.hibernating,
body[data-theme="apple"] .badge.hibernating {
  color: #1e1b4b !important;
  -webkit-text-fill-color: #1e1b4b !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
}

/* v104 — 98 theme: Stripe-inspired interface system.
   Uses Odafim Planner assets; no Stripe marks/assets. */
body[data-theme="stripe"] {
  --op-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --op-font-heading: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --op-bg: #f6f9fc;
  --op-bg-soft: #eef4fb;
  --op-surface: #ffffff;
  --op-surface-raised: #ffffff;
  --op-surface-soft: #f6f9fc;
  --op-surface-muted: #edf3fa;
  --op-text: #0a2540;
  --op-text-muted: #425466;
  --op-text-subtle: #697386;
  --op-border: #d9e2ec;
  --op-border-strong: #c6d3e1;
  --op-separator: rgba(10, 37, 64, .10);
  --op-primary: #635bff;
  --op-primary-strong: #4f46e5;
  --op-primary-soft: #f0efff;
  --op-accent: #00d4ff;
  --op-success-bg: #e6fcf5;
  --op-success-text: #006d4e;
  --op-success-border: #b2f2dc;
  --op-warning-bg: #fff7e6;
  --op-warning-text: #8a4b00;
  --op-warning-border: #ffd791;
  --op-danger-bg: #fff1f2;
  --op-danger-text: #b42318;
  --op-danger-border: #fecdd3;
  --op-track: #e6eef8;
  --op-shadow-sm: 0 1px 2px rgba(50, 50, 93, .08), 0 1px 3px rgba(0, 0, 0, .06);
  --op-shadow-md: 0 6px 18px rgba(50, 50, 93, .10), 0 2px 6px rgba(0, 0, 0, .06);
  --op-radius-sm: 8px;
  --op-radius-md: 12px;
  --op-radius-lg: 16px;
  --op-control-h: 34px;
  background:
    radial-gradient(720px 420px at 18% -8%, rgba(99,91,255,.16), transparent 58%),
    radial-gradient(560px 360px at 94% 2%, rgba(0,212,255,.12), transparent 55%),
    linear-gradient(180deg, #f8fbff 0%, #f6f9fc 38%, #eef4fb 100%) !important;
  color: var(--op-text) !important;
  font-family: var(--op-font-body) !important;
}

body[data-theme="stripe"] * { letter-spacing: 0 !important; }
body[data-theme="stripe"] h1,
body[data-theme="stripe"] h2,
body[data-theme="stripe"] h3,
body[data-theme="stripe"] h4,
body[data-theme="stripe"] h5,
body[data-theme="stripe"] h6,
body[data-theme="stripe"] .brand h1,
body[data-theme="stripe"] .panel-header h3,
body[data-theme="stripe"] .section-label h4,
body[data-theme="stripe"] .print-section h4 {
  font-family: var(--op-font-heading) !important;
  color: var(--op-text) !important;
  font-weight: 650 !important;
  line-height: 1.18 !important;
}

body[data-theme="stripe"] .app-shell,
body[data-theme="stripe"] .main { background: transparent !important; }

body[data-theme="stripe"] .sidebar {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(246,249,252,.92)) !important;
  border-right: 1px solid rgba(10,37,64,.09) !important;
  box-shadow: 10px 0 30px rgba(50,50,93,.05) !important;
}
body[data-theme="stripe"] .topbar {
  background: rgba(255,255,255,.72) !important;
  border-bottom: 1px solid rgba(10,37,64,.08) !important;
  backdrop-filter: blur(18px) saturate(1.18) !important;
  box-shadow: none !important;
}
body[data-theme="stripe"] .brand h1 { color: #0a2540 !important; }
body[data-theme="stripe"] .brand p,
body[data-theme="stripe"] .muted,
body[data-theme="stripe"] .muted-label,
body[data-theme="stripe"] .panel-header p,
body[data-theme="stripe"] .section-label p,
body[data-theme="stripe"] .sidebar-card p,
body[data-theme="stripe"] .print-note,
body[data-theme="stripe"] .history-mode-note,
body[data-theme="stripe"] .store-source-note,
body[data-theme="stripe"] .group-note,
body[data-theme="stripe"] .barcode-help,
body[data-theme="stripe"] small {
  color: var(--op-text-muted) !important;
}

body[data-theme="stripe"] .brand-mark {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #0a2540 0%, #263b80 52%, #635bff 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(99,91,255,.38) !important;
  box-shadow: 0 8px 22px rgba(99,91,255,.22) !important;
}
body[data-theme="stripe"] .brand-mark::after {
  background: linear-gradient(90deg, #00d4ff, #635bff) !important;
  box-shadow: none !important;
}

body[data-theme="stripe"] .nav-item {
  color: #425466 !important;
  border-radius: 10px !important;
  font-weight: 560 !important;
  box-shadow: none !important;
}
body[data-theme="stripe"] .nav-item:hover {
  background: rgba(99,91,255,.08) !important;
  color: #0a2540 !important;
}
body[data-theme="stripe"] .nav-item.active,
body[data-theme="stripe"] .nav-item.active:hover {
  background: linear-gradient(135deg, #635bff, #4f46e5) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 8px 16px rgba(99,91,255,.20) !important;
}

body[data-theme="stripe"] .panel,
body[data-theme="stripe"] .kpi-card,
body[data-theme="stripe"] .report-card,
body[data-theme="stripe"] .mini-kpi,
body[data-theme="stripe"] .setting-field,
body[data-theme="stripe"] .sidebar-card,
body[data-theme="stripe"] .barcode-preview-panel,
body[data-theme="stripe"] .barcode-preview-card,
body[data-theme="stripe"] .cloud-sharing-panel,
body[data-theme="stripe"] .cloud-workflow-card,
body[data-theme="stripe"] .cloud-details,
body[data-theme="stripe"] .db-summary div,
body[data-theme="stripe"] .file-row,
body[data-theme="stripe"] .log-line,
body[data-theme="stripe"] .empty-state,
body[data-theme="stripe"] .drop-zone,
body[data-theme="stripe"] .order-dispatch-editor,
body[data-theme="stripe"] .print-page-options,
body[data-theme="stripe"] .pallet-label-preview-card {
  background: rgba(255,255,255,.94) !important;
  color: var(--op-text) !important;
  border: 1px solid var(--op-border) !important;
  border-radius: var(--op-radius-lg) !important;
  box-shadow: var(--op-shadow-sm) !important;
}
body[data-theme="stripe"] .panel:hover,
body[data-theme="stripe"] .report-card:hover {
  box-shadow: var(--op-shadow-md) !important;
}

body[data-theme="stripe"] .btn,
body[data-theme="stripe"] button.btn,
body[data-theme="stripe"] .icon-btn,
body[data-theme="stripe"] .miniBtn {
  min-height: var(--op-control-h) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #0a2540 !important;
  border: 1px solid var(--op-border-strong) !important;
  box-shadow: 0 1px 2px rgba(50,50,93,.06) !important;
  font-weight: 620 !important;
}
body[data-theme="stripe"] .btn:hover:not(:disabled),
body[data-theme="stripe"] .icon-btn:hover:not(:disabled) {
  background: #f6f9fc !important;
  border-color: #b7c6d8 !important;
  transform: none !important;
}
body[data-theme="stripe"] .btn.primary,
body[data-theme="stripe"] button.primary,
body[data-theme="stripe"] #printOrderBtn {
  background: linear-gradient(135deg, #635bff, #4f46e5) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 8px 18px rgba(99,91,255,.24) !important;
}
body[data-theme="stripe"] .btn.secondary {
  background: #ffffff !important;
  color: #0a2540 !important;
  border-color: var(--op-border-strong) !important;
}
body[data-theme="stripe"] .btn.danger,
body[data-theme="stripe"] button.danger {
  background: #b42318 !important;
  color: #ffffff !important;
  border-color: #b42318 !important;
}

body[data-theme="stripe"] .language-segment,
body[data-theme="stripe"] .appearance-segment,
body[data-theme="stripe"] .topbar-sync {
  background: rgba(255,255,255,.86) !important;
  border: 1px solid rgba(10,37,64,.10) !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 2px rgba(50,50,93,.06) !important;
}
body[data-theme="stripe"] .language-segment-btn,
body[data-theme="stripe"] .appearance-segment-btn {
  color: #425466 !important;
  border-radius: 999px !important;
  background: transparent !important;
  font-weight: 600 !important;
}
body[data-theme="stripe"] .language-segment-btn.active,
body[data-theme="stripe"] .language-segment-btn[aria-pressed="true"],
body[data-theme="stripe"] .appearance-segment-btn.active,
body[data-theme="stripe"] .appearance-segment-btn[aria-pressed="true"] {
  background: #0a2540 !important;
  color: #ffffff !important;
  box-shadow: 0 3px 8px rgba(10,37,64,.18) !important;
}

body[data-theme="stripe"] .search-input,
body[data-theme="stripe"] .select-input,
body[data-theme="stripe"] input,
body[data-theme="stripe"] select,
body[data-theme="stripe"] textarea,
body[data-theme="stripe"] .setting-field input,
body[data-theme="stripe"] .setting-field select,
body[data-theme="stripe"] .store-directory-form input,
body[data-theme="stripe"] .store-directory-form select,
body[data-theme="stripe"] .order-dispatch-table select,
body[data-theme="stripe"] .order-dispatch-table input {
  background: #ffffff !important;
  color: #0a2540 !important;
  border: 1px solid var(--op-border-strong) !important;
  border-radius: var(--op-radius-md) !important;
  box-shadow: inset 0 1px 1px rgba(50,50,93,.04) !important;
}
body[data-theme="stripe"] input:focus,
body[data-theme="stripe"] select:focus,
body[data-theme="stripe"] textarea:focus,
body[data-theme="stripe"] .search-input:focus,
body[data-theme="stripe"] .select-input:focus {
  border-color: #635bff !important;
  box-shadow: 0 0 0 3px rgba(99,91,255,.18) !important;
  outline: none !important;
}
body[data-theme="stripe"] select option { background: #ffffff !important; color: #0a2540 !important; }

body[data-theme="stripe"] .table-scroll {
  background: #ffffff !important;
  border: 1px solid var(--op-border) !important;
  border-radius: var(--op-radius-lg) !important;
  box-shadow: var(--op-shadow-sm) !important;
  overflow: hidden !important;
}
body[data-theme="stripe"] .data-table,
body[data-theme="stripe"] .order-matrix {
  background: #ffffff !important;
  color: #0a2540 !important;
}
body[data-theme="stripe"] .data-table th,
body[data-theme="stripe"] .order-matrix th {
  background: #f6f9fc !important;
  color: #425466 !important;
  border-bottom-color: var(--op-border) !important;
  font-weight: 650 !important;
}
body[data-theme="stripe"] .data-table td,
body[data-theme="stripe"] .order-matrix td,
body[data-theme="stripe"] .order-dispatch-table td,
body[data-theme="stripe"] .order-dispatch-table th {
  color: #0a2540 !important;
  border-bottom-color: var(--op-border) !important;
}
body[data-theme="stripe"] .data-table tr:hover td,
body[data-theme="stripe"] .order-matrix tr:hover td {
  background: rgba(99,91,255,.045) !important;
}
body[data-theme="stripe"] .number,
body[data-theme="stripe"] td.number,
body[data-theme="stripe"] strong { color: #0a2540 !important; }

body[data-theme="stripe"] .trend-row {
  background: #ffffff !important;
  border-color: var(--op-border) !important;
  box-shadow: var(--op-shadow-sm) !important;
}
body[data-theme="stripe"] .trend-label,
body[data-theme="stripe"] .trend-value { color: #0a2540 !important; }
body[data-theme="stripe"] .trend-track { background: #e6eef8 !important; }
body[data-theme="stripe"] .trend-fill { background: linear-gradient(90deg, #635bff, #00d4ff) !important; }

body[data-theme="stripe"] .alert,
body[data-theme="stripe"] .warning,
body[data-theme="stripe"] .stock-limited,
body[data-theme="stripe"] .status-warning {
  background: var(--op-warning-bg) !important;
  color: var(--op-warning-text) !important;
  border-color: var(--op-warning-border) !important;
}
body[data-theme="stripe"] .alert-item,
body[data-theme="stripe"] .kpi-card.danger {
  background: #ffffff !important;
  border-color: var(--op-danger-border) !important;
  box-shadow: var(--op-shadow-sm) !important;
  position: relative;
}
body[data-theme="stripe"] .alert-item::before,
body[data-theme="stripe"] .kpi-card.danger::before {
  content: "";
  position: absolute;
  inset: 12px auto 12px 0;
  width: 4px;
  border-radius: 999px;
  background: #e5484d;
}
html[dir="rtl"] body[data-theme="stripe"] .alert-item::before,
html[dir="rtl"] body[data-theme="stripe"] .kpi-card.danger::before {
  left: auto;
  right: 0;
}
body[data-theme="stripe"] .alert-item strong,
body[data-theme="stripe"] .kpi-card.danger strong { color: #b42318 !important; }
body[data-theme="stripe"] .alert-item p,
body[data-theme="stripe"] .alert-item small,
body[data-theme="stripe"] .kpi-card.danger small { color: #425466 !important; }

body[data-theme="stripe"] .badge,
body[data-theme="stripe"] .legend-chip,
body[data-theme="stripe"] .status-pill,
body[data-theme="stripe"] .shipping-badge,
body[data-theme="stripe"] .cell-requested {
  border-radius: 999px !important;
  border: 1px solid rgba(10,37,64,.12) !important;
  background: #f6f9fc !important;
  color: #0a2540 !important;
  font-weight: 650 !important;
}
body[data-theme="stripe"] .badge.urgent,
body[data-theme="stripe"] .badge.critical,
body[data-theme="stripe"] .status-danger { background: var(--op-danger-bg) !important; color: var(--op-danger-text) !important; border-color: var(--op-danger-border) !important; }
body[data-theme="stripe"] .badge.hibernating { background: #eef4ff !important; color: #263b80 !important; border-color: #c7d7fe !important; }
body[data-theme="stripe"] .shipping-badge.katz { background: #eef4ff !important; color: #3730a3 !important; border-color: #c7d7fe !important; }
body[data-theme="stripe"] .shipping-badge.driver { background: #e6fcf5 !important; color: #006d4e !important; border-color: #b2f2dc !important; }
body[data-theme="stripe"] .cell-requested { background: #f0efff !important; color: #3730a3 !important; border-color: #c7d7fe !important; }

body[data-theme="stripe"] .qa-result-card,
body[data-theme="stripe"] .contrast-check-result {
  background: #ffffff !important;
  color: #0a2540 !important;
  border-color: var(--op-border) !important;
}

/* Keep Arabic readable inside 98 theme. */
html[lang="ar"] body[data-theme="stripe"],
body[data-theme="stripe"]:lang(ar) {
  font-family: Cairo, Inter, ui-sans-serif, system-ui, sans-serif !important;
}

/* v105 — targeted contrast cleanup from QA report.
   This layer intentionally stays last and uses high specificity so older theme rules cannot reintroduce
   hard-to-read text/background combinations. */

/* Light/76: data-table descriptive text and helper text should be normal readable secondary text, not pale gray. */
body[data-theme="light"] :where(td.description-cell, td.description-cell.rtl, .description-cell, .description-cell.rtl),
body[data-theme="apple"] :where(td.description-cell, td.description-cell.rtl, .description-cell, .description-cell.rtl) {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  opacity: 1 !important;
}
body[data-theme="light"] :where(td.description-cell small, td.description-cell.rtl small, .description-cell small, .rec-detail, .cell-detail),
body[data-theme="apple"] :where(td.description-cell small, td.description-cell.rtl small, .description-cell small, .rec-detail, .cell-detail) {
  color: #374151 !important;
  -webkit-text-fill-color: #374151 !important;
  opacity: 1 !important;
}
body[data-theme="light"] :where(.upload-card p, .drop-zone p, .panel p, p.muted, .muted, .hint, .helper, .note, .print-note),
body[data-theme="apple"] :where(.upload-card p, .drop-zone p, .panel p, p.muted, .muted, .hint, .helper, .note, .print-note) {
  color: #374151 !important;
  -webkit-text-fill-color: #374151 !important;
  opacity: 1 !important;
}

/* Dark: order print/matrix cells were still inheriting same foreground/background in some table states. */
body[data-theme="dark"] :where(.order-matrix, .order-dispatch-table, .print-matrix-table) :where(td, th) {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  opacity: 1 !important;
}
body[data-theme="dark"] :where(.order-matrix, .order-dispatch-table, .print-matrix-table) :where(td.number, td strong, strong, b) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] :where(.order-matrix, .order-dispatch-table, .print-matrix-table) :where(.cell-requested, .cell-detail, .cell-collect, .rec-detail) {
  color: #dbeafe !important;
  -webkit-text-fill-color: #dbeafe !important;
  border-top-color: rgba(219,234,254,.32) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] :where(.order-matrix td.shortage-none, .order-matrix td.shortage-partial, .order-matrix td.stock-ok, .order-matrix td.to-collect) :where(.cell-requested, .cell-detail, .cell-collect) {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* 76/Light: order print legend and label metadata should be dark on light surfaces. */
body[data-theme="apple"] :where(.order-print-legend, .order-print-legend *, .legend-chip, .print-label-meta, .pallet-label-meta, .manual-label-meta, .order-label-meta, .order-print-panel span) {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="apple"] :where(.legend-chip, .shipping-legend .legend-chip) {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
body[data-theme="apple"] :where(.order-matrix .cell-requested, .order-matrix .cell-detail, .order-matrix .cell-collect) {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  opacity: 1 !important;
}

/* Dark: Barcode PDF preview labels and helper copy. */
body[data-theme="dark"] :where(.barcode-preview-panel, .barcode-preview-card, .barcode-card, .label-preview-card, .barcode-print-preview, .print-preview-card) :where(strong, b, .label-preview-title) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
body[data-theme="dark"] :where(.barcode-preview-panel, .barcode-preview-card, .barcode-card, .label-preview-card, .barcode-print-preview, .print-preview-card) :where(.muted, span.muted, small, .hint, .helper, p) {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
  opacity: 1 !important;
}

/* Dark: active segmented controls and primary buttons need a darker blue so white text passes. */
body[data-theme="dark"] :where(.language-segment-btn.active, .language-segment-btn[aria-pressed="true"], .appearance-segment-btn.active, .appearance-segment-btn[aria-pressed="true"], .btn.primary, button.primary, #printOrderBtn) {
  background: #1d4ed8 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #1e40af !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] :where(.language-segment-btn.active *, .language-segment-btn[aria-pressed="true"] *, .appearance-segment-btn.active *, .appearance-segment-btn[aria-pressed="true"] *, .btn.primary *, button.primary *, #printOrderBtn *) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Stripe/98: keep the same contrast guarantees for new theme-specific surfaces. */
body[data-theme="stripe"] :where(td.description-cell, td.description-cell.rtl, .description-cell, .description-cell.rtl, .muted, .hint, .helper, small, .cell-detail, .rec-detail) {
  color: #425466 !important;
  -webkit-text-fill-color: #425466 !important;
  opacity: 1 !important;
}
body[data-theme="stripe"] :where(.badge, .status-badge, .shipping-badge, .legend-chip) {
  text-shadow: none !important;
  opacity: 1 !important;
}

/* v107: Order Print readability pass */
@media screen {
  #orderprint .panel.wide {
    max-width: 1480px;
  }

  #orderprint .panel-header {
    align-items: stretch;
    gap: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--op-separator, var(--line));
  }

  #orderprint .panel-header > div:first-child {
    max-width: 720px;
  }

  #orderprint .panel-header h3 {
    font-size: 22px;
    line-height: 1.18;
    margin-bottom: 6px;
    font-weight: 760;
  }

  #orderprint .panel-header p {
    max-width: 680px;
    line-height: 1.45;
  }

  #orderprint .order-controls {
    display: grid;
    grid-template-columns: minmax(320px, 1fr) auto auto;
    gap: 10px;
    align-items: center;
    min-width: min(100%, 680px);
    margin-left: auto;
  }

  #orderprint .order-controls .select-input {
    min-width: 0;
    width: 100%;
  }

  #orderprint .order-print-content {
    display: grid;
    gap: 20px;
    padding-top: 4px;
  }

  #orderprint .print-summary-grid {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin: 0;
  }

  #orderprint .print-kpi {
    padding: 14px 16px;
    border-radius: 16px;
  }

  #orderprint .print-kpi span {
    font-size: 12px;
    font-weight: 620;
    margin-bottom: 7px;
  }

  #orderprint .print-kpi strong {
    font-size: 24px;
    line-height: 1.05;
    font-weight: 760;
  }

  #orderprint .stock-warning-note,
  #orderprint .print-note {
    margin: 0;
    padding: 12px 14px;
    border-radius: 14px;
    line-height: 1.45;
  }

  #orderprint .print-page-options,
  #orderprint .order-dispatch-editor,
  #orderprint .print-section {
    margin: 0;
  }

  #orderprint .print-page-options,
  #orderprint .order-dispatch-editor {
    padding: 16px;
    border-radius: 18px;
  }

  #orderprint .print-page-options h4,
  #orderprint .order-dispatch-editor h4,
  #orderprint .print-section h4 {
    font-size: 16px;
    line-height: 1.25;
    font-weight: 720;
    margin: 0 0 6px;
    letter-spacing: 0;
  }

  #orderprint .print-page-options .section-label,
  #orderprint .order-dispatch-editor p {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.45;
    max-width: 860px;
  }

  #orderprint .print-page-options-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
  }

  #orderprint .print-page-option {
    min-height: 40px;
    align-items: center;
    gap: 10px;
    padding: 9px 11px;
    border: 1px solid var(--op-border, var(--line));
    border-radius: 12px;
    background: var(--op-surface-raised, rgba(255,255,255,.65));
    font-weight: 600;
    line-height: 1.25;
  }

  #orderprint .print-page-option input {
    flex: 0 0 auto;
  }

  #orderprint .order-dispatch-actions {
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--op-separator, var(--line));
  }

  #orderprint .table-scroll {
    border-radius: 16px;
  }

  #orderprint .data-table.compact th,
  #orderprint .data-table.compact td {
    padding: 9px 10px;
    line-height: 1.3;
  }

  #orderprint .order-dispatch-table th,
  #orderprint .order-dispatch-table td {
    vertical-align: middle;
  }

  #orderprint .order-dispatch-table select,
  #orderprint .order-dispatch-table input {
    min-height: 34px;
  }

  #orderprint .order-matrix th,
  #orderprint .order-matrix td {
    padding: 6px 7px;
    line-height: 1.22;
  }

  #orderprint .order-matrix th.store-header {
    min-width: 86px;
  }

  #orderprint .order-matrix th.store-header strong {
    font-size: 11px;
  }

  #orderprint .order-matrix th.store-header .store-id-line {
    font-size: 12px;
  }

  #orderprint .matrix-legend {
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid var(--op-border, var(--line));
    border-radius: 14px;
    background: var(--op-surface-soft, rgba(248,250,252,.85));
  }

  #orderprint .print-section {
    padding-top: 2px;
  }

  #orderprint .print-section + .print-section {
    padding-top: 8px;
  }

  body[data-theme="dark"] #orderprint .print-page-option {
    background: var(--op-surface-soft, rgba(255,255,255,.045));
  }
}

@media screen and (max-width: 1180px) {
  #orderprint .panel-header {
    display: grid;
  }

  #orderprint .order-controls {
    width: 100%;
    margin-left: 0;
    grid-template-columns: 1fr 1fr;
  }

  #orderprint .order-controls .select-input {
    grid-column: 1 / -1;
  }
}

@media screen and (max-width: 720px) {
  #orderprint .order-controls {
    grid-template-columns: 1fr;
  }

  #orderprint .order-controls .btn {
    width: 100%;
  }

  #orderprint .print-page-options-grid {
    grid-template-columns: 1fr;
  }
}

/* v108 — direct fixes for remaining QA contrast report after Light/Dark simplification. */

/* Light: Categories descriptions and compact recommendation notes were still too pale. */
body[data-theme="light"] #categories :where(td.description-cell, td.description-cell.rtl, .description-cell, .description-cell.rtl),
body[data-theme="light"] #categories :where(td.description-cell small, td.description-cell.rtl small, .description-cell small, small),
body[data-theme="light"] #categories :where(.rec-detail, .cell-detail, .muted, .hint, .helper),
body[data-theme="light"] .data-table :where(td.description-cell, td.description-cell.rtl),
body[data-theme="light"] .data-table :where(td.description-cell small, td.description-cell.rtl small) {
  color: #111827 !important;
  -webkit-text-fill-color: #111827 !important;
  opacity: 1 !important;
}

/* Light: Upload helper copy should pass normal-text contrast. */
body[data-theme="light"] #upload :where(p, .muted, .hint, .helper, .note),
body[data-theme="light"] .upload-card :where(p, .muted, .hint, .helper, .note),
body[data-theme="light"] .drop-zone :where(p, .muted, .hint, .helper, .note) {
  color: #1f2937 !important;
  -webkit-text-fill-color: #1f2937 !important;
  opacity: 1 !important;
}

/* Dark: Order Print uses colored shortage cells; force both text and local backgrounds to valid pairs.
   This is intentionally very specific because older matrix rules use !important and print-oriented colors. */
body[data-theme="dark"] #orderprint :where(.order-matrix, .order-dispatch-table, .print-matrix-table) :where(td, th) {
  background-color: #111827 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  border-color: rgba(148, 163, 184, .34) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix, .order-dispatch-table, .print-matrix-table) tbody tr:nth-child(even) :where(td, th) {
  background-color: #0f172a !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix td.shortage-none, .order-matrix tbody tr:nth-child(even) td.shortage-none) {
  background: #7f1d1d !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix td.shortage-partial, .order-matrix tbody tr:nth-child(even) td.shortage-partial) {
  background: #78350f !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix td.ship-driver-col, .order-matrix th.ship-driver-col) {
  background: #1f2937 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix td.ship-katz, .order-matrix th.ship-katz) {
  background: #172554 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix strong, .order-dispatch-table strong, .print-matrix-table strong, td.number, .number) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] #orderprint :where(.order-matrix .cell-requested, .order-matrix td.shortage-none .cell-requested, .order-matrix td.shortage-partial .cell-requested) {
  display: inline-block;
  margin-top: 3px;
  padding: 2px 5px;
  border: 1px solid rgba(255,255,255,.34) !important;
  border-radius: 6px;
  background: rgba(255,255,255,.14) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Dark: keep barcode PDF preview copy readable even when placed on preview surfaces. */
body[data-theme="dark"] #barcodepdf :where(strong, b, .label-preview-title) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
body[data-theme="dark"] #barcodepdf :where(.muted, .hint, .helper, small, span.muted, p) {
  color: #d1d5db !important;
  -webkit-text-fill-color: #d1d5db !important;
  opacity: 1 !important;
}

/* v109: remaining contrast targets + UI QA report polish */
body[data-theme="dark"] #page-order-print strong,
body[data-theme="dark"] #page-order-print td.number,
body[data-theme="dark"] #page-order-print span.cell-requested,
body[data-theme="dark"] #page-order-print .matrix-cell strong,
body[data-theme="dark"] #page-order-print .matrix-cell td.number,
body[data-theme="dark"] #page-order-print .order-matrix strong,
body[data-theme="dark"] #page-order-print .order-matrix td.number,
body[data-theme="dark"] #page-order-print .order-matrix .cell-requested {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

body[data-theme="light"] #page-replenishment td.description-cell,
body[data-theme="light"] #page-replenishment td.description-cell.rtl,
body[data-theme="light"] #page-replenishment small,
body[data-theme="light"] #page-settings td.description-cell,
body[data-theme="light"] #page-settings td.description-cell.rtl,
body[data-theme="light"] #page-settings small,
body[data-theme="light"] #page-categories td.description-cell,
body[data-theme="light"] #page-categories td.description-cell.rtl,
body[data-theme="light"] #page-categories small {
  color: #4b5563 !important;
  -webkit-text-fill-color: #4b5563 !important;
}

body[data-theme="light"] #page-upload p,
body[data-theme="light"] .panel-header p,
body[data-theme="light"] .muted,
body[data-theme="light"] small {
  color: #4b5563;
}

.ui-health-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 0;
}

.ui-health-section {
  border-top: 1px solid var(--op-border, rgba(148, 163, 184, .28));
  margin-top: 12px;
  padding-top: 12px;
}

.ui-health-section h4 {
  margin: 0 0 8px;
  font-size: 13px;
  letter-spacing: 0;
  color: var(--op-text, #111827);
}

body[data-theme="dark"] .ui-health-section h4 {
  color: #f8fafc;
}

.ui-health-list {
  display: grid;
  gap: 6px;
  max-height: 360px;
  overflow: auto;
  padding-right: 4px;
}

.ui-health-item {
  display: grid;
  grid-template-columns: 140px minmax(120px, 1fr) minmax(160px, 1.5fr);
  gap: 10px;
  align-items: baseline;
  padding: 8px 10px;
  border: 1px solid var(--op-border, rgba(148, 163, 184, .28));
  border-radius: 10px;
  background: var(--op-surface, #fff);
  font-size: 12px;
}

body[data-theme="dark"] .ui-health-item {
  background: #111827;
  border-color: rgba(148, 163, 184, .3);
  color: #e5e7eb;
}

.ui-health-item strong {
  color: var(--op-danger-text, #991b1b);
  font-size: 12px;
}

body[data-theme="dark"] .ui-health-item strong {
  color: #fecaca;
}

.ui-health-item code {
  white-space: normal;
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  .ui-health-item { grid-template-columns: 1fr; }
}

/* v110: QA export controls and final health-check cleanup */
#copyQaReportBtn:disabled,
#downloadQaReportBtn:disabled {
  opacity: .58 !important;
  cursor: not-allowed !important;
}

.language-segment,
.appearance-segment {
  min-height: 40px !important;
  padding: 4px !important;
}
.language-segment-btn,
.appearance-segment-btn {
  min-height: 34px !important;
  height: 34px !important;
  min-width: 40px !important;
  padding: 6px 12px !important;
  line-height: 1 !important;
}

body[data-theme="dark"] #orderprint .order-matrix :where(td, th),
body[data-theme="dark"] #orderprint .print-matrix-table :where(td, th),
body[data-theme="dark"] #orderprint .order-dispatch-table :where(td, th) {
  background-color: #111827 !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  opacity: 1 !important;
}
body[data-theme="dark"] #orderprint .order-matrix tbody tr:nth-child(even) :where(td, th),
body[data-theme="dark"] #orderprint .print-matrix-table tbody tr:nth-child(even) :where(td, th),
body[data-theme="dark"] #orderprint .order-dispatch-table tbody tr:nth-child(even) :where(td, th) {
  background-color: #0f172a !important;
}
body[data-theme="dark"] #orderprint .order-matrix :where(strong, b, .number, td.number),
body[data-theme="dark"] #orderprint .print-matrix-table :where(strong, b, .number, td.number),
body[data-theme="dark"] #orderprint .order-dispatch-table :where(strong, b, .number, td.number) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-color: transparent !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
body[data-theme="dark"] #orderprint .order-matrix :where(.cell-requested, .cell-detail, .cell-collect),
body[data-theme="dark"] #orderprint .print-matrix-table :where(.cell-requested, .cell-detail, .cell-collect) {
  background-color: #1e3a8a !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: rgba(255,255,255,.42) !important;
  opacity: 1 !important;
}
body[data-theme="dark"] #orderprint .order-matrix :where(td.shortage-none, td.shortage-partial) :where(strong, b, .number, td.number, .cell-requested, .cell-detail, .cell-collect) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* v112: clearer primary actions, compact demand panels, manual inventory, and capacity warnings. */
.btn.primary {
  border-width: 2px;
  font-weight: 900;
}
#chooseFilesBtn,
#importFilesBtn:not(:disabled) {
  min-height: 46px;
  padding-inline: 22px;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent), 0 14px 30px color-mix(in srgb, var(--accent) 34%, transparent);
}
#importFilesBtn:not(:disabled) { transform: translateY(-1px); }

.trend-list {
  gap: 6px !important;
  min-height: 0 !important;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 96%, var(--accent) 4%);
}
.trend-row,
.trend-list.compact .trend-row {
  padding: 5px 7px !important;
  border-radius: 7px !important;
  gap: 8px !important;
  min-height: 34px;
}
.trend-label { font-size: 12.5px !important; }
.trend-track { height: 9px !important; }
.trend-value strong { font-size: 14px !important; }
.trend-value small { font-size: 9px !important; }

.inventory-actions {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 4px 0 14px;
}
.inventory-actions-note { color: var(--muted); font-size: 13px; }
.manual-inventory-panel {
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--panel) 94%, var(--accent) 6%);
}
.manual-inventory-form {
  display: grid;
  grid-template-columns: minmax(120px,.7fr) minmax(150px,1fr) minmax(110px,.55fr) minmax(130px,.65fr) auto;
  gap: 10px;
  align-items: end;
}
.manual-inventory-status { min-height: 18px; margin-top: 8px; color: var(--muted); font-size: 13px; }
.manual-inventory-status.ok { color: var(--success); }
.manual-inventory-status.error { color: var(--danger); }
.badge.overcapacity {
  color: #075985;
  background: #e0f2fe;
  border-color: #7dd3fc;
}
body[data-theme="dark"] .badge.overcapacity {
  color: #bae6fd;
  background: rgba(14, 165, 233, .16);
  border-color: rgba(56, 189, 248, .42);
}
body[data-theme="stripe"] .badge.overcapacity {
  color: #075985 !important;
  background: #e0f2fe !important;
  border-color: #7dd3fc !important;
}
.inventory-print-sheet { display: none; }
.inventory-print-language { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; }
.inventory-print-language .select-input { min-width: 128px; height: 34px; padding-top: 4px; padding-bottom: 4px; }
@media (max-width: 900px) {
  .manual-inventory-form { grid-template-columns: 1fr 1fr; }
  .manual-inventory-form .btn { grid-column: 1 / -1; }
  .inventory-actions { align-items: flex-start; flex-direction: column; }
}
@media print {
  body.printing-inventory-sheet .app-shell > .sidebar,
  body.printing-inventory-sheet .main > :not(#inventoryPrintSheet) { display: none !important; }
  body.printing-inventory-sheet #inventoryPrintSheet {
    display: block !important;
    color: #000;
    background: #fff;
    font-family: Arial, Helvetica, sans-serif;
  }
  .inventory-print-page { break-after: page; page-break-after: always; width: 100%; }
  .inventory-print-page:last-child { break-after: auto; page-break-after: auto; }
  .inventory-print-header { display: flex; align-items: baseline; justify-content: space-between; gap: 4mm; margin: 0 0 1.5mm; }
  .inventory-print-sheet h1 { margin: 0; font-size: 13.5pt; line-height: 1.08; white-space: nowrap; }
  .inventory-print-sheet .inventory-print-meta { margin: 0; font-size: 7.7pt; line-height: 1.12; text-align: end; }
  .inventory-print-sheet table { width: 100%; border-collapse: collapse; font-size: 8.75pt; line-height: 1.03; table-layout: fixed; }
  .inventory-print-sheet col.col-location { width: 11%; }
  .inventory-print-sheet col.col-category { width: 9%; }
  .inventory-print-sheet col.col-description { width: 20%; }
  .inventory-print-sheet col.col-number { width: 7%; }
  .inventory-print-sheet col.col-capacity { width: 7%; }
  .inventory-print-sheet col.col-update-location { width: 12%; }
  .inventory-print-sheet col.col-update-number { width: 10%; }
  .inventory-print-sheet th,
  .inventory-print-sheet td { border: .35pt solid #777; padding: .66mm .62mm; height: 4.15mm; vertical-align: middle; color: #000 !important; background: #fff !important; overflow: hidden; }
  .inventory-print-sheet th { font-weight: 700; white-space: normal; }
  .inventory-print-sheet td { white-space: nowrap; text-overflow: clip; }
  .inventory-print-sheet .description-cell { font-size: 8.2pt; }
  .inventory-print-sheet .blank-cell { min-width: 8mm; }
  .inventory-print-sheet tr { break-inside: avoid; page-break-inside: avoid; }
  .inventory-print-sheet .inventory-other-row:first-child td { border-top-width: 1.2pt; }
  .inventory-print-page.density-dense table { font-size: 8pt; }
  .inventory-print-page.density-dense th,
  .inventory-print-page.density-dense td { padding: .42mm .48mm; height: 3.6mm; }
  .inventory-print-page.density-dense .description-cell { font-size: 7.5pt; }
  .inventory-print-page.density-ultra .inventory-print-header { margin-bottom: .8mm; }
  .inventory-print-page.density-ultra h1 { font-size: 11.8pt; }
  .inventory-print-page.density-ultra .inventory-print-meta { font-size: 6.8pt; }
  .inventory-print-page.density-ultra table { font-size: 7.1pt; }
  .inventory-print-page.density-ultra th,
  .inventory-print-page.density-ultra td { padding: .28mm .4mm; height: 3.1mm; }
  .inventory-print-page.density-ultra .description-cell { font-size: 6.75pt; }
}

/* v112.3 manual inventory selection state */
.manual-inventory-panel .setting-field input:disabled,
.manual-inventory-panel .setting-field select:disabled {
  opacity: .58;
  cursor: not-allowed;
  background: color-mix(in srgb, var(--panel) 88%, var(--muted) 12%);
}
.manual-inventory-panel.category-selected {
  border-color: color-mix(in srgb, var(--accent) 58%, var(--line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent);
}
.manual-inventory-panel.category-selected .setting-field:has(#manualInventoryLocation),
.manual-inventory-panel.category-selected .setting-field:has(#manualInventoryPallets),
.manual-inventory-panel.category-selected .setting-field:has(#manualInventoryCartons) {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--line));
  background: color-mix(in srgb, var(--panel) 90%, var(--accent) 10%);
}
.manual-inventory-panel.location-selected #manualInventoryLocation,
.manual-inventory-panel.location-selected #manualInventoryPallets,
.manual-inventory-panel.category-selected #manualInventoryCartons {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 38%, transparent);
}
.manual-inventory-status.ready { color: var(--accent); font-weight: 700; }

/* v113 separate Pro workspace entry — current interface otherwise unchanged */
.pro-preview-entry{display:flex;align-items:center;gap:10px;margin:10px 12px 12px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--accent,#2563eb) 38%,transparent);border-radius:10px;background:color-mix(in srgb,var(--accent,#2563eb) 10%,var(--panel,#fff));color:var(--text,#172033);text-decoration:none;line-height:1.15}.pro-preview-entry:hover{background:color-mix(in srgb,var(--accent,#2563eb) 16%,var(--panel,#fff));transform:translateY(-1px)}.pro-preview-entry__mark{display:grid;place-items:center;width:28px;height:28px;border-radius:7px;background:var(--accent,#2563eb);color:#fff;font-weight:800}.pro-preview-entry span:last-child{display:grid;gap:3px}.pro-preview-entry strong{font-size:12px}.pro-preview-entry small{font-size:10px;opacity:.68}

/* v116.3 weekday demand analytics and QA footer */
.weekday-demand-panel { margin-top: 16px; }
.weekday-demand-summary { color: var(--muted); font-size: 12px; text-align: end; }
.weekday-demand-chart { display: grid; gap: 8px; }
.weekday-demand-row {
  display: grid;
  grid-template-columns: minmax(82px, .7fr) minmax(180px, 3fr) minmax(94px, .8fr) minmax(94px, .8fr) minmax(72px, .6fr);
  gap: 12px;
  align-items: center;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}
.weekday-demand-row:last-child { border-bottom: 0; }
.weekday-demand-day { font-weight: 750; }
.weekday-demand-bars { display: grid; gap: 5px; }
.weekday-demand-track { height: 8px; border-radius: 999px; background: color-mix(in srgb, var(--muted) 16%, transparent); overflow: hidden; }
.weekday-demand-fill { display: block; height: 100%; min-width: 2px; border-radius: inherit; background: var(--accent); }
.weekday-demand-fill.max { opacity: .42; }
.weekday-demand-stat { font-size: 12px; color: var(--muted); }
.weekday-demand-stat strong { display: block; color: var(--text); font-size: 14px; }
.weekday-demand-row.busiest { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.weekday-demand-labels { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 10px; color: var(--muted); }
.site-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 14px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: var(--panel);
  font-size: 11px;
}
.site-footer a { color: var(--accent); text-decoration: none; font-weight: 650; }
.site-footer a:hover { text-decoration: underline; }
@media (max-width: 820px) {
  .weekday-demand-row { grid-template-columns: 72px 1fr 78px; }
  .weekday-demand-stat.max-stat, .weekday-demand-stat.days-stat { display: none; }
}
@media print { .site-footer { display: none !important; } }


/* v116.7 weekday drill-down */
.weekday-demand-row { width: 100%; border-left: 0; border-right: 0; border-top: 0; background: transparent; color: inherit; text-align: inherit; font: inherit; cursor: pointer; }
.weekday-demand-row:hover:not(:disabled), .weekday-demand-row.selected { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.weekday-demand-row:disabled { cursor: default; opacity: .55; }
.weekday-demand-day small { display: block; margin-top: 3px; color: var(--accent); font-size: 9px; font-weight: 700; }
.weekday-demand-details { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 12px; }
.weekday-detail-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.weekday-detail-header strong, .weekday-detail-header small { display: block; }
.weekday-detail-header small { color: var(--muted); margin-top: 2px; }
.weekday-detail-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); gap: 6px; }
.weekday-detail-row { display: grid; grid-template-columns: 1fr auto; column-gap: 8px; align-items: baseline; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--panel) 96%, var(--accent)); }
.weekday-detail-row small { grid-column: 2; color: var(--muted); font-size: 10px; }
.weekday-detail-row.largest { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }

/* v117.3 — release metadata */
.site-footer .build-version { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--text); }

/* v119.3 Classic Inventory Request */
.inventory-request-header{align-items:flex-start;gap:16px}.inventory-request-actions,.inventory-request-toolbar,.inventory-request-modes{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.inventory-request-toolbar{padding:12px 0;border-bottom:1px solid var(--border);justify-content:space-between}.inventory-request-toolbar .search-input{min-width:280px;flex:1}.inventory-request-modes .btn.active{box-shadow:inset 0 0 0 2px currentColor}.inventory-request-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px 0}.inventory-request-summary>div{border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:var(--surface-soft,rgba(127,127,127,.06));display:flex;flex-direction:column;gap:3px}.inventory-request-summary strong{font-size:1.25rem}.inventory-request-summary span{font-size:.78rem;color:var(--muted)}.inventory-request-table-scroll{max-height:calc(100vh - 330px)}.request-select-col{width:62px;text-align:center}.request-amount-input{width:88px;padding:6px 8px;text-align:center}.request-selected-row{outline:1px solid var(--accent);outline-offset:-1px;background:color-mix(in srgb,var(--accent) 7%,transparent)}
@media(max-width:1100px){.inventory-request-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v119.3 pallet quantity entry */
.request-pallet-input{min-width:92px}.inventory-request-classic .data-table th,.inventory-request-classic .data-table td{white-space:nowrap}.inventory-request-classic .description-cell{white-space:normal}

.inventory-request-lookback{display:flex;align-items:center;gap:8px;white-space:nowrap}.inventory-request-lookback span{font-size:12px;color:var(--muted)}.inventory-request-lookback .select-input{min-width:150px}

/* v119.18 Classic location capacity workspace */
.location-capacity-classic { display:flex; flex-direction:column; min-height:0; }
.location-capacity-actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.location-capacity-toolbar { display:flex; align-items:center; gap:14px; padding:12px 16px; border-bottom:1px solid var(--border); }
.location-capacity-toolbar .search-input { max-width:420px; }
.location-capacity-summary { margin-inline-start:auto; white-space:nowrap; color:var(--muted); }
.capacity-model-note { margin:10px 16px 0; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface-soft); color:var(--muted); }
.location-capacity-table-scroll { flex:1; min-height:0; }
#locationCapacityTable th:nth-child(1) { min-width:92px; }
#locationCapacityTable th:nth-child(2) { min-width:150px; }
#locationCapacityTable th:nth-child(3) { min-width:76px; }
#locationCapacityTable th:nth-child(4) { min-width:180px; }
#locationCapacityTable .capacity-space-input { width:92px; text-align:center; }
@media (max-width:900px) {
  .location-capacity-toolbar { align-items:stretch; flex-direction:column; }
  .location-capacity-summary { margin-inline-start:0; }
}

/* v119.20.1 authentication foundation */
html.auth-required .app-shell, html:not(.auth-authorized) .app-shell { visibility: hidden !important; }
.auth-gate { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 24px; background: #f4f7fb; color: #182230; }
html[data-startup-theme="dark"] .auth-gate, body[data-theme="dark"] .auth-gate { background: #0b1220; color: #f8fafc; }
.auth-gate[hidden] { display: none; }
.auth-card { width: min(430px, 100%); border: 1px solid #39424c; border-radius: 12px; background: #222930; box-shadow: 0 24px 70px rgba(0,0,0,.35); overflow: hidden; }
.auth-brand { display: flex; gap: 14px; align-items: center; padding: 24px; border-bottom: 1px solid #39424c; }
.auth-mark { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 8px; background: #e8edf1; color: #182028; font-weight: 800; }
.auth-brand h1 { margin: 0; font-size: 22px; }.auth-brand p { margin: 4px 0 0; color: #aeb8c1; }
.auth-form { display: grid; gap: 16px; padding: 24px; }.auth-form label { display: grid; gap: 7px; font-weight: 650; }
.auth-form input { width: 100%; box-sizing: border-box; border: 1px solid #56616d; border-radius: 7px; background: #151a1f; color: #fff; padding: 12px; font: inherit; }
.auth-password { display: grid; grid-template-columns: 1fr auto; }.auth-password input { border-radius: 7px 0 0 7px; }.auth-password button { border: 1px solid #56616d; border-left: 0; border-radius: 0 7px 7px 0; background: #303943; color: #eef2f5; padding: 0 12px; }
.auth-submit { border: 0; border-radius: 7px; padding: 12px 16px; background: #e8edf1; color: #182028; font: inherit; font-weight: 750; cursor: pointer; }.auth-submit:disabled { opacity: .55; cursor: wait; }
.auth-link { border: 0; background: transparent; color: #c9d2da; text-decoration: underline; cursor: pointer; font: inherit; }.auth-link:disabled { opacity: .55; }
.auth-message { min-height: 20px; color: #ffb3b3; }.auth-message[data-type="success"] { color: #9ee2b1; }
.auth-footer { display: flex; justify-content: space-between; gap: 12px; padding: 13px 24px; border-top: 1px solid #39424c; color: #9faab4; font-size: 13px; }
.auth-user-card { display:grid; gap:6px; margin-top:12px; }.auth-user-card small { text-transform:capitalize; opacity:.75; }.auth-user-card button { margin-top:6px; width:100%; }
.user-access-table input[type="text"], .user-access-table select { min-width: 150px; width: 100%; }
.user-access-table td { vertical-align: top; }
.inline-check { display: inline-flex; align-items: center; gap: .5rem; white-space: nowrap; }
