/* XIM4 POS Web — black & red, iPhone-friendly overrides */
:root{--bg:#0b0b0d;--p:#16171a;--p2:#202227;--line:#2c2f36;--red:#e3262f;--redbg:rgba(227,38,47,.15)}
html,body{-webkit-text-size-adjust:100%;overscroll-behavior:none}
body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.au-lic{display:none!important}
.web-hint{text-align:center;margin-top:-4px}
button,.btn,.nav,select,input,a{touch-action:manipulation}
input,select,textarea{font-size:16px!important} /* stop iOS zoom */
.rcpt-md{width:min(560px,96vw);max-width:96vw;height:90vh;display:flex;flex-direction:column}
.rcpt-md iframe{flex:1;width:100%;border:0;background:#fff;border-radius:8px}
.shop-logo{height:34px;max-width:70px;object-fit:contain;border-radius:6px;background:#fff;padding:2px;margin-inline-end:6px}
.logo-prev{width:110px;height:80px;border:1px dashed var(--line);border-radius:10px;display:grid;place-items:center;background:#fff;overflow:hidden}
.logo-prev img{max-width:100%;max-height:100%;object-fit:contain}
.mnav{display:none}#mscrim{display:none}
@media (max-width:820px){
 html,body{overflow:auto;height:auto;min-height:100%}
 .app{display:block!important;height:auto!important;min-height:100vh}
 .tree-side{position:fixed!important;top:0;bottom:0;inset-inline-start:0;width:min(86vw,320px)!important;z-index:60;transform:translateX(110%);transition:transform .2s;padding-top:env(safe-area-inset-top);overflow:auto}
 html[dir=ltr] .tree-side{transform:translateX(-110%)}
 body.navopen .tree-side{transform:none!important}
 body.navopen #mscrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:55}
 .tree-side.col{width:min(86vw,320px)!important}
 .mnav{display:grid;place-items:center;position:fixed;z-index:70;top:calc(8px + env(safe-area-inset-top));inset-inline-start:8px;width:46px;height:46px;font-size:22px;border-radius:12px;background:var(--red)!important;color:#fff;border:0}
 .work{width:100%!important;height:auto!important;padding-top:58px}
 .wtabs{overflow-x:auto;white-space:nowrap;padding-inline-start:60px;position:fixed;top:env(safe-area-inset-top);left:0;right:0;height:62px;z-index:50;background:var(--bg);display:flex;align-items:center}
 .main{height:auto!important;overflow:visible!important;padding:8px!important}
 .btn,.nav2,.ts,.tmh{min-height:44px}
 .ts,.tmh{display:flex;align-items:center}
 .grid.g2,.grid.g3,.grid.g4{grid-template-columns:1fr!important}
 .top{flex-wrap:wrap;gap:6px}
 table{font-size:13px}
 .card{overflow-x:auto}
 .md,.md.wide{width:96vw!important;max-width:96vw!important;max-height:92vh;overflow:auto}
 .au-wrap{flex-direction:column!important;width:100%!important;padding:12px}
 .au-side{display:none!important}
 .au-card{width:100%!important;max-width:none!important}
 .login{height:auto!important;min-height:100vh;overflow:auto}
}
@media (max-width:820px){
 .pos{display:flex!important;flex-direction:column;gap:10px}
 .pos .keys{display:none!important}
 .scan{flex-direction:column}
 #cust{width:100%!important}
 .pos .card.scroll{min-height:180px;max-height:none}
 .pays{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
 .pays .btn{min-height:56px;font-size:16px}
 .pos .row{flex-wrap:wrap;gap:6px}
 .kbd{display:none}
 .top h1{font-size:20px}
}