/* Receipt printer + tactile button — vanilla port of the ReceiptPrinter / TactileButton components. */
.rp-root,.tactile{--g1:#fcfcfc;--g2:#f9f9f9;--g3:#f0f0f0;--g4:#e8e8e8;--g8:#bbbbbb;--g9:#8d8d8d;--g11:#646464;--g12:#202020;--green9:#30a46c;--mono:"JetBrains Mono","SF Mono",ui-monospace,Menlo,Consolas,monospace}
#modal:has(.rp-root){background:transparent;box-shadow:none;border:0;padding:0;overflow-x:hidden;overflow-y:auto;width:min(24rem,calc(100vw - 32px));max-width:none;scrollbar-width:none}
#modal:has(.rp-root)::-webkit-scrollbar{display:none}
#modal:has(.rp-root)>.close,#modal:has(.rp-root) #modal-content>.eyebrow,#modal:has(.rp-root) #modal-content>h2{display:none}
.rp-root{position:relative;isolation:isolate;display:flex;width:100%;max-width:24rem;flex-direction:column;align-items:center;direction:ltr;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
.rp-machine{--printer-radius:1.5rem;--printer-inset:.75rem;--printer-inner-radius:calc(var(--printer-radius) - var(--printer-inset));position:relative;isolation:isolate;width:100%;overflow:hidden;border-radius:var(--printer-radius);border:1px solid var(--g12);background:color-mix(in oklab,var(--g11) 30%,var(--g12));padding:var(--printer-inset);padding-bottom:2rem;box-shadow:0 20px 36px -20px color-mix(in oklab,var(--g12) 55%,transparent),0 6px 14px -8px color-mix(in oklab,var(--g12) 24%,transparent),inset 0 1px 0 color-mix(in oklab,var(--g1) 14%,transparent),inset 0 -1px 0 color-mix(in oklab,var(--g12) 55%,transparent)}
.rp-machine:before{content:"";pointer-events:none;position:absolute;inset:0;z-index:0;border-radius:inherit;opacity:.3;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");background-size:180px 180px}
.rp-slot{position:absolute;inset-inline:1.5rem;bottom:var(--printer-inset);z-index:40;height:.5rem;border-radius:.25rem;border:1px solid var(--g12);background:var(--g12);box-shadow:inset 0 2px 4px 0 var(--g12)}
.rp-header{position:relative;z-index:10;display:flex;height:2.75rem;align-items:flex-start;justify-content:space-between}
.rp-mark{display:grid;place-items:center;width:30px;height:30px;margin:2px 0 0 8px;background:#5a5a58;color:var(--g12);font-weight:800;font-size:19px;line-height:1}
.rp-screen{position:relative;z-index:10;isolation:isolate;overflow:hidden;border-radius:var(--printer-inner-radius);border:1px solid var(--g12);background:var(--g12);padding:1rem;color:var(--g1);box-shadow:inset 0 2px 4px 0 color-mix(in oklab,var(--g12) 80%,transparent)}
.rp-screen:after{content:"";pointer-events:none;position:absolute;inset:0;z-index:20;border-radius:inherit;box-shadow:inset 0 0 24px 4px color-mix(in oklab,var(--g12) 52%,transparent)}
.rp-screen-inner{position:relative;z-index:10}
.rp-screen-top{display:flex;justify-content:space-between;gap:12px;margin:2px 4px 20px}
.rp-screen-top b{display:block;font-size:17px;font-weight:600;letter-spacing:-.01em}
.rp-screen-top small{display:block;margin-top:4px;color:#b4b4b4;font-size:14px}
.rp-screen-total{text-align:right;white-space:nowrap}.rp-screen-total small{margin:0 0 2px;font-size:15px}.rp-screen-total b{font-size:20px;font-weight:700}
.rp-status{display:flex;min-width:0;align-items:center;gap:.5rem;margin:0 4px 2px}
.rp-indicator{position:relative;display:grid;width:1.25rem;height:1.25rem;flex-shrink:0;place-items:center;color:var(--g8)}
.rp-indicator.done{color:var(--green9)}
.rp-spin{animation:rp-spin 1s linear infinite}@keyframes rp-spin{to{transform:rotate(360deg)}}
.rp-label{display:grid;min-width:0;flex:1;align-items:center}
.rp-label>span{grid-area:1/1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500;font-size:15px;line-height:1;color:#c8c8c8}
.rp-output{position:relative;z-index:50;margin-top:-1rem;height:32rem;width:calc(80% + 3rem);max-width:100%;overflow:hidden;padding:0 1.5rem}
.rp-shadow{display:none;pointer-events:none;position:absolute;inset-inline:1.5rem;top:-.25rem;z-index:20;height:.5rem;background:color-mix(in oklab,var(--g12) 75%,transparent);filter:blur(6px)}
.rp-root:not([data-stage=processing]) .rp-shadow{display:block}
.rp-feed{position:relative;isolation:isolate;opacity:0;transform:translateY(calc(-100% + 2px));transition:opacity .16s cubic-bezier(.23,1,.32,1)}
.rp-feed:before{content:"";pointer-events:none;position:absolute;inset:.75rem .75rem 1rem;z-index:0;border-radius:2px;box-shadow:0 8px 24px color-mix(in oklab,var(--g12) 24%,transparent)}
.rp-feed:after{content:"";pointer-events:none;position:absolute;left:8%;right:8%;bottom:0;z-index:0;height:.75rem;transform:translateY(.375rem);border-radius:9999px;background:color-mix(in oklab,var(--g12) 10%,transparent);filter:blur(16px)}
.rp-paper{position:relative;z-index:10;min-height:20rem;background:var(--g1);padding:1.75rem 1.5rem 2rem;font-family:var(--mono);color:var(--g12)}
.rp-logo{display:grid;place-items:center;width:50px;height:50px;margin:0 auto 24px;background:#333;color:var(--g1);font:800 26px/1 system-ui,sans-serif}
.rp-paper hr{border:0;border-top:1px dashed var(--g8);margin:0 0 18px}
.rp-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:11px}
.rp-item{margin-bottom:6px}.rp-item b{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:11px}
.rp-sub{color:var(--g11);font-size:11px;margin-bottom:22px;unicode-bidi:plaintext}
.rp-muted{color:var(--g11);margin-bottom:4px}
.rp-total{margin:18px 0 20px}.rp-total b{letter-spacing:.12em;font-size:12px}.rp-total strong{font-size:19px;font-weight:700}
.rp-meta{display:grid;grid-template-columns:1fr auto;gap:8px 12px;margin:0 0 24px;font-size:10px}.rp-meta dt{color:var(--g9)}.rp-meta dd{margin:0;min-width:7.6rem;unicode-bidi:plaintext}
.rp-barcode{display:flex;justify-content:center;height:34px}.rp-barcode i{display:block;height:100%;background:var(--g12)}
.rp-code{margin-top:7px;text-align:center;color:var(--g9);font-size:9px;letter-spacing:.3em}
.rp-actions{position:relative;z-index:60;display:flex;justify-content:center;gap:8px;margin-top:-1.5rem}
.rp-actions[hidden]{display:none}
/* TactileButton */
.tactile{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;height:2.75rem;padding:0 1.15rem;border-radius:.7rem;border:1px solid #1d1d1c;background:linear-gradient(180deg,#4d4d4a 0%,#3d3d3a 100%);color:#f5f5f4;font:600 15px/1 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;text-decoration:none;cursor:pointer;user-select:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.25),0 3px 0 #1f1f1e,0 5px 10px -4px rgba(0,0,0,.35);transform:translateY(0);transition:transform .12s cubic-bezier(.23,1,.32,1),box-shadow .12s cubic-bezier(.23,1,.32,1),filter .12s}
.tactile:hover{filter:brightness(1.06)}
.tactile:active,.tactile.is-pressed{transform:translateY(3px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,0,0,.25),0 0 0 #1f1f1e,0 2px 4px -2px rgba(0,0,0,.35)}
.tactile:focus-visible{outline:2px solid #8d8d8d;outline-offset:3px}
.tactile:disabled{opacity:.5;cursor:not-allowed;transform:none}
.tactile-sm{height:2.15rem;padding:0 .8rem;font-size:14px;border-radius:.6rem}
.tactile-ghost{background:linear-gradient(180deg,#fafaf9,#ececea);color:#202020;border-color:#cfcfcc;box-shadow:inset 0 1px 0 #fff,0 3px 0 #bdbdba,0 5px 10px -4px rgba(0,0,0,.2)}
.tactile-ghost:active{box-shadow:inset 0 1px 0 #fff,0 0 0 #bdbdba}
.tactile.full{width:100%}
@media (prefers-reduced-motion:reduce){.rp-spin{animation:none}.tactile{transition:none}}
/* Arabic receipt: right-to-left layout, Arabic labels, numbers kept left-to-right. */
.rp-root{direction:rtl;font-family:"Tajawal",Inter,system-ui,sans-serif}
.rp-screen-total{text-align:left}
.rp-paper{font-family:"Tajawal",var(--mono),sans-serif}
.rp-paper bdi,.rp-paper .rp-code,.rp-meta dd{font-family:var(--mono)}
.rp-item b{text-transform:none;letter-spacing:0;font-size:12.5px}
.rp-total b{letter-spacing:0;font-size:13px}
.rp-meta{font-size:11px}.rp-meta dd{min-width:0;text-align:left}
.rp-logo img,.rp-mark img{display:block;width:34px;height:auto}
.rp-mark{background:transparent!important;width:auto!important}
.rp-label>span{font-size:15px}
.rp-meta{grid-template-columns:auto 1fr}.rp-meta dt{white-space:nowrap}
.rp-meta dd{font-family:"Tajawal",sans-serif}.rp-meta dd bdi{font-family:var(--mono)}