/* Cashier component. Base, desktop focus, mobile and print rules have one owner. */
#posPanel:has(.cashier116) { padding:16px; max-width:none; }
#posPanel:has(.cashier116)>h1 { font-size:18px; margin:0 0 8px; padding:0 0 8px; }
#posBody:has(.cashier116)>h2 { display:none; }
#posPanel:has(.cashier116)>label { display:flex; gap:12px; align-items:center; margin-bottom:10px; }
#posPanel:has(.cashier116)>label select { max-width:340px; }
.cashier116 {
 display:grid!important; grid-template-columns:126px 230px 125px minmax(0,1fr);
 grid-template-areas:'top top top top' 'controls controls controls controls' 'extra extra extra extra' 'rail pay invoice invoice' 'rail pay groups products' 'rail pay actions actions' 'held held held held';
 gap:6px!important; margin:0!important; background:var(--surface,#fff); padding:12px!important;
 border:1px solid var(--line,#cad5df); border-radius:5px!important;
}
.cashier116 [hidden] { display:none!important; }
.cashier116-top { grid-area:top; display:grid; grid-template-columns:2fr 1fr 1fr; background:var(--accent-soft,#dff3fb); border:1px solid var(--line,#adc7d7); border-radius:5px; overflow:hidden; }
.cashier116-top>div { padding:8px 16px; border-inline-end:1px solid var(--line,#b4ccd8); display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; }
.cashier116-top small { font-size:12px; flex-basis:100%; color:var(--text,#17374b); }
.cashier116-top strong { font-size:32px; font-variant-numeric:tabular-nums; direction:ltr; color:var(--text,#17374b); }
.cashier116-top>div:first-child { background:var(--accent,#1386b0); }
.cashier116-top>div:first-child :is(small,strong,span) { color:white; }
.cashier116-controls { grid-area:controls; display:flex; gap:10px; }
.cashier116-controls>label { flex:1; display:flex; align-items:center; gap:10px; }
.cashier116-controls input { flex:1; height:40px; }
.cashier116-controls>[data-focus116] { white-space:nowrap; min-height:40px; font-size:12px; padding:6px 12px; }
.cashier117-service { display:flex; align-items:center; gap:8px; }
.cashier117-service label { display:flex; align-items:center; gap:4px; white-space:nowrap; font-size:12px; }
.cashier117-service input { width:65px!important; }
.cashier117-service select { width:105px!important; }
.cashier116-extra { margin:0!important; grid-area:extra; background:var(--surface-2,#f4f7fa); padding:8px 12px; border:1px solid var(--line,#cbd5e1); border-radius:4px; }
.cashier116-extra summary { font-size:12px; cursor:pointer; }
.cashier116-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding-top:12px; }
.cashier116-fields>label { min-width:0; display:flex; flex-direction:column; gap:5px; }
.cashier116-fields :is(input,select) { width:100%; min-width:0; height:36px; }
.cashier116-invoice { grid-area:invoice; min-width:0; background:var(--surface,#fff); border:1px solid var(--line,#cbd5e1); border-radius:4px; overflow:hidden; min-height:190px; }
#posCart { overflow-x:auto; max-height:320px; }
#posCart table { width:100%; min-width:620px; border-collapse:collapse; }
#posCart th { position:sticky; top:0; font-size:12px; background:var(--accent-soft,#dceff6); padding:8px; }
#posCart td { padding:6px 8px; font-size:13px; border:1px solid var(--line,#d0dee5); }
#posCart tbody tr:nth-child(even) { background:var(--accent-soft,#e8f7fb); }
#posCart input { height:34px; min-width:70px; width:95px; direction:ltr; font-variant-numeric:tabular-nums; padding:5px; }
#posCart td:first-child { min-width:170px; }
#posCart button { padding:6px; font-size:11px; min-height:32px; }
#posCart>p { margin:8px 12px; font-weight:bold; }
.cashier117-selected { outline:2px solid var(--accent,#118bb3); outline-offset:-2px; }
.cashier116-products { grid-area:products; min-width:0; border:1px solid var(--line,#cbd5e1); border-radius:4px; padding:8px; max-height:420px; overflow:auto; }
#posCatalog { display:grid!important; grid-template-columns:repeat(auto-fill,minmax(125px,1fr)); gap:6px!important; }
#posCatalog button { min-height:82px; padding:10px 7px!important; font-size:12px; font-weight:600; line-height:1.6; background:var(--surface-soft,var(--accent-soft,#e3f1d2)); color:var(--text,#183644); border:1px solid var(--line,#b8ccab); border-radius:5px; overflow-wrap:anywhere; }
#posCatalog button:hover { border-color:var(--accent,#008cca); background:var(--accent-soft,#d9f4fd); }
#posCatalog img { display:block; margin:auto auto 4px; object-fit:cover; border-radius:4px; }
.cashier116-categories { grid-area:groups; background:var(--surface-2,#f1f6fa); border:1px solid var(--line,#ccd6df); border-radius:4px; padding:8px; min-width:0; }
.cashier116-categories h3 { font-size:12px; margin:3px 0 8px; }
.cashier116-categories button { display:block; width:100%; margin-bottom:5px; min-height:42px; font-size:12px; border-radius:3px; padding:6px; background:var(--surface,#fff); color:var(--text,#21415a); }
.cashier116-categories button[aria-pressed=true] { background:var(--accent,#0888b8); color:white; }
.cashier116-categories>label { display:block; font-size:11px; margin-top:10px; }
.cashier116-categories select { max-width:100%; font-size:11px; height:34px; }
.cashier116-pay { grid-area:pay; background:var(--surface-2,#f2f7fa); border:1px solid var(--line,#bdcedb); border-radius:5px; padding:7px; min-width:0; overflow:auto; }
.cashier116-pay h3 { font-size:14px; margin:5px 0; }
.cashier116-pay p { font-size:11px; line-height:1.6; }
.cashier116-pay>label:has(#posConfirm) { display:flex; gap:6px; align-items:center; font-size:10px; margin:8px 0; }
.cashier116-pay input[type=checkbox] { width:20px; height:20px; flex:none; }
.cashier116-pay .pos-tender { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:8px; padding:6px; background:var(--surface,#fff); border-radius:4px; }
.cashier116-pay .pos-tender label { display:flex; flex-direction:column; font-size:11px; min-width:0; gap:3px; }
.cashier116-pay .pos-tender :is(input,select) { width:100%; min-width:0; height:34px; font-size:12px; padding:5px; }
.cashier116-pay .pos-tender button { min-height:28px; font-size:10px; padding:5px; }
.cashier116-pay .equivalent83 { font-size:10px; margin:0; }
.cashier116-pay #posPaymentTotal { padding:6px; background:var(--accent-soft,#e0f2fa); font-size:12px; font-weight:bold; }
#posAddPayment { width:100%; min-height:34px; font-size:12px; padding:6px; }
.cashier117-payment { margin:0!important; padding:4px!important; }
.cashier117-payment>summary { font-size:11px; padding:5px; cursor:pointer; }
.cashier117-payment[open] { max-height:220px; overflow:auto; }
.cashier116-help { padding:3px!important; margin:3px 0!important; border:0!important; font-size:11px; }
.cashier116-help>summary { cursor:pointer; padding:4px!important; font-size:11px; }
.cashier116-keypad { margin-top:6px; }
.cashier116-keypad>div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; direction:ltr; }
.cashier116-keypad button { font-size:18px; min-height:36px; border-radius:4px; padding:4px; background:var(--accent-soft,#d7ebf8); color:var(--text,#0c4974); border:1px solid var(--line,#b5cde2); }
.cashier116-keypad [data-key117=Enter] { grid-row:span 2; font-size:14px; background:var(--accent,#1688b5); color:#fff; }
.cashier117-entry { display:flex; flex-direction:column; gap:5px; }
.cashier117-entry input { height:40px; font-size:24px; text-align:right; direction:ltr; width:100%; min-width:0; background:var(--surface,#fff); border:2px solid var(--accent,#1688b5); }
.cashier117-entry small { font-size:10px; min-height:24px; }
.cashier116-actions { grid-area:actions; display:flex; flex-wrap:wrap; align-items:start; align-content:start; gap:5px; border-top:1px solid var(--line,#cbd5e1); padding-top:4px; }
.cashier116-actions>button { flex:1 1 95px; height:38px; min-height:38px; font-size:12px; font-weight:bold; border-radius:4px; }
.cashier116-actions #posCheckout { background:#138a52; color:white; }
.cashier116-actions #posHold { background:#aa7914; color:white; }
.cashier116-actions #posClear { background:#c53f44; color:white; }
.cashier117-quick { display:flex; gap:5px; flex:1 1 100%; justify-content:flex-end; }
.cashier117-quick button { flex:1; height:36px!important; min-height:36px!important; font-size:12px!important; color:#fff; max-width:150px; }
.cashier117-rail { grid-area:rail; display:flex; flex-direction:column; gap:4px; min-width:0; overflow:auto; }
.cashier117-rail button { flex:1; min-height:28px; padding:4px; font-size:11px; border-radius:3px; }
.cashier116-held { grid-area:held; font-size:12px; padding:5px!important; margin:0!important; }
.cashier116-held summary { cursor:pointer; padding:8px; background:var(--surface-2,#f1f6fa); }
.cashier-focus116 #appShell>aside { display:none!important; }
.cashier-focus116 #appShell { grid-template-columns:minmax(0,1fr); }
.cashier-focus116 main { padding:12px; }
.cashier-focus116>header,.cashier-focus116>.notice,.cashier-focus116>.session-bar,.cashier-focus116 .workspace-heading { display:none!important; }
.cashier-focus116 #posPanel>h1,.cashier-focus116 main>#status { display:none; }
.cashier117-settings { margin-top:20px; }
.cashier117-setting-row { display:flex; gap:8px; align-items:end; flex-wrap:wrap; padding:10px; border-bottom:1px solid var(--line,#ddd); }
.cashier117-setting-row label { display:flex; flex-direction:column; font-size:12px; gap:4px; }
.cashier117-setting-row input[type=color] { width:60px; }
.cashier117-setting-row label:has([type=checkbox]) { flex-direction:row; align-items:center; }
.cashier117-setting-row button { min-height:34px; padding:7px; }

/* Fixed-height desktop workstation: only lists and expanded details scroll. */
@media(min-width:901px) {
 .cashier-focus116 main { height:100dvh; padding:6px; overflow:hidden; }
 .cashier-focus116 #posPanel:has(.cashier117) { height:100%; margin:0; padding:4px; display:flex; flex-direction:column; }
 .cashier-focus116 #posPanel>label { margin:0 0 4px; font-size:11px; min-height:28px; }
 .cashier-focus116 #posPanel>label select { height:28px; font-size:11px; padding:3px; }
 .cashier-focus116 #posStatus:empty { display:none; }
 .cashier-focus116 #posStatus { font-size:11px; margin:0; max-height:28px; overflow:auto; }
 .cashier-focus116 #posBody { flex:1; min-height:0; }
 .cashier-focus116 .cashier117 { height:100%; box-sizing:border-box; grid-template-rows:58px 36px auto minmax(110px,1fr) minmax(120px,1fr) 84px 0; padding:5px!important; }
 .cashier-focus116 .cashier117 .cashier116-top strong { font-size:26px; }
 .cashier-focus116 .cashier117 .cashier116-top>div { padding:4px 10px; }
 .cashier-focus116 .cashier117 .cashier116-top small { font-size:10px; }
 .cashier-focus116 .cashier117 .cashier116-controls :is(input,button,select) { height:32px; min-height:32px; padding:4px; }
 .cashier-focus116 .cashier117 .cashier116-controls label { font-size:11px; }
 .cashier-focus116 .cashier117 .cashier116-extra { padding:3px 8px; }
 .cashier-focus116 .cashier117 .cashier116-extra[open] { max-height:160px; overflow:auto; }
 .cashier-focus116 .cashier117 .cashier116-invoice { min-height:0; height:100%; }
 .cashier-focus116 .cashier117 #posCart { max-height:none; height:100%; overflow:auto; }
 .cashier-focus116 .cashier117 #posCart td { padding:3px 5px; }
 .cashier-focus116 .cashier117 #posCart input { height:28px; }
 .cashier-focus116 .cashier117 :is(.cashier116-products,.cashier116-categories) { min-height:0; max-height:none; overflow:auto; padding:5px; }
 .cashier-focus116 .cashier117 #posCatalog { grid-template-columns:repeat(auto-fill,minmax(105px,1fr)); gap:4px!important; }
 .cashier-focus116 .cashier117 #posCatalog button { min-height:60px; font-size:11px; padding:5px!important; }
 .cashier117-quick { min-width:0; overflow-x:auto; flex-wrap:nowrap; }
 .cashier117-quick button { flex:0 0 110px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
 .cashier117 .cashier116-held { padding:0!important; }
 .cashier117 .cashier116-held:not([open]) { display:none!important; }
 .cashier117 .cashier116-held[open] { position:fixed; z-index:40; inset:15% 20%; overflow:auto; box-shadow:0 10px 60px #0006; background:var(--surface,#fff); border:2px solid var(--accent,#1688b5); padding:15px!important; }
 .cashier117 .cashier116-held summary { font-size:15px; }
 .cashier117 .cashier116-held summary:after { content:' — اضغط للإغلاق'; }
}
@media(max-width:1100px) and (min-width:901px) {
 .cashier116 { grid-template-columns:110px 210px 100px minmax(0,1fr); }
 .cashier116-fields { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .cashier116-controls { gap:5px; }
 .cashier116-categories button { min-width:0; width:100%; min-height:32px; font-size:10px; }
}
@media(max-width:900px) {
 #posPanel:has(.cashier116) { padding:10px; }
 .cashier116 { grid-template-columns:minmax(0,1fr); grid-template-areas:'top' 'controls' 'extra' 'invoice' 'groups' 'products' 'pay' 'actions' 'rail' 'held'; padding:6px!important; }
 .cashier116-top { grid-template-columns:1fr 1fr; }
 .cashier116-top>div:first-child { grid-column:1/-1; }
 .cashier116-top>div { padding:8px 12px; }
 .cashier116-top strong { font-size:28px; }
 .cashier116-controls { flex-wrap:wrap; }
 .cashier116-controls>label { flex-basis:100%; flex-direction:column; align-items:stretch; }
 .cashier117-service { flex-wrap:wrap; }
 .cashier116-fields { grid-template-columns:minmax(0,1fr); }
 .cashier116-invoice { min-height:160px; }
 .cashier116-products { max-height:300px; }
 #posCatalog { grid-template-columns:repeat(2,minmax(0,1fr)); }
 #posCatalog button { min-height:75px; }
 .cashier116-categories [data-groups116] { display:flex; flex-wrap:wrap; gap:5px; }
 .cashier116-categories button { width:auto; flex:1; min-width:110px; }
 .cashier116-keypad button { min-height:46px; }
 .cashier117-rail { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
 .cashier117-rail button { min-height:40px; }
 .cashier117-quick { flex-wrap:wrap; }
 .cashier117-quick button { min-width:90px; }
 #posPanel:has(.cashier116)>label { flex-direction:column; align-items:stretch; }
}
@media print {
 .cashier116-pay,.cashier116-products,.cashier116-categories,.cashier116-actions,.cashier116-controls,.cashier116-extra,.cashier116-held,.cashier117-rail { display:none!important; }
 .cashier116 { display:block!important; }
 .cashier116-top strong,.cashier116-top small { color:#000!important; }
 .cashier116-top>div { background:#fff!important; }
}

/*253: prioritize five compact cart rows; notes belong to individual items. */
#posCart .pos-note253{display:block;width:100%;min-width:100px;height:23px!important;font-size:11px;padding:2px 4px;margin-top:2px}
@media(min-width:901px){
.cashier-focus116 .cashier117{grid-template-rows:50px 34px auto minmax(300px,2fr) minmax(80px,.65fr) 60px 0!important}
.cashier-focus116 .cashier117 #posCatalog button{min-height:50px;padding:3px!important;font-size:11px}
.cashier-focus116 .cashier117 #posCart td{padding:2px 4px}
.cashier-focus116 .cashier117 #posCart th{padding:4px}
}

#posBody .receipt-density256{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;border:1px solid var(--line,#cbd5e1);border-radius:8px}
#posBody .receipt-density256 label{display:flex;align-items:center;gap:8px;padding:12px;border:2px solid var(--line,#cbd5e1);border-radius:8px;cursor:pointer}
#posBody .receipt-density256 label:has(input:checked){border-color:var(--accent,#445bd4);background:var(--accent-soft,#edf1ff)}

.receipt146-controls .receipt-style257{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.receipt-style257>small{grid-column:1/-1}@media(max-width:640px){.receipt146-controls .receipt-style257{grid-template-columns:1fr}}