/* ============================================================
   dr.track — Theme Override  (war.gov / AARO "UFO" aesthetic)
   Dark sci-fi: deep night ground, ice-cyan accent, Orbitron +
   Inconsolata type, scanline overlay, glow. Loaded AFTER the
   base stylesheets so it wins. Colours/typography only — never
   layout — so existing structure stays intact.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800&family=Inconsolata:wght@300;400;500;600;700&display=swap');

:root {
  --dt-night:        #02070d;
  --dt-night-2:      #060d16;
  --dt-panel:        #0a121c;
  --dt-panel-2:      #0d1826;
  --dt-text:         #d9d9d9;
  --dt-muted:        #8b97a3;
  --dt-rule:         rgba(217, 217, 217, 0.13);
  --dt-rule-strong:  rgba(110, 231, 255, 0.28);
  --dt-ice:          #6ee7ff;
  --dt-ice-dim:      rgba(0, 255, 255, 0.50);
  --dt-ice-glow:     rgba(110, 231, 255, 0.20);
  --dt-steel:        #4896a6;
  --dt-display: "Orbitron", "Segoe UI", sans-serif;
  --dt-body: "Inconsolata", "IBM Plex Mono", "SFMono-Regular", Consolas, Menlo, monospace;
}

/* ---- Base ground + scanline atmosphere ---- */
html { background: var(--dt-night); }

body {
  background: var(--dt-night) !important;
  color: var(--dt-text) !important;
  font-family: var(--dt-body) !important;
}

/* fixed scanline + faint grid overlay, like the AARO page */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9999;
  pointer-events: none;
  opacity: 0.16;
  mix-blend-mode: screen;
  background:
    repeating-linear-gradient(180deg, rgba(255,255,255,0.05) 0 1px, transparent 1px 5px),
    repeating-linear-gradient(90deg, rgba(133,188,255,0.025) 0 1px, transparent 1px 22px);
}

/* subtle radial glow anchored top, deep-space feel */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(1200px 600px at 78% -8%, rgba(110,231,255,0.06), transparent 60%),
    radial-gradient(900px 500px at 0% 110%, rgba(72,150,166,0.05), transparent 60%);
}

/* ---- Typography ---- */
h1, h2, h3, h4, h5, h6,
.page-title, .card-title, .navbar-title {
  font-family: var(--dt-display) !important;
  color: var(--dt-text) !important;
  letter-spacing: 0.02em;
}
.page-description, .navbar-breadcrumb, .page-header p { color: var(--dt-muted) !important; }

a { color: var(--dt-ice) !important; transition: color .18s ease, border-color .18s ease; }
a:hover { color: #aef3ff !important; }

/* ============================================================
   App shell  (dashboard / authenticated views)
   ============================================================ */
.sidebar {
  background: linear-gradient(180deg, #05101b 0%, #02070d 100%) !important;
  color: var(--dt-text) !important;
  border-right: 1px solid var(--dt-rule) !important;
  box-shadow: 2px 0 24px rgba(0,0,0,0.6) !important;
}
.sidebar-header { border-bottom: 1px solid var(--dt-rule) !important; }
.sidebar-logo, .sidebar-nav-link { color: var(--dt-text) !important; }

.sidebar-nav-title {
  font-family: var(--dt-display) !important;
  color: var(--dt-steel) !important;
  letter-spacing: 0.18em !important;
}
.sidebar-nav-link {
  border-left: 3px solid transparent !important;
  transition: background .18s ease, color .18s ease, box-shadow .18s ease !important;
}
.sidebar-nav-link:hover {
  background: rgba(110,231,255,0.07) !important;
  color: #fff !important;
}
.sidebar-nav-link.active {
  background: rgba(110,231,255,0.10) !important;
  border-left-color: var(--dt-ice) !important;
  color: #fff !important;
  box-shadow: inset 0 0 22px rgba(110,231,255,0.10) !important;
}
.sidebar-footer {
  border-top: 1px solid var(--dt-rule) !important;
  color: var(--dt-muted) !important;
  font-family: var(--dt-display) !important;
  letter-spacing: 0.04em;
}
.sidebar::-webkit-scrollbar-track { background: #02070d !important; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(110,231,255,0.20) !important; }

/* monochrome the nav icons so they read on dark; cyan on active/hover */
.sidebar-nav-icon {
  filter: brightness(0) invert(0.82) !important;
  opacity: 0.85;
  transition: filter .18s ease, opacity .18s ease;
}
.sidebar-nav-link:hover .sidebar-nav-icon,
.sidebar-nav-link.active .sidebar-nav-icon {
  filter: brightness(0) invert(0.86) sepia(1) saturate(6) hue-rotate(150deg) !important;
  opacity: 1;
}

/* ---- Navbar ---- */
.navbar {
  background: rgba(6,13,22,0.92) !important;
  border-bottom: 1px solid var(--dt-rule-strong) !important;
  box-shadow: 0 1px 0 rgba(110,231,255,0.08), 0 6px 20px rgba(0,0,0,0.5) !important;
  backdrop-filter: blur(6px);
}
.navbar-title { color: var(--dt-text) !important; }
.navbar-user { color: var(--dt-muted) !important; }
.navbar-avatar {
  background: linear-gradient(135deg, var(--dt-steel), var(--dt-ice)) !important;
  color: #02070d !important;
  font-family: var(--dt-display) !important;
  box-shadow: 0 0 14px rgba(110,231,255,0.35) !important;
}
/* logout button (inline-styled in markup) */
.navbar-right a[href*="logout"] {
  background: transparent !important;
  color: var(--dt-ice) !important;
  border: 1px solid var(--dt-rule-strong) !important;
}
.navbar-right a[href*="logout"]:hover {
  background: rgba(110,231,255,0.10) !important;
  box-shadow: 0 0 16px rgba(110,231,255,0.18) !important;
}

/* ---- Cards / panels ---- */
.card, .panel, .stat-card, .widget {
  background: var(--dt-panel) !important;
  border: 1px solid var(--dt-rule) !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 0 rgba(110,231,255,0.05), 0 10px 30px rgba(0,0,0,0.45) !important;
  color: var(--dt-text) !important;
}
.card-header { border-bottom: 1px solid var(--dt-rule) !important; }
.card-title { color: var(--dt-text) !important; }
.card-body { color: var(--dt-text) !important; }

/* ---- Buttons ---- */
.btn-primary, .btn-login {
  background: linear-gradient(135deg, #0b2a33, #0e3b46) !important;
  color: var(--dt-ice) !important;
  border: 1px solid var(--dt-rule-strong) !important;
  font-family: var(--dt-display) !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: box-shadow .18s ease, transform .12s ease, background .18s ease !important;
}
.btn-primary:hover, .btn-login:hover {
  background: linear-gradient(135deg, #0e3b46, #135362) !important;
  color: #aef3ff !important;
  box-shadow: 0 0 22px rgba(110,231,255,0.30) !important;
}
.btn-secondary {
  background: var(--dt-panel-2) !important;
  color: var(--dt-text) !important;
  border: 1px solid var(--dt-rule) !important;
}
.btn-secondary:hover { box-shadow: 0 0 16px rgba(110,231,255,0.16) !important; }
.btn-outline {
  background: transparent !important;
  border: 1px solid var(--dt-ice) !important;
  color: var(--dt-ice) !important;
}
.btn-outline:hover { background: rgba(110,231,255,0.10) !important; color: #aef3ff !important; }

/* ---- Tables ---- */
.table { background: transparent !important; color: var(--dt-text) !important; }
.table thead {
  background: #07131d !important;
  color: var(--dt-ice) !important;
}
.table th {
  font-family: var(--dt-display) !important;
  color: var(--dt-ice) !important;
  border-bottom: 1px solid var(--dt-rule-strong) !important;
  letter-spacing: 0.08em;
}
.table td { border-bottom: 1px solid var(--dt-rule) !important; color: var(--dt-text) !important; }
.table tbody tr:hover { background: rgba(110,231,255,0.05) !important; }

/* ---- Form controls (global) ---- */
input, select, textarea, .form-input, .form-control, .form-select {
  background: #07111b !important;
  color: var(--dt-text) !important;
  border: 1px solid var(--dt-rule) !important;
  border-radius: 6px !important;
  font-family: var(--dt-body) !important;
}
input::placeholder, textarea::placeholder { color: #5d6873 !important; }
input:focus, select:focus, textarea:focus,
.form-input:focus, .form-control:focus {
  outline: none !important;
  border-color: var(--dt-ice) !important;
  box-shadow: 0 0 0 3px rgba(110,231,255,0.14) !important;
}
label, .form-label { color: var(--dt-text) !important; }

/* ---- Badges (keep semantic hue, dark base) ---- */
.badge { border: 1px solid var(--dt-rule); }
.badge-success { background: rgba(40,167,69,0.16) !important; color: #5ee08a !important; }
.badge-warning { background: rgba(255,193,7,0.14) !important; color: #ffd55a !important; }
.badge-error   { background: rgba(211,47,47,0.16) !important; color: #ff7a7a !important; }
.badge-info    { background: rgba(110,231,255,0.14) !important; color: var(--dt-ice) !important; }

/* ============================================================
   Auth pages  (login / forgot / reset — shared class names)
   ============================================================ */
.login-container {
  background: var(--dt-panel) !important;
  border: 1px solid var(--dt-rule-strong) !important;
  box-shadow: 0 0 60px rgba(110,231,255,0.10), 0 20px 60px rgba(0,0,0,0.7) !important;
}
.login-header {
  background: linear-gradient(180deg, #05121c 0%, #02070d 100%) !important;
  color: var(--dt-text) !important;
  border-bottom: 1px solid var(--dt-rule-strong) !important;
}
.login-header h1, .login-header h2 { font-family: var(--dt-display) !important; color: var(--dt-text) !important; }
.login-body { background: var(--dt-panel) !important; }
.login-body h2 { color: var(--dt-ice) !important; font-family: var(--dt-display) !important; }
.retro-text {
  color: var(--dt-ice) !important;
  text-shadow: 0 0 8px rgba(110,231,255,0.45) !important;
  font-family: var(--dt-body) !important;
}
.login-footer {
  border-top: 1px solid var(--dt-rule) !important;
  color: var(--dt-muted) !important;
  font-family: var(--dt-display) !important;
  letter-spacing: 0.05em;
}
.error-message {
  background: rgba(211,47,47,0.14) !important;
  color: #ff8a8a !important;
  border-left: 4px solid #ff5a5a !important;
}

/* ============================================================
   Remove decorative bear mascots / dev imagery, keep nav icons
   ============================================================ */
img[src*="josh"],
img[src*="quinty"] {
  display: none !important;
}

/* ============================================================
   v2 — component retro-fixes (pills, tabs, quick-actions, icons)
   ============================================================ */

/* SVG nav icons inherit theme colour (replace old PNG filter) */
.sidebar-nav-icon { width: 22px; height: 22px; color: #9fb0bd; transition: color .18s ease, filter .18s ease; }
img.sidebar-nav-icon { filter: brightness(0) invert(0.78) !important; }   /* any leftover PNG */
.sidebar-nav-link:hover .sidebar-nav-icon,
.sidebar-nav-link.active .sidebar-nav-icon {
  color: var(--dt-ice) !important;
  filter: drop-shadow(0 0 6px rgba(110,231,255,0.55)) !important;
}

/* Quick-actions bar */
.dashboard-quick-actions {
  background: var(--dt-panel) !important;
  border: 1px solid var(--dt-rule) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.45) !important;
}
.dashboard-quick-actions span { color: var(--dt-muted) !important; }
.dashboard-quick-actions a, .dashboard-quick-actions button {
  background: #07131d !important;
  color: var(--dt-text) !important;
  border: 1px solid var(--dt-rule) !important;
  border-radius: 6px !important;
  transition: box-shadow .18s ease, border-color .18s ease !important;
}
.dashboard-quick-actions a:hover, .dashboard-quick-actions button:hover {
  border-color: var(--dt-rule-strong) !important;
  box-shadow: 0 0 16px rgba(110,231,255,0.18) !important;
}
.dashboard-quick-actions img { filter: brightness(0) invert(0.78); width: 15px !important; height: 15px !important; }

/* Date-range preset pills (dashboard / visitors / campaigns / stats) */
button[onclick^="setDashDate"],
button[onclick^="setVisitorDate"],
button[onclick^="setDateRange"] {
  background: #07131d !important;
  color: var(--dt-muted) !important;
  border: 1px solid var(--dt-rule) !important;
  border-radius: 6px !important;
  cursor: pointer;
}
button[onclick^="setDashDate"]:hover,
button[onclick^="setVisitorDate"]:hover,
button[onclick^="setDateRange"]:hover { border-color: var(--dt-rule-strong) !important; color: var(--dt-text) !important; }
button[onclick^="setDashDate"][style*="0e3b46"],
button[onclick^="setVisitorDate"][style*="0e3b46"],
button[onclick^="setDateRange"][style*="0e3b46"] {
  background: rgba(110,231,255,0.16) !important;
  color: var(--dt-ice) !important;
  border-color: var(--dt-rule-strong) !important;
  box-shadow: 0 0 14px rgba(110,231,255,0.18) !important;
}

/* Settings tabs (desktop) — kill green active + cream hover */
.settings-tabs-desktop a { color: var(--dt-muted) !important; }
.settings-tabs-desktop a:hover {
  background: rgba(110,231,255,0.08) !important;
  color: #aef3ff !important;
}
.settings-tabs-desktop a[style*="0e3b46"] {
  color: var(--dt-ice) !important;
  border-bottom-color: var(--dt-ice) !important;
}
.settings-tabs-wrapper { border-bottom: 1px solid var(--dt-rule) !important; }

/* Generic: any inline cream/white card-ish boxes left over read as panels */
[style*="background: #fff"]:not(input):not(.navbar):not(textarea),
[style*="background:#fff"]:not(input):not(.navbar):not(textarea),
[style*="background-color: #fff"]:not(input):not(textarea),
[style*="#f5f1e8"]:not(input):not(textarea) {
  background-color: var(--dt-panel) !important;
}

/* Old earthy green text → ice; old bark accents → steel */
[style*="color: #0e3b46"], [style*="color:#0e3b46"],
[style*="color: #07131d"], [style*="color:#07131d"],
[style*="color: #135362"], [style*="color:#135362"] { color: var(--dt-ice) !important; }
[style*="color: #356070"], [style*="color:#356070"] { color: var(--dt-steel) !important; }

/* ============================================================
   v3 — exhaustive inline-style retro-fix (bg / border / text)
   ============================================================ */
[style*="background: #fff"], [style*="background:#fff"],
[style*="background: #ffffff"], [style*="background:#ffffff"],
[style*="background: #f9f9f9"], [style*="background:#f9f9f9"],
[style*="background: #fafafa"], [style*="background:#fafafa"],
[style*="background: #f0f0f0"], [style*="background:#f0f0f0"],
[style*="background: #f5f1e8"], [style*="background:#f5f1e8"],
[style*="background: #e8dfd0"], [style*="background:#e8dfd0"],
[style*="background: #e9e9e9"], [style*="background:#e9e9e9"],
[style*="background: white"], [style*="background:white"],
[style*="background-color: #fff"], [style*="background-color:#fff"],
[style*="background-color: #f9f9f9"], [style*="background-color: white"] {
  background-color: var(--dt-panel) !important;
}
/* keep real form controls on the darker input tone */
input[style*="background"], select[style*="background"], textarea[style*="background"] {
  background-color: #07111b !important;
}

/* old borders -> theme rules */
[style*="solid #0e3b46"], [style*="solid #07131d"], [style*="solid #135362"] { border-color: var(--dt-rule-strong) !important; }
[style*="solid #356070"], [style*="solid #6d5636"] { border-color: var(--dt-steel) !important; }
[style*="solid #ddd"], [style*="solid #ccc"], [style*="solid #e9e9e9"], [style*="solid #eee"], [style*="solid #ebebeb"] { border-color: var(--dt-rule) !important; }

/* dark text tokens that would vanish on the dark ground */
[style*="color: #333"], [style*="color:#333"],
[style*="color: #222"], [style*="color:#222"],
[style*="color: #000"], [style*="color:#000"],
[style*="color: #1a1a1a"], [style*="color: #2c"], [style*="color: #444"] { color: var(--dt-text) !important; }
[style*="color: #666"], [style*="color:#666"],
[style*="color: #777"], [style*="color:#777"],
[style*="color: #888"], [style*="color:#888"],
[style*="color: #999"], [style*="color:#999"],
[style*="color: #555"], [style*="color: #6c757d"] { color: var(--dt-muted) !important; }

/* ============================================================
   v4 — gradient headers & boxes
   ============================================================ */
/* green section-header gradients -> teal, with bright text */
[style*="#0e3b46 0%"], [style*="#0e3b46 0"], [style*="linear-gradient(135deg, #0e3b46"],
[style*="#07131d 0%"], [style*="#0e3b46"], [style*="#4caf50"], [style*="#135362 0%"] {
  background: linear-gradient(135deg, #0b2a33 0%, #0e3b46 100%) !important;
  color: #dffaff !important;
  border-color: var(--dt-rule-strong) !important;
}
[style*="#0e3b46 0%"] *, [style*="linear-gradient(135deg, #0e3b46"] * { color: #dffaff !important; }

/* white / light gradients & cards -> dark panel */
[style*="#ffffff 0%"], [style*="#ffffff 0"], [style*="linear-gradient(135deg, #ffffff"],
[style*="#f8f9fa"], [style*="#fdfdfd"], [style*="#fcfcfc"], [style*="#f7f7f7"],
[style*="background: #0e3b46"], [style*="background:#0e3b46"] {
  background: var(--dt-panel) !important;
}
[style*="background: #0e3b46"], [style*="background:#0e3b46"] { color: var(--dt-text) !important; }

/* ============================================================
   v5 — semantic light info/warning/success/error boxes -> tinted dark
   ============================================================ */
[style*="#e7f3ff"], [style*="#e3f2fd"], [style*="#f0f9ff"], [style*="#e8f4fd"], [style*="#eef7ff"] {
  background-color: rgba(110,231,255,0.08) !important;
  border-color: var(--dt-rule-strong) !important;
}
[style*="#fff3cd"], [style*="#fff8e1"], [style*="#fffbea"], [style*="#fef3c7"] {
  background-color: rgba(255,193,7,0.10) !important;
  border-color: rgba(255,193,7,0.35) !important;
}
[style*="#d4edda"], [style*="#e6f4ea"], [style*="#dcfce7"] {
  background-color: rgba(40,167,69,0.12) !important;
  border-color: rgba(40,167,69,0.40) !important;
}
[style*="#f8d7da"], [style*="#fde8e8"], [style*="#fee2e2"] {
  background-color: rgba(211,47,47,0.12) !important;
  border-color: rgba(211,47,47,0.40) !important;
}
/* themed line-icons baked light; ensure visible everywhere */
img[src*="/assets/images/"][src$=".png"]:not([src*="mainlogo"]):not([src*="favicon"]):not([src*="josh"]):not([src*="quinty"]):not([src*="fresh"]) { opacity: 0.92; }

/* ============================================================
   v6 — UNIFORM form controls everywhere (selects, checkboxes, radios)
   ============================================================ */
select, .form-select, select.form-input {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-color: #07111b !important;
  color: var(--dt-text) !important;
  border: 1px solid var(--dt-rule) !important;
  border-radius: 6px !important;
  padding: 9px 36px 9px 12px !important;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2714%27 height=%2714%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%236ee7ff%27 stroke-width=%272.2%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpolyline points=%276 9 12 15 18 9%27/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  font-family: var(--dt-body) !important;
  cursor: pointer;
}
select:focus, .form-select:focus {
  outline: none !important;
  border-color: var(--dt-ice) !important;
  box-shadow: 0 0 0 3px rgba(110,231,255,0.14) !important;
}
select option, select optgroup {
  background-color: #0a121c !important;
  color: var(--dt-text) !important;
}

/* checkboxes & radios — uniform ice accent on every page incl. login */
input[type="checkbox"], input[type="radio"] {
  accent-color: var(--dt-ice) !important;
  width: 16px !important;
  height: 16px !important;
  cursor: pointer;
  vertical-align: middle;
}

/* date / number / text inputs keep dark tone + cyan focus everywhere */
input[type="date"], input[type="datetime-local"], input[type="number"],
input[type="text"], input[type="search"], input[type="email"], input[type="password"], input[type="url"] {
  background-color: #07111b !important;
  color: var(--dt-text) !important;
  border: 1px solid var(--dt-rule) !important;
  border-radius: 6px !important;
}
input[type="date"]:focus, input[type="number"]:focus, input[type="text"]:focus,
input[type="search"]:focus, input[type="email"]:focus, input[type="password"]:focus {
  outline: none !important; border-color: var(--dt-ice) !important;
  box-shadow: 0 0 0 3px rgba(110,231,255,0.14) !important;
}
/* native calendar/spin icons -> light so visible on dark */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator { filter: invert(0.8) sepia(1) saturate(4) hue-rotate(150deg); cursor: pointer; }