/*
 * Calm DARK interface theme: a slate palette. GENERATED by script/generate_themes.rb from the light theme's rules; don't edit by hand.
 * It overrides the same inline neon colours the light theme does.
 */
body.theme-midnight {
  background: #0f172a !important;
  color: #e2e8f0 !important;
}

/* The palette itself, for everything styled with colour tokens rather than inline colours (ALERTS, RECORDS,
   JUNIOR PROFILES and newer pages): dark surfaces become light, white text becomes dark, and neon accents become
   deeper tones that read on white. */
.theme-midnight {
  --c-black: #1e293b;
  --c-white: #e2e8f0;
  --c-grey-050505: #172033;
  --c-grey-080808: #172033;
  --c-grey-0a0a0a: #0f172a;
  --c-grey-111: #0f172a;
  --c-grey-1a1a1a: #334155;
  --c-grey-222: #334155;
  --c-grey-333: #334155;
  --c-grey-444: #334155;
  --c-grey-555: #94a3b8;
  --c-grey-666: #94a3b8;
  --c-grey-888: #94a3b8;
  --c-grey-aaa: #cbd5e1;
  --c-amber: #fbbf24;
  --c-gold: #fbbf24;
  --c-yellow: #fbbf24;
  --c-orange: #fb923c;
  --c-orange-nav: #fb923c;
  --c-orange-stats: #fb923c;
  --c-cyan: #38bdf8;
  --c-cyan-bright: #38bdf8;
  --c-aqua: #22d3ee;
  --c-green: #4ade80;
  --c-magenta: #e879f9;
  --c-pink: #e879f9;
  --c-red: #f87171;
  --c-red-pure: #f87171;
}

.theme-midnight #header {
  border-bottom: 2px solid #334155 !important;
}

.theme-midnight #tab-bar {
  background: #1e293b !important;
  border-bottom: 2px solid #334155 !important;
}
.theme-midnight .tab-btn {
  background: #172033 !important;
  color: #94a3b8 !important;
  border-right: 1px solid #334155 !important;
}
.theme-midnight .tab-btn.active {
  color: #fbbf24 !important;
  background: #1e293b !important;
  text-shadow: none !important;
  border-bottom: 2px solid #fbbf24 !important;
}

.theme-midnight #side-nav {
  background: #1e293b !important;
  border-left: 2px solid #334155 !important;
}
.theme-midnight .sidenav-tabs {
  background: #172033 !important;
  border-bottom: 1.5px solid #334155 !important;
}
.theme-midnight .sidenav-tab-btn {
  background: #172033 !important;
  color: #94a3b8 !important;
}
.theme-midnight .sidenav-tab-btn:hover {
  color: #e2e8f0 !important;
  background: #0f172a !important;
}
.theme-midnight .sidenav-tab-btn.active {
  color: #fbbf24 !important;
  background: #1e293b !important;
  border-bottom: 2px solid #fbbf24 !important;
  text-shadow: none !important;
}
.theme-midnight .operator-box {
  background: #1e293b !important;
}
.theme-midnight .nav-item {
  border-bottom: 1px solid #334155 !important;
}
.theme-midnight .nav-item:hover {
  background: #0f172a !important;
}
.theme-midnight .nav-item[href$="/seen"] { color: #38bdf8 !important; }
.theme-midnight .nav-item[href$="/airports"] { color: #fbbf24 !important; }
.theme-midnight .nav-item[href$="/spotter"] { color: #4ade80 !important; }
.theme-midnight .nav-item[href$="/caught"] { color: #e879f9 !important; }
.theme-midnight .nav-item[href$="/leaderboard"] { color: #38bdf8 !important; }
.theme-midnight .nav-item[href$="/news"] { color: #fb923c !important; }
.theme-midnight .nav-item[href$="/safety"] { color: #f87171 !important; }
.theme-midnight .nav-item[href$="/alerts"] { color: #fbbf24 !important; }
.theme-midnight .nav-item[href$="/replay"] { color: #38bdf8 !important; }
.theme-midnight .nav-item[href$="/records"] { color: #fbbf24 !important; }

.theme-midnight .receiver-filter select {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
}

.theme-midnight .records-card,
.theme-midnight .records-tab {
  background: #1e293b !important;
  border-color: #334155 !important;
}
.theme-midnight .records-card {
  border-top: 3px solid #fbbf24 !important;
}
.theme-midnight .records-card-value,
.theme-midnight .records-tab.active {
  color: #fbbf24 !important;
}
.theme-midnight .records-card-detail strong {
  color: #e2e8f0 !important;
}
.theme-midnight .records-input {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
}

.theme-midnight .replay-bar,
.theme-midnight .replay-overhead {
  background: rgba(15, 23, 42, 0.95) !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
.theme-midnight .replay-input {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
}
.theme-midnight .replay-result {
  background: #172033 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
  border-left-color: #fbbf24 !important;
}

.theme-midnight .operator-name,
.theme-midnight #map-layer-select,
.theme-midnight #global-theme-select {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1px solid #334155 !important;
}
.theme-midnight #user-icon-box {
  background: #172033 !important;
  border-color: #38bdf8 !important;
}

.theme-midnight #stats-panel {
  background: #172033 !important;
  border-bottom: 1px solid #334155 !important;
}
.theme-midnight .stat-card {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
}
.theme-midnight .stat-card:nth-child(1) .stat-val { color: #f87171 !important; }
.theme-midnight .stat-card:nth-child(2) .stat-val { color: #fbbf24 !important; }
.theme-midnight .stat-card:nth-child(3) .stat-val { color: #38bdf8 !important; }
.theme-midnight .stat-card .stat-label {
  color: #cbd5e1 !important;
  font-weight: bold !important;
}

.theme-midnight .section-header {
  background: #172033 !important;
  color: #94a3b8 !important;
  border-top: 1px solid #334155 !important;
}
.theme-midnight .section-header.hdr-board {
  background: #1e293b !important;
  border-bottom: 2px solid #a78bfa !important;
}
.theme-midnight .section-header.hdr-boh {
  color: #fbbf24 !important;
  border-bottom: 2px solid #fbbf24 !important;
}
.theme-midnight .section-header.hdr-ga {
  color: #4ade80 !important;
  border-bottom: 2px solid #4ade80 !important;
}
.theme-midnight .section-header.hdr-transit {
  color: #38bdf8 !important;
  border-bottom: 2px solid #38bdf8 !important;
}

.theme-midnight table th {
  color: #a78bfa !important;
}
.theme-midnight td {
  color: #cbd5e1 !important;
  border-bottom: 1px solid #334155 !important;
}
.theme-midnight tr:hover {
  background: #0f172a !important;
}
.theme-midnight .f-sub {
  color: #cbd5e1 !important;
}
.theme-midnight .orig-col { color: #e879f9 !important; }
.theme-midnight .dest-col { color: #2dd4bf !important; }
.theme-midnight .dist-col { color: #4ade80 !important; }

.theme-midnight td .f-id span {
  color: #38bdf8 !important;
  text-shadow: none !important;
}
.theme-midnight td .f-id svg {
  fill: #38bdf8 !important;
  filter: none !important;
}

.theme-midnight tr.row-military td .f-id span { color: #fbbf24 !important; }
.theme-midnight tr.row-military td .f-id svg { fill: #fbbf24 !important; filter: none !important; }
.theme-midnight tr.row-military {
  background: rgba(180, 83, 9, 0.04) !important;
  box-shadow: inset 5px 0 0 #fbbf24 !important;
}
.theme-midnight tr.row-emergency td .f-id span { color: #f87171 !important; }
.theme-midnight tr.row-emergency td .f-id svg { fill: #f87171 !important; filter: none !important; }
.theme-midnight tr.row-emergency {
  background: rgba(185, 28, 28, 0.06) !important;
  box-shadow: inset 5px 0 0 #f87171 !important;
}
.theme-midnight tr.row-emergency-plane td .f-id span { color: #fb923c !important; }
.theme-midnight tr.row-emergency-plane td .f-id svg { fill: #fb923c !important; filter: none !important; }
.theme-midnight tr.row-emergency-plane {
  background: rgba(194, 65, 12, 0.04) !important;
  box-shadow: inset 5px 0 0 #fb923c !important;
}
.theme-midnight tr.row-helicopter td .f-id span { color: #e879f9 !important; }
.theme-midnight tr.row-helicopter td .f-id svg { fill: #e879f9 !important; filter: none !important; }
.theme-midnight tr.row-helicopter {
  background: rgba(162, 28, 175, 0.04) !important;
  box-shadow: inset 5px 0 0 #e879f9 !important;
}
.theme-midnight tr.row-light-aircraft td .f-id span { color: #4ade80 !important; }
.theme-midnight tr.row-light-aircraft td .f-id svg { fill: #4ade80 !important; filter: none !important; }
.theme-midnight tr.row-light-aircraft {
  background: rgba(21, 128, 61, 0.04) !important;
  box-shadow: inset 5px 0 0 #4ade80 !important;
}
.theme-midnight tr.row-private-jet td .f-id span { color: #cbd5e1 !important; }
.theme-midnight tr.row-private-jet td .f-id svg { fill: #cbd5e1 !important; filter: none !important; }
.theme-midnight tr.row-private-jet {
  background: rgba(51, 65, 85, 0.04) !important;
  box-shadow: inset 5px 0 0 #cbd5e1 !important;
}

.theme-midnight .alt-climb { color: #4ade80 !important; }
.theme-midnight .alt-descend { color: #f87171 !important; }
.theme-midnight .alt-level { color: #60a5fa !important; }

.theme-midnight .split-left,
.theme-midnight .split-right,
.theme-midnight .webcam-card,
.theme-midnight .leader-col {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
}
.theme-midnight #airport-search-input,
.theme-midnight #spotter-search-input,
.theme-midnight #seen-search-input {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  color: #e2e8f0 !important;
}
.theme-midnight .stats-card {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  border-top-width: 4px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}
.theme-midnight .stats-card-lbl {
  color: #94a3b8 !important;
}
.theme-midnight .stats-card[style*="#55ff00"] { border-top-color: #4ade80 !important; }
.theme-midnight .stats-card[style*="#f2fa0a"] { border-top-color: #fbbf24 !important; }
.theme-midnight .stats-card[style*="#00f5ff"] { border-top-color: #38bdf8 !important; }
.theme-midnight .stats-card[style*="#e204ff"] { border-top-color: #e879f9 !important; }
.theme-midnight .stats-card[style*="#ffc400"] { border-top-color: #fbbf24 !important; }
.theme-midnight .stats-card[style*="#ff6600"] { border-top-color: #fb923c !important; }
.theme-midnight .stats-card[style*="#ff003c"] { border-top-color: #f87171 !important; }
.theme-midnight .stats-card[style*="#ff00d4"] { border-top-color: #e879f9 !important; }
.theme-midnight .stats-card[style*="#00ffc4"] { border-top-color: #4ade80 !important; }
.theme-midnight .stats-card-val {
  text-shadow: none !important;
}
.theme-midnight .stats-card-val[style*="#55ff00"] { color: #4ade80 !important; }
.theme-midnight .stats-card-val[style*="#f2fa0a"] { color: #fbbf24 !important; }
.theme-midnight .stats-card-val[style*="#00f5ff"] { color: #38bdf8 !important; }
.theme-midnight .stats-card-val[style*="#e204ff"] { color: #e879f9 !important; }
.theme-midnight .stats-card-val[style*="#ffc400"] { color: #fbbf24 !important; }
.theme-midnight .stats-card-val[style*="#ff6600"] { color: #fb923c !important; }
.theme-midnight .stats-card-val[style*="#ff003c"] { color: #f87171 !important; }
.theme-midnight .stats-card-val[style*="#ff00d4"] { color: #e879f9 !important; }
.theme-midnight .stats-card-val[style*="#00ffc4"] { color: #4ade80 !important; }

.theme-midnight .leader-col .section-header {
  background: #172033 !important;
  color: #a78bfa !important;
  border-bottom: 2px solid #a78bfa !important;
}
.theme-midnight .leader-col table tr {
  border-bottom: 1px solid #334155 !important;
}
.theme-midnight .leader-col table td {
  border-bottom: 1px solid #334155 !important;
  color: #cbd5e1 !important;
}

.theme-midnight .locate-btn {
  background: #0f172a !important;
  border: 1px solid #334155 !important;
  color: #38bdf8 !important;
  box-shadow: none !important;
  font-weight: bold;
}
.theme-midnight .locate-btn:hover {
  background: #334155 !important;
  color: #e2e8f0 !important;
  box-shadow: none !important;
}
.theme-midnight .map-btn {
  background: #0f172a !important;
  border: 1px solid #334155 !important;
  color: #cbd5e1 !important;
  box-shadow: none !important;
}
.theme-midnight #find-btn:hover {
  background: #38bdf8 !important;
  color: #1e293b !important;
  box-shadow: none !important;
}
.theme-midnight #boh-btn:hover {
  background: #fbbf24 !important;
  color: #1e293b !important;
  box-shadow: none !important;
}
.theme-midnight #footer button {
  background: #0f172a !important;
  border: 1px solid #334155 !important;
  color: #94a3b8 !important;
  box-shadow: none !important;
}
.theme-midnight #footer button:hover {
  background: #334155 !important;
  color: #e2e8f0 !important;
}

.theme-midnight .radar-ping {
  display: none !important;
}
.theme-midnight #emergency-alarm-hud {
  border: 6px solid #f87171 !important;
  box-shadow: none !important;
  animation: none !important;
}
.theme-midnight #emergency-alarm-hud .alarm-banner {
  background: #f87171 !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important;
}

.theme-midnight #radar-sweeper-btn {
  background: #0f172a !important;
  border: 1px solid #334155 !important;
  color: #cbd5e1 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
.theme-midnight #radar-sweeper-btn:hover {
  background: #334155 !important;
  color: #e2e8f0 !important;
  box-shadow: none !important;
}


.theme-midnight #cockpit-hud {
  background: rgba(15, 23, 42, 0.96) !important;
  border: 2px solid #4ade80 !important;
  color: #e2e8f0 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
}
.theme-midnight #hud-callsign {
  color: #38bdf8 !important;
}
.theme-midnight #hud-speed-text,
.theme-midnight #hud-alt-text {
  background: rgba(15, 23, 42, 0.9) !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
.theme-midnight #hud-speed-hand {
  background: #fbbf24 !important;
  filter: none !important;
}
.theme-midnight #hud-alt-hand {
  background: #38bdf8 !important;
  filter: none !important;
}
.theme-midnight #map-search-container {
  background: rgba(15, 23, 42, 0.95) !important;
  border: 1px solid #334155 !important;
}
.theme-midnight #map-search-input {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  color: #38bdf8 !important;
}

.theme-midnight .leaflet-popup-content-wrapper {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 1.5px solid #fbbf24 !important;
}
.theme-midnight .leaflet-popup-tip {
  background: #1e293b !important;
}
.theme-midnight .leaflet-control-layers {
  background: rgba(15, 23, 42, 0.95) !important;
  border: 1.5px solid #38bdf8 !important;
  color: #e2e8f0 !important;
}
.theme-midnight .leaflet-control-layers-expanded {
  border-color: #e879f9 !important;
}

.theme-midnight #stats-modal {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 2px solid #fbbf24 !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
}
.theme-midnight #stats-modal-title {
  color: #e2e8f0 !important;
}
.theme-midnight #stats-modal-content {
  color: #e2e8f0 !important;
}
.theme-midnight .stats-modal-close {
  background: #0f172a !important;
  border: 1px solid #334155 !important;
  color: #cbd5e1 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.theme-midnight #footer {
  background: #1e293b !important;
  border-top: 1px solid #334155 !important;
}
.theme-midnight #sync-time {
  color: #fbbf24 !important;
}
.theme-midnight #sync-text {
  color: #4ade80 !important;
}

.theme-midnight .plane-datatag {
  background: rgba(15, 23, 42, 0.95) !important;
  border-width: 1px !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1) !important;
}

/*
 * Flyaboo brand: menus, tabs, headings, buttons, links and borders use the logo's colours (navy #1b3a6b, blue #2f74b5
 * and the plane's orange #ea580c). Aircraft category colours on the board and map keep their meanings. Later rules
 * win over the ones above, and the generated DARK and CLASSIC AVIATION themes carry the brand across.
 */
.theme-midnight {
  --c-amber: #fb923c;
  --c-gold: #fb923c;
  --c-yellow: #fb923c;
  --c-orange-nav: #fb923c;
  --c-cyan: #60a5fa;
  --c-cyan-bright: #60a5fa;
  --c-aqua: #60a5fa;
}

.theme-midnight .tab-btn.active,
.theme-midnight .sidenav-tab-btn.active {
  color: #fb923c !important;
  border-bottom: 2px solid #fb923c !important;
}

.theme-midnight .nav-item,
.theme-midnight .nav-item[href$="/seen"],
.theme-midnight .nav-item[href$="/airports"],
.theme-midnight .nav-item[href$="/spotter"],
.theme-midnight .nav-item[href$="/caught"],
.theme-midnight .nav-item[href$="/leaderboard"],
.theme-midnight .nav-item[href$="/news"],
.theme-midnight .nav-item[href$="/safety"],
.theme-midnight .nav-item[href$="/replay"],
.theme-midnight .nav-item[href$="/records"],
.theme-midnight .nav-item[href$="/alerts"] {
  color: #dbe7f5 !important;
}
.theme-midnight .nav-item:hover {
  color: #fb923c !important;
}

.theme-midnight #user-icon-box {
  border-color: #60a5fa !important;
}

.theme-midnight .stat-card:nth-child(1) .stat-val { color: #fb923c !important; }
.theme-midnight .stat-card:nth-child(2) .stat-val { color: #60a5fa !important; }
.theme-midnight .stat-card:nth-child(3) .stat-val { color: #dbe7f5 !important; }

.theme-midnight .section-header.hdr-board {
  border-bottom: 2px solid #60a5fa !important;
}
.theme-midnight table th {
  color: #dbe7f5 !important;
}
.theme-midnight .leader-col .section-header {
  color: #dbe7f5 !important;
  border-bottom: 2px solid #60a5fa !important;
}

.theme-midnight .locate-btn,
.theme-midnight #hud-callsign {
  color: #60a5fa !important;
}
.theme-midnight #find-btn:hover {
  background: #60a5fa !important;
}
.theme-midnight #boh-btn:hover {
  background: #fb923c !important;
}

.theme-midnight .leaflet-popup-content-wrapper,
.theme-midnight #stats-modal {
  border-color: #fb923c !important;
}
.theme-midnight .leaflet-control-layers {
  border-color: #60a5fa !important;
}
.theme-midnight .leaflet-control-layers-expanded {
  border-color: #fb923c !important;
}
.theme-midnight #cockpit-hud {
  border-color: #60a5fa !important;
}
.theme-midnight #sync-time {
  color: #fb923c !important;
}

.theme-midnight .records-card {
  border-top-color: #fb923c !important;
}
.theme-midnight .records-card-value,
.theme-midnight .records-tab.active {
  color: #fb923c !important;
}
.theme-midnight .replay-result {
  border-left-color: #fb923c !important;
}


.theme-midnight .wave-bar {
  background: #94a3b8 !important;
}

.theme-midnight #atc-play-stop-btn {
  background: #38bdf8 !important;
  border: 1px solid #38bdf8 !important;
  color: #1e293b !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

.theme-midnight #atc-play-stop-btn:hover {
  background: #38bdf8 !important;
  border-color: #38bdf8 !important;
}

.theme-midnight #caught-modal {
  background: #1e293b !important;
  color: #e2e8f0 !important;
  border: 2px solid #fbbf24 !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15) !important;
}

.theme-midnight #caught-modal .close-btn {
  background: #0f172a !important;
  border: 1px solid #334155 !important;
  color: #cbd5e1 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.theme-midnight #junior-side-progress {
  background: #172033 !important;
  border: 1.5px dashed #4ade80 !important;
  color: #e2e8f0 !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05) !important;
}

.theme-midnight #junior-side-rank { color: #4ade80 !important; }

.theme-midnight #junior-side-xp-bar { background: #4ade80 !important; }

.theme-midnight #junior-side-xp-text { color: #94a3b8 !important; }

.theme-midnight .target-locked-plane::before {
  border: 2px solid #f87171 !important;
  box-shadow: none !important;
  animation: none !important;
}

.theme-midnight #target-lock-banner {
  background: #1e293b !important;
  border: 2px solid #f87171 !important;
  color: #f87171 !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
  animation: none !important;
}