/* HealthyLife global header dropdown — single source of truth for every page. */
.hl-global-dropdown {
  --hl-global-y: 0px;
  position: fixed !important;
  top: max(0px, env(safe-area-inset-top)) !important;
  right: clamp(10px, 2.2vw, 34px) !important;
  z-index: 100020 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 12px 12px !important;
  border: 1px solid rgba(15, 54, 104, .11) !important;
  border-top: 0 !important;
  border-radius: 0 0 18px 18px !important;
  background: rgba(255, 255, 255, .97) !important;
  box-shadow: 0 12px 34px rgba(15, 54, 104, .16) !important;
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  backdrop-filter: blur(14px) saturate(150%);
  transform: translate3d(0, var(--hl-global-y), 0) !important;
  will-change: transform;
  transition: transform .34s cubic-bezier(.22,.61,.36,1) !important;
  touch-action: pan-x !important;
}

.hl-global-dropdown.hl-global-dragging { transition: none !important; }

.hl-global-control {
  min-height: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid rgba(15, 54, 104, .13) !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: #17324d !important;
  box-shadow: 0 4px 14px rgba(15, 54, 104, .07) !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  outline: none !important;
  transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
  box-sizing: border-box !important;
}

.hl-global-control:hover,
.hl-global-control:focus-visible {
  background: #f8fbff !important;
  border-color: rgba(11, 99, 206, .28) !important;
  box-shadow: 0 7px 18px rgba(15, 54, 104, .10) !important;
}

.hl-global-control:active { transform: translateY(1px) !important; }

select.hl-global-control {
  min-width: 92px !important;
  padding-right: 34px !important;
  appearance: auto !important;
  -webkit-appearance: menulist !important;
}

.hl-global-logout {
  color: #c62828 !important;
  background: #fff7f7 !important;
  border-color: rgba(198, 40, 40, .17) !important;
}

.hl-global-logout:hover,
.hl-global-logout:focus-visible { background: #feecec !important; }

.hl-global-pull-handle {
  position: absolute !important;
  left: 50% !important;
  bottom: -24px !important;
  width: 74px !important;
  height: 25px !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid rgba(15, 54, 104, .10) !important;
  border-top: 0 !important;
  border-radius: 0 0 14px 14px !important;
  background: rgba(255,255,255,.98) !important;
  box-shadow: 0 8px 18px rgba(15,54,104,.10) !important;
  cursor: ns-resize !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  touch-action: none !important;
}

.hl-global-pull-handle::before {
  content: "";
  width: 30px;
  height: 4px;
  border-radius: 999px;
  background: #b7c5d8;
}

.hl-global-dropdown [hidden],
.hl-global-dropdown .hidden,
.hl-legacy-header-control {
  display: none !important;
}

@media (max-width: 768px) {
  .hl-global-dropdown {
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: calc(100vw - 24px) !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
    padding: calc(8px + env(safe-area-inset-top)) 9px 11px !important;
    top: 0 !important;
  }

  .hl-global-control {
    min-height: 42px !important;
    height: 42px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 14px !important;
  }

  select.hl-global-control {
    min-width: 78px !important;
    padding-right: 24px !important;
  }
}


/* ===== HealthyLife v4 — top notifications/messages + compact live cart ===== */
.hl-global-icon-control{
  position:relative!important;
  width:44px!important;
  min-width:44px!important;
  padding:0!important;
  flex:0 0 44px!important;
}
.hl-global-icon-svg{width:21px;height:21px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.hl-global-icon-svg svg{width:100%;height:100%;display:block}
.hl-global-badge{
  position:absolute!important;right:-5px!important;top:-6px!important;
  min-width:17px!important;height:17px!important;padding:0 4px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  border:2px solid #fff!important;border-radius:999px!important;
  background:#d92d20!important;color:#fff!important;font-size:9px!important;
  line-height:1!important;font-weight:900!important;box-sizing:border-box!important;
  box-shadow:0 2px 6px rgba(0,0,0,.18)!important;
}
.hl-global-badge[hidden],.hl-global-badge.hl-chat-hidden{display:none!important}
.hl-global-cart{position:relative!important;min-width:64px!important;padding:0 11px!important;gap:5px!important}
.hl-global-cart-count{min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#0b74b8;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:900}
#globalHeaderNotifications:hover,#globalHeaderMessages:hover{color:#0b74b8!important;background:#eef8ff!important}

@media(max-width:768px){
  .hl-global-dropdown{
    flex-wrap:nowrap!important;
    gap:5px!important;
    padding-left:7px!important;
    padding-right:7px!important;
  }
  .hl-global-control{padding-left:8px!important;padding-right:8px!important;min-width:0!important}
  select.hl-global-control{width:66px!important;min-width:66px!important;padding-right:18px!important}
  .hl-global-account{max-width:82px!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .hl-global-icon-control{width:40px!important;min-width:40px!important;flex-basis:40px!important;padding:0!important}
  .hl-global-cart{width:62px!important;min-width:62px!important;padding:0 7px!important}
  .hl-global-logout{width:40px!important;min-width:40px!important;padding:0!important}
}
@media(max-width:390px){
  .hl-global-dropdown{gap:4px!important;padding-left:5px!important;padding-right:5px!important}
  select.hl-global-control{width:58px!important;min-width:58px!important}
  .hl-global-account{max-width:68px!important}
  .hl-global-icon-control{width:37px!important;min-width:37px!important;flex-basis:37px!important}
  .hl-global-cart{width:58px!important;min-width:58px!important}
  .hl-global-logout{width:37px!important;min-width:37px!important}
}

/* ===== HealthyLife v5 — permanent quick controls (no pull-down) ===== */
.hl-global-dropdown.hl-global-static-toolbar{
  --hl-global-y:0px!important;
  top:12px!important;
  right:14px!important;
  left:auto!important;
  width:auto!important;
  max-width:calc(100vw - 28px)!important;
  transform:none!important;
  border:1px solid rgba(15,54,104,.12)!important;
  border-radius:18px!important;
  padding:8px!important;
  flex-wrap:nowrap!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 10px 30px rgba(15,54,104,.14)!important;
  touch-action:auto!important;
  will-change:auto!important;
}
.hl-global-static-toolbar .hl-global-pull-handle{display:none!important}

@media(max-width:768px){
  .hl-global-dropdown.hl-global-static-toolbar{
    /* This is the former single-cart control zone, now used by all quick controls. */
    top:108px!important;
    left:12px!important;
    right:12px!important;
    width:calc(100vw - 24px)!important;
    max-width:none!important;
    justify-content:flex-end!important;
    gap:5px!important;
    padding:6px!important;
    border-radius:16px!important;
    overflow:visible!important;
  }
  .hl-global-static-toolbar .hl-global-control{
    height:40px!important;
    min-height:40px!important;
    border-radius:12px!important;
    box-shadow:none!important;
  }
  .hl-global-static-toolbar select.hl-global-control{
    width:58px!important;
    min-width:58px!important;
    padding-left:7px!important;
    padding-right:16px!important;
  }
  .hl-global-static-toolbar .hl-global-account{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    padding:0 7px!important;
    overflow:hidden!important;
  }
  .hl-global-static-toolbar .hl-global-account [data-hl-label]{
    max-width:25px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .hl-global-static-toolbar .hl-global-icon-control,
  .hl-global-static-toolbar .hl-global-logout{
    width:40px!important;
    min-width:40px!important;
    flex:0 0 40px!important;
    padding:0!important;
  }
  .hl-global-static-toolbar .hl-global-cart{
    width:55px!important;
    min-width:55px!important;
    flex:0 0 55px!important;
    padding:0 6px!important;
  }
}

@media(max-width:380px){
  .hl-global-dropdown.hl-global-static-toolbar{left:6px!important;right:6px!important;width:calc(100vw - 12px)!important;gap:3px!important;padding:5px!important}
  .hl-global-static-toolbar select.hl-global-control{width:52px!important;min-width:52px!important}
  .hl-global-static-toolbar .hl-global-account{width:52px!important;min-width:52px!important;max-width:52px!important}
  .hl-global-static-toolbar .hl-global-icon-control,.hl-global-static-toolbar .hl-global-logout{width:36px!important;min-width:36px!important;flex-basis:36px!important}
  .hl-global-static-toolbar .hl-global-cart{width:50px!important;min-width:50px!important;flex-basis:50px!important}
}

/* ===== HealthyLife v6 — permanent header utility row, never overlays content ===== */
.header.hl-has-global-controls,
.hl-shop-header.hl-has-global-controls{
  overflow:visible!important;
}

.hl-global-dropdown.hl-global-flow-toolbar{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  z-index:2!important;
  width:min(1180px,calc(100% - 32px))!important;
  max-width:1180px!important;
  margin:4px auto 10px!important;
  padding:7px 8px!important;
  transform:none!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
  border:1px solid rgba(15,54,104,.10)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 5px 18px rgba(15,54,104,.07)!important;
  -webkit-backdrop-filter:blur(12px) saturate(140%);
  backdrop-filter:blur(12px) saturate(140%);
  touch-action:auto!important;
  will-change:auto!important;
}

.hl-global-flow-toolbar .hl-global-control{
  min-height:38px!important;
  height:38px!important;
  box-shadow:none!important;
  border-radius:11px!important;
}

/* The new global cart is the only header cart. */
.header.hl-has-global-controls .nav .cart-button,
.header.hl-has-global-controls .nav-links .cart-button,
.hl-shop-header.hl-has-global-controls .hl-shop-top .hl-cart-link,
.hl-shop-header.hl-has-global-controls > .hl-cart-link{
  display:none!important;
}

@media(max-width:768px){
  .hl-global-dropdown.hl-global-flow-toolbar{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(100% - 20px)!important;
    max-width:none!important;
    margin:4px 10px 9px!important;
    padding:6px!important;
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:5px!important;
    border-radius:14px!important;
    overflow:visible!important;
  }
  .hl-global-flow-toolbar .hl-global-control,
  .hl-global-flow-toolbar select.hl-global-control,
  .hl-global-flow-toolbar .hl-global-account,
  .hl-global-flow-toolbar .hl-global-icon-control,
  .hl-global-flow-toolbar .hl-global-cart,
  .hl-global-flow-toolbar .hl-global-logout{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:none!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 5px!important;
    border-radius:10px!important;
  }
  .hl-global-flow-toolbar select.hl-global-control{
    padding-left:4px!important;
    padding-right:4px!important;
    text-align:center!important;
  }
  .hl-global-flow-toolbar .hl-global-account{
    gap:3px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .hl-global-flow-toolbar .hl-global-account [data-hl-label]{
    display:none!important;
  }
  .hl-global-flow-toolbar .hl-global-icon-svg{width:20px!important;height:20px!important}
  .hl-global-flow-toolbar .hl-global-cart-count{position:absolute!important;right:2px!important;top:1px!important;min-width:16px!important;height:16px!important;font-size:9px!important}
  .hl-global-flow-toolbar .hl-global-cart{position:relative!important;justify-content:center!important}
  .hl-global-flow-toolbar .hl-global-badge{right:0!important;top:-3px!important}
}

@media(max-width:360px){
  .hl-global-dropdown.hl-global-flow-toolbar{width:calc(100% - 12px)!important;margin-left:6px!important;margin-right:6px!important;gap:3px!important;padding:4px!important}
  .hl-global-flow-toolbar .hl-global-control,
  .hl-global-flow-toolbar select.hl-global-control,
  .hl-global-flow-toolbar .hl-global-account,
  .hl-global-flow-toolbar .hl-global-icon-control,
  .hl-global-flow-toolbar .hl-global-cart,
  .hl-global-flow-toolbar .hl-global-logout{height:36px!important;min-height:36px!important;padding:0 3px!important}
}


/* ===== HealthyLife v8 — Login/Register toolbar: actually visible above auth overlay ===== */
body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active{
  position:fixed!important;
  top:max(12px,env(safe-area-inset-top))!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  max-width:calc(100vw - 32px)!important;
  margin:0!important;
  padding:7px 8px!important;
  z-index:2147482500!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:6px!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.98)!important;
  border:1px solid rgba(15,54,104,.12)!important;
  box-shadow:0 14px 38px rgba(15,54,104,.20)!important;
  backdrop-filter:blur(16px) saturate(140%)!important;
  -webkit-backdrop-filter:blur(16px) saturate(140%)!important;
}
body.hl-auth-login-open .auth-overlay.show{
  padding-top:max(92px,calc(env(safe-area-inset-top) + 82px))!important;
}
body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active .hl-global-pull-handle{
  display:none!important;
}
@media(max-width:768px){
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active{
    top:max(7px,env(safe-area-inset-top))!important;
    width:calc(100vw - 14px)!important;
    max-width:none!important;
    padding:5px!important;
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:4px!important;
    border-radius:13px!important;
  }
  body.hl-auth-login-open .auth-overlay.show{
    padding-top:max(78px,calc(env(safe-area-inset-top) + 70px))!important;
  }
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active .hl-global-control,
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active select.hl-global-control,
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active .hl-global-account,
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active .hl-global-icon-control,
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active .hl-global-cart,
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active .hl-global-logout{
    min-width:0!important;
    width:100%!important;
    height:40px!important;
    padding:0 4px!important;
  }
}


/* ===== HealthyLife v9 — compact shrink-wrap utility toolbar ===== */
.hl-global-dropdown.hl-global-flow-toolbar{
  width:max-content!important;
  min-width:0!important;
  max-width:calc(100% - 32px)!important;
  margin:4px 16px 10px auto!important;
  padding:6px!important;
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:5px!important;
  overflow:visible!important;
  border-radius:14px!important;
}

.hl-global-flow-toolbar .hl-global-control{
  flex:0 0 auto!important;
}

@media(max-width:768px){
  .hl-global-dropdown.hl-global-flow-toolbar{
    width:max-content!important;
    min-width:0!important;
    max-width:calc(100% - 16px)!important;
    margin:4px auto 9px!important;
    padding:5px!important;
    display:flex!important;
    grid-template-columns:none!important;
    justify-content:center!important;
    gap:4px!important;
    overflow:visible!important;
  }

  .hl-global-flow-toolbar .hl-global-control,
  .hl-global-flow-toolbar select.hl-global-control,
  .hl-global-flow-toolbar .hl-global-account,
  .hl-global-flow-toolbar .hl-global-icon-control,
  .hl-global-flow-toolbar .hl-global-cart,
  .hl-global-flow-toolbar .hl-global-logout{
    width:auto!important;
    max-width:none!important;
    flex:0 0 auto!important;
    height:38px!important;
    min-height:38px!important;
  }

  .hl-global-flow-toolbar select.hl-global-control{
    width:52px!important;
    min-width:52px!important;
    padding:0 5px!important;
  }
  .hl-global-flow-toolbar .hl-global-account{
    width:52px!important;
    min-width:52px!important;
    max-width:52px!important;
    padding:0 5px!important;
  }
  .hl-global-flow-toolbar .hl-global-icon-control,
  .hl-global-flow-toolbar .hl-global-logout{
    width:38px!important;
    min-width:38px!important;
    flex-basis:38px!important;
    padding:0!important;
  }
  .hl-global-flow-toolbar .hl-global-cart{
    width:50px!important;
    min-width:50px!important;
    flex-basis:50px!important;
    padding:0 5px!important;
  }
}

@media(max-width:360px){
  .hl-global-dropdown.hl-global-flow-toolbar{
    max-width:calc(100% - 8px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    gap:3px!important;
    padding:4px!important;
  }
  .hl-global-flow-toolbar select.hl-global-control,
  .hl-global-flow-toolbar .hl-global-account{
    width:47px!important;
    min-width:47px!important;
    max-width:47px!important;
  }
  .hl-global-flow-toolbar .hl-global-icon-control,
  .hl-global-flow-toolbar .hl-global-logout{
    width:35px!important;
    min-width:35px!important;
    flex-basis:35px!important;
  }
  .hl-global-flow-toolbar .hl-global-cart{
    width:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
  }
}


/* ===== HealthyLife v11 — center compact utility toolbar everywhere ===== */
.hl-global-dropdown.hl-global-flow-toolbar{
  position:relative!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  inset:auto!important;
  width:max-content!important;
  min-width:0!important;
  max-width:calc(100% - 24px)!important;
  margin:4px auto 10px!important;
  transform:none!important;
  align-self:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
}

.header.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar,
.hl-shop-header.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar{
  margin-left:auto!important;
  margin-right:auto!important;
}

@media(min-width:769px){
  .hl-global-dropdown.hl-global-flow-toolbar{
    width:max-content!important;
    max-width:calc(100vw - 32px)!important;
    margin:4px auto 10px!important;
  }
  .hl-global-flow-toolbar select.hl-global-control{
    max-width:132px!important;
  }
  .hl-global-flow-toolbar .hl-global-account{
    max-width:170px!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
  }
}

@media(max-width:768px){
  .hl-global-dropdown.hl-global-flow-toolbar{
    width:max-content!important;
    max-width:calc(100vw - 14px)!important;
    margin:4px auto 9px!important;
    justify-content:center!important;
  }
}

/* Login/Register keeps the same center line while floating above the auth modal. */
body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active{
  left:50%!important;
  right:auto!important;
  margin-left:0!important;
  margin-right:0!important;
  transform:translateX(-50%)!important;
}


/* ===== HealthyLife v12 — centered utility toolbar on Terms / Privacy ===== */
.terms-topbar.hl-has-global-controls{
  width:100%!important;
  max-width:1000px!important;
  margin:0 auto 18px!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
}
.terms-topbar.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar{
  width:max-content!important;
  max-width:calc(100vw - 24px)!important;
  margin:0 auto!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
}
@media(max-width:700px){
  .terms-topbar.hl-has-global-controls{
    margin-bottom:12px!important;
  }
  .terms-topbar.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar{
    max-width:calc(100vw - 16px)!important;
  }
}

/* ===== HealthyLife final scope — desktop right everywhere, legal pages centered ===== */
@media (min-width: 769px) {
  /* Default desktop position on every normal page. */
  .hl-global-dropdown.hl-global-flow-toolbar {
    width: max-content !important;
    max-width: calc(100vw - 108px) !important;
    margin: 4px 84px 10px auto !important;
    align-self: flex-end !important;
    justify-content: flex-start !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }

  .header.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar,
  .hl-shop-header.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar {
    margin-left: auto !important;
    margin-right: 84px !important;
  }

  /* Login/Register follows the normal desktop right alignment. */
  body.hl-auth-login-open > .hl-global-dropdown.hl-auth-toolbar-active {
    left: auto !important;
    right: 84px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  /* ONLY Terms + Privacy keep the utility toolbar centered. */
  .terms-topbar.hl-has-global-controls,
  .privacy-topbar.hl-has-global-controls {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto 18px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
  }

  .terms-topbar.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar,
  .privacy-topbar.hl-has-global-controls > .hl-global-dropdown.hl-global-flow-toolbar {
    width: max-content !important;
    max-width: calc(100vw - 32px) !important;
    margin: 0 auto !important;
    align-self: center !important;
    justify-content: center !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
  }
}

/* v19 — mobile safety net: a toolbar must never sit in document flow below the footer. */
@media (max-width: 768px) {
  body > .hl-global-dropdown.hl-global-flow-toolbar:not(.hl-auth-toolbar-active) {
    position: fixed !important;
    top: max(8px, env(safe-area-inset-top)) !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: max-content !important;
    max-width: calc(100vw - 14px) !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    z-index: 100020 !important;
  }
}

/* =========================================================
   HealthyLife — hide Suppliers from customer-facing UI only
   Keeps supplier routes/data/backend untouched.
   ========================================================= */

/* Public navigation links */
a[href="/suppliers/"],
a[href="/suppliers"],
.nav-links a[data-i18n="suppliers"],
.hl-shop-nav a[data-detail-i18n="suppliers"],
.hl-shop-nav a[data-cart-i18n="suppliers"] {
    display: none !important;
}

/* Supplier-only customer filter block */
.filter-group:has(> h4[data-i18n="supplier"]),
.hl-filter-section:has([data-i18n="supplier"]),
.hl-filter-section:has([data-i18n="verifiedSuppliers"]) {
    display: none !important;
}

/* Any legacy customer supplier shortcuts */
[data-i18n="forSuppliers"],
[data-i18n="becomeSupplier"],
[data-i18n="supplierDashboard"] {
    display: none !important;
}

/* =========================================================
   HealthyLife v20 — SAFE compact sticky header
   IMPORTANT: layout-only. The working toolbar JS stays unchanged.
   Desktop: Logo | Search | utility controls.
   Mobile: Logo -> utility controls -> Search.
   ========================================================= */
body.hl-page-home .header,
body.hl-page-catalog .header,
body.hl-page-legacy .header{
  position:sticky!important;
  top:0!important;
  z-index:5000!important;
  width:100%!important;
  box-sizing:border-box!important;
  background:rgba(255,255,255,.975)!important;
  border-bottom:1px solid rgba(216,229,239,.9)!important;
  box-shadow:0 8px 28px rgba(16,42,67,.055)!important;
  -webkit-backdrop-filter:blur(16px) saturate(145%)!important;
  backdrop-filter:blur(16px) saturate(145%)!important;
  transform:none!important;
  opacity:1!important;
  visibility:visible!important;
  overflow:visible!important;
}

/* Customer-facing text navigation is intentionally omitted from the compact header. */
body.hl-page-home .header .nav-links,
body.hl-page-catalog .header .nav-links,
body.hl-page-legacy .header .nav-links{
  display:none!important;
}

@media (min-width:769px){
  body.hl-page-home .header,
  body.hl-page-catalog .header,
  body.hl-page-legacy .header{
    display:grid!important;
    grid-template-columns:auto minmax(320px,680px) auto!important;
    align-items:center!important;
    justify-content:center!important;
    column-gap:16px!important;
    min-height:66px!important;
    padding:8px max(18px,calc((100vw - 1320px)/2))!important;
  }

  /* Do not move the toolbar in JS. display:contents lets the already-working
     nav children participate in the header grid safely. */
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav{
    display:contents!important;
  }

  body.hl-page-home .header .logo,
  body.hl-page-catalog .header .logo,
  body.hl-page-legacy .header .logo{
    grid-column:1!important;
    grid-row:1!important;
    margin:0!important;
    padding:0!important;
    min-width:0!important;
    align-self:center!important;
  }

  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img{
    width:132px!important;
    max-width:132px!important;
    max-height:46px!important;
    object-fit:contain!important;
  }

  body.hl-page-home .header .hl-header-search,
  body.hl-page-catalog .header .hl-header-search,
  body.hl-page-legacy .header .hl-header-search{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    max-width:680px!important;
    min-width:0!important;
    height:42px!important;
    margin:0!important;
    padding:3px 4px 3px 12px!important;
    border-radius:14px!important;
    background:#f8fbfd!important;
    border:1px solid #dbe7ef!important;
    box-shadow:none!important;
    align-self:center!important;
  }

  body.hl-page-home .header .hl-header-search:focus-within,
  body.hl-page-catalog .header .hl-header-search:focus-within,
  body.hl-page-legacy .header .hl-header-search:focus-within{
    background:#fff!important;
    border-color:#8bbfe4!important;
    box-shadow:0 0 0 3px rgba(11,105,180,.075)!important;
  }

  body.hl-page-home .header .hl-header-search input,
  body.hl-page-catalog .header .hl-header-search input,
  body.hl-page-legacy .header .hl-header-search input{
    height:34px!important;
    font-size:14px!important;
  }

  body.hl-page-home .header .hl-header-search button,
  body.hl-page-catalog .header .hl-header-search button,
  body.hl-page-legacy .header .hl-header-search button{
    height:34px!important;
    min-width:78px!important;
    padding:0 12px!important;
    border-radius:10px!important;
  }

  body.hl-page-home .header > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-column:3!important;
    grid-row:1!important;
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    width:max-content!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    padding:5px!important;
    align-self:center!important;
    justify-self:end!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    gap:5px!important;
    transform:none!important;
    border-radius:14px!important;
    border:1px solid rgba(15,54,104,.10)!important;
    background:#fff!important;
    box-shadow:0 4px 14px rgba(15,54,104,.055)!important;
  }

  body.hl-page-home .header > .hl-global-dropdown .hl-global-control,
  body.hl-page-catalog .header > .hl-global-dropdown .hl-global-control,
  body.hl-page-legacy .header > .hl-global-dropdown .hl-global-control{
    min-height:36px!important;
    height:36px!important;
    border-radius:10px!important;
    box-shadow:none!important;
  }
}

@media (max-width:768px){
  body.hl-page-home .header,
  body.hl-page-catalog .header,
  body.hl-page-legacy .header{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    padding:calc(7px + env(safe-area-inset-top)) 10px 9px!important;
  }

  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav{
    display:contents!important;
  }

  /* 1) logo */
  body.hl-page-home .header .logo,
  body.hl-page-catalog .header .logo,
  body.hl-page-legacy .header .logo{
    order:1!important;
    width:100%!important;
    margin:0!important;
    padding:0 7px 5px!important;
    display:flex!important;
    justify-content:flex-start!important;
    align-items:center!important;
    box-sizing:border-box!important;
  }

  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img{
    width:124px!important;
    max-width:124px!important;
    max-height:45px!important;
    object-fit:contain!important;
  }

  /* 2) utility controls */
  body.hl-page-home .header > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header > .hl-global-dropdown.hl-global-flow-toolbar{
    order:2!important;
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    width:max-content!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0 auto 7px!important;
    padding:5px!important;
    transform:none!important;
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    gap:4px!important;
    border-radius:14px!important;
    overflow:visible!important;
  }

  /* 3) search */
  body.hl-page-home .header .hl-header-search,
  body.hl-page-catalog .header .hl-header-search,
  body.hl-page-legacy .header .hl-header-search{
    order:3!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:44px!important;
    margin:0!important;
    padding:3px 4px 3px 11px!important;
    border-radius:14px!important;
    background:#fff!important;
    border:1px solid #dbe7ef!important;
    box-shadow:0 5px 16px rgba(16,42,67,.05)!important;
    box-sizing:border-box!important;
  }

  body.hl-page-home .header .hl-header-search input,
  body.hl-page-catalog .header .hl-header-search input,
  body.hl-page-legacy .header .hl-header-search input{
    height:34px!important;
    font-size:16px!important;
  }

  body.hl-page-home .header .hl-header-search button,
  body.hl-page-catalog .header .hl-header-search button,
  body.hl-page-legacy .header .hl-header-search button{
    height:34px!important;
    min-width:74px!important;
    padding:0 10px!important;
    border-radius:10px!important;
    font-size:12px!important;
  }
}

@media (max-width:390px){
  body.hl-page-home .header,
  body.hl-page-catalog .header,
  body.hl-page-legacy .header{
    padding-left:7px!important;
    padding-right:7px!important;
  }
  body.hl-page-home .header .logo,
  body.hl-page-catalog .header .logo,
  body.hl-page-legacy .header .logo{
    padding-left:5px!important;
    padding-right:5px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img{
    width:116px!important;
    max-width:116px!important;
  }
}

/* =========================================================
   HealthyLife v21 — fixed storefront header, real toolbar DOM
   The toolbar is appended by global-header-dropdown.js to .nav,
   so every selector below targets .nav > .hl-global-dropdown.
   ========================================================= */
body.hl-page-home,
body.hl-page-catalog,
body.hl-page-legacy{
  --hl-fixed-storefront-header:76px;
}
body.hl-page-home .header,
body.hl-page-catalog .header,
body.hl-page-legacy .header{
  position:fixed!important;
  inset:0 0 auto 0!important;
  top:0!important;
  z-index:2147481200!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  background:rgba(255,255,255,.975)!important;
  border-bottom:1px solid rgba(214,228,239,.92)!important;
  box-shadow:0 10px 32px rgba(16,42,67,.075)!important;
  -webkit-backdrop-filter:blur(18px) saturate(145%)!important;
  backdrop-filter:blur(18px) saturate(145%)!important;
  transform:none!important;
  opacity:1!important;
  visibility:visible!important;
}
body.hl-page-home > main,
body.hl-page-catalog > main,
body.hl-page-legacy > main{
  padding-top:var(--hl-fixed-storefront-header)!important;
}
body.hl-page-home .header > .nav,
body.hl-page-catalog .header > .nav,
body.hl-page-legacy .header > .nav{
  width:min(1440px,100%)!important;
  min-height:76px!important;
  margin:0 auto!important;
  padding:9px 18px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:136px minmax(260px,1fr) auto 42px!important;
  grid-template-areas:"logo search tools back"!important;
  align-items:center!important;
  gap:10px!important;
  overflow:visible!important;
}
body.hl-page-home .header .logo,
body.hl-page-catalog .header .logo,
body.hl-page-legacy .header .logo{
  grid-area:logo!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
}
body.hl-page-home .header .logo img,
body.hl-page-catalog .header .logo img,
body.hl-page-legacy .header .logo img{
  display:block!important;
  width:126px!important;
  max-width:126px!important;
  max-height:48px!important;
  object-fit:contain!important;
}
body.hl-page-home .header .hl-header-search,
body.hl-page-catalog .header .hl-header-search,
body.hl-page-legacy .header .hl-header-search{
  grid-area:search!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:44px!important;
  margin:0!important;
  padding:3px 4px 3px 12px!important;
  box-sizing:border-box!important;
  border:1px solid #d8e5ee!important;
  border-radius:14px!important;
  background:#f8fbfd!important;
  box-shadow:none!important;
}
body.hl-page-home .header .hl-header-search:focus-within,
body.hl-page-catalog .header .hl-header-search:focus-within,
body.hl-page-legacy .header .hl-header-search:focus-within{
  border-color:#80bde4!important;
  background:#fff!important;
  box-shadow:0 0 0 3px rgba(11,105,180,.075)!important;
}
body.hl-page-home .header .nav-links,
body.hl-page-catalog .header .nav-links,
body.hl-page-legacy .header .nav-links{
  display:none!important;
}
body.hl-page-home .header .nav > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-page-catalog .header .nav > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-page-legacy .header .nav > .hl-global-dropdown.hl-global-flow-toolbar{
  grid-area:tools!important;
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  width:max-content!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  margin:0!important;
  padding:4px!important;
  transform:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  gap:4px!important;
  overflow:visible!important;
  border:1px solid rgba(15,54,104,.09)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 5px 16px rgba(15,54,104,.055)!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  touch-action:auto!important;
}
body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-control,
body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-control,
body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-control{
  min-height:36px!important;
  height:36px!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
.hl-header-back{
  grid-area:back;
  width:40px;
  height:40px;
  min-width:40px;
  display:inline-grid;
  place-items:center;
  margin:0;
  padding:0;
  border:1px solid rgba(11,105,180,.18);
  border-radius:12px;
  background:#fff;
  color:#0b69b4;
  box-shadow:0 5px 16px rgba(16,42,67,.06);
  font:900 25px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.hl-header-back:hover{background:#eef8ff;border-color:rgba(11,105,180,.32)}
.hl-header-back:active{transform:translateX(-1px)}
.hl-header-back[hidden]{display:none!important}

@media(max-width:900px){
  body.hl-page-home,
  body.hl-page-catalog,
  body.hl-page-legacy{--hl-fixed-storefront-header:128px}
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav{
    min-height:128px!important;
    padding:calc(7px + env(safe-area-inset-top)) 10px 8px!important;
    grid-template-columns:100px minmax(0,1fr) 40px!important;
    grid-template-rows:44px 44px!important;
    grid-template-areas:
      "logo tools back"
      "search search search"!important;
    gap:6px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img{
    width:94px!important;
    max-width:94px!important;
    max-height:40px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header .nav > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header .nav > .hl-global-dropdown.hl-global-flow-toolbar{
    width:max-content!important;
    max-width:100%!important;
    justify-self:end!important;
    padding:3px!important;
    gap:3px!important;
    border-radius:12px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-control,
  body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-control,
  body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-control{
    min-height:36px!important;
    height:36px!important;
  }
  body.hl-page-home .header .hl-header-search,
  body.hl-page-catalog .header .hl-header-search,
  body.hl-page-legacy .header .hl-header-search{
    height:42px!important;
    min-height:42px!important;
    padding:3px 4px 3px 10px!important;
    border-radius:13px!important;
  }
  body.hl-page-home .header .hl-header-search input,
  body.hl-page-catalog .header .hl-header-search input,
  body.hl-page-legacy .header .hl-header-search input{
    height:34px!important;
    font-size:16px!important;
  }
  body.hl-page-home .header .hl-header-search button,
  body.hl-page-catalog .header .hl-header-search button,
  body.hl-page-legacy .header .hl-header-search button{
    height:34px!important;
    min-width:70px!important;
    padding:0 9px!important;
    border-radius:10px!important;
  }
  .hl-header-back{width:38px;height:38px;min-width:38px;border-radius:11px;font-size:23px}
}

@media(max-width:480px){
  body.hl-page-home,
  body.hl-page-catalog,
  body.hl-page-legacy{--hl-fixed-storefront-header:166px}
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav{
    min-height:166px!important;
    grid-template-columns:minmax(0,1fr) 40px!important;
    grid-template-rows:40px 38px 42px!important;
    grid-template-areas:
      "logo back"
      "tools tools"
      "search search"!important;
    row-gap:6px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img{
    width:92px!important;
    max-width:92px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header .nav > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header .nav > .hl-global-dropdown.hl-global-flow-toolbar{
    justify-self:center!important;
    width:max-content!important;
    max-width:calc(100vw - 20px)!important;
    height:38px!important;
    padding:2px 3px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-control,
  body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-control,
  body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-control{
    min-height:32px!important;
    height:32px!important;
    padding-left:5px!important;
    padding-right:5px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown select.hl-global-control,
  body.hl-page-catalog .header .nav > .hl-global-dropdown select.hl-global-control,
  body.hl-page-legacy .header .nav > .hl-global-dropdown select.hl-global-control{
    width:50px!important;
    min-width:50px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-account,
  body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-account,
  body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-account{
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-icon-control,
  body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-icon-control,
  body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-icon-control,
  body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-logout,
  body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-logout,
  body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-logout{
    width:34px!important;
    min-width:34px!important;
    flex-basis:34px!important;
  }
  body.hl-page-home .header .nav > .hl-global-dropdown .hl-global-cart,
  body.hl-page-catalog .header .nav > .hl-global-dropdown .hl-global-cart,
  body.hl-page-legacy .header .nav > .hl-global-dropdown .hl-global-cart{
    width:45px!important;
    min-width:45px!important;
    flex-basis:45px!important;
  }
}

/* =========================================================
   HealthyLife V52 — canonical fixed storefront header
   One final layout wins over all legacy header experiments.
   Desktop: Logo | Search | utility controls | Back
   Mobile:  Logo + Back / utility controls / Search
   ========================================================= */
:root{--hl-storefront-header-h:84px;--hl-storefront-header-h-mobile:154px}

body.hl-page-home .header,
body.hl-page-catalog .header,
body.hl-page-legacy .header,
body.hl-detail-body .hl-shop-header,
body.hl-cart-body .hl-shop-header{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  z-index:100030!important;
  margin:0!important;
  transform:none!important;
  opacity:1!important;
  visibility:visible!important;
  overflow:visible!important;
  background:rgba(255,255,255,.985)!important;
  border-bottom:1px solid rgba(214,228,239,.94)!important;
  box-shadow:0 8px 28px rgba(16,42,67,.075)!important;
  -webkit-backdrop-filter:blur(16px) saturate(145%)!important;
  backdrop-filter:blur(16px) saturate(145%)!important;
}

body.hl-page-home > main,
body.hl-page-catalog > main,
body.hl-page-legacy > main,
body.hl-detail-body > main,
body.hl-cart-body > main{
  padding-top:var(--hl-storefront-header-h)!important;
}

body.hl-page-home .header > .nav,
body.hl-page-catalog .header > .nav,
body.hl-page-legacy .header > .nav,
body.hl-detail-body .hl-shop-header > .hl-shop-top,
body.hl-cart-body .hl-shop-header > .hl-shop-top{
  width:calc(100% - 40px)!important;
  max-width:1480px!important;
  min-height:84px!important;
  margin:0 auto!important;
  padding:10px 0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:174px minmax(300px,560px) auto 44px!important;
  grid-template-areas:"logo search tools back"!important;
  justify-content:center!important;
  align-items:center!important;
  column-gap:14px!important;
  overflow:visible!important;
}

body.hl-page-home .header .logo,
body.hl-page-catalog .header .logo,
body.hl-page-legacy .header .logo,
body.hl-detail-body .hl-shop-logo,
body.hl-cart-body .hl-shop-logo{
  grid-area:logo!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
}
body.hl-page-home .header .logo img,
body.hl-page-catalog .header .logo img,
body.hl-page-legacy .header .logo img,
body.hl-detail-body .hl-shop-logo img,
body.hl-cart-body .hl-shop-logo img{
  display:block!important;
  width:166px!important;
  max-width:166px!important;
  height:auto!important;
  max-height:58px!important;
  object-fit:contain!important;
}

body.hl-page-home .header .hl-header-search,
body.hl-page-catalog .header .hl-header-search,
body.hl-page-legacy .header .hl-header-search,
body.hl-detail-body .hl-shop-search,
body.hl-cart-body .hl-shop-search{
  grid-area:search!important;
  display:flex!important;
  width:100%!important;
  max-width:560px!important;
  min-width:0!important;
  height:46px!important;
  margin:0!important;
  padding:4px 5px 4px 12px!important;
  box-sizing:border-box!important;
  align-items:center!important;
  gap:8px!important;
  border:1px solid #d7e4ed!important;
  border-radius:15px!important;
  background:#f8fbfd!important;
  box-shadow:0 5px 16px rgba(16,42,67,.04)!important;
  overflow:visible!important;
}
body.hl-detail-body .hl-shop-search input,
body.hl-cart-body .hl-shop-search input{
  min-width:0!important;
  flex:1 1 auto!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.hl-detail-body .hl-shop-search button,
body.hl-cart-body .hl-shop-search button{
  width:42px!important;
  min-width:42px!important;
  height:36px!important;
  padding:0!important;
  border:0!important;
  border-radius:11px!important;
  background:#0b69b4!important;
  color:#fff!important;
}

body.hl-page-home .header .nav-links,
body.hl-page-catalog .header .nav-links,
body.hl-page-legacy .header .nav-links,
body.hl-detail-body .hl-shop-nav,
body.hl-cart-body .hl-shop-nav{
  display:none!important;
}

body.hl-page-home .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-page-catalog .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-page-legacy .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-detail-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-cart-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
  grid-area:tools!important;
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  z-index:2!important;
  width:max-content!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  margin:0!important;
  padding:4px!important;
  transform:none!important;
  align-self:center!important;
  justify-self:end!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  gap:4px!important;
  overflow:visible!important;
  border:1px solid rgba(15,54,104,.09)!important;
  border-radius:14px!important;
  background:#f9fbfd!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  touch-action:auto!important;
}
body.hl-page-home .header .nav.hl-global-controls-host .hl-global-control,
body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-control,
body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-control,
body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-control,
body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-control{
  min-height:38px!important;
  height:38px!important;
  border-radius:11px!important;
  box-shadow:none!important;
}

.hl-header-back,
.hl-shop-back{
  grid-area:back!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  display:inline-grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(11,105,180,.18)!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#0b69b4!important;
  box-shadow:0 4px 14px rgba(16,42,67,.055)!important;
  font:900 25px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  text-decoration:none!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.hl-header-back:hover,.hl-shop-back:hover{background:#eef8ff!important;border-color:rgba(11,105,180,.32)!important}
.hl-header-back[hidden]{display:none!important}

/* Dashboard is a fixed app of its own. It starts BELOW the global header. */
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9{
  inset:var(--hl-storefront-header-h) 0 0 0!important;
  top:var(--hl-storefront-header-h)!important;
  width:100vw!important;
  height:calc(100dvh - var(--hl-storefront-header-h))!important;
  max-height:calc(100dvh - var(--hl-storefront-header-h))!important;
}
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-shell-v9,
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-sidebar-v9,
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-main-v9{
  height:100%!important;
  max-height:100%!important;
}
/* The fixed global header already carries the brand; avoid a second logo colliding below it. */
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dash-brand-v9{
  display:none!important;
}
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-sidebar-v9{
  padding-top:18px!important;
}

@media(max-width:980px){
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    width:calc(100% - 24px)!important;
    grid-template-columns:150px minmax(240px,1fr) auto 42px!important;
    column-gap:9px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:145px!important;
    max-width:145px!important;
  }
}

@media(max-width:760px){
  :root{--hl-storefront-header-h:154px}
  body.hl-page-home > main,
  body.hl-page-catalog > main,
  body.hl-page-legacy > main,
  body.hl-detail-body > main,
  body.hl-cart-body > main{
    padding-top:var(--hl-storefront-header-h)!important;
  }
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    width:100%!important;
    max-width:none!important;
    min-height:154px!important;
    padding:calc(7px + env(safe-area-inset-top)) 12px 8px!important;
    grid-template-columns:minmax(0,1fr) 42px!important;
    grid-template-rows:44px 40px 44px!important;
    grid-template-areas:
      "logo back"
      "tools tools"
      "search search"!important;
    justify-content:stretch!important;
    row-gap:6px!important;
    column-gap:8px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:122px!important;
    max-width:122px!important;
    max-height:44px!important;
  }
  body.hl-page-home .header .hl-header-search,
  body.hl-page-catalog .header .hl-header-search,
  body.hl-page-legacy .header .hl-header-search,
  body.hl-detail-body .hl-shop-search,
  body.hl-cart-body .hl-shop-search{
    width:100%!important;
    max-width:none!important;
    height:44px!important;
    min-height:44px!important;
    margin:0!important;
    padding:3px 4px 3px 11px!important;
    border-radius:13px!important;
  }
  body.hl-page-home .header .hl-header-search input,
  body.hl-page-catalog .header .hl-header-search input,
  body.hl-page-legacy .header .hl-header-search input,
  body.hl-detail-body .hl-shop-search input,
  body.hl-cart-body .hl-shop-search input{
    height:34px!important;
    font-size:16px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    justify-self:center!important;
    align-self:center!important;
    width:max-content!important;
    max-width:calc(100vw - 24px)!important;
    height:40px!important;
    margin:0!important;
    padding:2px 4px!important;
    gap:3px!important;
    border-radius:12px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-control{
    min-height:34px!important;
    height:34px!important;
    padding-left:5px!important;
    padding-right:5px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host select.hl-global-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:52px!important;
    min-width:52px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-account,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-account{
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-logout,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:34px!important;
    min-width:34px!important;
    flex-basis:34px!important;
    padding:0!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-cart,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:46px!important;
    min-width:46px!important;
    flex-basis:46px!important;
  }
  .hl-header-back,.hl-shop-back{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    justify-self:end!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9{
    inset:var(--hl-storefront-header-h) 0 0 0!important;
    top:var(--hl-storefront-header-h)!important;
    height:calc(100dvh - var(--hl-storefront-header-h))!important;
    max-height:calc(100dvh - var(--hl-storefront-header-h))!important;
  }
}

@media(max-width:390px){
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    padding-left:8px!important;
    padding-right:8px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:114px!important;
    max-width:114px!important;
  }
}

/* === HealthyLife v53: Home header uses the same compact search layout, without Back === */
@media (min-width: 761px){
  body.hl-page-home .header > .nav{
    grid-template-columns:174px minmax(300px,560px) auto!important;
    grid-template-areas:"logo search tools"!important;
  }
}

@media (min-width: 761px) and (max-width: 980px){
  body.hl-page-home .header > .nav{
    grid-template-columns:150px minmax(240px,1fr) auto!important;
  }
}

@media (max-width: 760px){
  body.hl-page-home .header > .nav{
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:44px 40px 44px!important;
    grid-template-areas:
      "logo"
      "tools"
      "search"!important;
  }
  body.hl-page-home .header .logo{
    justify-self:start!important;
  }
  body.hl-page-home .hl-header-back{
    display:none!important;
  }
}

/* =========================================================
   HealthyLife V54 — single canonical header layout
   Desktop: Logo | controls | Search | Back
   Mobile:  Logo + controls / Search + Back
   This block intentionally wins over all older header experiments.
   ========================================================= */
:root{
  --hl-storefront-header-h:76px;
  --hl-storefront-header-h-mobile:110px;
}

body.hl-page-home .header,
body.hl-page-catalog .header,
body.hl-page-legacy .header,
body.hl-detail-body .hl-shop-header,
body.hl-cart-body .hl-shop-header{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  min-height:var(--hl-storefront-header-h)!important;
  z-index:100030!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  transform:none!important;
  opacity:1!important;
  visibility:visible!important;
  background:rgba(255,255,255,.985)!important;
  border-bottom:1px solid rgba(214,228,239,.94)!important;
  box-shadow:0 7px 24px rgba(16,42,67,.07)!important;
  -webkit-backdrop-filter:blur(15px) saturate(145%)!important;
  backdrop-filter:blur(15px) saturate(145%)!important;
}

body.hl-page-home > main,
body.hl-page-catalog > main,
body.hl-page-legacy > main,
body.hl-detail-body > main,
body.hl-cart-body > main{
  padding-top:var(--hl-storefront-header-h)!important;
}

body.hl-page-home .header > .nav,
body.hl-page-catalog .header > .nav,
body.hl-page-legacy .header > .nav,
body.hl-detail-body .hl-shop-header > .hl-shop-top,
body.hl-cart-body .hl-shop-header > .hl-shop-top{
  width:min(1260px,calc(100% - 32px))!important;
  min-height:var(--hl-storefront-header-h)!important;
  margin:0 auto!important;
  padding:8px 0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:180px max-content minmax(300px,520px) 44px!important;
  grid-template-areas:"logo tools search back"!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  overflow:visible!important;
}

body.hl-page-home .header > .nav{
  grid-template-columns:180px max-content minmax(300px,520px)!important;
  grid-template-areas:"logo tools search"!important;
}

body.hl-page-home .header .logo,
body.hl-page-catalog .header .logo,
body.hl-page-legacy .header .logo,
body.hl-detail-body .hl-shop-logo,
body.hl-cart-body .hl-shop-logo{
  grid-area:logo!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  align-self:center!important;
}

body.hl-page-home .header .logo img,
body.hl-page-catalog .header .logo img,
body.hl-page-legacy .header .logo img,
body.hl-detail-body .hl-shop-logo img,
body.hl-cart-body .hl-shop-logo img{
  display:block!important;
  width:170px!important;
  max-width:170px!important;
  height:auto!important;
  max-height:54px!important;
  object-fit:contain!important;
}

body.hl-page-home .header .nav-links,
body.hl-page-catalog .header .nav-links,
body.hl-page-legacy .header .nav-links,
body.hl-detail-body .hl-shop-nav,
body.hl-cart-body .hl-shop-nav{
  display:none!important;
}

body.hl-page-home .header .hl-header-search,
body.hl-page-catalog .header .hl-header-search,
body.hl-page-legacy .header .hl-header-search,
body.hl-detail-body .hl-shop-search,
body.hl-cart-body .hl-shop-search{
  grid-area:search!important;
  width:100%!important;
  max-width:520px!important;
  min-width:0!important;
  height:44px!important;
  min-height:44px!important;
  margin:0!important;
  padding:4px 5px 4px 12px!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  border:1px solid #d7e4ed!important;
  border-radius:14px!important;
  background:#f8fbfd!important;
  box-shadow:0 4px 14px rgba(16,42,67,.035)!important;
  overflow:visible!important;
}

body.hl-page-home .header .hl-header-search:focus-within,
body.hl-page-catalog .header .hl-header-search:focus-within,
body.hl-page-legacy .header .hl-header-search:focus-within,
body.hl-detail-body .hl-shop-search:focus-within,
body.hl-cart-body .hl-shop-search:focus-within{
  border-color:#83bde2!important;
  background:#fff!important;
  box-shadow:0 0 0 3px rgba(11,105,180,.075)!important;
}

body.hl-page-home .header .hl-header-search input,
body.hl-page-catalog .header .hl-header-search input,
body.hl-page-legacy .header .hl-header-search input,
body.hl-detail-body .hl-shop-search input,
body.hl-cart-body .hl-shop-search input{
  flex:1 1 auto!important;
  min-width:0!important;
  height:34px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:14px!important;
}

body.hl-page-home .header .hl-header-search button,
body.hl-page-catalog .header .hl-header-search button,
body.hl-page-legacy .header .hl-header-search button,
body.hl-detail-body .hl-shop-search button,
body.hl-cart-body .hl-shop-search button{
  flex:0 0 auto!important;
  min-width:66px!important;
  height:34px!important;
  margin:0!important;
  padding:0 12px!important;
  border:0!important;
  border-radius:10px!important;
  background:#0b69b4!important;
  color:#fff!important;
  font-weight:800!important;
  box-shadow:none!important;
}

/* The JS mounts the live controls inside the same row as logo/search/back. */
body.hl-page-home .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-page-catalog .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-page-legacy .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-detail-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body.hl-cart-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
  grid-area:tools!important;
  position:relative!important;
  inset:auto!important;
  width:max-content!important;
  min-width:0!important;
  max-width:100%!important;
  height:auto!important;
  margin:0!important;
  padding:4px!important;
  align-self:center!important;
  justify-self:start!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:nowrap!important;
  gap:4px!important;
  transform:none!important;
  overflow:visible!important;
  border:1px solid rgba(15,54,104,.10)!important;
  border-radius:13px!important;
  background:#f9fbfd!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  touch-action:auto!important;
}

body.hl-page-home .header .nav.hl-global-controls-host .hl-global-control,
body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-control,
body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-control,
body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-control,
body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-control{
  min-height:36px!important;
  height:36px!important;
  border-radius:10px!important;
  box-shadow:none!important;
}

.hl-header-back,
.hl-shop-back{
  grid-area:back!important;
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  margin:0!important;
  padding:0!important;
  display:inline-grid!important;
  place-items:center!important;
  align-self:center!important;
  justify-self:start!important;
  border:1px solid rgba(11,105,180,.18)!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#0b69b4!important;
  box-shadow:0 4px 13px rgba(16,42,67,.05)!important;
  font:900 24px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  text-decoration:none!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
}
.hl-header-back[hidden]{display:none!important}

/* Dashboard always starts below the same fixed storefront header. */
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9{
  inset:var(--hl-storefront-header-h) 0 0 0!important;
  top:var(--hl-storefront-header-h)!important;
  width:100vw!important;
  height:calc(100dvh - var(--hl-storefront-header-h))!important;
  max-height:calc(100dvh - var(--hl-storefront-header-h))!important;
}
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-shell-v9,
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-sidebar-v9,
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-main-v9{
  height:100%!important;
  max-height:100%!important;
}
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dash-brand-v9{display:none!important}

/* Login/Register: keep controls in the header and place the auth panel below it. */
body.hl-auth-login-open .auth-overlay.show{
  top:var(--hl-storefront-header-h)!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  height:calc(100dvh - var(--hl-storefront-header-h))!important;
  padding:16px!important;
  z-index:100020!important;
}
body.hl-auth-login-open .hl-mobile-bottom-nav{display:none!important}

@media(max-width:1100px) and (min-width:761px){
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    width:calc(100% - 24px)!important;
    grid-template-columns:150px max-content minmax(220px,1fr) 40px!important;
    gap:9px!important;
  }
  body.hl-page-home .header > .nav{
    grid-template-columns:150px max-content minmax(220px,1fr)!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:144px!important;
    max-width:144px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label]{display:none!important}
}

@media(max-width:760px){
  :root{--hl-storefront-header-h:var(--hl-storefront-header-h-mobile)}

  body.hl-page-home .header,
  body.hl-page-catalog .header,
  body.hl-page-legacy .header,
  body.hl-detail-body .hl-shop-header,
  body.hl-cart-body .hl-shop-header{
    min-height:var(--hl-storefront-header-h-mobile)!important;
  }

  body.hl-page-home > main,
  body.hl-page-catalog > main,
  body.hl-page-legacy > main,
  body.hl-detail-body > main,
  body.hl-cart-body > main{
    padding-top:var(--hl-storefront-header-h-mobile)!important;
  }

  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    width:100%!important;
    max-width:none!important;
    min-height:var(--hl-storefront-header-h-mobile)!important;
    margin:0!important;
    padding:8px 10px 9px!important;
    display:grid!important;
    grid-template-columns:108px minmax(0,1fr) 40px!important;
    grid-template-rows:40px 44px!important;
    grid-template-areas:
      "logo tools tools"
      "search search back"!important;
    align-items:center!important;
    justify-content:stretch!important;
    row-gap:7px!important;
    column-gap:7px!important;
  }

  body.hl-page-home .header > .nav{
    grid-template-areas:
      "logo tools tools"
      "search search search"!important;
  }

  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:104px!important;
    max-width:104px!important;
    max-height:39px!important;
  }

  body.hl-page-home .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    justify-self:end!important;
    align-self:center!important;
    width:max-content!important;
    max-width:100%!important;
    height:38px!important;
    margin:0!important;
    padding:2px 3px!important;
    gap:3px!important;
    border-radius:11px!important;
  }

  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-control{
    min-height:32px!important;
    height:32px!important;
    padding:0 4px!important;
  }

  body.hl-page-home .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host select.hl-global-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:46px!important;
    min-width:46px!important;
    padding-right:14px!important;
  }

  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-account,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-account,
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-logout,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:32px!important;
    min-width:32px!important;
    max-width:32px!important;
    flex-basis:32px!important;
    padding:0!important;
  }

  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label],
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label]{display:none!important}

  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-cart,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:42px!important;
    min-width:42px!important;
    flex-basis:42px!important;
    padding:0 3px!important;
  }

  body.hl-page-home .header .hl-header-search,
  body.hl-page-catalog .header .hl-header-search,
  body.hl-page-legacy .header .hl-header-search,
  body.hl-detail-body .hl-shop-search,
  body.hl-cart-body .hl-shop-search{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:44px!important;
    min-height:44px!important;
    padding:3px 4px 3px 10px!important;
    border-radius:13px!important;
  }

  body.hl-page-home .header .hl-header-search input,
  body.hl-page-catalog .header .hl-header-search input,
  body.hl-page-legacy .header .hl-header-search input,
  body.hl-detail-body .hl-shop-search input,
  body.hl-cart-body .hl-shop-search input{
    height:34px!important;
    font-size:16px!important;
  }

  body.hl-page-home .header .hl-header-search button,
  body.hl-page-catalog .header .hl-header-search button,
  body.hl-page-legacy .header .hl-header-search button,
  body.hl-detail-body .hl-shop-search button,
  body.hl-cart-body .hl-shop-search button{
    height:34px!important;
    min-width:60px!important;
    padding:0 10px!important;
    border-radius:10px!important;
  }

  .hl-header-back,.hl-shop-back{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    justify-self:end!important;
    font-size:23px!important;
  }

  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9{
    inset:var(--hl-storefront-header-h-mobile) 0 0 0!important;
    top:var(--hl-storefront-header-h-mobile)!important;
    height:calc(100dvh - var(--hl-storefront-header-h-mobile))!important;
    max-height:calc(100dvh - var(--hl-storefront-header-h-mobile))!important;
  }

  body.hl-auth-login-open .auth-overlay.show{
    top:var(--hl-storefront-header-h-mobile)!important;
    height:calc(100dvh - var(--hl-storefront-header-h-mobile))!important;
    padding:10px!important;
    align-items:center!important;
    justify-content:center!important;
  }

  body.hl-auth-login-open .admin-auth-shell{
    width:min(100%,440px)!important;
    min-height:0!important;
    max-height:100%!important;
    height:auto!important;
    margin:auto!important;
    display:block!important;
    overflow:hidden!important;
    border-radius:18px!important;
  }
  body.hl-auth-login-open .admin-auth-sidebar{display:none!important}
  body.hl-auth-login-open .admin-auth-mobile-brand{display:flex!important}
  body.hl-auth-login-open .admin-auth-content{
    width:100%!important;
    min-height:0!important;
    max-height:calc(100dvh - var(--hl-storefront-header-h-mobile) - 20px)!important;
    padding:20px 16px 18px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    box-sizing:border-box!important;
  }
  body.hl-auth-login-open .admin-auth-form-grid{
    grid-template-columns:1fr!important;
    gap:0!important;
  }
}

@media(max-width:390px){
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    padding-left:7px!important;
    padding-right:7px!important;
    grid-template-columns:96px minmax(0,1fr) 38px!important;
    column-gap:5px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:94px!important;
    max-width:94px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    gap:2px!important;
    padding-left:2px!important;
    padding-right:2px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host select.hl-global-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:43px!important;
    min-width:43px!important;
  }
}

@media(max-width:350px){
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    grid-template-columns:86px minmax(0,1fr) 36px!important;
    padding-left:5px!important;
    padding-right:5px!important;
  }
  body.hl-page-home .header .logo img,
  body.hl-page-catalog .header .logo img,
  body.hl-page-legacy .header .logo img,
  body.hl-detail-body .hl-shop-logo img,
  body.hl-cart-body .hl-shop-logo img{
    width:84px!important;
    max-width:84px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host select.hl-global-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host select.hl-global-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:39px!important;min-width:39px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-account,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-account,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-account,
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-icon-control,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-logout,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-logout,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:29px!important;min-width:29px!important;max-width:29px!important;flex-basis:29px!important;
  }
  body.hl-page-home .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-page-catalog .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-page-legacy .header .nav.hl-global-controls-host .hl-global-cart,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host .hl-global-cart,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:38px!important;min-width:38px!important;flex-basis:38px!important;
  }
}


/* ==========================================================
   V55 canonical header — centered desktop order everywhere
   Desktop: Logo -> Search -> controls -> Back
   Mobile keeps the shared two-row responsive header.
   ========================================================== */
@media (min-width:761px){
  body.hl-page-home .header > .nav,
  body.hl-page-catalog .header > .nav,
  body.hl-page-legacy .header > .nav,
  body.hl-page-features .header > .nav,
  body.hl-detail-body .hl-shop-header > .hl-shop-top,
  body.hl-cart-body .hl-shop-header > .hl-shop-top{
    width:min(1180px,calc(100% - 32px))!important;
    max-width:1180px!important;
    margin:0 auto!important;
    display:grid!important;
    grid-template-columns:180px minmax(320px,460px) max-content 42px!important;
    grid-template-areas:"logo search tools back"!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
  }

  body.hl-page-home .header > .nav{
    grid-template-columns:180px minmax(340px,480px) max-content!important;
    grid-template-areas:"logo search tools"!important;
  }

  body.hl-page-home .header .logo,
  body.hl-page-catalog .header .logo,
  body.hl-page-legacy .header .logo,
  body.hl-page-features .header .logo,
  body.hl-detail-body .hl-shop-logo,
  body.hl-cart-body .hl-shop-logo{
    grid-area:logo!important;
    justify-self:end!important;
    align-self:center!important;
  }

  body.hl-page-home .header .hl-header-search,
  body.hl-page-catalog .header .hl-header-search,
  body.hl-page-legacy .header .hl-header-search,
  body.hl-page-features .header .hl-header-search,
  body.hl-detail-body .hl-shop-search,
  body.hl-cart-body .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    max-width:none!important;
    justify-self:stretch!important;
  }

  body.hl-page-home .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-catalog .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-legacy .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-page-features .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-detail-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body.hl-cart-body .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    justify-self:start!important;
  }

  body.hl-page-features .nav-links{display:none!important}
}

/* Features page uses the same fixed storefront header as the rest of the site. */
body.hl-page-features .header{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  z-index:100100!important;
}
body.hl-page-features > main{
  padding-top:var(--hl-storefront-header-h)!important;
}
@media(max-width:760px){
  body.hl-page-features > main{padding-top:var(--hl-storefront-header-h-mobile)!important}
}

/* V56 — standalone account pages share the same fixed storefront header. */
body.hl-page-manager-reviews .hlr-shell{
  padding-top:calc(var(--hl-storefront-header-h) + 34px)!important;
}
@media(max-width:760px){
  body.hl-page-manager-reviews .hlr-shell{
    padding-top:calc(var(--hl-storefront-header-h-mobile) + 18px)!important;
  }
}

/* ==========================================================
   V57 FINAL — centered header everywhere + mobile safe scrolling
   One last override after all legacy header experiments.
   Desktop: Logo | Search | controls | Back, centered as one group.
   Mobile:  Logo + controls / Search + Back, centered and compact.
   ========================================================== */
:root{
  --hl-v57-header-desktop:84px;
  --hl-v57-header-mobile:116px;
  --hl-storefront-header-h:var(--hl-v57-header-desktop);
  --hl-storefront-header-h-mobile:var(--hl-v57-header-mobile);
}

/* All storefront/account shell headers use one fixed centered frame. */
body .header,
body .hl-shop-header{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  z-index:100100!important;
  margin:0!important;
  transform:none!important;
  background:rgba(255,255,255,.985)!important;
  border-bottom:1px solid rgba(214,228,239,.94)!important;
  box-shadow:0 7px 24px rgba(16,42,67,.065)!important;
  -webkit-backdrop-filter:blur(14px) saturate(140%)!important;
  backdrop-filter:blur(14px) saturate(140%)!important;
  overflow:visible!important;
}

body .header > .nav,
body .hl-shop-header > .hl-shop-top{
  width:min(1120px,calc(100% - 28px))!important;
  max-width:1120px!important;
  min-height:var(--hl-v57-header-desktop)!important;
  height:var(--hl-v57-header-desktop)!important;
  margin:0 auto!important;
  padding:10px 0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:168px minmax(300px,470px) max-content 42px!important;
  grid-template-areas:"logo search tools back"!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  overflow:visible!important;
}

body.hl-page-home .header > .nav{
  grid-template-columns:168px minmax(340px,500px) max-content!important;
  grid-template-areas:"logo search tools"!important;
}

body .header .logo,
body .hl-shop-header .hl-shop-logo{
  grid-area:logo!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  justify-self:center!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
body .header .logo img,
body .hl-shop-header .hl-shop-logo img{
  display:block!important;
  width:158px!important;
  max-width:158px!important;
  max-height:58px!important;
  height:auto!important;
  object-fit:contain!important;
}

body .header .hl-header-search,
body .hl-shop-header .hl-shop-search{
  grid-area:search!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:46px!important;
  margin:0!important;
  justify-self:stretch!important;
  box-sizing:border-box!important;
}

body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
  grid-area:tools!important;
  position:relative!important;
  inset:auto!important;
  margin:0!important;
  transform:none!important;
  justify-self:center!important;
  align-self:center!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  width:max-content!important;
  max-width:100%!important;
  overflow:visible!important;
}

body .hl-header-back,
body .hl-shop-back{
  grid-area:back!important;
  justify-self:center!important;
  align-self:center!important;
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  margin:0!important;
}
body .hl-header-back[hidden]{display:none!important}

/* Main shell content must always start below the fixed header. */
body.hl-page-home > main,
body.hl-page-catalog > main,
body.hl-page-legacy > main,
body.hl-page-features > main,
body.hl-detail-body > main,
body.hl-cart-body > main{
  padding-top:var(--hl-v57-header-desktop)!important;
}

/* Dashboard lives inside the viewport BELOW the common header. */
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9{
  top:var(--hl-v57-header-desktop)!important;
  bottom:0!important;
  left:0!important;
  right:0!important;
  inset:var(--hl-v57-header-desktop) 0 0 0!important;
  width:100vw!important;
  height:calc(100dvh - var(--hl-v57-header-desktop))!important;
  max-height:calc(100dvh - var(--hl-v57-header-desktop))!important;
}
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-shell-v9{
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
}
body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-main-v9{
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}

/* Desktop dashboard sidebar buttons scroll independently all the way down. */
@media(min-width:801px){
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-sidebar-v9{
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dash-nav-v9{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding-right:5px!important;
    scrollbar-width:thin!important;
    scrollbar-color:rgba(255,255,255,.42) transparent!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dash-nav-v9::-webkit-scrollbar{width:6px!important}
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dash-nav-v9::-webkit-scrollbar-thumb{background:rgba(255,255,255,.42)!important;border-radius:999px!important}
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dash-sidebar-bottom-v9{flex:0 0 auto!important}
}

@media(max-width:760px){
  :root{
    --hl-storefront-header-h:var(--hl-v57-header-mobile);
    --hl-storefront-header-h-mobile:var(--hl-v57-header-mobile);
  }

  body .header,
  body .hl-shop-header{
    min-height:var(--hl-v57-header-mobile)!important;
  }

  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:min(414px,calc(100% - 14px))!important;
    max-width:414px!important;
    min-height:var(--hl-v57-header-mobile)!important;
    height:var(--hl-v57-header-mobile)!important;
    margin:0 auto!important;
    padding:7px 0 8px!important;
    display:grid!important;
    grid-template-columns:98px minmax(0,1fr) 40px!important;
    grid-template-rows:44px 48px!important;
    grid-template-areas:
      "logo tools tools"
      "search search back"!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px 6px!important;
    overflow:visible!important;
  }
  body.hl-page-home .header > .nav{
    grid-template-columns:98px minmax(0,1fr)!important;
    grid-template-areas:
      "logo tools"
      "search search"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    justify-self:center!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:96px!important;
    max-width:96px!important;
    max-height:42px!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    justify-self:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-width:0!important;
    height:40px!important;
    padding:2px!important;
    gap:2px!important;
    border-radius:12px!important;
    overflow:visible!important;
  }

  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:34px!important;
    min-height:34px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    border-radius:9px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:45px!important;min-width:45px!important;max-width:45px!important;padding:0 4px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account{
    width:38px!important;min-width:38px!important;max-width:38px!important;padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label]{display:none!important}
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:36px!important;min-width:36px!important;max-width:36px!important;padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:42px!important;min-width:42px!important;max-width:42px!important;padding:0!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:44px!important;
    min-height:44px!important;
    margin:0!important;
    justify-self:stretch!important;
  }
  body .header .hl-header-search input,
  body .hl-shop-header .hl-shop-search input{
    min-width:0!important;
    font-size:16px!important;
  }
  body .header .hl-header-search button,
  body .hl-shop-header .hl-shop-search button{
    min-width:58px!important;
    height:36px!important;
    padding:0 9px!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    justify-self:center!important;
  }

  body.hl-page-home > main,
  body.hl-page-catalog > main,
  body.hl-page-legacy > main,
  body.hl-page-features > main,
  body.hl-detail-body > main,
  body.hl-cart-body > main{
    padding-top:var(--hl-v57-header-mobile)!important;
  }

  /* Cart: leave real scrollable room above the fixed bottom navigation. */
  body.hl-cart-body{
    padding-bottom:calc(92px + env(safe-area-inset-bottom))!important;
  }
  body.hl-cart-body .hl-cart-page{
    padding-bottom:calc(150px + env(safe-area-inset-bottom))!important;
  }
  body.hl-cart-body footer{
    padding-bottom:calc(94px + env(safe-area-inset-bottom))!important;
  }

  /* Dashboard: all lower content remains reachable on iOS/Android. */
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9{
    top:var(--hl-v57-header-mobile)!important;
    inset:var(--hl-v57-header-mobile) 0 0 0!important;
    height:calc(100dvh - var(--hl-v57-header-mobile))!important;
    max-height:calc(100dvh - var(--hl-v57-header-mobile))!important;
    overflow:hidden!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-shell-v9{
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-main-v9{
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:calc(128px + env(safe-area-inset-bottom))!important;
    scroll-padding-bottom:calc(128px + env(safe-area-inset-bottom))!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .dashboard-section:last-child,
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .dashboard-panel:last-child{
    margin-bottom:24px!important;
  }
  body.hl-page-legacy #dashboardOverlay.hl-dashboard-v9 .hl-dashboard-sidebar-v9{
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:calc(90px + env(safe-area-inset-bottom))!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }

  body.hl-auth-login-open .auth-overlay.show{
    top:var(--hl-v57-header-mobile)!important;
    height:calc(100dvh - var(--hl-v57-header-mobile))!important;
  }
}

@media(max-width:390px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:calc(100% - 10px)!important;
    grid-template-columns:86px minmax(0,1fr) 38px!important;
    gap:6px 4px!important;
  }
  body.hl-page-home .header > .nav{
    grid-template-columns:86px minmax(0,1fr)!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:84px!important;
    max-width:84px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{width:41px!important;min-width:41px!important;max-width:41px!important}
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account,
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{width:32px!important;min-width:32px!important;max-width:32px!important}
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{width:38px!important;min-width:38px!important;max-width:38px!important}
}


/* ==========================================================
   V58 FINAL — exact centered desktop header on every page
   Keep the entire Logo -> Search -> controls -> Back group centered.
   Home omits Back without leaving an empty column.
   ========================================================== */
@media (min-width:761px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:fit-content!important;
    max-width:calc(100vw - 32px)!important;
    min-width:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important;
    grid-template-columns:160px minmax(320px,500px) max-content 42px!important;
    grid-template-areas:"logo search tools back"!important;
    justify-content:center!important;
    justify-items:stretch!important;
    column-gap:12px!important;
  }

  body.hl-page-home .header > .nav{
    width:fit-content!important;
    max-width:calc(100vw - 32px)!important;
    grid-template-columns:160px minmax(360px,520px) max-content!important;
    grid-template-areas:"logo search tools"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    justify-self:center!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    width:100%!important;
    min-width:0!important;
    justify-self:stretch!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    justify-self:center!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    justify-self:center!important;
  }
}

/* ==========================================================
   V59 — Cart/Product content begins after the fixed header
   Use a real top offset for the page box instead of consuming
   the page's own design padding with the header height.
   ========================================================== */
body.hl-detail-body > main.hl-product-page,
body.hl-cart-body > main.hl-cart-page{
  margin-top:var(--hl-v57-header-desktop)!important;
}
body.hl-detail-body > main.hl-product-page{
  padding-top:25px!important;
}
body.hl-cart-body > main.hl-cart-page{
  padding-top:34px!important;
}

@media (max-width:900px){
  body.hl-detail-body > main.hl-product-page,
  body.hl-cart-body > main.hl-cart-page{
    margin-top:var(--hl-v57-header-mobile)!important;
  }
  body.hl-detail-body > main.hl-product-page{
    padding-top:18px!important;
  }
  body.hl-cart-body > main.hl-cart-page{
    padding-top:24px!important;
  }
}

@media (max-width:560px){
  body.hl-detail-body > main.hl-product-page{
    padding-top:14px!important;
  }
  body.hl-cart-body > main.hl-cart-page{
    padding-top:18px!important;
  }
}

/* ==========================================================
   V60 — ONE HEADER POSITION EVERYWHERE
   Exact shared placement for app shell, product/cart/user,
   account standalone pages and static public pages.
   Desktop: Logo -> Search -> controls -> Back, centered.
   Mobile: Logo + controls, then Search + Back.
   ========================================================== */
:root{
  --hl-v60-header-desktop:112px;
  --hl-v60-header-mobile:206px;
  --hl-v57-header-desktop:var(--hl-v60-header-desktop);
  --hl-v57-header-mobile:var(--hl-v60-header-mobile);
  --hl-storefront-header-h:var(--hl-v60-header-desktop);
  --hl-storefront-header-h-mobile:var(--hl-v60-header-mobile);
}

body .header,
body .hl-shop-header{
  position:fixed!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  min-height:var(--hl-v60-header-desktop)!important;
  z-index:1200!important;
  background:rgba(255,255,255,.98)!important;
  border-bottom:1px solid #dbe7ef!important;
  box-shadow:0 7px 24px rgba(15,61,115,.06)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Old text navigation must never take a grid slot. */
body .header .nav-links,
body .hl-shop-header .hl-shop-nav{
  display:none!important;
}

@media (min-width:761px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    box-sizing:border-box!important;
    width:min(1500px, calc(100vw - 40px))!important;
    max-width:min(1500px, calc(100vw - 40px))!important;
    min-width:0!important;
    min-height:var(--hl-v60-header-desktop)!important;
    margin:0 auto!important;
    padding:12px 0!important;
    display:grid!important;
    grid-template-columns:190px minmax(300px,1fr) max-content 56px!important;
    grid-template-areas:"logo search tools back"!important;
    align-items:center!important;
    justify-content:center!important;
    justify-items:stretch!important;
    column-gap:14px!important;
    position:relative!important;
  }

  /* Home keeps the same geometry; the hidden Back simply leaves its slot empty. */
  body.hl-page-home .header > .nav{
    width:min(1500px, calc(100vw - 40px))!important;
    max-width:min(1500px, calc(100vw - 40px))!important;
    grid-template-columns:190px minmax(300px,1fr) max-content 56px!important;
    grid-template-areas:"logo search tools back"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    width:190px!important;
    min-width:190px!important;
    height:76px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:0!important;
    justify-self:center!important;
  }
  body .header .logo a,
  body .hl-shop-header .hl-shop-logo{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:100%!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    display:block!important;
    width:182px!important;
    max-width:182px!important;
    max-height:74px!important;
    object-fit:contain!important;
    margin:0 auto!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:64px!important;
    min-height:64px!important;
    margin:0!important;
    justify-self:stretch!important;
    align-self:center!important;
    border-radius:18px!important;
  }
  body .header .hl-header-search input,
  body .hl-shop-header .hl-shop-search input{
    min-width:0!important;
    height:100%!important;
    font-size:17px!important;
  }
  body .header .hl-header-search button,
  body .hl-shop-header .hl-shop-search button{
    height:50px!important;
    min-height:50px!important;
    min-width:92px!important;
    border-radius:14px!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    justify-self:start!important;
    align-self:center!important;
    width:max-content!important;
    max-width:none!important;
    min-width:0!important;
    min-height:64px!important;
    height:64px!important;
    margin:0!important;
    padding:5px!important;
    gap:6px!important;
    border-radius:18px!important;
    overflow:visible!important;
  }

  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:52px!important;
    min-height:52px!important;
    border-radius:13px!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    grid-area:back!important;
    width:56px!important;
    min-width:56px!important;
    height:56px!important;
    margin:0!important;
    padding:0!important;
    justify-self:center!important;
    align-self:center!important;
    border-radius:15px!important;
  }

  /* Hide legacy product/cart account/cart buttons after shared controls take over. */
  body .hl-shop-header.hl-has-global-controls .hl-header-btn{
    display:none!important;
  }
}

@media (max-width:760px){
  :root{
    --hl-storefront-header-h:var(--hl-v60-header-mobile);
    --hl-storefront-header-h-mobile:var(--hl-v60-header-mobile);
  }

  body .header,
  body .hl-shop-header{
    min-height:var(--hl-v60-header-mobile)!important;
    height:var(--hl-v60-header-mobile)!important;
    padding:0!important;
  }

  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    box-sizing:border-box!important;
    width:calc(100% - 20px)!important;
    max-width:720px!important;
    min-width:0!important;
    height:100%!important;
    margin:0 auto!important;
    padding:10px 0 12px!important;
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr) 48px!important;
    grid-template-rows:86px 58px!important;
    grid-template-areas:
      "logo tools tools"
      "search search back"!important;
    align-content:center!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px 8px!important;
    position:relative!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    width:112px!important;
    min-width:112px!important;
    height:76px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    justify-self:center!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:108px!important;
    max-width:108px!important;
    max-height:66px!important;
    object-fit:contain!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    justify-self:end!important;
    align-self:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-width:0!important;
    height:52px!important;
    min-height:52px!important;
    margin:0!important;
    padding:3px!important;
    gap:3px!important;
    border-radius:14px!important;
    overflow:visible!important;
  }

  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:44px!important;
    min-height:44px!important;
    border-radius:11px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:52px!important;
    min-width:52px!important;
    max-width:52px!important;
    padding:0 5px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account{
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label]{display:none!important}
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:44px!important;
    min-width:44px!important;
    max-width:44px!important;
    padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:48px!important;
    min-width:48px!important;
    max-width:48px!important;
    padding:0!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:56px!important;
    min-height:56px!important;
    margin:0!important;
    justify-self:stretch!important;
    border-radius:16px!important;
  }
  body .header .hl-header-search input,
  body .hl-shop-header .hl-shop-search input{
    min-width:0!important;
    font-size:16px!important;
  }
  body .header .hl-header-search button,
  body .hl-shop-header .hl-shop-search button{
    height:46px!important;
    min-height:46px!important;
    min-width:62px!important;
    border-radius:13px!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    grid-area:back!important;
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    margin:0!important;
    justify-self:center!important;
    align-self:center!important;
    border-radius:13px!important;
  }

  body .hl-shop-header.hl-has-global-controls .hl-header-btn{
    display:none!important;
  }
}

@media (max-width:390px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:calc(100% - 12px)!important;
    grid-template-columns:92px minmax(0,1fr) 44px!important;
    gap:8px 5px!important;
  }
  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    width:92px!important;
    min-width:92px!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:90px!important;
    max-width:90px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:46px!important;min-width:46px!important;max-width:46px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account,
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:39px!important;min-width:39px!important;max-width:39px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:43px!important;min-width:43px!important;max-width:43px!important;
  }
}

/* Standalone public pages that now use the shared fixed header. */
body.hl-static-unified-header > main{
  margin-top:var(--hl-v60-header-desktop)!important;
}
@media(max-width:760px){
  body.hl-static-unified-header > main{
    margin-top:var(--hl-v60-header-mobile)!important;
  }
}

/* ==========================================================
   V61 FINAL — restore proven mobile header + truly centered desktop
   Desktop: center the whole Logo -> Search -> controls -> Back group.
   Mobile: restore the compact V58 layout that was working correctly.
   ========================================================== */

@media (min-width:761px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    box-sizing:border-box!important;
    width:fit-content!important;
    max-width:calc(100vw - 40px)!important;
    min-width:0!important;
    height:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important;
    display:grid!important;
    grid-template-columns:170px minmax(360px,560px) max-content 52px!important;
    grid-template-areas:"logo search tools back"!important;
    justify-content:center!important;
    justify-items:stretch!important;
    align-items:center!important;
    column-gap:12px!important;
    overflow:visible!important;
  }

  body.hl-page-home .header > .nav{
    width:fit-content!important;
    max-width:calc(100vw - 40px)!important;
    grid-template-columns:170px minmax(380px,580px) max-content!important;
    grid-template-areas:"logo search tools"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    width:170px!important;
    min-width:170px!important;
    margin:0!important;
    padding:0!important;
    justify-self:center!important;
    align-self:center!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:160px!important;
    max-width:160px!important;
    max-height:68px!important;
    object-fit:contain!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    justify-self:stretch!important;
    align-self:center!important;
    border-radius:17px!important;
  }
  body .header .hl-header-search button,
  body .hl-shop-header .hl-shop-search button{
    height:46px!important;
    min-height:46px!important;
    min-width:86px!important;
    border-radius:13px!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    justify-self:center!important;
    align-self:center!important;
    width:max-content!important;
    max-width:none!important;
    min-width:0!important;
    min-height:54px!important;
    height:54px!important;
    margin:0!important;
    padding:4px!important;
    gap:4px!important;
    overflow:visible!important;
    border-radius:16px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:46px!important;
    min-height:46px!important;
    border-radius:12px!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    grid-area:back!important;
    width:52px!important;
    min-width:52px!important;
    height:52px!important;
    margin:0!important;
    justify-self:center!important;
    align-self:center!important;
    border-radius:14px!important;
  }
  body .hl-header-back[hidden]{display:none!important}
}

/* Restore the earlier compact mobile arrangement exactly: first row Logo + controls,
   second row Search + Back. Home has no Back and Search spans the row. */
@media (max-width:760px){
  :root{
    --hl-storefront-header-h:var(--hl-v57-header-mobile)!important;
    --hl-storefront-header-h-mobile:var(--hl-v57-header-mobile)!important;
  }

  body .header,
  body .hl-shop-header{
    min-height:var(--hl-v57-header-mobile)!important;
    height:var(--hl-v57-header-mobile)!important;
    padding:0!important;
  }

  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    box-sizing:border-box!important;
    width:min(414px,calc(100% - 14px))!important;
    max-width:414px!important;
    min-width:0!important;
    min-height:var(--hl-v57-header-mobile)!important;
    height:var(--hl-v57-header-mobile)!important;
    margin:0 auto!important;
    padding:7px 0 8px!important;
    display:grid!important;
    grid-template-columns:98px minmax(0,1fr) 40px!important;
    grid-template-rows:44px 48px!important;
    grid-template-areas:
      "logo tools tools"
      "search search back"!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px 6px!important;
    overflow:visible!important;
    position:relative!important;
  }

  body.hl-page-home .header > .nav{
    grid-template-columns:98px minmax(0,1fr)!important;
    grid-template-areas:
      "logo tools"
      "search search"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    width:98px!important;
    min-width:98px!important;
    height:44px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    justify-self:center!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:96px!important;
    max-width:96px!important;
    max-height:42px!important;
    object-fit:contain!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    justify-self:center!important;
    align-self:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-width:0!important;
    height:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:2px!important;
    gap:2px!important;
    border-radius:12px!important;
    overflow:visible!important;
  }

  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:34px!important;
    min-height:34px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    border-radius:9px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:45px!important;min-width:45px!important;max-width:45px!important;padding:0 4px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account{
    width:38px!important;min-width:38px!important;max-width:38px!important;padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account [data-hl-label],
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account [data-hl-label]{display:none!important}
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:36px!important;min-width:36px!important;max-width:36px!important;padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:42px!important;min-width:42px!important;max-width:42px!important;padding:0!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:44px!important;
    min-height:44px!important;
    margin:0!important;
    justify-self:stretch!important;
    align-self:center!important;
    border-radius:14px!important;
  }
  body .header .hl-header-search input,
  body .hl-shop-header .hl-shop-search input{
    min-width:0!important;
    font-size:16px!important;
  }
  body .header .hl-header-search button,
  body .hl-shop-header .hl-shop-search button{
    min-width:58px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 9px!important;
    border-radius:11px!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    grid-area:back!important;
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
    margin:0!important;
    justify-self:center!important;
    align-self:center!important;
    border-radius:11px!important;
  }
}

@media (max-width:390px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:calc(100% - 10px)!important;
    grid-template-columns:86px minmax(0,1fr) 38px!important;
    gap:6px 4px!important;
  }
  body.hl-page-home .header > .nav{
    grid-template-columns:86px minmax(0,1fr)!important;
  }
  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    width:86px!important;
    min-width:86px!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:84px!important;
    max-width:84px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:41px!important;min-width:41px!important;max-width:41px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account,
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:32px!important;min-width:32px!important;max-width:32px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:38px!important;min-width:38px!important;max-width:38px!important;
  }
}

/* ==========================================================
   V62 — restore the proven mobile storefront/cart header sizing
   Keep V61 desktop centering untouched. The V60 bridge had left
   --hl-v57-header-mobile resolving to 206px; the working V57/V58
   mobile layout is 116px.
   ========================================================== */
@media (max-width:760px){
  :root{
    --hl-v57-header-mobile:116px!important;
    --hl-v60-header-mobile:116px!important;
    --hl-storefront-header-h:116px!important;
    --hl-storefront-header-h-mobile:116px!important;
  }

  body .header,
  body .hl-shop-header{
    min-height:116px!important;
    height:116px!important;
  }

  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    min-height:116px!important;
    height:116px!important;
    width:min(414px,calc(100% - 14px))!important;
    max-width:414px!important;
    margin:0 auto!important;
    padding:7px 0 8px!important;
    grid-template-columns:98px minmax(0,1fr) 40px!important;
    grid-template-rows:44px 48px!important;
    grid-template-areas:
      "logo tools tools"
      "search search back"!important;
    gap:7px 6px!important;
    align-items:center!important;
    justify-content:center!important;
  }

  body.hl-page-home .header > .nav{
    grid-template-columns:98px minmax(0,1fr)!important;
    grid-template-areas:
      "logo tools"
      "search search"!important;
  }

  body.hl-cart-body > main.hl-cart-page,
  body.hl-detail-body > main.hl-product-page{
    margin-top:116px!important;
  }

  body.hl-cart-body > main.hl-cart-page{
    padding-top:18px!important;
  }
}

@media (max-width:390px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:calc(100% - 10px)!important;
    grid-template-columns:86px minmax(0,1fr) 38px!important;
    gap:6px 4px!important;
  }
  body.hl-page-home .header > .nav{
    grid-template-columns:86px minmax(0,1fr)!important;
  }
}

/* ==========================================================
   V63 — mobile cart/header first-row alignment only
   Keep Back on the second row. Keep Logo left and pin the
   shared control group to the right, matching the proven layout.
   ========================================================== */
@media (max-width:760px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    grid-template-columns:98px minmax(0,1fr) 40px!important;
    grid-template-areas:
      "logo tools tools"
      "search search back"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    justify-self:start!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    justify-self:end!important;
    margin-left:auto!important;
    margin-right:0!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-end!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar > *,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar > *{
    flex-shrink:0!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    grid-area:back!important;
    justify-self:end!important;
    margin-right:0!important;
  }
}

@media (max-width:390px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    grid-template-columns:86px minmax(0,1fr) 38px!important;
  }
}

/* ==========================================================
   V65 — canonical desktop header + equal logout icon
   Fixes the left-clipped logo / off-center header seen after V64.
   Mobile geometry is intentionally left on the proven V62/V63 rules.
   ========================================================== */

/* Logout is a true icon control everywhere, same visual scale as bell/message. */
.hl-global-logout{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
}
.hl-global-logout .hl-global-icon-svg{
  width:21px!important;
  height:21px!important;
  min-width:21px!important;
  flex:0 0 21px!important;
}

@media (min-width:761px){
  :root{
    --hl-v65-header-desktop:104px;
    --hl-storefront-header-h:104px!important;
  }

  /* One centered frame on every normal shared header. */
  body .header,
  body .hl-shop-header{
    min-height:var(--hl-v65-header-desktop)!important;
    height:var(--hl-v65-header-desktop)!important;
    padding:0!important;
    overflow:visible!important;
  }

  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    transform:none!important;
    box-sizing:border-box!important;
    width:min(1380px,calc(100vw - 32px))!important;
    max-width:1380px!important;
    min-width:0!important;
    height:100%!important;
    min-height:var(--hl-v65-header-desktop)!important;
    margin:0 auto!important;
    padding:10px 0!important;
    display:grid!important;
    grid-template-columns:160px minmax(360px,560px) max-content 52px!important;
    grid-template-areas:"logo search tools back"!important;
    justify-content:center!important;
    justify-items:stretch!important;
    align-items:center!important;
    column-gap:14px!important;
    overflow:visible!important;
  }

  /* Home has no back button; do not reserve an empty last column. */
  body.hl-page-home .header > .nav{
    grid-template-columns:160px minmax(380px,580px) max-content!important;
    grid-template-areas:"logo search tools"!important;
  }

  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    position:relative!important;
    left:auto!important;
    transform:none!important;
    width:160px!important;
    min-width:160px!important;
    max-width:160px!important;
    height:68px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    justify-self:center!important;
    overflow:visible!important;
  }
  body .header .logo a,
  body .hl-shop-header .hl-shop-logo a{
    display:flex!important;
    width:100%!important;
    height:100%!important;
    align-items:center!important;
    justify-content:center!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    display:block!important;
    width:154px!important;
    max-width:154px!important;
    height:auto!important;
    max-height:64px!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0 auto!important;
  }

  body .header .hl-header-search,
  body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    justify-self:stretch!important;
    align-self:center!important;
  }
  body .header .hl-header-search button,
  body .hl-shop-header .hl-shop-search button{
    height:46px!important;
    min-height:46px!important;
    min-width:86px!important;
  }

  body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    transform:none!important;
    width:max-content!important;
    max-width:none!important;
    min-width:0!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:4px!important;
    gap:4px!important;
    justify-self:center!important;
    align-self:center!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:nowrap!important;
    overflow:visible!important;
    border-radius:16px!important;
  }

  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:46px!important;
    min-height:46px!important;
    border-radius:12px!important;
    box-sizing:border-box!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    min-width:62px!important;
    width:62px!important;
    max-width:62px!important;
    padding:0 7px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    min-width:92px!important;
    width:92px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account{
    min-width:112px!important;
    max-width:138px!important;
  }

  body .hl-header-back,
  body .hl-shop-back{
    grid-area:back!important;
    width:52px!important;
    min-width:52px!important;
    max-width:52px!important;
    height:52px!important;
    min-height:52px!important;
    margin:0!important;
    justify-self:center!important;
    align-self:center!important;
  }

  /* Never leave a phantom back column on pages where back is hidden. */
  body.hl-page-home .hl-header-back,
  body.hl-page-home .hl-shop-back,
  body .hl-header-back[hidden],
  body .hl-shop-back[hidden]{display:none!important}
}

/* Mid-size desktop/tablet landscape: keep the group centered without clipping. */
@media (min-width:761px) and (max-width:1180px){
  body .header > .nav,
  body .hl-shop-header > .hl-shop-top{
    width:calc(100vw - 22px)!important;
    grid-template-columns:132px minmax(245px,1fr) max-content 44px!important;
    column-gap:8px!important;
  }
  body.hl-page-home .header > .nav{
    grid-template-columns:132px minmax(260px,1fr) max-content!important;
  }
  body .header .logo,
  body .hl-shop-header .hl-shop-logo{
    width:132px!important;min-width:132px!important;max-width:132px!important;
  }
  body .header .logo img,
  body .hl-shop-header .hl-shop-logo img{
    width:128px!important;max-width:128px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-control{
    height:42px!important;min-height:42px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-icon-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-icon-control,
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:42px!important;min-width:42px!important;max-width:42px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-cart,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-cart{
    width:54px!important;min-width:54px!important;max-width:54px!important;
  }
  body .header .nav.hl-global-controls-host select.hl-global-control,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host select.hl-global-control{
    width:72px!important;min-width:72px!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-account,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-account{
    min-width:88px!important;max-width:100px!important;padding-left:9px!important;padding-right:9px!important;
  }
  body .hl-header-back,
  body .hl-shop-back{
    width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;min-height:44px!important;
  }
}

/* Mobile: preserve V62/V63 geometry; only make logout exactly the same square as icon controls. */
@media (max-width:760px){
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:34px!important;
    min-height:34px!important;
    padding:0!important;
  }
  body .header .nav.hl-global-controls-host .hl-global-logout .hl-global-icon-svg,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout .hl-global-icon-svg{
    width:20px!important;height:20px!important;min-width:20px!important;flex-basis:20px!important;
  }
}
@media (max-width:390px){
  body .header .nav.hl-global-controls-host .hl-global-logout,
  body .hl-shop-header .hl-shop-top.hl-global-controls-host .hl-global-logout{
    width:32px!important;min-width:32px!important;max-width:32px!important;
  }
}

/* ==========================================================
   V66 — viewport-centered desktop header
   Desktop is centered against the actual browser viewport, not a
   page/container parent. Mobile intentionally keeps the proven V62/V63
   geometry unchanged.
   ========================================================== */
@media (min-width:761px){
  :root{
    --hl-v66-header-desktop:104px;
    --hl-storefront-header-h:var(--hl-v66-header-desktop)!important;
  }

  /* The header itself always spans the full browser viewport. */
  html body .header,
  html body .hl-shop-header{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100vw!important;
    max-width:none!important;
    min-width:0!important;
    height:var(--hl-v66-header-desktop)!important;
    min-height:var(--hl-v66-header-desktop)!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    z-index:10050!important;
  }

  /* Center the COMPLETE header group to the viewport center. */
  html body .header > .nav,
  html body .hl-shop-header > .hl-shop-top{
    position:absolute!important;
    top:0!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    width:max-content!important;
    max-width:calc(100vw - 32px)!important;
    min-width:0!important;
    height:100%!important;
    min-height:var(--hl-v66-header-desktop)!important;
    margin:0!important;
    padding:10px 0!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:160px minmax(360px,560px) max-content 52px!important;
    grid-template-areas:"logo search tools back"!important;
    justify-content:center!important;
    justify-items:stretch!important;
    align-items:center!important;
    column-gap:14px!important;
    overflow:visible!important;
  }

  html body.hl-page-home .header > .nav{
    grid-template-columns:160px minmax(380px,580px) max-content!important;
    grid-template-areas:"logo search tools"!important;
  }

  html body .header .logo,
  html body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    justify-self:center!important;
    align-self:center!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    width:160px!important;
    min-width:160px!important;
    max-width:160px!important;
    margin:0!important;
    overflow:visible!important;
  }

  html body .header .hl-header-search,
  html body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    justify-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
  }

  html body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  html body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    justify-self:center!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    margin:0!important;
    width:max-content!important;
    max-width:none!important;
  }

  html body .hl-header-back,
  html body .hl-shop-back{
    grid-area:back!important;
    justify-self:center!important;
    margin:0!important;
  }
}

/* Keep the whole centered group inside narrower desktop/tablet viewports. */
@media (min-width:761px) and (max-width:1220px){
  html body .header > .nav,
  html body .hl-shop-header > .hl-shop-top{
    max-width:calc(100vw - 20px)!important;
    grid-template-columns:124px minmax(250px,360px) max-content 44px!important;
    column-gap:8px!important;
  }
  html body.hl-page-home .header > .nav{
    grid-template-columns:124px minmax(270px,390px) max-content!important;
  }
  html body .header .logo,
  html body .hl-shop-header .hl-shop-logo{
    width:124px!important;
    min-width:124px!important;
    max-width:124px!important;
  }
  html body .header .logo img,
  html body .hl-shop-header .hl-shop-logo img{
    width:120px!important;
    max-width:120px!important;
  }
}

/* ==========================================================
   V66 — viewport-centered desktop header
   Desktop is centered against the actual browser viewport, not a
   page/container parent. Mobile intentionally keeps the proven V62/V63
   geometry unchanged.
   ========================================================== */
@media (min-width:761px){
  :root{
    --hl-v66-header-desktop:104px;
    --hl-storefront-header-h:var(--hl-v66-header-desktop)!important;
  }
  html body .header,
  html body .hl-shop-header{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100vw!important;
    max-width:none!important;
    min-width:0!important;
    height:var(--hl-v66-header-desktop)!important;
    min-height:var(--hl-v66-header-desktop)!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    z-index:10050!important;
  }
  html body .header > .nav,
  html body .hl-shop-header > .hl-shop-top{
    position:absolute!important;
    top:0!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    width:max-content!important;
    max-width:calc(100vw - 32px)!important;
    min-width:0!important;
    height:100%!important;
    min-height:var(--hl-v66-header-desktop)!important;
    margin:0!important;
    padding:10px 0!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:160px minmax(360px,560px) max-content 52px!important;
    grid-template-areas:"logo search tools back"!important;
    justify-content:center!important;
    justify-items:stretch!important;
    align-items:center!important;
    column-gap:14px!important;
    overflow:visible!important;
  }
  html body.hl-page-home .header > .nav{
    grid-template-columns:160px minmax(380px,580px) max-content!important;
    grid-template-areas:"logo search tools"!important;
  }
  html body .header .logo,
  html body .hl-shop-header .hl-shop-logo{
    grid-area:logo!important;
    justify-self:center!important;
    align-self:center!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    width:160px!important;
    min-width:160px!important;
    max-width:160px!important;
    margin:0!important;
    overflow:visible!important;
  }
  html body .header .hl-header-search,
  html body .hl-shop-header .hl-shop-search{
    grid-area:search!important;
    justify-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
  }
  html body .header .nav.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar,
  html body .hl-shop-header .hl-shop-top.hl-global-controls-host > .hl-global-dropdown.hl-global-flow-toolbar{
    grid-area:tools!important;
    justify-self:center!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    margin:0!important;
    width:max-content!important;
    max-width:none!important;
  }
  html body .hl-header-back,
  html body .hl-shop-back{
    grid-area:back!important;
    justify-self:center!important;
    margin:0!important;
  }
}
@media (min-width:761px) and (max-width:1220px){
  html body .header > .nav,
  html body .hl-shop-header > .hl-shop-top{
    max-width:calc(100vw - 20px)!important;
    grid-template-columns:124px minmax(250px,360px) max-content 44px!important;
    column-gap:8px!important;
  }
  html body.hl-page-home .header > .nav{
    grid-template-columns:124px minmax(270px,390px) max-content!important;
  }
  html body .header .logo,
  html body .hl-shop-header .hl-shop-logo{
    width:124px!important;
    min-width:124px!important;
    max-width:124px!important;
  }
  html body .header .logo img,
  html body .hl-shop-header .hl-shop-logo img{
    width:120px!important;
    max-width:120px!important;
  }
}

/* ==========================================================
   V67 — standalone About / Terms / Privacy header repair
   These pages do not load customer-ui-v3.css, so keep the
   shared header search completely self-contained here.
   ========================================================== */
body.hl-static-unified-header .header .hl-header-search{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  position:relative!important;
  overflow:visible!important;
  box-sizing:border-box!important;
  padding:4px 5px 4px 13px!important;
  border:1px solid #dce7ef!important;
  border-radius:15px!important;
  background:#fff!important;
  box-shadow:0 8px 24px rgba(16,42,67,.06)!important;
}
body.hl-static-unified-header .header .hl-header-search:focus-within{
  border-color:#8fc3e7!important;
  box-shadow:0 0 0 3px rgba(11,105,180,.08),0 10px 28px rgba(16,42,67,.08)!important;
}
body.hl-static-unified-header .header .hl-header-search-icon{
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  max-width:20px!important;
  flex:0 0 20px!important;
  display:grid!important;
  place-items:center!important;
  position:relative!important;
  inset:auto!important;
  margin:0!important;
  padding:0!important;
  color:#6c8294!important;
  line-height:1!important;
  transform:none!important;
}
body.hl-static-unified-header .header .hl-header-search-icon svg{
  display:block!important;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  max-width:20px!important;
  min-height:20px!important;
  max-height:20px!important;
  position:static!important;
  inset:auto!important;
  margin:0!important;
  transform:none!important;
}
body.hl-static-unified-header .header .hl-header-search input{
  flex:1 1 auto!important;
  min-width:0!important;
  width:auto!important;
  height:36px!important;
  min-height:36px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#153650!important;
  font:inherit!important;
  font-size:14px!important;
  box-shadow:none!important;
}
body.hl-static-unified-header .header .hl-header-search input::placeholder{
  color:#8b9cab!important;
  opacity:1!important;
}
body.hl-static-unified-header .header .hl-header-search button{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:84px!important;
  height:36px!important;
  min-height:36px!important;
  margin:0!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:11px!important;
  background:#0b69b4!important;
  color:#fff!important;
  font:inherit!important;
  font-size:13px!important;
  font-weight:850!important;
  line-height:1!important;
  cursor:pointer!important;
  box-shadow:none!important;
  transform:none!important;
}
body.hl-static-unified-header .header .hl-header-search button:hover{
  background:#07558f!important;
}

/* The fixed shared header already has its own Back control.  On mobile,
   remove the legacy in-page Back buttons to avoid duplicate navigation. */
@media (max-width:760px){
  body.hl-static-unified-header .about-back,
  body.hl-static-unified-header .privacy-bottom,
  body.hl-static-unified-header .terms-bottom,
  body.hl-static-unified-header .terms-back-top{
    display:none!important;
  }

  body.hl-static-unified-header .header .hl-header-search-icon{
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    max-width:18px!important;
    flex-basis:18px!important;
  }
  body.hl-static-unified-header .header .hl-header-search-icon svg{
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    max-width:18px!important;
    min-height:18px!important;
    max-height:18px!important;
  }
}

/* ==========================================================
   V68 — static About / Terms / Privacy mobile back alignment
   Keep the previous header Back button, but make it the same
   36x36 footprint as the neighboring mobile header controls.
   ========================================================== */
@media (max-width:760px){
  body.hl-static-unified-header .header .hl-header-back{
    display:inline-grid!important;
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    padding:0!important;
    margin:0!important;
    border-radius:10px!important;
    justify-self:end!important;
    align-self:center!important;
    place-items:center!important;
    font-size:21px!important;
    line-height:1!important;
    box-sizing:border-box!important;
  }
}
/* Keep the restored legal header Back arrow and remove its duplicate shop Back arrow on mobile. */
@media (max-width:760px){
  body.hl-static-unified-header .hl-shop-back{
    display:none!important;
  }
}

/* Header image search control */
.hl-image-search-input{display:none!important}
body .header .hl-header-search .hl-image-search-button{
  flex:0 0 36px;
  min-width:36px;
  width:36px;
  height:36px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid #dce7ef;
  border-radius:11px;
  background:#f5f9fc;
  color:#41627a;
  box-shadow:none;
}
body .header .hl-header-search .hl-image-search-button svg{width:19px;height:19px;display:block}
body .header .hl-header-search .hl-image-search-button:hover{background:#eaf5fc;border-color:#a9cde3;color:#0b69b4}
body .header .hl-header-search .hl-image-search-button:disabled{opacity:.55;cursor:wait}