/* Light palette for the desktop-matched web shell. */
html[data-theme="light"] {
  color-scheme: light;
  --bg: #edf3fa;
  --surface: #f5f8fc;
  --surface-2: #e5edf7;
  --ink: #17263d;
  --muted: #60738e;
  --line: #c7d4e3;
  --brand: #2563eb;
  --brand-2: #06b6d4;
  --success: #059669;
  --warn: #d97706;
  --danger: #e11d48;
  --input-bg: #fbfdff;
  --topbar-bg: #09111e;
  --sidebar-bg: #edf3fa;
  --sidebar-panel: #f7f9fc;
  --hover: #e3ebf6;
  --shadow-soft: 0 4px 16px rgba(28, 48, 78, 0.08);
  --shadow-card: 0 8px 24px rgba(28, 48, 78, 0.12);
}

html[data-theme="light"] body {
  color: var(--ink);
  background: var(--bg);
}

html[data-theme="light"] .topbar {
  color: #e8eef8;
  background: var(--topbar-bg);
  border-color: #17263b;
}

html[data-theme="light"] .topbar h1,
html[data-theme="light"] .topbar p,
html[data-theme="light"] .topbar .eyebrow {
  color: #e8eef8;
}

html[data-theme="light"] .topbar .global-search {
  color: #dce7f6;
  background: #111d2d;
  border-color: #293a52;
}

html[data-theme="light"] .topbar .global-search input {
  color: #e8eef8;
  background: transparent;
  border-color: transparent;
}

html[data-theme="light"] .topbar .topbar-tool,
html[data-theme="light"] .topbar .icon-btn {
  color: #e8eef8;
  background: #111d2d;
  border-color: #293a52;
}

html[data-theme="light"] .sidebar {
  color: var(--ink);
  background: var(--sidebar-bg);
  border-color: var(--line);
}

html[data-theme="light"] .brand,
html[data-theme="light"] .sidebar-bottom {
  background: var(--sidebar-bg);
  border-color: var(--line);
}

html[data-theme="light"] .nav-button {
  color: var(--ink);
}

html[data-theme="light"] .nav-button:hover,
html[data-theme="light"] .nav-button.active {
  color: var(--brand);
  background: #dce8f7;
}

html[data-theme="light"] .main,
html[data-theme="light"] .content {
  color: var(--ink);
  background: var(--bg);
}

html[data-theme="light"] .card,
html[data-theme="light"] .metric,
html[data-theme="light"] .customer-data-table td,
html[data-theme="light"] .customer-data-table th {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--line);
}

html[data-theme="light"] .customer-workspace-head,
html[data-theme="light"] .customer-filterbar,
html[data-theme="light"] .customer-footer {
  background: var(--bg);
  border-color: var(--line);
}

html[data-theme="light"] .customer-data-table th {
  background: #e1eaf5;
}

html[data-theme="light"] .customer-data-table td {
  background: #f1f6fb;
}

html[data-theme="light"] .customer-filterbar input,
html[data-theme="light"] .customer-filterbar select,
html[data-theme="light"] .customer-filterbar .control {
  color: var(--ink);
  background: var(--input-bg);
  border-color: var(--line);
}

html[data-theme="light"] .customer-filterbar input::placeholder {
  color: var(--muted);
  opacity: 1;
}

html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  color: var(--ink);
  background: var(--input-bg);
  border-color: var(--line);
}

html[data-theme="light"] .shell-status-bar {
  color: var(--muted);
  background: #f5f8fc;
  border-color: var(--line);
}