/* Sanlucy — giao diện điện thoại cho toàn site (nạp sau site.css) */
.navToggle{display:none}
@media (max-width:820px){
  .stagingBar{font-size:11px!important;padding:3px 8px!important;font-weight:600!important}
  header.top{position:sticky;top:0;z-index:40;background:#fff;transition:transform .25s ease;box-shadow:0 1px 0 var(--line)}
  header.top.hid{transform:translateY(-100%)}
  header.top.open{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important;filter:none!important;overflow:visible!important}
  .topin{display:flex!important;align-items:center;justify-content:space-between;gap:10px;padding:8px 14px!important;width:auto!important;text-align:left!important}
  .topin .brand{display:flex!important;align-items:center;width:auto!important;padding:0!important;flex:1;min-width:0}
  .topin .brand .logo,.logo{height:34px!important;width:auto!important;margin:0!important}
  .navToggle{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 11px;cursor:pointer;order:3}
  .navToggle span{display:block;height:2px;border-radius:2px;background:#1B2530;transition:transform .2s,opacity .2s}
  header.top.open .navToggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  header.top.open .navToggle span:nth-child(2){opacity:0}
  header.top.open .navToggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  /* trong thanh: chỉ để nút "Mua ngay"; còn lại vào menu */
  .topin nav{display:flex!important;align-items:center;gap:8px;margin:0!important;white-space:nowrap!important;order:2;width:auto!important}
  .topin nav > a:not(.btn),.topin nav > .lang,.topin nav > a.btn.ghost{display:none!important}
  .topin nav > a.btn:not(.ghost){display:inline-flex!important;align-items:center;min-height:44px;padding:0 16px!important;margin:0!important;font-size:14px}
  header.top.open nav{position:fixed;left:0;right:0;top:var(--hdrH,60px);bottom:0;background:#fff;flex-direction:column;align-items:stretch;gap:0;padding:8px 18px 30px;overflow:auto;z-index:39}
  header.top.open nav > a:not(.btn),header.top.open nav > a.btn{display:flex!important;align-items:center;min-height:52px;border-bottom:1px solid var(--line);font-size:17px;color:#1B2530;margin:0!important;padding:0 4px!important;border-radius:0;background:none!important;border-left:0;border-right:0;border-top:0}
  header.top.open nav > a.btn:not(.ghost){justify-content:center;margin-top:16px!important;border-radius:999px;background:var(--accent,#E8553F)!important;color:#fff!important;border:0}
  header.top.open nav > a.btn.ghost{color:#2B8A3E!important;font-weight:700}
  header.top.open nav > .lang{display:flex!important;margin:16px 0 0!important;align-self:flex-start}
  .lang a{padding:10px 14px!important;font-size:14px!important}
  html.navOpen,html.navOpen body{overflow:hidden}
  /* nút Zalo gọn: chỉ còn biểu tượng */
  .zalo-float{display:flex!important;padding:0!important;width:54px;height:54px;justify-content:center;right:14px!important;bottom:calc(14px + env(safe-area-inset-bottom,0px))!important;transition:bottom .25s}
  .zalo-float .zt{display:none}
  .zalo-float img{width:30px!important;height:30px!important}
  body.hasCta .zalo-float{bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}
  /* chân trang: link dễ chạm */
  footer{line-height:2.1;padding-bottom:90px!important}
  footer a{display:inline-block;padding:6px 4px;min-height:32px}
}
