/* STLBEAST V226 — Header Overflow Repair
   Fixes index/product header falling off the right side without redesigning the current look. */

html,
body{
  max-width:100%!important;
  overflow-x:hidden!important;
}

*,
*::before,
*::after{
  box-sizing:border-box!important;
}

/* Outer shells must never create horizontal scroll */
.v114-shell,
.stlb125-shell,
.v114-page,
.stlb125-body,
body[class*="product-"]{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}

/* Top bars can wrap instead of pushing page width */
.v114-topbar,
.stlb125-topbar{
  width:min(1480px,calc(100vw - 18px))!important;
  max-width:calc(100vw - 18px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  gap:8px 12px!important;
}

/* Header frame: preserve premium look, remove right overflow */
.v114-nav.stlb147-premium-nav,
header.stlb125-nav,
header.nav.stlb159-nav,
.sb-header,
.seo-nav{
  width:min(1480px,calc(100vw - 18px))!important;
  max-width:calc(100vw - 18px)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:visible!important;
  transform:none!important;
}

/* Main header grid: never require more width than viewport */
.v114-nav.stlb147-premium-nav .stlb147-nav-shell,
header.stlb125-nav .stlb147-nav-shell,
header.nav.stlb159-nav,
.sb-header .sb-nav,
.seo-nav{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  grid-template-columns:minmax(240px,390px) minmax(0,1fr) minmax(190px,310px)!important;
  gap:clamp(10px,1.4vw,18px)!important;
  padding:clamp(12px,1.45vw,20px)!important;
}

/* Brand plate cannot force the grid wider */
.v114-nav .stlb147-logo-frame,
header.stlb125-nav .stlb125-brand,
header.nav .stlb159-brand,
.sb-header .sb-logo,
.seo-nav .logo,
header.nav > .logo{
  min-width:0!important;
  width:100%!important;
  max-width:390px!important;
  justify-self:start!important;
}

/* Real logo image must fit inside plate */
.v114-nav .stlb147-logo-frame .stlb161-logo,
header.stlb125-nav .stlb125-brand .stlb161-logo,
header.nav .stlb159-brand .stlb161-logo{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

.v114-nav .stlb147-logo-frame img,
header.stlb125-nav .stlb125-brand img,
header.nav .stlb159-brand img,
.stlb161-logo img{
  max-width:100%!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

/* Nav links wrap inside available space rather than extending right */
.v114-nav .stlb147-link-row,
header.stlb125-nav .stlb125-links,
header.nav .stlb159-links,
.v114-links,
.stlb125-links,
.navlinks{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  overflow:visible!important;
}

.v114-nav .stlb147-link-row a,
header.stlb125-nav .stlb125-links a,
header.nav .stlb159-links a,
.v114-links a,
.stlb125-links a,
.navlinks a{
  flex:0 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:nowrap!important;
  font-size:clamp(10px,.72vw,12px)!important;
  padding:0 clamp(8px,.8vw,12px)!important;
}

/* Search box can shrink; text truncates instead of pushing page */
.v114-search.stlb147-searchbox,
.stlb125-search.stlb147-searchbox,
.stlb159-search,
.stlb147-searchbox{
  min-width:0!important;
  width:100%!important;
  max-width:310px!important;
  justify-self:end!important;
  overflow:hidden!important;
}

.stlb147-searchtext,
.v114-search span,
.stlb125-search span{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

/* Switch to stacked premium header earlier so tablets/narrow laptops do not overflow */
@media(max-width:1420px){
  .v114-nav.stlb147-premium-nav .stlb147-nav-shell,
  header.stlb125-nav .stlb147-nav-shell,
  header.nav.stlb159-nav,
  .sb-header .sb-nav,
  .seo-nav{
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-areas:"brand" "nav" "search"!important;
    justify-items:center!important;
    gap:12px!important;
    min-height:0!important;
  }

  .v114-nav .stlb147-logo-frame,
  header.stlb125-nav .stlb125-brand,
  header.nav .stlb159-brand,
  .sb-header .sb-logo,
  .seo-nav .logo{
    justify-self:center!important;
    width:min(390px,92vw)!important;
    max-width:min(390px,92vw)!important;
  }

  .v114-nav .stlb147-link-row,
  header.stlb125-nav .stlb125-links,
  .v114-links,
  .stlb125-links,
  .navlinks{
    justify-self:center!important;
    width:100%!important;
    max-width:920px!important;
  }

  .v114-search.stlb147-searchbox,
  .stlb125-search.stlb147-searchbox,
  .stlb147-searchbox{
    justify-self:center!important;
    width:min(420px,92vw)!important;
    max-width:min(420px,92vw)!important;
  }
}

/* Phone: compact two-column nav buttons */
@media(max-width:720px){
  .v114-nav.stlb147-premium-nav,
  header.stlb125-nav{
    width:calc(100vw - 10px)!important;
    max-width:calc(100vw - 10px)!important;
    margin-top:8px!important;
    margin-bottom:18px!important;
  }

  .v114-nav.stlb147-premium-nav .stlb147-nav-shell,
  header.stlb125-nav .stlb147-nav-shell{
    border-radius:18px!important;
    padding:12px 10px 14px!important;
  }

  .v114-nav .stlb147-logo-frame,
  header.stlb125-nav .stlb125-brand{
    width:min(330px,88vw)!important;
    max-width:min(330px,88vw)!important;
    height:72px!important;
    min-height:72px!important;
  }

  .v114-nav .stlb147-link-row,
  header.stlb125-nav .stlb125-links,
  .v114-links,
  .stlb125-links{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:360px!important;
  }

  .v114-nav .stlb147-link-row a,
  header.stlb125-nav .stlb125-links a,
  .v114-links a,
  .stlb125-links a{
    width:100%!important;
    justify-content:center!important;
    text-align:center!important;
    min-height:36px!important;
    padding:0 7px!important;
    font-size:10.25px!important;
  }

  .v114-search.stlb147-searchbox,
  .stlb125-search.stlb147-searchbox{
    width:min(360px,88vw)!important;
    max-width:min(360px,88vw)!important;
  }
}
