/* ============================================================
   Chicago Offline — Brand Theme Override for CoreScope
   Official palette confirmed 2026-04-22 (Jourdan + Eric)
   Overrides style.css variables for dark mode (default).
   ============================================================ */

/* ── Palette tokens ── */
:root {
  --co-bg:        #0C0F1A;  /* Background — cooler/deeper, reduces halos around accents */
  --co-surface1:  #141829;  /* Cards / panels */
  --co-surface2:  #1a1f30;  /* Nested surfaces */
  --co-surface3:  #1f2438;  /* Deep nesting */
  --co-border:    #242840;  /* Borders */
  --co-cyan:      #00E5FF;  /* Signal Cyan — primary accent / links / brand */
  --co-amber:     #FFB300;  /* Beacon Amber — alerts / CTA / emphasis */
  --co-green:     #39FF14;  /* Mesh Green — status / nodes / online */
  --co-text:      #EDF2FF;  /* Text primary */
  --co-muted:     #A0AABF;  /* Text secondary */
}

/* ── Apply to dark mode (OS-level) — this is our default ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    /* Backgrounds */
    --surface-0:    var(--co-bg);
    --surface-1:    var(--co-surface1);
    --surface-2:    var(--co-surface2);
    --surface-3:    var(--co-surface3);
    --content-bg:   var(--co-bg);
    --card-bg:      var(--co-surface1);
    --nav-bg:       var(--co-bg);
    --nav-bg2:      var(--co-surface1);
    --detail-bg:    var(--co-surface2);
    --input-bg:     var(--co-surface2);
    --section-bg:   var(--co-surface2);

    /* Text */
    --text:         var(--co-text);
    --text-muted:   var(--co-muted);
    --nav-text:     var(--co-text);
    --nav-text-muted: var(--co-muted);

    /* Borders / rows */
    --border:       var(--co-border);
    --row-stripe:   #141829;
    --row-hover:    #1f2438;
    --hover-bg:     rgba(255,255,255,0.04);
    --selected-bg:  rgba(0,229,255,0.12);

    /* Accent — Signal Cyan replaces the upstream blue */
    --accent:       var(--co-cyan);
    --accent-hover: color-mix(in srgb, var(--co-cyan) 80%, #fff);
    --geo-filter-color: var(--co-cyan);

    /* Status — keep upstream colours except green (use Mesh Green) */
    --status-green: var(--co-green);

    /* Misc */
    --theme-color:  var(--co-bg);
  }
}

/* ── Manual dark toggle ([data-theme="dark"]) — keep in sync ── */
[data-theme="dark"] {
  --surface-0:    var(--co-bg);
  --surface-1:    var(--co-surface1);
  --surface-2:    var(--co-surface2);
  --surface-3:    var(--co-surface3);
  --content-bg:   var(--co-bg);
  --card-bg:      var(--co-surface1);
  --nav-bg:       var(--co-bg);
  --nav-bg2:      var(--co-surface1);
  --detail-bg:    var(--co-surface2);
  --input-bg:     var(--co-surface2);
  --section-bg:   var(--co-surface2);

  --text:         var(--co-text);
  --text-muted:   var(--co-muted);
  --nav-text:     var(--co-text);
  --nav-text-muted: var(--co-muted);

  --border:       var(--co-border);
  --row-stripe:   #141829;
  --row-hover:    #1f2438;
  --hover-bg:     rgba(255,255,255,0.04);
  --selected-bg:  rgba(0,229,255,0.12);

  --accent:       var(--co-cyan);
  --accent-hover: color-mix(in srgb, var(--co-cyan) 80%, #fff);
  --geo-filter-color: var(--co-cyan);

  --status-green: var(--co-green);
}

/* ── Force dark as default (chicagooffline always dark) ── */
:root {
  color-scheme: dark;
}

/* ── Nav gradient with our bg ── */
.top-nav {
  background: linear-gradient(135deg, var(--co-bg) 0%, var(--co-surface1) 100%) !important;
  border-bottom: 1px solid var(--co-border) !important;
}

/* ── Accent glow on active nav items ── */
.nav-active-bg,
.top-nav a.active,
.top-nav .nav-item.active {
  background: rgba(0,229,255,0.12) !important;
}

/* ── meta theme-color (dynamic, for mobile chrome chrome) ── */