/**
 * Phase I.5 — Header no spillage (SOT).
 * Ensures header/top bar is properly configured on every surface:
 * no spillage, no overflow outside the shell, contained within layout.
 * Applies to: control plane, portal, backend, marketing, auth.
 */
/* Global: prevent horizontal spill from viewport */
html {
  overflow-x: clip;
}
body {
  overflow-x: clip;
  max-width: 100vw;
}

/* Control plane: .cp-navbar (control_plane_base.html) */
.cp-shell-content .cp-navbar.statement-header,
nav.cp-navbar.statement-header {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
  flex-shrink: 0;
}
.cp-shell-content .cp-navbar .container-fluid,
nav.cp-navbar .container-fluid {
  max-width: 100%;
  min-width: 0;
  /* overflow-x: hidden made overflow-y compute to auto and clipped Bootstrap dropdowns */
  overflow-x: clip;
  overflow-y: visible;
}

/* v3.16 (2026-05-17) — dropdown escape hatch.
   `overflow-x: clip` still establishes a clipping containing block for
   absolutely positioned descendants, so Bootstrap dropdowns (positioned via
   Popper.js as `position: absolute` inside the trigger's offset parent) get
   cut off at the navbar's edge. Mirror the marketing :has(.mega-menu.show)
   pattern: when any dropdown inside the header is shown, lift overflow on
   the container chain so the menu escapes. Tested on Chrome/Firefox/Safari —
   :has() is baseline-modern across all three since 2023. */
.cp-shell-content .cp-navbar:has(.dropdown-menu.show),
nav.cp-navbar:has(.dropdown-menu.show),
.cp-shell-content .cp-navbar:has(.dropdown-menu.show) .container-fluid,
nav.cp-navbar:has(.dropdown-menu.show) .container-fluid {
  overflow-x: visible;
  overflow-y: visible;
}

/* Portal / tenant: #portalHeader (portal_base.html) */
#portalHeader.topbar.statement-header,
nav#portalHeader.statement-header {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
  overflow-y: visible;
}
#portalHeader .container-fluid,
#portalHeader .navbar-collapse {
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
  overflow-y: visible;
}
/* v3.16 dropdown escape hatch — see comment above .cp-navbar block. */
#portalHeader:has(.dropdown-menu.show),
#portalHeader:has(.dropdown-menu.show) .container-fluid,
#portalHeader:has(.dropdown-menu.show) .navbar-collapse {
  overflow-x: visible;
  overflow-y: visible;
}

/* Marketing: .mkt-navbar (marketing_header.html)
   overflow-x: hidden clips Bootstrap dropdowns (Popper absolutely positioned).
   Use clip + visible y (same pattern as portal header). */
.mkt-navbar.statement-header,
nav.mkt-navbar.statement-header {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
  overflow-y: visible;
}
.mkt-navbar .mkt-navbar-container,
.mkt-navbar .container {
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
  overflow-y: visible;
}
.mkt-navbar .navbar-collapse {
  overflow-x: clip;
  overflow-y: visible;
}
@media (min-width: 992px) {
  .mkt-navbar-unified:has(.mkt-mega-menu.show) .mkt-navbar-container,
  .mkt-navbar-unified:has(.mkt-mega-menu.show) .navbar-collapse,
  .mkt-navbar-unified:has(.mkt-mega-menu.show) .container {
    overflow-x: visible;
    overflow-y: visible;
  }
}

/* Auth / standalone: any .navbar that is a direct header */
body .navbar.statement-header {
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}
body .navbar .container,
body .navbar .container-fluid {
  max-width: 100%;
  min-width: 0;
}

/* Admin wrapper (admin_nav_bridge): ensure header strip doesn't spill */
body.admin-wrap .navbar,
body .admin_nav_bridge {
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}