/*
 * ══════════════════════════════════════════════════════════
 *  SWEDBANG — ENTERPRISE DARK HEADER / FOOTER
 *  Version: 2.0 | Date: 2026-06-21
 *
 *  Header BG:   #0C162D
 *  Header Border: 1px solid rgba(0,198,255,0.10)
 *  Nav:         #A8C0E0
 *  Nav Hover:   #00C6FF
 *  Active Nav:  #00C6FF
 *
 *  Footer BG:   #0C162D
 *  Footer Border: 1px solid rgba(0,198,255,0.10)
 *  Headings:    #A8C0E0
 *  Links:       #7A9BBF
 *  Link Hover:  #00C6FF
 *  Metadata:    #4A6A8A
 * ══════════════════════════════════════════════════════════
 */

/* ─────────────────────────────────────────────────────────────
   HEADER — Non-scrolled (transparent overlay over hero)
   ───────────────────────────────────────────────────────────── */
.sb-header:not(.scrolled) {
  background: #0C162D !important;
  backdrop-filter: blur(12px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.4) !important;
  border-bottom: 1px solid rgba(0, 198, 255, 0.10) !important;
  box-shadow: 0 2px 24px rgba(0, 0, 0, 0.40) !important;
}

/* Header inner glow pseudo-element */
.sb-header::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 80% 50%,
    rgba(0, 198, 255, 0.04) 0%,
    transparent 65%);
  pointer-events: none;
  z-index: 0;
}

/* ─────────────────────────────────────────────────────────────
   HEADER — Scrolled state
   ───────────────────────────────────────────────────────────── */
.sb-header.scrolled {
  background: rgba(12, 22, 45, 0.97) !important;
  backdrop-filter: blur(20px) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.5) !important;
  border-bottom: 1px solid rgba(0, 198, 255, 0.10) !important;
  box-shadow: 0 4px 28px rgba(0, 0, 0, 0.55) !important;
}

/* ─────────────────────────────────────────────────────────────
   HEADER — Mobile (< 960px)
   ───────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  .sb-header {
    background: rgba(12, 22, 45, 0.98) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-bottom: 1px solid rgba(0, 198, 255, 0.10) !important;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.45) !important;
  }
}

/* Mobile scrolled */
@media (max-width: 1024px) {
  header.scrolled,
  #sb-header.scrolled,
  .sb-header.scrolled {
    background: rgba(12, 22, 45, 0.99) !important;
    backdrop-filter: blur(20px) saturate(1.5) !important;
    -webkit-backdrop-filter: blur(20px) saturate(1.5) !important;
    border-bottom: 1px solid rgba(0, 198, 255, 0.10) !important;
    box-shadow: 0 4px 28px rgba(0, 0, 0, 0.55) !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   NAV LINKS — Enterprise text colors
   ───────────────────────────────────────────────────────────── */
.sb-nav > a,
.sb-nav > div {
  color: #A8C0E0 !important;
  font-weight: 500 !important;
}
.sb-nav > a:hover,
.sb-nav > div:hover {
  color: #00C6FF !important;
  border-bottom: 1px solid rgba(0, 198, 255, 0.40) !important;
}
.sb-nav > a.active {
  color: #00C6FF !important;
  border-bottom: 2px solid #00C6FF !important;
}

/* Trust badge */
.sb-trust-badge-header {
  color: rgba(168, 192, 224, 0.90) !important;
  border-left: 1px solid rgba(168, 192, 224, 0.20) !important;
}

/* Header right CTA button */
.sb-header-right .sb-btn-secondary {
  background: rgba(0, 198, 255, 0.08) !important;
  border-color: rgba(0, 198, 255, 0.20) !important;
  color: #A8C0E0 !important;
  backdrop-filter: blur(8px) !important;
}
.sb-header-right .sb-btn-secondary:hover {
  background: rgba(0, 198, 255, 0.14) !important;
  border-color: rgba(0, 198, 255, 0.40) !important;
  color: #00C6FF !important;
}

/* Hamburger lines */
.sb-ham-line {
  background: #A8C0E0 !important;
}
.sb-hamburger:hover {
  background: rgba(0, 198, 255, 0.08) !important;
}

/* ─────────────────────────────────────────────────────────────
   DROPDOWN PANEL — Deep enterprise dark
   ───────────────────────────────────────────────────────────── */
.sb-dropdown-inner {
  background: rgba(7, 12, 26, 0.98) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(0, 198, 255, 0.12) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55) !important;
}
.sb-dropdown-head {
  color: rgba(168, 192, 224, 0.45) !important;
}
.sb-dropdown-paths a {
  color: rgba(168, 192, 224, 0.80) !important;
}
.sb-dropdown-paths a:hover {
  color: #00C6FF !important;
}
.sb-dropdown-footer {
  background: rgba(7, 12, 26, 0.80) !important;
  border-top: 1px solid rgba(0, 198, 255, 0.07) !important;
}
.sb-dropdown-footer-text { color: rgba(168, 192, 224, 0.55) !important; }
.sb-dropdown-footer-link { color: #00C6FF !important; }
.sb-dropdown-footer-link:hover { color: #5DDEFF !important; }

/* ─────────────────────────────────────────────────────────────
   MOBILE DRAWER — Deep enterprise dark
   ───────────────────────────────────────────────────────────── */
.sb-mobile-menu {
  background: rgba(12, 22, 45, 0.99) !important;
  border-left: 1px solid rgba(0, 198, 255, 0.12) !important;
  box-shadow: -12px 0 60px rgba(0, 0, 0, 0.55) !important;
}
.sb-mob-header {
  border-bottom: 1px solid rgba(0, 198, 255, 0.08) !important;
}
.sb-mob-close {
  background: rgba(0, 198, 255, 0.06) !important;
  border: 1px solid rgba(0, 198, 255, 0.16) !important;
  color: rgba(168, 192, 224, 0.80) !important;
}
.sb-mob-close:hover {
  background: rgba(0, 198, 255, 0.12) !important;
  color: #00C6FF !important;
}
.sb-mob-top-link {
  color: rgba(168, 192, 224, 0.90) !important;
  border-bottom: 1px solid rgba(0, 198, 255, 0.07) !important;
  font-weight: 600 !important;
}
.sb-mob-top-link:hover,
.sb-mob-top-link.active { color: #00C6FF !important; }
.sb-mob-section-label { color: #00C6FF !important; }
.sb-mob-accordion-trigger {
  color: rgba(168, 192, 224, 0.75) !important;
  font-weight: 600 !important;
}
.sb-mob-accordion-trigger:hover,
.sb-mob-accordion-trigger.open { color: #EBF2FF !important; }
.sb-mob-accordion { border-bottom: 1px solid rgba(0, 198, 255, 0.06) !important; }
.sb-mob-accordion-icon { color: #00C6FF !important; }
.sb-mob-sub-link {
  color: rgba(122, 155, 191, 0.80) !important;
  border-left: 2px solid rgba(0, 198, 255, 0.18) !important;
}
.sb-mob-sub-link:hover,
.sb-mob-sub-link.active {
  color: #00C6FF !important;
  border-left-color: #00C6FF !important;
}
.sb-mob-bottom {
  border-top: 1px solid rgba(0, 198, 255, 0.08) !important;
}
.sb-mob-primary-btn {
  background: #00C6FF !important;
  color: #000F1F !important;
}
.sb-mob-wa-btn {
  color: rgba(168, 192, 224, 0.80) !important;
  border-color: rgba(37, 211, 102, 0.30) !important;
}
.sb-mob-wa-btn:hover {
  color: #25d366 !important;
  background: rgba(37, 211, 102, 0.08) !important;
}

/* Guard: prevent light-theme override of nav text in header */
html.light-theme header a,
html.light-theme nav a,
html.light-theme .desktop-nav a,
html.light-theme header button:not(.luxury-button-primary):not(.theme-toggle-btn):not(#sb-sound-btn) {
  color: #0D1120 !important;
}
html.light-theme header a:hover,
html.light-theme nav a:hover {
  color: #2B4AC0 !important;
}

/* ══════════════════════════════════════════════════════
   GRADIENT BRIDGE — Body → Footer transition
   ══════════════════════════════════════════════════════ */
#sb-footer-bridge {
  display: block;
  height: 80px;
  background: linear-gradient(to bottom, #070C1A 0%, #0C162D 100%);
  width: 100%;
  flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════
   FOOTER — Enterprise dark #0C162D
   ══════════════════════════════════════════════════════ */
footer,
.footer,
[class*="footer"],
[class*="Footer"] {
  background: #0C162D !important;
  border-top: 1px solid rgba(0, 198, 255, 0.10) !important;
  position: relative;
  overflow: hidden;
}

/* Subtle accent glow inside footer */
footer::before,
.footer::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 20% 50%,
    rgba(0, 198, 255, 0.04) 0%,
    transparent 60%);
  pointer-events: none;
  z-index: 0;
}

/* Footer headings */
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
footer [class*="heading"], footer [class*="title"],
footer strong,
.footer h1, .footer h2, .footer h3, .footer h4 {
  color: #A8C0E0 !important;
  font-weight: 600 !important;
}

/* Prevent background-color injection from extensions */
footer p, footer span, footer a, footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
header p, header span, header a, header h1, header h2, header h3, header h4, header h5, header h6,
nav p, nav span, nav a, font, mark {
  background-color: transparent !important;
}

/* Footer body text */
footer p, footer span, footer li,
.footer p, .footer span, .footer li {
  color: #7A9BBF !important;
}

/* Footer links */
footer a,
.footer a {
  color: #7A9BBF !important;
  transition: color 0.15s ease !important;
  text-decoration: none !important;
}
footer a:hover,
.footer a:hover {
  color: #00C6FF !important;
}

/* Footer social icons */
footer [class*="social"] svg,
footer [class*="icon"] svg,
footer svg {
  color: #7A9BBF !important;
  fill: currentColor;
  transition: color 0.15s ease !important;
}
footer [class*="social"]:hover svg,
footer [class*="icon"]:hover svg {
  color: #00C6FF !important;
}

/* Copyright / bottom bar */
footer [class*="copyright"],
footer [class*="bottom-bar"],
footer [class*="bottomBar"],
footer > div:last-child {
  background: rgba(0, 0, 0, 0.20) !important;
  color: #4A6A8A !important;
  border-top: 1px solid rgba(0, 198, 255, 0.06) !important;
}
footer [class*="copyright"] a,
footer [class*="bottom-bar"] a {
  color: #7A9BBF !important;
  transition: color 0.15s ease !important;
}
footer [class*="copyright"] a:hover,
footer [class*="bottom-bar"] a:hover {
  color: #00C6FF !important;
}

/* Footer inputs */
footer input, footer textarea {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(0, 198, 255, 0.14) !important;
  color: #EBF2FF !important;
}

/* Light-theme overrides — protect footer from light theme washing */
html.light-theme footer,
html.light-theme .footer,
html.light-theme .bg-\[\#050810\] {
  background: var(--footer-bg, #E2E6F0) !important;
  color: #2C3E6A !important;
}
html.light-theme footer p,
html.light-theme footer span,
html.light-theme footer li {
  color: #2C3E6A !important;
}
html.light-theme footer a {
  color: #2B4AC0 !important;
}
html.light-theme footer a:hover {
  color: #1A3299 !important;
}
html.light-theme footer h1,
html.light-theme footer h2,
html.light-theme footer h3,
html.light-theme footer h4,
html.light-theme footer h5,
html.light-theme footer h6,
html.light-theme footer strong {
  color: #0D1120 !important;
}