/*
 * FlightOps app-wide theme modes — UI overhaul lane (2026-07-23).
 *
 * Architecture:
 *   - Obsidian Gold is the default theme. Its values ARE the baseline tokens
 *     defined in flightops-ops-console.css :root (desktop) and mobile.css :root
 *     (mobile). No [data-flightops-ui-theme="obsidian"] override block is needed.
 *   - Night and Cobalt are pure token overrides of the same custom properties.
 *     There are intentionally NO per-component theme rules in this file anymore:
 *     if a surface does not re-theme, fix its styles to consume tokens — do not
 *     add scoped overrides here.
 *   - Legacy compat namespaces (--fo-theme-*, --fo-beta10-*, --fo-audit-*,
 *     --fo-warm-*, --fo-theme-chat-*) are chained onto the core tokens below and
 *     in flightops-ops-console.css. Do not add new consumers of those names.
 *
 * Theme ids: obsidian (default) | night | cobalt
 * Switch mechanism: html[data-flightops-ui-theme] set by flightops-theme.js
 * (localStorage key "flightopsUiTheme"; legacy dark/light/blue values migrate).
 */

/* ============================================================
   HTML-level short tokens (mobile PWA + auth/switcher surfaces)
   ============================================================ */

html[data-flightops-ui-theme="obsidian"] {
  color-scheme: dark;
  --bg: #0e0f11;
  --panel: #16181c;
  --panel-2: #1c1e23;
  --line: rgba(196, 184, 166, 0.22);
  --text: #f2efe9;
  --muted: #a49d92;
  --accent: #d9ad52;
  --accent-strong: #c0973f;
  --shadow: rgba(0, 0, 0, 0.5);
  --good: #3ecf7d;
  --warn: #ffa733;
  --bad: #f05252;
}

html[data-flightops-ui-theme="night"] {
  color-scheme: dark;
  --bg: #050607;
  --panel: #0a0c0e;
  --panel-2: #0f1214;
  --line: rgba(120, 160, 140, 0.24);
  --text: #e6efe9;
  --muted: #93a39a;
  --accent: #54d68a;
  --accent-strong: #3aa86b;
  --shadow: rgba(0, 0, 0, 0.62);
  --good: #2fae66;
  --warn: #e5a13c;
  --bad: #ff4d42;
}

html[data-flightops-ui-theme="cobalt"] {
  color-scheme: dark;
  --bg: #0a1424;
  --panel: #101f35;
  --panel-2: #152742;
  --line: rgba(140, 178, 224, 0.24);
  --text: #eef5fd;
  --muted: #a3b8d1;
  --accent: #56a4fa;
  --accent-strong: #3b82d9;
  --shadow: rgba(2, 8, 20, 0.6);
  --good: #2fd076;
  --warn: #ffb03a;
  --bad: #ff5d5d;
}

/* ============================================================
   Desktop console: legacy namespace chaining (default scope).
   These make every remaining --fo-theme-* / chat consumer follow
   the active theme automatically, including the previously
   never-theming chat surfaces.
   ============================================================ */

body.flightops-ops-console {
  --fo-theme-page: var(--fo-bg-page);
  --fo-theme-page-deep: var(--fo-bg-page);
  --fo-theme-surface: var(--fo-bg-surface);
  --fo-theme-surface-raised: var(--fo-bg-surface-2);
  --fo-theme-surface-soft: var(--fo-bg-surface-2);
  --fo-theme-line: var(--fo-border-subtle);
  --fo-theme-line-strong: var(--fo-border-strong);
  --fo-theme-text: var(--fo-text-primary);
  --fo-theme-strong: var(--fo-text-strong);
  --fo-theme-muted: var(--fo-text-secondary);
  --fo-theme-dim: var(--fo-text-muted);
  --fo-theme-accent: var(--fo-accent);
  --fo-theme-accent-deep: var(--fo-accent-deep);
  --fo-theme-accent-contrast: var(--fo-accent-ink);
  --fo-theme-control: var(--fo-bg-surface);
  --fo-theme-control-hover: var(--fo-bg-surface-2);
  --fo-theme-control-active: var(--fo-accent-soft);
  --fo-theme-shadow-strong: rgba(0, 0, 0, 0.45);
  --fo-theme-chat-shell: var(--fo-bg-page);
  --fo-theme-chat-panel: var(--fo-bg-surface);
  --fo-theme-chat-panel-raised: var(--fo-bg-surface-2);
  --fo-theme-chat-inbound: var(--fo-bg-surface-2);
  --fo-theme-chat-outbound: var(--fo-accent-soft);
  --fo-theme-chat-range: var(--fo-bg-surface-3);
  --fo-theme-chat-accent: var(--fo-accent);
  --fo-theme-chat-accent-deep: var(--fo-accent-deep);
  --fo-theme-chat-text: var(--fo-text-primary);
  --fo-theme-chat-muted: var(--fo-text-secondary);
  --fo-theme-chat-line: var(--fo-border-subtle);
}

/* ============================================================
   NIGHT — dark-room scope console.
   Near-black neutral surfaces, hairline borders, phosphor-green
   interaction accent, red reserved for critical.
   ============================================================ */

html[data-flightops-ui-theme="night"] body.flightops-ops-console {
  --fo-bg-page: #050607;
  --fo-bg-map: #060809;
  --fo-bg-topbar: linear-gradient(180deg, #0b0d0f, #08090b);
  --fo-bg-overlay: rgba(5, 6, 7, 0.95);
  --fo-bg-surface: #0a0c0e;
  --fo-bg-surface-2: #0f1214;
  --fo-bg-surface-3: #13171a;
  --fo-bg-card: #0f1214;
  --fo-bg-card-soft: #13171a;
  --fo-bg-card-hover: #161b1e;
  --fo-bg-input: #07090a;
  --fo-bg-elevated: #13171a;

  --fo-text-primary: #d6e2da;
  --fo-text-secondary: #9db0a5;
  --fo-text-muted: #7f9187;
  --fo-text-strong: #eef5f0;

  --fo-border-subtle: rgba(120, 160, 140, 0.14);
  --fo-border-medium: rgba(120, 160, 140, 0.26);
  --fo-border-strong: rgba(84, 214, 138, 0.42);

  --fo-accent: #54d68a;
  --fo-accent-hover: #74e2a2;
  --fo-accent-soft: rgba(84, 214, 138, 0.11);
  --fo-accent-deep: #3aa86b;
  --fo-accent-ink: #04120a;
  --fo-toggle-on-bg: var(--fo-accent-soft);
  --fo-toggle-on-border: var(--fo-border-strong);
  --fo-toggle-on-text: var(--fo-text-strong);
  --fo-toggle-on-shadow: none;
  --fo-success: #2fae66;
  --fo-warning: #e5a13c;
  --fo-danger: #ff4d42;
  --fo-stale: #566058;

  --fo-ok-soft: rgba(47, 174, 102, 0.13);
  --fo-warn-soft: rgba(229, 161, 60, 0.13);
  --fo-bad-soft: rgba(255, 77, 66, 0.15);
  --fo-info: #3fb6c9;
  --fo-info-soft: rgba(63, 182, 201, 0.13);
  --fo-focus: #74e2a2;
  --fo-sev-adv: #e5a13c;
  --fo-sev-warn: #ff8c1a;
  --fo-sev-crit: #ff3b30;
  --fo-sev-adv-soft: rgba(229, 161, 60, 0.16);
  --fo-sev-warn-soft: rgba(255, 140, 26, 0.16);
  --fo-sev-crit-soft: rgba(255, 59, 48, 0.18);
  --fo-sev-adv-ink: #241800;

  --alert-row-adv-tint: rgba(229, 161, 60, 0.11);
  --alert-row-warn-tint: rgba(255, 140, 26, 0.14);
  --alert-row-crit-tint: rgba(255, 59, 48, 0.18);
  --alert-badge-adv-bg: rgba(229, 161, 60, 0.18);
  --alert-badge-adv-border: rgba(229, 161, 60, 0.68);
  --alert-badge-warn-bg: rgba(255, 140, 26, 0.2);
  --alert-badge-warn-border: rgba(255, 140, 26, 0.78);
  --alert-badge-crit-bg: rgba(255, 59, 48, 0.22);
  --alert-badge-crit-border: rgba(255, 59, 48, 0.84);

  --fo-shadow-1: 0 4px 14px rgba(0, 0, 0, 0.55);
  --fo-shadow-2: 0 10px 30px rgba(0, 0, 0, 0.65);
}

/* ============================================================
   COBALT — the Classic FlightOps Blue lineage as avionics glass.
   Navy-slate surfaces, sky-blue interaction accent, status colors
   tuned for the navy field instead of inherited from the warm theme.
   ============================================================ */

html[data-flightops-ui-theme="cobalt"] body.flightops-ops-console {
  --fo-bg-page: #0a1424;
  --fo-bg-map: #0b1626;
  --fo-bg-topbar: linear-gradient(180deg, #12233c, #0c1a2e);
  --fo-bg-overlay: rgba(8, 18, 34, 0.94);
  --fo-bg-surface: #101f35;
  --fo-bg-surface-2: #152742;
  --fo-bg-surface-3: #1a2f4e;
  --fo-bg-card: #142440;
  --fo-bg-card-soft: #1a2f4e;
  --fo-bg-card-hover: #1d3555;
  --fo-bg-input: #0b1830;
  --fo-bg-elevated: #1a2f4e;

  --fo-text-primary: #e6effa;
  --fo-text-secondary: #aec2da;
  --fo-text-muted: #75899f;
  --fo-text-strong: #f4f9ff;

  --fo-border-subtle: rgba(140, 178, 224, 0.14);
  --fo-border-medium: rgba(140, 178, 224, 0.26);
  --fo-border-strong: rgba(86, 164, 250, 0.5);

  --fo-accent: #56a4fa;
  --fo-accent-hover: #7dbbff;
  --fo-accent-soft: rgba(86, 164, 250, 0.14);
  --fo-accent-deep: #3b82d9;
  --fo-accent-ink: #061224;
  --fo-toggle-on-bg: var(--fo-accent-soft);
  --fo-toggle-on-border: var(--fo-border-strong);
  --fo-toggle-on-text: var(--fo-text-strong);
  --fo-toggle-on-shadow: none;
  --fo-success: #2fd076;
  --fo-warning: #ffb03a;
  --fo-danger: #ff5d5d;
  --fo-stale: #5c718a;

  --fo-ok-soft: rgba(47, 208, 118, 0.13);
  --fo-warn-soft: rgba(255, 176, 58, 0.13);
  --fo-bad-soft: rgba(255, 93, 93, 0.15);
  --fo-info: #55d0e0;
  --fo-info-soft: rgba(85, 208, 224, 0.13);
  --fo-focus: #7dbbff;
  --fo-sev-adv: #ffb03a;
  --fo-sev-warn: #ff7a1a;
  --fo-sev-crit: #ff4040;
  --fo-sev-adv-soft: rgba(255, 176, 58, 0.16);
  --fo-sev-warn-soft: rgba(255, 122, 26, 0.16);
  --fo-sev-crit-soft: rgba(255, 64, 64, 0.18);
  --fo-sev-adv-ink: #2a1c00;

  --alert-row-adv-tint: rgba(255, 176, 58, 0.11);
  --alert-row-warn-tint: rgba(255, 122, 26, 0.14);
  --alert-row-crit-tint: rgba(255, 64, 64, 0.18);
  --alert-badge-adv-bg: rgba(255, 176, 58, 0.18);
  --alert-badge-adv-border: rgba(255, 176, 58, 0.68);
  --alert-badge-warn-bg: rgba(255, 122, 26, 0.2);
  --alert-badge-warn-border: rgba(255, 122, 26, 0.78);
  --alert-badge-crit-bg: rgba(255, 64, 64, 0.22);
  --alert-badge-crit-border: rgba(255, 64, 64, 0.84);

  --fo-shadow-1: 0 10px 26px rgba(2, 8, 20, 0.4);
  --fo-shadow-2: 0 20px 50px rgba(2, 8, 20, 0.55);
}

/* ============================================================
   Theme switcher control (theme-agnostic chrome)
   ============================================================ */

.flightopsThemeControl {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.flightopsThemeButton {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-width: 54px;
  width: auto !important;
  padding-inline: 11px !important;
  white-space: nowrap;
}

body.flightops-ops-console .flightopsThemeButton {
  width: auto !important;
  min-width: 54px !important;
  padding: 0 11px !important;
}

.flightopsThemeButtonText {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
}

.flightopsThemeMenu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 2450;
  width: 196px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--fo-border-subtle, rgba(196, 184, 166, 0.16));
  border-radius: 10px;
  background: var(--fo-bg-surface, #16181c);
  box-shadow: var(--fo-shadow-2, 0 22px 48px rgba(0, 0, 0, 0.34));
}

.flightopsThemeMenu[hidden] {
  display: none !important;
}

.flightopsThemeOption {
  width: 100%;
  min-height: 44px;
  display: grid !important;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--fo-text-secondary, #b3aca1) !important;
  text-align: left;
  box-shadow: none !important;
}

.flightopsThemeOption:hover,
.flightopsThemeOption.active {
  background: var(--fo-accent-soft, rgba(217, 173, 82, 0.1)) !important;
  border-color: var(--fo-border-strong, rgba(217, 173, 82, 0.34)) !important;
  color: var(--fo-text-strong, #f7f4ee) !important;
}

.flightopsThemeSwatch {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid var(--fo-border-medium, rgba(196, 184, 166, 0.2));
  background: #0e0f11;
}

.flightopsThemeOption[data-flightops-theme-option="obsidian"] .flightopsThemeSwatch {
  background: linear-gradient(135deg, #16181c 0 50%, #d9ad52 50% 100%);
}

.flightopsThemeOption[data-flightops-theme-option="night"] .flightopsThemeSwatch {
  background: linear-gradient(135deg, #060809 0 50%, #54d68a 50% 100%);
}

.flightopsThemeOption[data-flightops-theme-option="cobalt"] .flightopsThemeSwatch {
  background: linear-gradient(135deg, #0a1424 0 50%, #56a4fa 50% 100%);
}

.flightopsThemeOptionBody {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.flightopsThemeOptionBody strong {
  font-size: 12px;
  line-height: 1.1;
  color: inherit;
}

.flightopsThemeOptionBody span {
  font-size: 11px;
  line-height: 1.2;
  color: var(--fo-text-muted, #8f897e);
}

#flightopsThemeAuthControl {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 2410;
}

body:not(.authLocked) #flightopsThemeAuthControl {
  display: none;
}

/* Mobile PWA switcher chrome (uses the html-level short tokens). */

body:not(.flightops-ops-console) .flightopsThemeControl-mobile .flightopsThemeButton {
  min-width: 52px;
  min-height: 40px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--panel-2);
  color: var(--text);
  padding: 9px 10px;
}

body:not(.flightops-ops-console) .flightopsThemeControl-mobile .flightopsThemeButtonText {
  display: inline;
  font-size: 10px;
}

body:not(.flightops-ops-console) .flightopsThemeMenu {
  background: var(--panel);
  border-color: var(--line);
  color: var(--text);
  box-shadow: 0 18px 40px var(--shadow);
}

body:not(.flightops-ops-console) .flightopsThemeOption {
  color: var(--text) !important;
}

body:not(.flightops-ops-console) .flightopsThemeOptionBody span {
  color: var(--muted);
}

html[data-flightops-ui-theme="night"] body .mobileShell,
html[data-flightops-ui-theme="cobalt"] body .mobileShell {
  background: linear-gradient(180deg, var(--bg), color-mix(in srgb, var(--bg) 88%, #000 12%));
}
