/* The existing POS remains the only payment screen. Each column owns its
   native scroll; short viewports must never clip payment controls. */
html#tr-management-layout body:not(.customer-direct) #posCheckout.on{
 box-sizing:border-box;top:var(--app-visible-top,0px)!important;bottom:auto!important;
 height:var(--app-visible-height,100dvh)!important;max-height:var(--app-visible-height,100dvh)!important;
 padding:12px!important;overflow:hidden!important;align-items:stretch!important
}
html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active){
 height:100%!important;min-height:0!important;max-height:100%!important;
 grid-template-columns:minmax(0,1fr) minmax(300px,390px);overflow:hidden!important
}
html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active)>:is(.pos-summary,.pos-padarea){
 display:block!important;box-sizing:border-box;height:100%;min-height:0!important;min-width:0;
 overflow-y:auto!important;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:16px!important
}
html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active) .pos-summary>header{
 position:sticky!important;top:-16px;z-index:2;gap:12px;background:#fff;padding:12px 0!important
}
html#tr-management-layout #posCheckout .pos-summary>header>div{min-width:0;overflow-wrap:anywhere}
html#tr-management-layout #posCheckout .pos-summary h2{font-size:22px}
html#tr-management-layout #posCheckout .pos-close{flex:none;min-width:70px}
html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active) .pos-lines{
 max-height:none!important;min-height:0!important;overflow:visible!important
}
html#tr-management-layout #posCheckout :is(.pos-qty button,.pos-close,.pos-actions button,.pos-discounts button,.pos-methods button,.pos-docs button,.pos-quick button,.equal-split-box button){
 box-sizing:border-box;min-height:44px!important;min-width:44px!important;height:auto!important;
 padding:10px 12px!important;font-size:14px!important;line-height:1.3;white-space:normal;word-break:normal
}
html#tr-management-layout #posCheckout .pos-qty button{width:44px!important;padding:8px!important}
html#tr-management-layout #posCheckout .pos-line-check{width:28px!important;height:28px!important}
html#tr-management-layout #posCheckout .pos-variants{white-space:normal!important;overflow:visible!important;text-overflow:clip;max-width:100%;overflow-wrap:anywhere}
html#tr-management-layout #posCheckout .pos-totals p{gap:12px;flex-wrap:wrap}
html#tr-management-layout #posCheckout .pos-totals p>b{white-space:nowrap;margin-left:auto}
html#tr-management-layout #posCheckout .pos-complete{min-height:52px!important;white-space:normal;padding:12px!important}
@media(max-width:1000px){
 html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 html#tr-management-layout #posCheckout .pos-line{grid-template-columns:28px minmax(0,1fr)!important}
 html#tr-management-layout #posCheckout .pos-line-side{grid-column:2;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
}
@media(max-width:700px){
 html#tr-management-layout body:not(.customer-direct) #posCheckout.on{padding:8px!important}
 html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active){display:block;overflow-y:auto!important;overscroll-behavior:contain}
 html#tr-management-layout #posCheckout .pos-shell:not(.equal-split-active)>:is(.pos-summary,.pos-padarea){height:auto;overflow:visible!important}
}