/* Remove native button arrow and border from split-toggle */
.bpg-header .dropdown-split-toggle {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 8px !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  outline: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* Remove any pseudo-elements or default markers from split-toggle */
.bpg-header .dropdown-split-toggle::before,
.bpg-header .dropdown-split-toggle::after {
  content: none !important;
  display: none !important;
}

/* Remove any small border/box that appears under the toggle in some browsers */
.bpg-header .dropdown-split-toggle { border-bottom: 0 !important; }

/* Ensure only the caret next to the parent link is visible */
.bpg-header .nav-link .caret { visibility: visible !important; }
.bpg-header .dropdown-split-toggle .caret { display: none !important; }
/* Power Pages legacy header defaults */

/* Hide in-progress modern header assets so the platform navbar is the only header shown. */
.bpg-modern-header,
.bpg-sidebar {
  display: none !important;
}

.bpg-header-cta,
.bpg-header-utility {
  display: none !important;
}

/* Reset layout margins if experimental sidebar classes are still present. */
body.bpg-sidebar-mounted .page,
body.bpg-sidebar-mounted main,
body.bpg-sidebar-mounted .section,
body.bpg-sidebar-mounted .container,
body.bpg-sidebar-mounted .container-fluid,
body.bpg-sidebar-mounted footer,
body.bpg-sidebar-collapsed .page,
body.bpg-sidebar-collapsed main,
body.bpg-sidebar-collapsed .section,
body.bpg-sidebar-collapsed .container,
body.bpg-sidebar-collapsed .container-fluid,
body.bpg-sidebar-collapsed footer {
  padding-left: 0 !important;
}

/* Keep only the custom header navbar visible */
.bpg-header, .bpg-header .navbar {
  display: block !important;
}

/* Hide other platform navbars that might duplicate header */
/*
  Previously used selector `.navbar:not(.bpg-header .navbar)` accidentally matched
  the header element when it had both `.bpg-header` and `.navbar` on the same element
  (the selector checks for a descendant `.navbar` inside `.bpg-header`). Change to
  `.navbar:not(.bpg-header)` which correctly excludes navbars that carry the
  `.bpg-header` class themselves.
*/
/* Previously we attempted to hide other platform navbars. That selector caused
   unexpected behavior across some environments and hid the active header in
   certain render paths. Remove the rule entirely so the platform navbars are
   controlled by the templates themselves. If duplicate navbars reappear we can
   revisit with a more targeted selector. */
/* .navbar:not(.bpg-header) { display: none !important; } */

/* --------- Enhanced header layout & visuals --------- */
.bpg-header {
  background: #ffffff;
  color: #000000;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Make header a containing block for absolutely positioned utilities */
.bpg-header { position: relative; }

/* Hide hamburger toggle entirely on desktop (duplicate safeguard) */
.bpg-header .navbar-toggler { display: none; }
.bpg-header .navbar-toggler .bpg-hamburger span { display: none; }

@media (max-width: 991px) {
  .bpg-header .navbar-toggler { display: inline-flex; }
  .bpg-header .navbar-toggler .bpg-hamburger span { display: block; }
}

.bpg-header .container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 14px 32px;
}

@media (min-width: 992px) {
  .bpg-header .container.custom-container {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 1240px;
    margin: 0 auto;
    padding: 14px 40px;
  }

  .bpg-header .navbar-header { flex: 0 0 auto; margin-right: 56px; }
  .bpg-header .navbar-collapse { flex: 0 1 auto; }
  .bpg-header nav.menu-bar { flex: 0 1 auto; }
  .bpg-header nav.menu-bar .navbar-nav { gap: 32px; position: relative; padding-right: 120px; }
  .bpg-header .nav-item-auth { position: absolute; right: 40px; top: 50%; transform: translateY(-50%); }
  .bpg-header .bpg-header-right { flex: 0 0 auto; margin-left: 56px; display:flex; align-items:center; }
}

/* Brand/logo */
.bpg-header .navbar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #000000 !important;
  text-decoration: none;
}

.bpg-header .navbar-brand img {
  height: 58px;
  width: auto;
  display: block;
}

@media (max-width: 991px) {
  .bpg-header .navbar-brand img {
    height: 44px;
  }
}

/* Logo rendered as CSS background to avoid broken-image alt text showing */
.bpg-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Fallback img for logo */
.bpg-logo-img {
  height: 56px;
  width: auto;
}

@media (max-width: 991px) {
  .bpg-logo,
  .bpg-logo-img {
    height: 42px;
    width: auto;
  }
}

/* Main nav - horizontal, remove bullets */
.bpg-header .navbar-nav {
  display: flex !important;
  align-items: center;
  gap: 24px;
  margin: 0;
  padding: 0;
}

.bpg-header .navbar-nav .nav-item {
  display: flex;
  align-items: center;
}

.bpg-header .navbar-nav .nav-link {
  display: inline-flex;
  align-items: center;
  color: #000000 !important;
  padding: 10px 8px;
  text-decoration: none;
  font-weight: 600;
  line-height: 1.2;
  transition: color 120ms ease, background 120ms ease;
}

.bpg-header .navbar-nav .navbar-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.bpg-header .navbar-nav .nav-link:hover,
.bpg-header .navbar-nav .nav-link:focus {
  color: #333333 !important;
  background: rgba(0,0,0,0.04);
  border-radius: 6px;
}

/* Right-side utilities */
.bpg-header .navbar-nav.ms-auto {
  margin-left: 16px;
}

/* Sign In button styling */
.bpg-header .btn-primary {
  background: #f8f9fa !important;
  border: 1px solid #dee2e6 !important;
  color: #000000 !important;
  padding: 8px 14px !important;
  box-shadow: none;
  border-radius: 6px;
}

.bpg-header .btn-primary:hover,
.bpg-header .btn-primary:focus {
  background: #e9ecef !important;
  border-color: #adb5bd !important;
  color: #000000 !important;
  transform: none;
}

/* Make header sticky at top with subtle backdrop */
.bpg-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  -webkit-backdrop-filter: saturate(120%) blur(4px);
  backdrop-filter: saturate(120%) blur(4px);
}

/* Mobile: stack items and show toggle */
@media (max-width: 991px) {
  .bpg-header .container {
    padding: 12px 16px;
  }

  .bpg-header .navbar-nav {
    flex-direction: column;
    gap: 8px;
    padding: 12px 8px;
    background: #ffffff;
  }

  .bpg-header .navbar-toggler {
    border: 0;
    background: transparent;
    display: none; /* hide on large screens */
  }

  .bpg-header .navbar-collapse {
    background: #ffffff;
  }

  /* mobile toggler styles - custom hamburger */
  .bpg-hamburger {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 20px;
    gap: 4px;
  }
  .bpg-hamburger span {
    display: block;
    width: 100%;
    height: 2px;
    background: #0f172a;
    border-radius: 2px;
    transition: transform 200ms ease;
  }
  @media (max-width: 991px) {
    .bpg-header .navbar-toggler { display: inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:10px; }
    .bpg-header .navbar-nav { gap: 12px; }
  }

  /* align sign-in vertically */
  .bpg-header .navbar-nav.ms-auto .nav-item .btn {
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* Accessibility: visible focus for keyboard users */
.bpg-header a:focus-visible,
.bpg-header button:focus-visible {
  outline: 3px solid rgba(6,183,212,0.35);
  outline-offset: 2px;
}

/* Blue Sign In button used in header (replaces inline/button look) */
.bpg-signin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  border-radius: 10px;
  color: #ffffff !important;
  background-color: #0d6efd;
  border: 1px solid #0b5ed7;
  text-decoration: none;
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(13, 110, 253, 0.25);
  transition: transform 160ms ease, box-shadow 160ms ease;
  font-size: 0.95rem;
}
.bpg-signin-btn:hover,
.bpg-signin-btn:focus {
  background-color: #0b5ed7;
  border-color: #0a58ca;
  color: #fff !important;
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(11, 94, 215, 0.28);
}

/* End enhanced header styles */

/* Reset list styling so the built-in menu renders correctly. */
.navbar .nav,
.navbar .navbar-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.navbar .nav > li,
.navbar .navbar-nav > li,
.navbar .navbar-nav > .nav-item {
  display: inline-block;
}

.bpg-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.bpg-toggle-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 0;
  background: rgba(148, 163, 184, 0.16);
  color: var(--bpg-sidebar-text);
  transition: background 160ms ease, transform 160ms ease;
  cursor: pointer;
}

.bpg-toggle-btn:hover,
.bpg-toggle-btn:focus-visible {
  background: rgba(56, 189, 248, 0.28);
}

.bpg-toggle-btn:focus-visible {
  outline: 3px solid rgba(56, 189, 248, 0.55);
  outline-offset: 2px;
}

/* Layout utilities for Search landing section (replaces inline styles) */
.section-landing-search .sectionBlockLayout {
  display: flex;
  flex-wrap: wrap;
  text-align: center;
}

.section-landing-search .sectionBlockLayout .container {
  display: flex;
  flex-wrap: wrap;
}

.section-landing-search .columnBlockLayout {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.bpg-toggle-icon {
  font-size: 22px;
  line-height: 1;
  transition: transform 240ms ease;
}

.bpg-logo-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
  color: inherit;
  font-weight: 600;
  letter-spacing: 0.01em;
}

.bpg-logo-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(148, 163, 184, 0.18);
  color: var(--bpg-sidebar-text);
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.bpg-logo-text {
  font-size: 1rem;
  white-space: nowrap;
}

.bpg-sidebar-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  position: relative;
}

.bpg-nav-list {
  list-style: none;
  margin: 0;
  padding: 0 4px 12px 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  height: 100%;
  overflow-y: auto;
}

.bpg-sub-nav {
  list-style: none;
  margin: 6px 0 0 16px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bpg-sub-nav .bpg-nav-link {
  padding: 9px 12px;
  font-size: 0.86rem;
  font-weight: 500;
  background: rgba(148, 163, 184, 0.12);
}

.bpg-sub-nav .bpg-nav-link:hover {
  background: rgba(148, 163, 184, 0.22);
}

.bpg-nav-empty {
  margin: 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.38);
  border: 1px dashed rgba(148, 163, 184, 0.35);
  color: var(--bpg-sidebar-text-muted);
  font-size: 0.86rem;
}

.bpg-nav-item {
  display: block;
}

/* Ensure dropdowns are not clipped by header containers and have sufficient z-index */
.bpg-header,
.bpg-header .navbar,
.bpg-header .navbar-collapse,
.bpg-header .navbar-nav {
  overflow: visible !important;
}

.bpg-header .dropdown-menu {
  position: absolute !important;
  left: auto !important;
  right: 0 !important;
  top: 100% !important;
  margin-top: 6px !important;
  z-index: 10000 !important;
  /* Hide by default to avoid stray dividers or small bars showing when menu is closed */
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-4px) !important;
}

/* Show dropdown on hover/focus and when Bootstrap toggles the .show class */
.bpg-header .nav-item.weblink.dropdown:hover > .dropdown-menu,
.bpg-header .nav-item.weblink.dropdown:focus-within > .dropdown-menu,
.bpg-header .dropdown-menu.show {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

/* Also show menu if the parent nav-item receives the Bootstrap 'show' class */
.bpg-header .nav-item.weblink.dropdown.show > .dropdown-menu {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

/* Replace any stray inline 'bar' caret with a small downward triangle for clarity.
   This avoids rendering a tiny rectangular artifact when icon fonts are missing. */
.bpg-header .caret,
.bpg-header .nav-link .caret,
.bpg-header .dropdown-split-toggle .caret {
  display: inline-block !important;
  width: 0 !important;
  height: 0 !important;
  margin-left: 8px !important;
  vertical-align: middle !important;
  border-left: 6px solid transparent !important;
  border-right: 6px solid transparent !important;
  border-top: 6px solid currentColor !important; /* triangle points down */
  background: transparent !important;
  line-height: 0 !important;
}

/* Hide any element with class 'bar' inside the header if present */
.bpg-header .nav-link .bar,
.bpg-header .dropdown-split-toggle .bar {
  display: none !important;
}

/* Hide the vertical divider used between nav items (small bar artifact) */
.bpg-header .divider-vertical {
  display: none !important;
}

/* Hide dropdown dividers unless the menu is visible */
.bpg-header .dropdown-menu .dropdown-divider {
  display: none !important;
}
.bpg-header .dropdown-menu.show .dropdown-divider,
.bpg-header .nav-item.weblink.dropdown:hover > .dropdown-menu .dropdown-divider,
.bpg-header .nav-item.weblink.dropdown:focus-within > .dropdown-menu .dropdown-divider {
  display: block !important;
}

.bpg-nav-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  padding: 11px 14px;
  color: inherit;
  text-decoration: none;
  font-weight: 600;
  border-radius: 12px;
  transition: background 160ms ease, color 160ms ease, transform 160ms ease;
}

/* Utility to apply theme-on-color to header nav links (moved from inline styles) */
.nav-oncolor { color: #000000 !important; }

.bpg-header .text-light {
  color: #000000 !important;
}

.bpg-nav-link:hover {
  background: rgba(148, 163, 184, 0.16);
  color: #ffffff;
}

.bpg-nav-link:focus-visible {
  outline: 3px solid rgba(56, 189, 248, 0.5);
  outline-offset: 2px;
}

.bpg-nav-link.active {
  background: rgba(56, 189, 248, 0.28);
  color: #ffffff;
}

.bpg-link-text {
  display: inline-block;
}

.bpg-link-short {
  display: none;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.bpg-link-icon {
  width: 28px;
  height: 28px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}

.bpg-cart-section {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: rgba(15, 23, 42, 0.52);
  border: 1px solid var(--bpg-sidebar-border);
  border-radius: var(--bpg-sidebar-radius);
  padding: 20px 18px;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.28);
  transition: background 200ms ease, border-color 200ms ease;
}

.bpg-cart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.bpg-cart-header h3 {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: inherit;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}

.bpg-cart-text {
  display: inline-block;
}

.bpg-cart-short {
  display: none;
  font-size: 0.78rem;
  letter-spacing: 0.16em;
}

.bpg-cart-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(56, 189, 248, 0.2);
  color: #f8fafc;
  font-size: 0.78rem;
  font-weight: 600;
}

.bpg-cart-items {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 220px;
  overflow-y: auto;
  padding-right: 4px;
}

.bpg-cart-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(148, 163, 184, 0.16);
  color: var(--bpg-sidebar-text);
  font-size: 0.88rem;
}

.bpg-cart-remove {
  border: 0;
  background: rgba(15, 23, 42, 0.42);
  color: inherit;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  transition: background 160ms ease;
}

.bpg-cart-remove:hover,
.bpg-cart-remove:focus-visible {
  background: rgba(248, 113, 113, 0.42);
  color: #ffffff;
}

.bpg-cart-empty {
  margin: 0;
  font-size: 0.88rem;
  color: var(--bpg-sidebar-text-muted);
  text-align: center;
}

.bpg-cart-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.bpg-btn-primary,
.bpg-btn-secondary {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 12px;
  font-weight: 600;
  font-family: var(--bpg-font);
  font-size: 0.9rem;
  border: none;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.bpg-btn-primary {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.9), rgba(14, 165, 233, 0.85));
  color: #0f172a;
}

.bpg-btn-primary:hover:not([disabled]) {
  background: linear-gradient(135deg, rgba(56, 189, 248, 1), rgba(14, 165, 233, 1));
  transform: translateY(-1px);
}

.bpg-btn-primary[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

.bpg-btn-secondary {
  background: rgba(15, 23, 42, 0.45);
  color: var(--bpg-sidebar-text);
  border: 1px solid rgba(148, 163, 184, 0.35);
}

.bpg-btn-secondary:hover {
  background: rgba(148, 163, 184, 0.22);
}

.bpg-btn-text {
  display: inline-block;
}

.bpg-btn-short {
  display: none;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
}

.bpg-sidebar.collapsed {
  width: var(--bpg-sidebar-collapsed-width);
  padding: 26px 14px;
  box-shadow: none;
}

.bpg-sidebar.collapsed .bpg-sidebar-header {
  flex-direction: column;
  gap: 14px;
}

.bpg-sidebar.collapsed .bpg-logo-link {
  flex-direction: column;
  gap: 10px;
  text-align: center;
}

.bpg-sidebar.collapsed .bpg-logo-text {
  display: none;
}


.bpg-sidebar.collapsed .bpg-nav-link {
  justify-content: center;
  padding: 12px 10px;
}

.bpg-sidebar.collapsed .bpg-link-text,
.bpg-sidebar.collapsed .bpg-cart-text,
.bpg-sidebar.collapsed .bpg-btn-text {
  display: none;
}

.bpg-sidebar.collapsed .bpg-link-short,
.bpg-sidebar.collapsed .bpg-cart-short,
.bpg-sidebar.collapsed .bpg-btn-short {
  display: inline-block;
}

.bpg-sidebar.collapsed .bpg-cart-section {
  align-items: center;
  text-align: center;
  padding: 18px 12px;
}

.bpg-sidebar.collapsed .bpg-cart-header {
  flex-direction: column;
  gap: 8px;
}

.bpg-sidebar.collapsed .bpg-cart-count {
  min-width: 28px;
  padding: 6px 8px;
}

.bpg-sidebar.collapsed .bpg-cart-actions {
  flex-direction: column;
  width: 100%;
}

.bpg-sidebar.collapsed .bpg-cart-items {
  width: 100%;
  max-height: 160px;
}

body.theme-dark .bpg-sidebar {
  background: linear-gradient(180deg, #020617 0%, #0f172a 48%, #020617 100%);
  border-right-color: rgba(255, 255, 255, 0.08);
  box-shadow: 12px 0 40px rgba(2, 6, 23, 0.6);
}

body.theme-dark .bpg-cart-section {
  background: rgba(15, 23, 42, 0.64);
  border-color: rgba(148, 163, 184, 0.26);
}

.bpg-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.bpg-cart-items::-webkit-scrollbar,
.bpg-nav-list::-webkit-scrollbar {
  width: 8px;
}

.bpg-cart-items::-webkit-scrollbar-track,
.bpg-nav-list::-webkit-scrollbar-track {
  background: transparent;
}

.bpg-cart-items::-webkit-scrollbar-thumb,
.bpg-nav-list::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.2);
  border-radius: 999px;
}

@media (prefers-reduced-motion: reduce) {
  .bpg-sidebar,
  .bpg-toggle-btn,
  .bpg-nav-link,
  .bpg-cart-section,
  .bpg-btn-primary,
  .bpg-btn-secondary {
    transition: none !important;
  }
}