/* Keep public pages inside the viewport without disabling local scrollers. */
html { overflow-x: hidden; }
@supports (overflow: clip) {
  html { overflow-x: clip; }
}
body, .body-wrapper { min-width: 0; max-width: 100%; }
.row > [class*="col-"], .st-footer-grid > *, .st-blog-featured > *,
.st-blog-featured-side article > *, .account-layout > * { min-width: 0; }
.pagination, .st-blog-pagination { flex-wrap: wrap; max-width: 100%; row-gap: 8px; }
.pagination > li { flex-shrink: 0; }
.st-footer-grid, .st-user-dropdown, .st-cart-items, .account-card {
  overflow-wrap: anywhere;
}
.st-blog-hero input { min-width: 0; }
.shop-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 100%; }
.shop-search-form, .shop-filter-field, .shop-native-select,
.st-mobile-category-control, .st-mobile-category-select { min-width: 0; max-width: 100%; }
.table-content { max-width: 100%; overflow-x: auto; }
@media (max-width: 767.98px) {
  /* Anchor popovers to the header, not an icon near the screen edge. */
  .st-nav-row { position: relative; }
  .st-cart-menu, .st-user-menu { position: static; }
  .st-cart-dropdown, .st-user-dropdown {
    left: auto !important; right: 12px !important;
    width: min(330px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px);
  }
  .shop-filter-form { grid-template-columns: minmax(0, 1fr) !important; }
  .st-blog-featured-side article { grid-template-columns: minmax(0, 100px) minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
  /* Bootstrap's -15px outer row exceeded the old 4px container gutters. */
  #shop-live-area > .container { padding-left: 12px !important; padding-right: 12px !important; }
  #shop-live-area > .container > .row { margin-left: 0 !important; margin-right: 0 !important; }
  #shop-live-area > .container > .row > [class*="col-"] {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  #shop-live-area .st-shop-grid-row { margin-left: -4px !important; margin-right: -4px !important; }
  #shop-live-area .st-shop-grid-col { padding-left: 4px !important; padding-right: 4px !important; min-width: 0; }
  .st-shop-product-body, .st-product-body { overflow-wrap: anywhere; }
}

/* Mobile hero: let the tallest slide set the height, then reserve a control row.
   Previously absolute slides overflowed the forced 370px hero and clipped CTAs. */
@media (max-width: 767px) {
  .st-home-hero .st-hero-slider { min-height: 0 !important; }
  .st-home-hero .st-hero-slides {
    position: relative;
    inset: auto;
    height: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  .st-home-hero .st-hero-slide {
    position: relative;
    inset: auto;
    grid-area: 1 / 1;
    height: auto;
    min-width: 0;
  }
  .st-home-hero .st-hero-copy-wrap {
    min-height: 0 !important;
    height: 100%;
    align-items: center;
  }
  .st-home-hero .st-hero-copy {
    width: 100%;
    padding: 30px 0 76px;
  }
  .st-home-hero .st-hero-actions {
    justify-content: flex-start;
    margin-top: 20px;
    gap: 10px;
  }
  .st-home-hero .st-hero-actions .st-btn {
    min-height: 44px !important;
    height: auto;
    white-space: normal;
    text-align: center;
  }
  .st-home-hero .st-hero-arrow {
    top: auto;
    bottom: 14px;
    margin-top: 0;
    width: 36px;
    height: 36px;
  }
  .st-home-hero .st-hero-prev { left: 16px; }
  .st-home-hero .st-hero-next { right: 16px; }
  .st-home-hero .st-hero-controls { bottom: 26px; }
}
