/**
 * Unified SPA — SpaceX IR mid-2026 look on beyondorbit-spacex.com (single platform)
 * Typography aligned to ir.spacex.com: D-DIN industrial sans, uppercase display
 */

/* ── Hero: D-DIN display (ir.spacex.com spec) ── */
#root h1 {
  font-family: var(--font-display, 'D-DIN', 'Arial Narrow', Arial, sans-serif) !important;
  font-weight: 700 !important;
  font-size: clamp(2.25rem, 7vw, 4.75rem) !important;
  line-height: 0.95 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: #f0f0fa !important;
}

#root h1 .bg-clip-text,
#root h1 span.bg-clip-text,
#root h1 span.text-transparent {
  background: none !important;
  background-image: none !important;
  -webkit-text-fill-color: #f0f0fa !important;
  color: #f0f0fa !important;
}

#root h2 {
  font-family: var(--font-display, 'D-DIN', 'Arial Narrow', Arial, sans-serif) !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: #f0f0fa !important;
}

#root p,
#root li,
#root span:not(.ir-ticker-symbol):not(.ticker-symbol) {
  font-family: var(--font-body, 'D-DIN', 'Arial Narrow', Arial, sans-serif);
}

/* ── Desktop IR nav inside React header — drawer-only (links via logo menu) ── */
.ir-nav-desktop-spa {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.ir-nav-desktop-spa a {
  font-family: var(--font-body, 'D-DIN', 'Arial Narrow', Arial, sans-serif);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(240, 240, 250, 0.55);
  padding: 0.45rem 0.65rem;
  border-radius: 0;
  text-decoration: none;
  transition: color 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  white-space: nowrap;
}

.ir-nav-desktop-spa a:hover,
.ir-nav-desktop-spa a.active {
  color: #f0f0fa;
}

.ir-nav-desktop-spa a.active {
  background: transparent;
  box-shadow: inset 0 -1px 0 #f0f0fa;
}

/* Dashboard route — hide bundled React chrome, show injected portfolio only */
body.ir-route-dashboard-only #root section:not(.ir-spa-block),
body.ir-route-dashboard-only #root footer {
  display: none !important;
  min-height: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Fail-safe — restore React sections after leaving portfolio routes (not footer-only) */
body:not(.ir-route-dashboard-only) #root section:not(.ir-spa-block):not([data-ir-chrome-suppressed="1"]),
body:not(.ir-route-dashboard-only) #root section.ir-chrome-visible {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  visibility: visible !important;
}

body:not(.ir-route-dashboard-only) #root .ir-spa-block.ir-chrome-visible {
  display: block !important;
  visibility: visible !important;
}

body:not(.ir-route-dashboard-only) #root > div {
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
}

#spcx-ir-dash-host {
  display: block;
  width: 100%;
  background: #000;
}

#spcx-ir-dash-host[hidden] {
  display: none !important;
}

body.ir-route-dashboard-only #spcx-ir-dash-host {
  min-height: 40vh;
}

body.ir-route-dashboard-only #root > div {
  min-height: 0 !important;
}

body.ir-route-dashboard-only #root .ir-spa-block,
body.ir-route-dashboard-only #spcx-ir-dash-host .ir-spa-block {
  display: block !important;
}

body.ir-route-dashboard-only #mandate-investor-dashboard {
  min-height: 0 !important;
  display: block !important;
  padding-top: calc(var(--site-header-h, 84px) + 0.5rem) !important;
  padding-bottom: 3rem !important;
}

body.ir-route-dashboard-only #spcx-ir-dash-host #mandate-investor-dashboard {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.ir-route-dashboard-only #mandate-investor-transactions,
body.ir-route-dashboard-only #mandate-investor-settings {
  display: none !important;
}

body.ir-route-dashboard-only #mandate-investor-dashboard,
body.ir-route-dashboard-only #mandate-investor-dashboard .ir-reveal {
  opacity: 1 !important;
  transform: none !important;
}

body.ir-route-dashboard-only #root .pt-16,
body.ir-route-dashboard-only #root section.min-h-screen {
  min-height: 0 !important;
  padding-top: 0 !important;
}

body.ir-route-dashboard-only #mandate-investor-dashboard.ir-spa-block {
  padding: calc(var(--site-header-h, 84px) + 0.75rem) 0 3rem !important;
  border-top: none !important;
}

/* ── Injected IR blocks inside SPA ── */
.ir-spa-block {
  background: #000000 !important;
  border-top: 1px solid rgba(240, 240, 250, 0.12);
  padding: clamp(3.5rem, 8vw, 6rem) 0 !important;
  max-width: none !important;
  scroll-margin-top: calc(var(--site-header-h, 94px) + 1.25rem);
}

body.mandate-active #root .ir-spa-block:first-child,
body.mandate-active #root > div > .ir-spa-block:first-child,
body.mandate-active #root > div > section.ir-spa-block:first-of-type {
  padding-top: calc(var(--site-header-h, 94px) + clamp(1.5rem, 5vw, 3rem)) !important;
}

#mandate-ir-newsletter {
  background: #0a0a0a !important;
}

#root nav.fixed {
  background: rgba(0, 0, 0, 0.98) !important;
  backdrop-filter: none !important;
  border-bottom: 1px solid rgba(240, 240, 250, 0.12) !important;
  height: var(--nav-h, 54px);
  min-height: var(--nav-h, 54px);
  box-sizing: border-box;
}

#root nav.fixed a,
#root nav.fixed button,
.ir-drawer-links a {
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0.06);
}

#root nav.fixed .spcx-nav-brand .spacex-wordmark {
  display: block;
  height: 16px;
  width: auto;
  filter: brightness(0) invert(1);
}

#root nav.fixed .spcx-nav-title,
#root nav.fixed .spcx-nav-brand span {
  font-family: var(--font-body, 'D-DIN', 'Arial Narrow', Arial, sans-serif) !important;
  font-size: 0.63rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: rgba(240, 240, 250, 0.55) !important;
}

/* Ticker matches IR platform */
#spcx-ticker-bar.ir-ticker {
  font-family: var(--font-body, 'D-DIN', 'Arial Narrow', Arial, sans-serif) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.08em !important;
  padding-top: var(--ticker-pad-y, 0.32rem) !important;
  padding-bottom: var(--ticker-pad-y, 0.32rem) !important;
  padding-right: max(var(--ticker-pad-x, 1rem), env(safe-area-inset-right, 0px)) !important;
  padding-left: max(var(--ticker-pad-x, 1rem), env(safe-area-inset-left, 0px)) !important;
  justify-content: flex-start !important;
  text-transform: uppercase;
}

#spcx-ticker-bar .ticker-live {
  display: none !important;
}

/* Page content clears fixed ticker + nav on every route */
body.mandate-active #root .pt-16,
body.mandate-active #root section.min-h-screen,
body.mandate-active #root > div > section:first-of-type:not(.ir-spa-block) {
  padding-top: calc(var(--site-header-h, 94px) + 1.25rem) !important;
  box-sizing: border-box !important;
}

body.mandate-active #root section.min-h-screen {
  min-height: 100vh !important;
}

body.mandate-active #root > div > section:first-of-type,
body.mandate-active #root section.min-h-screen:first-of-type,
body.mandate-active #root [id^="mandate-"],
body.mandate-active #root .ir-spa-block {
  scroll-margin-top: calc(var(--site-header-h, 94px) + 1rem);
}

@media (max-width: 768px) {
  body.mandate-active #root .pt-16,
  body.mandate-active #root section.min-h-screen,
  body.mandate-active #root > div > section:first-of-type:not(.ir-spa-block) {
    padding-top: calc(var(--site-header-h, 84px) + 1rem) !important;
  }

  /* Hero content starts below header — not vertically centered mid-screen */
  body.mandate-active #root section.min-h-screen.flex.items-center,
  body.mandate-active #root section.min-h-screen[class*="items-center"] {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    min-height: auto !important;
    padding-bottom: 2.5rem !important;
  }

  body.mandate-active #root section.min-h-screen.flex.items-center > div,
  body.mandate-active #root section.min-h-screen[class*="items-center"] > div {
    padding-top: 0.5rem;
    width: 100%;
  }

  body.mandate-active #root .ir-spa-block:first-child,
  body.mandate-active #root > div > .ir-spa-block:first-child,
  body.mandate-active #root > div > section.ir-spa-block:first-of-type {
    padding-top: calc(var(--site-header-h, 84px) + 1.25rem) !important;
  }
}

/* Kill purple/blue page glows */
#root [class*="from-blue"],
#root [class*="from-purple"],
#root [class*="to-cyan"],
#root .bg-gradient-to-b,
#root .bg-gradient-to-br {
  background-image: none !important;
}

#root section.min-h-screen {
  background-color: #000000 !important;
}

/* Clear fixed ticker + nav on every route (including before mandate-active) */
body.access-granted #root section.min-h-screen,
body.investor-authenticated #root section.min-h-screen,
body.access-granted #root section.pt-16,
body.investor-authenticated #root section.pt-16,
body.access-granted #root section[class*="pt-16"],
body.investor-authenticated #root section[class*="pt-16"],
#root section.ir-header-clearance {
  padding-top: calc(var(--site-header-h, 94px) + 1.25rem) !important;
  box-sizing: border-box !important;
}

body.access-granted #root section.min-h-screen > div > h1,
body.investor-authenticated #root section.min-h-screen > div > h1,
body.access-granted #root section.min-h-screen > div > .text-4xl,
body.investor-authenticated #root section.min-h-screen > div > .text-4xl,
body.mandate-active #root section.min-h-screen > div > h1:first-child {
  scroll-margin-top: calc(var(--site-header-h, 94px) + 1rem);
}

/* Post-login Investors home — hero video at top, not vertically centered mid-page */
body.access-granted #root section.min-h-screen.flex.items-center,
body.investor-authenticated #root section.min-h-screen.flex.items-center,
body.investor-home-ready #root section.min-h-screen.flex.items-center,
body.access-granted #root section.min-h-screen[class*="items-center"],
body.investor-authenticated #root section.min-h-screen[class*="items-center"],
body.investor-home-ready #root section.min-h-screen[class*="items-center"],
body.mandate-active #root section.min-h-screen.flex.items-center,
body.mandate-active #root section.min-h-screen[class*="items-center"] {
  align-items: flex-start !important;
  justify-content: flex-start !important;
  min-height: min(70dvh, 100vh) !important;
  padding-bottom: 2.5rem !important;
}

body.access-granted #root section.min-h-screen.flex.items-center > div,
body.investor-authenticated #root section.min-h-screen.flex.items-center > div,
body.access-granted #root section.min-h-screen[class*="items-center"] > div,
body.investor-authenticated #root section.min-h-screen[class*="items-center"] > div,
body.mandate-active #root section.min-h-screen.flex.items-center > div,
body.mandate-active #root section.min-h-screen[class*="items-center"] > div {
  width: 100%;
  padding-top: 0.5rem;
}

body.access-granted #root section.min-h-screen .aspect-video,
body.investor-authenticated #root section.min-h-screen .aspect-video,
body.mandate-active #root section.min-h-screen .aspect-video {
  margin-top: 0;
}

/* Hide user-facing refresh timing and buy CTAs injected by the SPA bundle */
.live-refresh,
#spcx-refresh-log,
.spcx-refresh-log,
#root a[href="/buy"],
#root .btn-buy-spcx {
  display: none !important;
}

/* Cards & panels — minimal IR treatment */
#root .rounded-2xl,
#root .rounded-xl,
#root .rounded-lg {
  border-radius: 2px !important;
}