/* Local palette trial. Kept separate so the previous theme is easy to restore.
   Brand blue/cyan are distinct from green success, amber warnings and red errors. */
:root {
  --brand-navy: #061a37;
  --brand-blue: #075be8;
  --brand-cyan: #33d3f5;
  --brand-accent: #67d9ef;
  --brand-soft: rgba(51, 211, 245, .12);
  --bg-dark-base: #091d38;
  --bg-dark-surface: #102846;
  --bg-dark-elevated: #173454;
  --bg-dark-glow: #25486d;
  --glass-bg: #102846;
  --glass-border: #2b4665;
  --glass-border-focus: #518cbe;
  --text-primary: #f1f6ff;
  --text-secondary: #b6c8df;
  --text-muted: #9aafcb;
  --color-blue: #397eea;
  --color-blue-hover: #2469d3;
  --color-blue-glow: rgba(57, 126, 234, .16);
  --color-green: #34d399;
  --color-green-hover: #059669;
  --color-orange: #fbbf24;
  --color-orange-hover: #d97706;
  --color-copper: #33d3f5;
  --color-copper-hover: #0cb8dc;
  --color-copper-glow: rgba(51, 211, 245, .12);
  --copper-glow-shadow: 0 4px 18px #33d3f51a;
  --table-td-bg: #102846;
  --table-hover-bg: #19395c;
  --input-bg: #0c213d;
  --input-bg-focus: #122e50;
  --btn-outline-hover-bg: #1b3b60;
  --menu-item-hover-bg: #183657;
  --menu-item-active-bg: #173e66;
  --header-bg: #0e2543f5;
  --shadow-sm: 0 3px 10px #020f201c;
  --shadow-md: 0 8px 24px #020f2033;
  --shadow-lg: 0 18px 44px #020f2055;
  --blue-glow-shadow: 0 6px 20px #075be826;
}
:root.light-theme, .light-theme {
  --brand-accent: #006f91;
  --brand-soft: #e3f4fa;
  --bg-dark-base: #f1f5fa;
  --bg-dark-surface: #ffffff;
  --bg-dark-elevated: #eaf1f9;
  --bg-dark-glow: #d1dfef;
  --glass-bg: #ffffff;
  --glass-border: #d6e1ee;
  --glass-border-focus: #7ea9dd;
  --text-primary: #0a2145;
  --text-secondary: #415773;
  --text-muted: #566d88;
  --color-blue: #075be8;
  --color-blue-hover: #084bb8;
  --color-green: #087c58;
  --color-orange: #a35708;
  --color-copper: #006f91;
  --color-copper-hover: #005872;
  --table-td-bg: #ffffff;
  --table-hover-bg: #edf5fd;
  --input-bg: #f8fbff;
  --input-bg-focus: #ffffff;
  --btn-outline-hover-bg: #e8f1fc;
  --menu-item-hover-bg: #e8f1fc;
  --menu-item-active-bg: #dceafd;
  --header-bg: #ffffffed;
  --shadow-sm: 0 3px 10px #082c5508;
  --shadow-md: 0 8px 24px #082c550d;
  --shadow-lg: 0 18px 44px #082c5517;
}
body { background-image: none; }
.login-page .btn-orange, .login-page .btn-blue { background: var(--brand-blue); color: #fff; }
.login-page .btn-orange:hover, .login-page .btn-blue:hover { background: #084bb8; }
.login-page .portal-opt.active { background: var(--brand-soft); color: var(--brand-accent); }
.login-card::before, .login-card::after { background: none; }
/* The navigation stays navy in both themes, like the landing header. */
.app-container .sidebar {
  --bg-dark-surface: #061a37;
  --bg-dark-elevated: #102e51;
  --text-primary: #f1f6ff;
  --text-secondary: #b6c8df;
  --text-muted: #97b0ce;
  --glass-border: #274263;
  --color-blue: #67d9ef;
  --color-copper: #67d9ef;
  --color-orange: #fbbf24;
  background: #061a37;
  border-right-color: #274263;
}
.app-container .sidebar .menu-item:hover { background: #112f52; }
.app-container .sidebar .menu-item.active {
  color: #8ae9ff;
  background: #10395f;
  border-left-color: #33d3f5;
}
.app-container .sidebar .logo-icon { background: #075be8 !important; }
.app-container .sidebar .user-avatar { background: #075be8; color: white; }
.app-container .sidebar .tenant-name { color: #67d9ef; }
.app-container .sidebar .btn-outline:hover { background: #153858; }
.app-container .main-header { border-bottom-color: var(--glass-border); }
.app-container .btn-blue { background: var(--brand-blue); color: #fff; }
.app-container .btn-blue:hover { background: #084bb8; }
.app-container .btn-green { background: var(--brand-cyan); color: #062046; }
.app-container .btn-green:hover { background: #72e2fa; color: #062046; }
.app-container .btn-orange { color: #fff; background: #985000; }
.app-container .btn-orange:hover { background: #7f4000; }
.app-container .dashboard-eyebrow,
.app-container .dashboard-section-title h3 svg { color: var(--brand-accent); }
.app-container .dashboard-bar-track span { background: linear-gradient(180deg, #33d3f5, #075be8); }
.app-container .metric-icon.blue { background: var(--color-blue-glow); color: var(--brand-accent); }
.app-container .dashboard-metric { border-left-color: var(--brand-blue); }
.app-container .dashboard-metric .metric-icon { background: var(--brand-soft); color: var(--brand-accent); }
.app-container .badge-blue { color: var(--brand-accent); border-color: var(--glass-border-focus); }
.app-container .dashboard-section-title button,
.app-container .support-eyebrow,
.app-container .support-ticket-number { color: var(--brand-accent); }
.app-container .input-field:focus { border-color: var(--brand-accent); box-shadow: 0 0 0 3px var(--brand-soft); }
.app-container :where(button, a, input, select, textarea):focus-visible { outline: 2px solid var(--brand-accent); outline-offset: 3px; }
@media print {
  .app-container { --text-primary: #111827; --text-secondary: #374151; --text-muted: #475569; --glass-bg: #fff; --bg-dark-base: #fff; --bg-dark-surface: #fff; --table-td-bg: #fff; }
}