/* ── Shared pennant badge ────────────────────────────────────────────────────── */

.sbh-pennant-sm {
  position: relative;
  flex-shrink: 0;
  width: 54px;
  height: 66px;
  top: 5px;
}

.sbh-pennant-lg {
  position: absolute;
  left: calc(var(--container-offset));
  top: 0;
  z-index: 10;
  width: 85px;
  height: 103px;
}

.sbh-pennant-svg {
  position: absolute;
  inset: 0;
  filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.1));
}

.sbh-pennant-shape {
  fill: #ffffff;
  transition: fill 0.3s ease;
}

.sbh-logo-path-theme {
  fill: black;
  transition: fill 0.3s ease;
}

/* ─── Desktop Header: Home page transparent states ─── */
.sbh-header-desktop {
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1);
}

/* 1. Desktop Pennant Badge on Home Page when NOT scrolled */
body.home .sbh-header-desktop:not(.sbh-scrolled) .sbh-pennant-shape {
  fill: #1f2b7b;
}

body.home .sbh-header-desktop:not(.sbh-scrolled) .sbh-logo-path-theme {
  fill: white;
}

/* 2. Desktop Topbar on Home Page when NOT scrolled */
body.home .sbh-header-desktop:not(.sbh-scrolled) .sbh-topbar {
  background: transparent;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* 3. Desktop Navbar on Home Page when NOT scrolled */
body.home .sbh-header-desktop:not(.sbh-scrolled) .sbh-navbar {
  background: hsl(var(--core_neu_50) / 0.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.sbh-pennant-logo {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.sbh-pennant-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ── Mobile bar ──────────────────────────────────────────────────────────────── */

.sbh-mobile-bar {
  height: 54px;
  background: #ffffff;
  transition:
    background 0.3s ease,
    backdrop-filter 0.3s ease,
    -webkit-backdrop-filter 0.3s ease;
  box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.2);
}

/* Mobile Pennant Shape default background (always blue by default) */
.sbh-header-mobile .sbh-pennant-shape {
  fill: #1f2b7b;
}

/* Mobile Logo Paths default fill (always white by default) */
.sbh-header-mobile .sbh-logo-path-theme {
  fill: #ffffff;
}

/* Mobile Bar when scrolled and not open: gets the dark blue background */
.sbh-header-mobile.sbh-scrolled:not(.sbh-open) .sbh-mobile-bar {
  background: hsl(var(--background_sec_card));
  /* matches background_sec_card */
}

/* Mobile Pennant Shape when scrolled and not open: gets white background */
.sbh-header-mobile.sbh-scrolled:not(.sbh-open) .sbh-pennant-shape {
  fill: #ffffff;
}

/* Mobile Logo Paths when scrolled and not open: gets black fill */
.sbh-header-mobile.sbh-scrolled:not(.sbh-open) .sbh-logo-path-theme {
  fill: #000000;
}

.sbh-cta-gap {
  border-top: 1px solid hsl(var(--border_sec_disable));
  gap: 24px;
}

.sbh-hamburger-btn {
  width: 60px;
  height: 54px;
}

.sbh-line-s {
  width: 12px;
}

.sbh-line-l {
  width: 22px;
}

/* ── Mobile overlay ──────────────────────────────────────────────────────────── */

.sbh-menu-overlay {
  font-family: "Montserrat", sans-serif;
  height: calc(100dvh - 54px);
  z-index: -1;
}

.sbh-left-panel {
  width: 185px;
}

.sbh-left-panel-inner {
  gap: 24px;
}

.sbh-download-row {
  height: 40px;
}

.sbh-download-icon {
  width: 36px;
  height: 36px;
}

.sbh-social-icon-sm {
  width: 24px;
  height: 28px;
}

/* ── Bottom pennant (left panel footer) ──────────────────────────────────────── */

.sbh-bottom-pennant {
  margin-top: auto;
  padding: 0 12px 16px;
}

.sbh-bottom-pennant-badge {
  position: relative;
  width: 54px;
  height: 66px;
  margin-top: -20px;
}

/* ── Right panel ─────────────────────────────────────────────────────────────── */

.sbh-right-bg {
  background:
    url("/static-assets/images/misc/sbstatic-assetsimagesmischeader-m-right-pattern.png"),
    var(--gradient_sec_vert_5_gradient);
}

.sbh-nav-inner {
  gap: 24px;
}

.sbh-chevron-left {
  font-size: 12px;
  line-height: 1;
  transform: rotate(-90deg);
}

.sbh-hospitality-btn {
  padding: 0 25px;
}

.sbh-cta-btn {
  border: 0.5px solid hsl(var(--text_invert_high));
  padding: 10px 20px;
}

/* ── Desktop ─────────────────────────────────────────────────────────────────── */

.sbh-desktop-offset {
  padding-left: 100px;
}

.sbh-topbar,
.sbh-navbar {
  transition:
    background 0.3s ease,
    backdrop-filter 0.3s ease,
    -webkit-backdrop-filter 0.3s ease;
}

.sbh-sponsor-img {
  height: 28px;
  width: auto;
  object-fit: contain;
}

.sbh-sponsor-img--rounded {
  width: 28px;
  border-radius: 50%;
}

.sbh-more-panel {
  width: 165px;
}

.sbh-user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
}

.sbh-social-icon-desktop {
  width: 22px;
  height: 22px;
}

.sbh-desktop-nav-item.sbh-active {
  background-color: hsl(var(--background_prim_card));
}

.sbh-mobile-nav-item.sbh-active {
  color: hsl(var(--background_prim_card));
}