/* 2026-09-07 — mobile header: logo | search | account | cart | menu, phone on its own row. */
@media(max-width:600px){
  body.zgh-ui-active .zh-home.zg-v6 .zg4-main,
  .zh-home.zg-v6 .zg4-main{
    grid-template-columns:minmax(54px,1fr) 40px 40px 40px 86px!important;
    grid-template-rows:auto auto!important;
    gap:10px 9px!important;
    align-items:center!important;
  }
  body.zgh-ui-active .zh-home.zg-v6 .zg4-logo,
  .zh-home.zg-v6 .zg4-logo{grid-row:1!important;grid-column:1!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tools,
  .zh-home.zg-v6 .zg4-tools{display:contents!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tools>.zg4-tool,
  .zh-home.zg-v6 .zg4-tools>.zg4-tool{grid-row:1!important;align-self:center!important;justify-self:end!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tools>.zg4-tool[href*="#zg-search"],
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tools>.zg4-tool[href*="/shop/#zg-search"],
  .zh-home.zg-v6 .zg4-tools>.zg4-tool[href*="#zg-search"]{grid-column:2!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tools>.zg4-account,
  .zh-home.zg-v6 .zg4-tools>.zg4-account{grid-column:3!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tools>.zg4-tool[href*="/cart/"],
  .zh-home.zg-v6 .zg4-tools>.zg4-tool[href*="/cart/"]{grid-column:4!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-wishlist,
  .zh-home.zg-v6 .zg4-wishlist{display:none!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-mobile,
  .zh-home.zg-v6 .zg4-mobile{grid-row:1!important;grid-column:5!important;align-self:center!important;justify-self:end!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg6-header-phone,
  .zh-home.zg-v6 .zg6-header-phone{grid-row:2!important;grid-column:1/-1!important;width:100%!important;margin:0!important}
}
@media(max-width:370px){
  body.zgh-ui-active .zh-home.zg-v6 .zg4-main,
  .zh-home.zg-v6 .zg4-main{
    grid-template-columns:minmax(48px,1fr) 35px 35px 35px 76px!important;
    gap:9px 6px!important;
  }
  body.zgh-ui-active .zh-home.zg-v6 .zg4-tool,
  .zh-home.zg-v6 .zg4-tool{width:35px!important;height:37px!important}
  body.zgh-ui-active .zh-home.zg-v6 .zg4-mobile>summary,
  .zh-home.zg-v6 .zg4-mobile>summary{padding-inline:9px!important;font-size:11px!important}
}

/* 2026-09-07 — mobile burger visibility must follow <details open> exactly. */
@media(max-width:1080px){
  .zg4-header details.zg4-mobile:not([open]) > .zg4-mobile-panel{display:none!important}
  .zg4-header details.zg4-mobile[open] > .zg4-mobile-panel{display:block!important}
}


/* 2026-09-07 — mobile burger button replacing native details. */
.zgh-ui-active .zgh-mobile-menu{display:none;position:static}
.zgh-ui-active .zgh-mobile-menu>.zgh-mobile-toggle{display:flex;align-items:center;gap:7px;min-height:42px;padding:8px 13px;border:0;border-radius:28px;background:#000;color:#fff;font:700 12px/1.3 Arial,Helvetica,sans-serif;list-style:none;cursor:pointer;box-shadow:none}
.zgh-ui-active .zgh-mobile-menu>.zgh-mobile-toggle svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.zgh-ui-active .zgh-mobile-menu.is-open>.zgh-mobile-toggle{background:var(--wp--preset--color--accent,#97ea90);color:#000}
.zgh-ui-active .zgh-mobile-menu>.zg4-mobile-panel[hidden]{display:none!important}
.zgh-ui-active .zgh-mobile-menu>.zg4-mobile-panel:not([hidden]){display:block!important}
@media(max-width:1080px){.zgh-ui-active .zgh-mobile-menu{display:block}}
@media(max-width:600px){
  .zgh-ui-active .zgh-mobile-menu{grid-row:1;grid-column:5;align-self:center;justify-self:end}
  .zgh-ui-active .zgh-mobile-menu>.zgh-mobile-toggle{padding-inline:12px}
}
@media(max-width:370px){.zgh-ui-active .zgh-mobile-menu>.zgh-mobile-toggle{padding-inline:9px;font-size:11px}}


/* 2026-09-07 mobile header hardening: visible burger panel + truly centered phone. */
@media (max-width:1080px){
  .zg4-header,
  .zg4-header .zg4-main,
  .zg4-header .zg4-tools,
  .zg4-header .zgh-mobile-menu{
    overflow:visible!important;
  }
  .zg4-header .zgh-mobile-menu.is-open>.zg4-mobile-panel{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    position:absolute!important;
    top:100%!important;
    left:0!important;
    right:0!important;
    width:auto!important;
    max-width:none!important;
    z-index:999999!important;
    pointer-events:auto!important;
  }
}
@media (max-width:600px){
  .zh-home.zg-v6 .zg4-main,
  body.zgh-ui-active .zh-home.zg-v6 .zg4-main{
    position:relative!important;
    overflow:visible!important;
  }
  .zh-home.zg-v6 .zg6-header-phone,
  body.zgh-ui-active .zh-home.zg-v6 .zg6-header-phone{
    grid-row:2!important;
    grid-column:1/-1!important;
    justify-self:center!important;
    align-self:center!important;
    width:min(calc(100vw - 36px),520px)!important;
    max-width:520px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    transform:none!important;
  }
  .zg4-header .zgh-mobile-menu.is-open>.zg4-mobile-panel{
    top:calc(100% + 1px)!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    max-height:calc(100dvh - 190px)!important;
    overflow:auto!important;
    border-radius:0 0 18px 18px!important;
    box-shadow:0 18px 35px rgba(0,0,0,.18)!important;
  }
}