/* Shared subcategory/navigation wrapper and layout
   - The combined two-row navigation is owned by #catalog-sticky-navigation (position: sticky)
   - Children are in normal document flow and are NOT independently sticky. */

#catalog-sticky-navigation {
  width: 100%;
  background: #ffffff;
  position: sticky;
  top: 38px;
  z-index: 1000;
  box-shadow: 0 1px 0 rgba(0,0,0,0.04);
}

/* Ensure children stack with no gap and preserve container padding control */

#catalog-sticky-navigation > .container {
  padding-left: 0;
  padding-right: 0;
}

/* Ensure the mobile stripe is not independently sticky and sits in normal flow */

#mobile-sticky-category-stripe {
  position: static !important;
  z-index: auto;
  background: transparent;
}

/* Ensure the shared subcategory nav is not independently sticky */

#shared-subcategory-nav {
  width: 100%;
  background: transparent;
  position: static !important;
  top: auto !important;
  z-index: auto;
}

#shared-subcategory-nav > .container {
  padding-top: 8px;
  padding-bottom: 8px;
}

/* Chips wrapper layout remains centered and responsive */

#shared-subcategory-nav .category-chips-wrapper, #catalog-sticky-navigation .category-chips-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}

/* Keep legacy sticky headers static while the new combined nav is active */

.sticky-category-header {
  position: static !important;
}

/* Mobile behaviour:
   - When screen is narrow assume header may scroll away; keep combined nav at the very top edge.
   - This preserves the existing mobile UX where the nav reaches the page top when the header scrolls away. */

@media (max-width: 767.98px) {
  #catalog-sticky-navigation {
    top: 0;
  }
}