.modal-backdrop:has(.pos-checkout-screen){padding:0;overflow:hidden}
.modal.pos-checkout-screen{width:100vw!important;max-width:none;height:100dvh;max-height:100dvh;margin:0;border-radius:0;display:flex;flex-direction:column;overflow:hidden;background:#20243f;font-family:Calibri,Arial,sans-serif!important}
.pos-checkout-screen .modal-head{padding:12px 24px;background:white;flex-shrink:0}.pos-checkout-screen .modal-head h2{font:700 22px Calibri,Arial,sans-serif!important}.pos-checkout-screen .modal-body{flex:1;min-height:0;padding:0!important;overflow:auto}.pos-checkout-screen .modal-foot{padding:8px 20px;background:#20243f;border:0;flex-shrink:0}
.pos-checkout-screen #payment-form{display:grid;grid-template-columns:minmax(240px,32%) minmax(340px,1fr) minmax(280px,26%);gap:16px;height:100%;padding:16px;font:16px Calibri,Arial,sans-serif}
.pos-checkout-screen :is(input,select,textarea,button,label,p,small){font-family:Calibri,Arial,sans-serif!important}.pos-checkout-screen label{font-size:16px!important}.pos-checkout-screen :is(input,select,textarea){font-size:18px!important;min-height:46px}
.checkout-ticket{background:#fafbfc;display:flex;flex-direction:column;min-height:0;border-radius:8px;overflow:hidden}.checkout-ticket header{padding:20px;background:white;border-bottom:1px solid #e3e7ec}.checkout-ticket header>strong{font-size:20px}.checkout-lines{flex:1;overflow:auto;padding:16px}.checkout-lines article{display:flex;align-items:center;gap:14px;padding:18px 0;border-bottom:1px solid #ddd}.checkout-lines article>span{flex:1}.checkout-lines small{display:block}.checkout-ticket footer{padding:22px;background:white;display:flex;justify-content:space-between;border-top:1px solid #ddd}.checkout-ticket footer>strong{color:#00a33b;font-size:24px}
.checkout-controls{background:#fff;border-radius:10px;padding:16px;overflow:auto;min-height:0;display:flex;flex-direction:column;gap:12px}.checkout-summary{background:#f1f3f5;padding:12px}.checkout-summary>div{display:flex;justify-content:space-between;padding:8px;background:#e3f8ea;color:#008a39;font-size:20px}.checkout-controls fieldset{border:1px solid #dce2e9;border-radius:8px;padding:14px;margin:0}.checkout-controls fieldset p{margin:8px 0;font-size:14px}.checkout-controls .payment-methods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.checkout-controls .method{min-height:76px;font-size:17px!important;background:#f5f6f8;border:1px solid #dce2e9;color:#414658}.checkout-controls .method.active{background:#e5ffed;border:2px solid #009d32}.checkout-controls .offline-payment-note{font-size:13px;padding:10px}.checkout-controls .permission-note{font-size:14px}
.checkout-payment-side{display:flex;flex-direction:column;gap:16px;min-height:0}.checkout-due{background:#e9ffe9;color:#009b27;border-radius:10px;padding:22px;display:flex;flex-direction:column;gap:12px;text-align:center;flex:1;justify-content:center}.checkout-due>span{font-size:28px}.checkout-due>strong{font-size:32px}.checkout-due p{color:#52685a;font-size:14px}.checkout-due label{text-align:left}.checkout-due #confirm-payment{background:#009b27;color:white;min-height:66px;font-size:20px!important;box-shadow:none}
.checkout-keypad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.checkout-keypad button{min-height:68px;border:0;border-radius:9px;background:white;color:#414658;font-size:24px!important}.checkout-keypad [data-checkout-key=pay]{grid-row:span 2;background:#009b27;color:white;font-size:20px!important}
@media(max-width:1000px){.pos-checkout-screen #payment-form{grid-template-columns:minmax(320px,1fr) minmax(260px,40%)}.checkout-ticket{display:none}}
@media(max-width:650px){.pos-checkout-screen #payment-form{display:flex;flex-direction:column;height:auto}.checkout-ticket{display:flex;min-height:180px}.checkout-controls{overflow:visible}.checkout-payment-side{min-height:550px}}

/* Own the checkout layout independently of the older register theme rules.
   Intrinsic payment content must never shrink across the keypad or header. */
.pos-checkout-screen .modal-body{overflow:hidden}
.pos-checkout-screen #payment-form{min-height:0;min-width:0;align-items:stretch}
.pos-checkout-screen .checkout-controls{min-width:0}
.pos-checkout-screen .checkout-payment-side{display:flex;flex-direction:column;grid-column:auto;min-width:0;justify-content:flex-start;overflow-y:auto;overflow-x:hidden}
.pos-checkout-screen .checkout-due{flex:0 0 auto;min-height:0;justify-content:flex-start}
.pos-checkout-screen .checkout-keypad{flex:0 0 auto}
@media(min-width:721px) and (max-height:800px){
  .pos-checkout-screen .checkout-due{padding:12px;gap:6px}
  .pos-checkout-screen .checkout-due>span{font-size:20px}
  .pos-checkout-screen .checkout-due>strong{font-size:28px}
  .pos-checkout-screen .checkout-due>p{font-size:12px}
  .pos-checkout-screen .checkout-due>label{gap:4px}
  .pos-checkout-screen .checkout-due #confirm-payment{min-height:50px;font-size:18px!important}
  .pos-checkout-screen .checkout-keypad button{min-height:48px}
}
@media(min-width:721px) and (max-width:1180px){
  .pos-checkout-screen #payment-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,38%);height:100%;gap:12px;padding:12px}
  .pos-checkout-screen .checkout-ticket{display:none}
}
@media(max-width:720px){
  .pos-checkout-screen .modal-body{overflow:auto}
  .pos-checkout-screen #payment-form{display:flex;flex-direction:column;height:auto;padding:12px}
  .pos-checkout-screen .checkout-ticket{display:flex;min-height:180px;max-height:340px}
  .pos-checkout-screen .checkout-controls{overflow:visible}
  .pos-checkout-screen .checkout-payment-side{min-height:0;overflow:visible}
}