/* Mobile layout fix for independent retail company demos. */
@media(max-width:640px){
 html,body{max-width:100%;overflow-x:clip}
 .app-shell,.main{width:100%;min-width:0;max-width:100%}
 .sidebar{width:100%;min-width:0;max-width:100%;overflow-x:auto}
 .topbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:flex-start;width:100%;min-width:0}
 .topbar>div:first-child{flex:1 1 100%;min-width:0}
 .top-actions{display:flex;flex:1 1 100%;width:100%;min-width:0;gap:7px;flex-wrap:wrap}
 .top-actions .btn{font-size:10px;padding:8px 10px}
 .top-actions .icon-button{padding:8px 10px}
 .top-actions .pill{display:none}
 .content{min-width:0;width:100%;overflow-x:clip}
 .pos-grid,.panel,.products,.product,.hero{min-width:0}
 .hero h1{overflow-wrap:anywhere;word-break:normal}
}