/* ═══════════════════════════════════════════════════════════════
 * V3 Theme Bridge — overrides zeak.css variables for global
 * dark glass-morphism uniformity across all 22 inherited pages.
 * Load AFTER zeak.css and v3_home.css in base.html.
 * ═══════════════════════════════════════════════════════════════ */

/* ── Core overrides: force single dark theme regardless of data-theme ── */
:root,
[data-theme="cosmic"],
[data-theme="desert"],
[data-theme="forest"],
[data-theme="flame"] {
  --bg:               #0A0E14;
  --canvas:           #0A0E14;
  --surface:          rgba(255,255,255,0.03);
  --surface-2:        rgba(255,255,255,0.06);
  --surface-3:        rgba(255,255,255,0.10);
  --surface-glass:    rgba(255,255,255,0.04);
  --text:             #E6E8EC;
  --text-secondary:   #8B92A0;
  --text-tertiary:    #5A6070;
  --navy:             #E6E8EC;
  --navy-light:       #8B92A0;
  --text-inverse:     #E6E8EC;
  --border:           rgba(255,255,255,0.06);
  --border-strong:    rgba(255,255,255,0.10);
  --border-active:    rgba(59,130,246,0.55);
  --positive:         #22C55E;
  --positive-soft:    rgba(34,197,94,0.10);
  --positive-glow:    rgba(34,197,94,0.3);
  --warning:          #F59E0B;
  --warning-soft:     rgba(245,158,11,0.10);
  --negative:         #EF4444;
  --negative-soft:    rgba(239,68,68,0.10);
  --negative-glow:    rgba(239,68,68,0.3);
  --up:               #22C55E;
  --up-soft:          rgba(34,197,94,0.10);
  --down:             #EF4444;
  --down-soft:        rgba(239,68,68,0.10);
  --primary:          #3B82F6;
  --primary-light:    #60A5FA;
  --primary-glow:     rgba(59,130,246,0.15);
  --accent:           #8B5CF6;
  --accent-light:     #A78BFA;
  --accent-glow:      rgba(139,92,246,0.15);
  --aurora-gradient:  linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);
  --bg-gradient:      radial-gradient(ellipse 100% 80% at 50% -20%, rgba(59,130,246,0.12) 0%, transparent 60%),
                      radial-gradient(ellipse 80% 60% at 80% 50%, rgba(139,92,246,0.08) 0%, transparent 50%);
  --shadow-sm:        0 2px 8px rgba(0,0,0,0.3);
  --shadow-md:        0 4px 16px rgba(0,0,0,0.4);
  --shadow-lg:        0 8px 32px rgba(0,0,0,0.5);
  --shadow-xl:        0 16px 48px rgba(0,0,0,0.6);
  --shadow-glow:      0 0 30px rgba(59,130,246,0.15);
  --shadow-glow-purple: 0 0 24px rgba(139,92,246,0.15);
}

/* ── Kill old theme-specific background images ── */
.cosmic-bg.has-image,
.cosmic-bg.has-image::after {
  background-image: none !important;
  background: var(--bg-gradient) !important;
}

/* ── Theme dots: hide (single-theme V3) ── */
.theme-switcher { display: none !important; }

/* ── Nav: V3 glass base ── */
.navbar {
  background: rgba(10,14,20,0.85) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* ── Page header polish ── */
.page-title {
  font-weight: 700 !important;
  letter-spacing: -0.5px !important;
}
.page-subtitle {
  color: var(--text-secondary) !important;
}

/* ── Card glass refinement ── */
.card, .kpi, .sector-card {
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid var(--border) !important;
}

/* ── Table row hover ── */
.tbl tr:hover td {
  background: rgba(59,130,246,0.06) !important;
}

/* ── Score bar colors ── */
.score-high { color: var(--up) !important; }
.score-mid { color: var(--warning) !important; }
.score-low { color: var(--down) !important; }

/* ── Button CTA ── */
.btn-primary {
  background: var(--aurora-gradient) !important;
  color: #fff !important;
}

/* ── Footer dark ── */
footer {
  background: var(--surface) !important;
  border-top: 1px solid var(--border) !important;
  color: var(--text-tertiary) !important;
}

/* ── Dark scrollbar ── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.10); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.20); }

/* ── AI commentary block ── */
.ai-commentary {
  background: rgba(59,130,246,0.06) !important;
  border-left: 3px solid var(--primary) !important;
}

/* ── Page entry animation ── */
.zk-reveal {
  animation-duration: 400ms !important;
}

/* ── Loading skeleton ── */
.skeleton {
  background: linear-gradient(90deg, var(--surface-2) 25%, var(--surface-3) 50%, var(--surface-2) 75%) !important;
  background-size: 200% 100% !important;
  animation: v3-shimmer 1.5s ease-in-out infinite;
}
@keyframes v3-shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ── Focus ring (replaces browser default) ── */
*:focus-visible {
  outline: 2px solid var(--primary) !important;
  outline-offset: 2px !important;
}

/* ── Nav dropdown glass ── */
.nav-dropdown-menu {
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  background: rgba(20,24,32,0.98) !important;
  border: 1px solid var(--border-strong) !important;
}
.dd-item {
  border-radius: 8px !important;
  transition: background 120ms ease !important;
}
.dd-item:hover { background: rgba(59,130,246,0.12) !important; color: var(--primary) !important; }

/* ── Card hover lift ── */
.sector-column,.card,.kpi {
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease !important;
}
.sector-column:hover,.card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}

/* ── Number pulse (live-data micro-glow) ── */
@keyframes v3-num-pulse { 0%,100%{filter:brightness(1)} 50%{filter:brightness(1.06)} }
.v3-hero-stat-val,.v3-ticker-price { animation: v3-num-pulse 2s ease-in-out infinite; }

/* ── Table row hover transition ── */
.tbl tbody tr { transition: background 120ms ease !important; }
.tbl tbody tr:hover { background: rgba(59,130,246,0.06) !important; }
