/* ============================================================ DCS MISSION COMMAND — Color Themes Applied via Tactical (default) = no class ============================================================ */ /* ============================================================ AMBER — Warm phosphor CRT terminal (P1 phosphor) Inspired by 1970s AN/TPY radar scopes and early mil terminals ============================================================ */ body.theme-amber { --bg-primary: #060400; --bg-secondary: #0a0700; --bg-panel: #0e0a00; --bg-panel-alt: #120d00; --bg-elevated: #1a1200; --border: rgba(255, 170, 0, 0.2); --border-active: rgba(255, 170, 0, 0.5); --green-dim: #1a1000; --green: #ffaa00; --green-bright: #ffd27a; --amber: #ffaa00; --amber-dim: #7a5000; --green-accent: #ffcc44; --red: #ff6600; --red-dim: #661800; --blue: #ffaa00; --text-primary: #ffaa00; --text-secondary: #a06800; --text-bright: #ffd27a; --shadow-soft: 0 14px 30px rgba(0, 0, 0, 0.6); --shadow-panel: 0 20px 50px rgba(0, 0, 0, 0.7); /* CRT scanlines + phosphor glow background */ background: repeating-linear-gradient( to bottom, transparent 0px, transparent 3px, rgba(0, 0, 0, 0.18) 3px, rgba(0, 0, 0, 0.18) 4px ), radial-gradient(ellipse at center, #0d0900 0%, #050300 100%) !important; color: #ffaa00 !important; } body.theme-amber #top-bar { background: #0a0700 !important; border-bottom-color: rgba(255, 170, 0, 0.25) !important; box-shadow: 0 2px 20px rgba(255, 170, 0, 0.08); } body.theme-amber .dash-row { border-color: rgba(255, 170, 0, 0.15) !important; } body.theme-amber .dash-cell { border-right-color: rgba(255, 170, 0, 0.15) !important; } body.theme-amber .callsign { color: #ffd27a; } body.theme-amber .dash-label { color: #a06800; } body.theme-amber .dash-value { color: #ffaa00; } body.theme-amber .dash-sub { color: #7a4e00; } body.theme-amber .callsign, body.theme-amber .dash-value, body.theme-amber .dash-label, body.theme-amber .section-title, body.theme-amber .overview-title, body.theme-amber .overview-kicker, body.theme-amber .page-title, body.theme-amber .admin-title, body.theme-amber .settings-title { text-shadow: 0 0 8px rgba(255, 170, 0, 0.7), 0 0 20px rgba(255, 170, 0, 0.3); } body.theme-amber .nav-link { color: #ffaa00 !important; border-color: rgba(255, 170, 0, 0.3) !important; background: rgba(255, 170, 0, 0.04) !important; border-radius: 0 !important; text-shadow: 0 0 6px rgba(255, 170, 0, 0.5); } body.theme-amber .nav-link:hover, body.theme-amber .nav-link.active { background: rgba(255, 170, 0, 0.14) !important; border-color: #ffaa00 !important; box-shadow: 0 0 10px rgba(255, 170, 0, 0.25), inset 0 0 10px rgba(255, 170, 0, 0.05); } body.theme-amber .dash-home a { color: #ffaa00 !important; text-shadow: 0 0 6px rgba(255, 170, 0, 0.5); } /* Square corners — old hardware terminals had zero rounding */ body.theme-amber * { border-radius: 0 !important; } /* ============================================================ VECTOR — Green phosphor (P31 phosphor / NVG green) Classic radar scope & night-vision goggle aesthetic ============================================================ */ body.theme-vector { --bg-primary: #000a02; --bg-secondary: #000e03; --bg-panel: #001405; --bg-panel-alt: #001a06; --bg-elevated: #002008; --border: rgba(0, 220, 100, 0.18); --border-active: rgba(0, 255, 120, 0.5); --green-dim: #001a06; --green: #00ff88; --green-bright: #88ffcc; --amber: #00ff88; --amber-dim: #006630; --green-accent: #00ffaa; --red: #ff3344; --red-dim: #441122; --blue: #00ccff; --text-primary: #00cc66; --text-secondary: #007740; --text-bright: #00ff88; --shadow-soft: 0 14px 30px rgba(0, 0, 0, 0.7); --shadow-panel: 0 20px 50px rgba(0, 0, 0, 0.75); background: radial-gradient(ellipse at center, #001a06 0%, #000800 100%) !important; color: #00cc66 !important; } body.theme-vector #top-bar { background: #000e03 !important; border-bottom-color: rgba(0, 220, 100, 0.2) !important; box-shadow: 0 2px 20px rgba(0, 255, 100, 0.06); } body.theme-vector .dash-row { border-color: rgba(0, 220, 100, 0.12) !important; } body.theme-vector .dash-cell { border-right-color: rgba(0, 220, 100, 0.12) !important; } body.theme-vector .callsign { color: #00ff88; } body.theme-vector .dash-label { color: #007740; } body.theme-vector .dash-value { color: #00cc66; } body.theme-vector .dash-sub { color: #005530; } body.theme-vector .callsign, body.theme-vector .dash-value, body.theme-vector .dash-label, body.theme-vector .section-title, body.theme-vector .overview-title, body.theme-vector .overview-kicker, body.theme-vector .page-title, body.theme-vector .admin-title, body.theme-vector .settings-title { text-shadow: 0 0 8px rgba(0, 255, 136, 0.7), 0 0 20px rgba(0, 255, 136, 0.25); } body.theme-vector .nav-link { color: #00cc66 !important; border-color: rgba(0, 220, 100, 0.25) !important; background: rgba(0, 255, 100, 0.04) !important; border-radius: 0 !important; text-shadow: 0 0 6px rgba(0, 255, 136, 0.4); } body.theme-vector .nav-link:hover, body.theme-vector .nav-link.active { background: rgba(0, 255, 100, 0.1) !important; border-color: #00ff88 !important; box-shadow: 0 0 10px rgba(0, 255, 100, 0.2), inset 0 0 10px rgba(0, 255, 100, 0.05); } body.theme-vector .dash-home a { color: #00cc66 !important; text-shadow: 0 0 6px rgba(0, 255, 136, 0.4); } body.theme-vector * { border-radius: 0 !important; } /* ============================================================ BLOOD — Deep crimson combat High-threat environment, maximum tension ============================================================ */ body.theme-blood { --bg-primary: #080000; --bg-secondary: #0e0000; --bg-panel: #130000; --bg-panel-alt: #190000; --bg-elevated: #220000; --border: rgba(255, 40, 60, 0.18); --border-active: rgba(255, 40, 60, 0.5); --green-dim: #1a0000; --green: #ff4455; --green-bright: #ff9999; --amber: #ff4455; --amber-dim: #660011; --green-accent: #ff6677; --red: #ff0022; --red-dim: #550011; --blue: #ff4455; --text-primary: #ff4455; --text-secondary: #992233; --text-bright: #ff8899; --shadow-soft: 0 14px 30px rgba(0, 0, 0, 0.65); --shadow-panel: 0 20px 50px rgba(0, 0, 0, 0.72); background: radial-gradient(ellipse at center, #1a0004 0%, #080000 100%) !important; color: #ff4455 !important; } body.theme-blood #top-bar { background: #0e0000 !important; border-bottom-color: rgba(255, 40, 60, 0.22) !important; box-shadow: 0 2px 20px rgba(255, 20, 40, 0.08); } body.theme-blood .dash-row { border-color: rgba(255, 40, 60, 0.14) !important; } body.theme-blood .dash-cell { border-right-color: rgba(255, 40, 60, 0.14) !important; } body.theme-blood .callsign { color: #ff8899; } body.theme-blood .dash-label { color: #992233; } body.theme-blood .dash-value { color: #ff4455; } body.theme-blood .dash-sub { color: #661122; } body.theme-blood .callsign, body.theme-blood .dash-value, body.theme-blood .dash-label, body.theme-blood .section-title, body.theme-blood .overview-title, body.theme-blood .overview-kicker, body.theme-blood .page-title, body.theme-blood .admin-title, body.theme-blood .settings-title { text-shadow: 0 0 8px rgba(255, 40, 80, 0.7), 0 0 20px rgba(255, 20, 50, 0.3); } body.theme-blood .nav-link { color: #ff4455 !important; border-color: rgba(255, 40, 60, 0.3) !important; background: rgba(255, 20, 40, 0.05) !important; border-radius: 0 !important; text-shadow: 0 0 6px rgba(255, 40, 80, 0.5); } body.theme-blood .nav-link:hover, body.theme-blood .nav-link.active { background: rgba(255, 20, 40, 0.12) !important; border-color: #ff4455 !important; box-shadow: 0 0 10px rgba(255, 20, 40, 0.25), inset 0 0 10px rgba(255, 20, 40, 0.06); } body.theme-blood .dash-home a { color: #ff4455 !important; text-shadow: 0 0 6px rgba(255, 40, 80, 0.5); } body.theme-blood * { border-radius: 0 !important; } /* ============================================================ ARCTIC — Ice blue NATO operations center Cold, clinical precision — allied command aesthetic ============================================================ */ body.theme-arctic { --bg-primary: #010508; --bg-secondary: #020810; --bg-panel: #030c17; --bg-panel-alt: #04101f; --bg-elevated: #061628; --border: rgba(0, 180, 255, 0.18); --border-active: rgba(0, 210, 255, 0.5); --green-dim: #030c1a; --green: #88ccff; --green-bright: #cceeff; --amber: #00ccff; --amber-dim: #003366; --green-accent: #44ddff; --red: #ff4499; --red-dim: #441133; --blue: #00aaff; --text-primary: #88ccff; --text-secondary: #3a6699; --text-bright: #cceeff; --shadow-soft: 0 14px 30px rgba(0, 0, 0, 0.65); --shadow-panel: 0 20px 50px rgba(0, 0, 0, 0.72); background: radial-gradient(ellipse at center, #061628 0%, #010508 100%) !important; color: #88ccff !important; } body.theme-arctic #top-bar { background: #020810 !important; border-bottom-color: rgba(0, 180, 255, 0.22) !important; box-shadow: 0 2px 20px rgba(0, 150, 255, 0.08); } body.theme-arctic .dash-row { border-color: rgba(0, 180, 255, 0.12) !important; } body.theme-arctic .dash-cell { border-right-color: rgba(0, 180, 255, 0.12) !important; } body.theme-arctic .callsign { color: #cceeff; } body.theme-arctic .dash-label { color: #3a6699; } body.theme-arctic .dash-value { color: #88ccff; } body.theme-arctic .dash-sub { color: #1f4466; } body.theme-arctic .callsign, body.theme-arctic .dash-value, body.theme-arctic .dash-label, body.theme-arctic .section-title, body.theme-arctic .overview-title, body.theme-arctic .overview-kicker, body.theme-arctic .page-title, body.theme-arctic .admin-title, body.theme-arctic .settings-title { text-shadow: 0 0 8px rgba(0, 200, 255, 0.6), 0 0 20px rgba(0, 180, 255, 0.25); } body.theme-arctic .nav-link { color: #88ccff !important; border-color: rgba(0, 180, 255, 0.28) !important; background: rgba(0, 150, 255, 0.04) !important; border-radius: 0 !important; text-shadow: 0 0 6px rgba(0, 200, 255, 0.4); } body.theme-arctic .nav-link:hover, body.theme-arctic .nav-link.active { background: rgba(0, 150, 255, 0.1) !important; border-color: #00ccff !important; box-shadow: 0 0 10px rgba(0, 150, 255, 0.22), inset 0 0 10px rgba(0, 150, 255, 0.05); } body.theme-arctic .dash-home a { color: #88ccff !important; text-shadow: 0 0 6px rgba(0, 200, 255, 0.4); } body.theme-arctic * { border-radius: 0 !important; }