/* ShoppersXpress mobile header — single source of truth. Based on Bk2.zip markup. */
@media (max-width:1180px) {
  #sxHeader.sx-header { position:relative!important; padding:0!important; background:#087443!important; background-image:none!important; border-bottom:2px solid #e7c77a!important; box-shadow:0 2px 9px #052b1b35!important; }
  #sxHeader .sx-header-inner { box-sizing:border-box!important; display:grid!important; grid-template-columns:48px minmax(0,1fr) 48px!important; grid-template-rows:auto!important; gap:8px!important; align-items:center!important; min-height:72px!important; padding:8px 12px!important; background:transparent!important; }
  #sxHeader .sx-mobile-menu { display:flex!important; position:static!important; grid-column:1!important; grid-row:1!important; order:unset!important; width:44px!important; height:44px!important; min-width:44px!important; min-height:44px!important; margin:0!important; padding:0!important; align-items:center!important; justify-content:center!important; border:1px solid #b9d6c5!important; border-radius:10px!important; background:#09643c!important; color:#fff!important; font-size:21px!important; cursor:pointer!important; }
  #sxHeader .sx-brand-stack { grid-column:2!important; grid-row:1!important; order:unset!important; display:flex!important; justify-content:center!important; align-items:center!important; min-width:0!important; margin:0!important; padding:0!important; background:transparent!important; }
  #sxHeader .sx-brand { display:block!important; position:relative!important; width:min(100%,220px)!important; height:52px!important; margin:auto!important; background:transparent url('/assets/images/branding/sx-mobile-wordmark.png?v=8') center/contain no-repeat!important; border:0!important; box-shadow:none!important; overflow:hidden!important; }
  #sxHeader .sx-brand img { display:none!important; }
  #sxHeader .sx-brand::before,#sxHeader .sx-brand::after { display:none!important; content:none!important; }
  #sxHeader .sx-logo-live { display:none!important; }
  #sxHeader .sx-head-actions { grid-column:3!important; grid-row:1!important; order:unset!important; position:static!important; display:flex!important; align-items:center!important; justify-content:center!important; width:48px!important; margin:0!important; padding:0!important; gap:0!important; background:transparent!important; }
  #sxHeader .sx-head-actions .sx-btn-yellow { display:none!important; }
  #sxHeader .sx-head-actions [data-login-open] { display:flex!important; align-items:center!important; justify-content:center!important; width:44px!important; height:44px!important; min-width:44px!important; min-height:44px!important; padding:0!important; margin:0!important; border:0!important; background:transparent!important; color:#fff!important; font-size:0!important; box-shadow:none!important; }
  #sxHeader .sx-head-actions [data-login-open] i { font-size:23px!important; }
  #sxHeader .sx-nav { display:none!important; }
  #sxHeader.open .sx-header-inner { grid-template-rows:auto auto auto!important; row-gap:8px!important; }
  #sxHeader.open .sx-brand { display:none!important; }
  #sxHeader.open .sx-brand-stack::before { content:'MENU'; display:block; color:#ffe4a3; font-size:15px; font-weight:900; letter-spacing:.12em; }
  #sxHeader.open .sx-nav { grid-column:1/-1!important; grid-row:2!important; order:unset!important; position:static!important; display:flex!important; flex-direction:column!important; align-items:stretch!important; width:100%!important; margin:4px 0 0!important; padding:6px!important; gap:3px!important; border:1px solid #398561!important; border-radius:12px!important; background:#075333!important; box-shadow:none!important; max-height:55vh!important; overflow-y:auto!important; }
  #sxHeader.open .sx-nav a { display:block!important; padding:13px 14px!important; border:0!important; border-radius:7px!important; color:#fff!important; font-size:14px!important; font-weight:700!important; text-align:left!important; white-space:normal!important; }
  #sxHeader.open .sx-nav a:focus-visible,#sxHeader.open .sx-nav a:hover { background:#16794b!important; }
  #sxHeader.open .sx-head-actions { grid-column:1/-1!important; grid-row:3!important; width:100%!important; justify-content:stretch!important; gap:10px!important; }
  #sxHeader.open .sx-head-actions .sx-btn-yellow { display:flex!important; flex:1 1 0!important; align-items:center!important; justify-content:center!important; }
  #sxHeader.open .sx-head-actions [data-login-open] { display:flex!important; flex:1 1 0!important; width:auto!important; height:46px!important; padding:8px 12px!important; border:1px solid #b9d6c5!important; border-radius:9px!important; background:#09643c!important; font-size:13px!important; font-weight:800!important; gap:8px!important; }
  #sxHeader.open .sx-head-actions [data-login-open] i { font-size:17px!important; }
}
@media(max-width:360px) { #sxHeader .sx-header-inner { grid-template-columns:44px minmax(0,1fr) 44px!important; padding-inline:6px!important; gap:5px!important; } #sxHeader .sx-brand { height:45px!important; } }
