/* Neworia visual system: navy and steel surfaces, electric cyan, cool blue. */
:root {
  --bg: #071522;
  --sidebar: #0c0d0f;
  --panel: #15171a;
  --panel-2: #222427;
  --control: #181a1d;
  --line: #2a2d30;
  --sidebar-line: #282a2d;
  --text: #f2f3f4;
  --muted: #b4b4b4;
  --blue: #37b9e8;
  --blue-light: #b8e5ff;
  --focus: #71c8fa;
  --green: #68d6ad;
  --red: #ff838c;
  --amber: #a7e8ff;
  --surface-shadow: none;
  --brand-accent: #37b9e8;
  --brand-highlight: #72d3fb;
  --brand-steel: #bac3c9;
}

body.light {
  --bg: #edf3f6;
  --sidebar: #081b29;
  --panel: #ffffff;
  --panel-2: #f5f8fa;
  --control: #f7fafb;
  --line: #d7e1e7;
  --sidebar-line: #183344;
  --text: #142a38;
  --muted: #647987;
  --blue: #087eaa;
  --blue-light: #dff5ff;
  --focus: #72d3fb;
  --green: #138766;
  --red: #bf4652;
  --amber: #087eaa;
  --surface-shadow: none;
  --brand-accent: #087eaa;
  --brand-highlight: #075d7c;
  --brand-steel: #56636c;
}

/* The legacy dashboard scopes its own palette to body.dashboard-v3.
   Override those higher-specificity tokens so the Neworia palette reaches every module. */
body.dashboard-v3:not(.light) {
  --bg: #071522;
  --sidebar: #0c0d0f;
  --sidebar-line: #282a2d;
  --panel: #15171a;
  --surface: #15171a;
  --surface-raised: #222427;
  --panel-2: #222427;
  --control: #181a1d;
  --line: #2a2d30;
  --text: #f2f3f4;
  --muted: #b4b4b4;
  --accent: #37b9e8;
  --blue: #37b9e8;
  --blue-light: #a7e8ff;
  --focus: #72d3fb;
  --amber: #72d3fb;
  --surface-shadow: none;
}

body.dashboard-v3.light {
  --bg: #edf3f6;
  --sidebar: #081b29;
  --sidebar-line: #183344;
  --panel: #ffffff;
  --surface: #ffffff;
  --surface-raised: #f5f8fa;
  --panel-2: #f5f8fa;
  --control: #f7fafb;
  --line: #d7e1e7;
  --text: #142a38;
  --muted: #647987;
  --accent: #087eaa;
  --blue: #087eaa;
  --blue-light: #075d7c;
  --focus: #075d7c;
  --amber: #075d7c;
  --surface-shadow: none;
}

html { scrollbar-color: var(--line) var(--bg); }
body { background-color: var(--bg); color: var(--text); }
body:not(.light) { color-scheme: dark; }
body.light { color-scheme: light; }
::selection { background: color-mix(in srgb, var(--brand-accent) 35%, transparent); color: var(--text); }

.brand-mark.small,
.brand-mark.login-mark {
  border: 1px solid color-mix(in srgb, var(--brand-highlight) 52%, var(--line));
  border-radius: 11px;
  background-color: #121820;
  box-shadow: 0 5px 18px #0004;
  object-fit: contain;
}
.brand b,
.team-brand b,
.team-login-brand b { letter-spacing: .08em; }
.brand small,
.team-brand small,
.team-login-brand small { color: var(--muted); }
.login-brand-art { display: block; width: min(232px, 86%); height: 174px; margin: 0 auto 14px; object-fit: contain; }
.team-login-art { width: min(205px, 80%); height: 148px; margin-bottom: 4px; }
.button.primary,
.button.primary:hover:not(:disabled) {
  border-color: var(--brand-accent);
  background: var(--brand-accent);
  color: #06202b;
}
.button.primary:hover:not(:disabled) { filter: brightness(1.12); }
.workspace-category.active::after,
.nav-item.active { box-shadow: inset 3px 0 var(--brand-highlight); }
.workspace-category.active { border-color: color-mix(in srgb, var(--brand-accent) 64%, var(--line)); }
.nav-group-toggle[aria-expanded="true"],
.nav-item.active,
.team-tab[aria-current="page"] { color: var(--text); }
.nav-item.active { background: color-mix(in srgb, var(--brand-accent) 13%, var(--panel)); }
body.dashboard-v3 .nav-item.active {
  border-color: color-mix(in srgb, var(--brand-accent) 28%, var(--line));
  background: color-mix(in srgb, var(--brand-accent) 13%, var(--panel));
  box-shadow: inset 3px 0 var(--brand-highlight);
  color: var(--text);
}
body.dashboard-v3 .nav-item.active > span,
body.dashboard-v3 .mobile-tab.active > span { color: var(--brand-highlight); }
body.dashboard-v3 .nav-group-toggle:hover,
body.dashboard-v3 .nav-item:hover,
body.dashboard-v3 .quick-actions button:hover,
body.dashboard-v3 .ticket-row:hover {
  border-color: color-mix(in srgb, var(--brand-accent) 24%, var(--line));
  background: color-mix(in srgb, var(--brand-accent) 7%, var(--panel-2));
}
body.dashboard-v3 .button.primary,
body.dashboard-v3 .primary:not(.badge):not(.status-badge) {
  border-color: var(--brand-accent);
  background: var(--brand-accent);
  color: #06202b;
}
body.dashboard-v3 .button.primary:hover:not(:disabled),
body.dashboard-v3 .primary:not(.badge):not(.status-badge):hover {
  border-color: var(--brand-highlight);
  background: var(--brand-highlight);
  color: #06202b;
}
body.dashboard-v3 .panel,
body.dashboard-v3 .stat-card,
body.dashboard-v3 .login-card,
body.dashboard-v3 .module-card,
body.dashboard-v3 .event-card,
body.dashboard-v3 .resource-card,
body.dashboard-v3 .type-chip,
body.dashboard-v3 .application-question-card {
  border-color: var(--line);
  background-color: var(--panel);
}
body.dashboard-v3 .input:focus,
body.dashboard-v3 textarea.input:focus,
body.dashboard-v3 select.input:focus,
body.dashboard-v3 .multi-select-trigger:focus-visible {
  border-color: var(--focus);
  outline-color: color-mix(in srgb, var(--focus) 35%, transparent);
}
body.dashboard-v3 .overview-focus .focus-icon,
body.dashboard-v3 .quick-actions button > span,
body.dashboard-v3 .nav-item.active > span { color: var(--brand-highlight); }
body.dashboard-v3 .mobile-tabbar {
  border-color: color-mix(in srgb, var(--brand-highlight) 36%, var(--line));
  background: var(--sidebar);
}
body.dashboard-v3 .badge:not(.success):not(.danger),
body.dashboard-v3 .status-badge:not(.success):not(.danger) {
  border-color: color-mix(in srgb, var(--brand-accent) 42%, var(--line));
  background: color-mix(in srgb, var(--brand-accent) 14%, var(--panel));
  color: var(--blue-light);
}
.team-cockpit-heading,
.team-section-heading { border-color: color-mix(in srgb, var(--brand-highlight) 30%, var(--line)); }
.team-news-status,
.team-calendar-item time { color: var(--brand-highlight); }
body.dashboard-v3 .brand-mark.small { border: 1px solid color-mix(in srgb, var(--brand-highlight) 62%, var(--line)); }
.overview-separator,
.team-eyebrow,
.team-active-space span { color: var(--brand-highlight); }
.overview-hero {
  border-color: color-mix(in srgb, var(--brand-accent) 44%, var(--line));
  background-color: #102838;
  background-image: linear-gradient(115deg, #0c2638, #102838 58%, #123247);
  background-size: cover;
  background-position: center;
}
.health-pill,
.badge.open,
.badge.claimed { border-color: color-mix(in srgb, var(--green) 42%, var(--line)); }
.button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible { outline-color: var(--focus); }
.team-page-footer,
.topbar,
.team-topbar { border-color: var(--line); }
.user-settings-dialog,
.team-theme-dialog,
.mobile-more-dialog { border-color: var(--line); background: var(--panel); color: var(--text); }
.legal-shell { --legal-bg: var(--bg); --legal-panel: var(--panel); --legal-line: var(--line); --legal-text: var(--text); --legal-muted: var(--muted); --legal-accent: var(--brand-accent); }
.legal-brand { color: var(--text); }

@media (prefers-reduced-motion: reduce) {
  html:focus-within { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Replace remaining literal legacy blues in components that predate the theme layer. */
body.dashboard-v3:not(.light) .category-rail { background: var(--sidebar); }
body.dashboard-v3:not(.light) .category-tab { color: var(--muted); }
body.dashboard-v3:not(.light) .category-tab:hover,
body.dashboard-v3:not(.light) .category-tab.active { border-color: color-mix(in srgb, var(--brand-accent) 38%, var(--line)); background: color-mix(in srgb, var(--brand-accent) 14%, var(--panel)); color: var(--brand-highlight); }
body.dashboard-v3:not(.light) .nav-item.active { border-color: color-mix(in srgb, var(--brand-accent) 30%, var(--line)); background: color-mix(in srgb, var(--brand-accent) 13%, var(--panel)); box-shadow: inset 3px 0 var(--brand-highlight); color: var(--text); }
body.dashboard-v3:not(.light) .nav-item.active span { color: var(--brand-highlight); }
body.dashboard-v3:not(.light) .multi-select-dialog { border-color: var(--line); background: var(--panel); color: var(--text); }
body.dashboard-v3:not(.light) .multi-select-head h2 { color: var(--text); }
body.dashboard-v3:not(.light) #multi-select-search { border-color: var(--line); background-color: var(--control); color: var(--text); }
body.dashboard-v3:not(.light) .multi-select-selection,
body.dashboard-v3:not(.light) .multi-select-tools { color: var(--muted); }
body.dashboard-v3:not(.light) .multi-select-option { border-color: var(--line); background: var(--panel-2); color: var(--text) !important; }
body.dashboard-v3:not(.light) .multi-select-option:hover,
body.dashboard-v3:not(.light) .multi-select-option.selected { border-color: color-mix(in srgb, var(--brand-accent) 48%, var(--line)); background: color-mix(in srgb, var(--brand-accent) 14%, var(--panel)); }
body.dashboard-v3:not(.light) .multi-select-actions { border-color: var(--line); }
body.dashboard-v3:not(.light) .invite-reward-row { border-color: var(--line) !important; background: var(--panel-2) !important; }
body.dashboard-v3:not(.light) .overview-hero::before { background: linear-gradient(90deg, #071522e8, #0c1b25e0 66%, #102838b5); }
body.dashboard-v3:not(.light) .mobile-tabbar { border-color: color-mix(in srgb, var(--brand-highlight) 32%, var(--line)); background: color-mix(in srgb, var(--sidebar) 94%, transparent); }
body.dashboard-v3:not(.light) .mobile-tab.active { background: color-mix(in srgb, var(--brand-accent) 18%, var(--panel)); color: var(--brand-highlight); }
body.dashboard-v3:not(.light) select.input option,
body.dashboard-v3:not(.light) .server-picker select option { background: var(--panel); color: var(--text); }
body.dashboard-v3.light .category-tab:hover,
body.dashboard-v3.light .category-tab.active { border-color: color-mix(in srgb, var(--brand-accent) 38%, var(--line)); background: color-mix(in srgb, var(--brand-accent) 10%, var(--panel)); color: var(--brand-accent); }
body.dashboard-v3.light .multi-select-dialog,
body.dashboard-v3.light .multi-select-option { border-color: var(--line); background: var(--panel); color: var(--text); }
body.dashboard-v3.light .multi-select-option.selected,
body.dashboard-v3.light .multi-select-option:hover { border-color: color-mix(in srgb, var(--brand-accent) 48%, var(--line)); background: color-mix(in srgb, var(--brand-accent) 10%, var(--panel)); }

/* Keep form selections in the dashboard's original cyan, separate from Neworia cyan branding. */
body.dashboard-v3:not(.light) { --selection-accent: #37b8e8; --selection-focus: #73d4f7; }
body.dashboard-v3.light { --selection-accent: #087ea8; --selection-focus: #087ea8; }
body.dashboard-v3 :is(select, .multi-select-trigger):focus-visible,
body.dashboard-v3 select:focus {
  border-color: var(--selection-focus) !important;
  outline: 2px solid color-mix(in srgb, var(--selection-focus) 22%, transparent) !important;
  outline-offset: 1px;
}
body.dashboard-v3 input[type="checkbox"],
body.dashboard-v3 input[type="radio"] { accent-color: var(--selection-accent); }
body.dashboard-v3 select option:checked { background: var(--selection-accent); color: #fff; }
body.dashboard-v3 .multi-select-option:is(:hover, .selected) {
  border-color: color-mix(in srgb, var(--selection-accent) 55%, var(--line));
  background: color-mix(in srgb, var(--selection-accent) 14%, var(--panel));
}