/* SecretToys v11 — real visual-viewport lock.
   Keeps the mobile bottom navigation centered on the visible phone viewport and
   removes the product route's old 100vw dependency that could create sideways layout. */
@media (max-width:991px){
  html,
  body{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
    overflow-x:clip!important;
  }

  body.vp-product-route,
  body.vp-product-route .vp-main-shell,
  body.vp-product-route .vp-product-page{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow-x:hidden!important;
    overflow-x:clip!important;
    box-sizing:border-box!important;
  }

  /* Undo the older calc(100vw ...) product container rule. Percentages are
     relative to the real layout viewport and therefore cannot widen the page. */
  body.vp-product-route .vp-product-page > .vp-container,
  body.vp-product-route .vp-product-page > .vp-container.vp-container-wide{
    width:calc(100% - 12px)!important;
    max-width:calc(100% - 12px)!important;
    min-width:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
  }

  body.vp-product-route .vp-product-detail,
  body.vp-product-route .vp-product-gallery,
  body.vp-product-route .vp-product-summary,
  body.vp-product-route .vp-product-panels,
  body.vp-product-route .vp-panel{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  /* The JS writes an exact visualViewport width/centre inline. These values are
     also safe before JS runs, preventing a flash outside the viewport. */
  .vp-mobile-bottom-nav{
    position:fixed!important;
    left:50%!important;
    right:auto!important;
    width:min(calc(100dvw - 16px),520px)!important;
    max-width:calc(100dvw - 16px)!important;
    min-width:0!important;
    margin:0!important;
    transform:translateX(-50%)!important;
    box-sizing:border-box!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    z-index:2147483000!important;
  }

  .vp-mobile-bottom-nav > a,
  .vp-mobile-bottom-nav > button{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
}

@supports not (width:100dvw){
  @media (max-width:991px){
    .vp-mobile-bottom-nav{
      width:min(calc(100vw - 16px),520px)!important;
      max-width:calc(100vw - 16px)!important;
    }
  }
}