/* ── reset ── */
*{-webkit-tap-highlight-color:transparent;box-sizing:border-box}
body{background:#020812;color:#e2e8f0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;overscroll-behavior:none;min-height:100vh}
::-webkit-scrollbar{width:3px;height:3px}
::-webkit-scrollbar-track{background:#020812}
::-webkit-scrollbar-thumb{background:#1e3a5f;border-radius:3px}

/* ── status palette ── */
.SUR{background:rgba(255,165,0,.1);border-color:#FFA500;color:#FFA500}
.SR {background:rgba(76,175,80,.1);border-color:#4CAF50;color:#4CAF50}
.SRT{background:rgba(244,67,54,.1);border-color:#F44336;color:#F44336}
.SD {background:rgba(33,150,243,.1);border-color:#2196F3;color:#2196F3}
.DUR{background:#FFA500}.DR{background:#4CAF50}.DRT{background:#F44336}.DD{background:#2196F3}
.badge{border:1px solid;display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;white-space:nowrap;flex-shrink:0}

/* ── filter chips ── */
.chip{padding:5px 13px;border-radius:999px;border:1px solid #1e3a5f;font-size:11px;font-weight:700;cursor:pointer;transition:all .18s;color:#3a5270;background:transparent;white-space:nowrap;user-select:none}
.chip:active{transform:scale(.95)}
.chip-all  {border-color:#3b82f6;color:#3b82f6;background:rgba(59,130,246,.1)}
.chip-ur   {border-color:#FFA500;color:#FFA500;background:rgba(255,165,0,.1)}
.chip-rep  {border-color:#4CAF50;color:#4CAF50;background:rgba(76,175,80,.1)}
.chip-ret  {border-color:#F44336;color:#F44336;background:rgba(244,67,54,.1)}
.chip-del  {border-color:#2196F3;color:#2196F3;background:rgba(33,150,243,.1)}

/* ── cards / sections ── */
.jcard{background:#0a1628;border:1px solid #142236;border-radius:16px;padding:15px;cursor:pointer;transition:border-color .2s,transform .12s;-webkit-tap-highlight-color:transparent}
.jcard:active{transform:scale(.985);border-color:#1e3a5f}
.sec{background:#0a1628;border:1px solid #142236;border-radius:16px;padding:16px;margin-bottom:14px}
.sec-hd{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px;display:flex;align-items:center;gap:7px}

/* ── modal / sheet ── */
.overlay{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);display:flex;align-items:flex-end;justify-content:center}
.overlay.ctr{align-items:center;padding:16px}
.sheet{background:#08111f;width:100%;max-width:540px;border-radius:24px 24px 0 0;max-height:95vh;display:flex;flex-direction:column;border:1px solid #142236;border-bottom:none}
.sheet.mid{border-radius:20px;border:1px solid #142236;max-height:90vh}
@keyframes su{from{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}
.su{animation:su .26s cubic-bezier(.22,.7,0,1.15)}
.sbody{overflow-y:auto;flex:1;padding:20px}
.sbody::-webkit-scrollbar{width:2px}

/* ── form elements ── */
input,select,textarea{background:#0a1628;border:1px solid #1a2e4a;color:#e2e8f0;border-radius:10px;padding:9px 12px;width:100%;font-size:14px;transition:border-color .2s;-webkit-appearance:none;appearance:none;line-height:1.4}
input:focus,select:focus,textarea:focus{outline:none;border-color:#2563eb;background:#0c1e3a}
label.lbl{font-size:10px;font-weight:700;color:#3a5270;text-transform:uppercase;letter-spacing:.08em;display:block;margin-bottom:5px}
.fld{margin-bottom:13px}

/* ── product item in form ── */
.prod-card{background:#060f1e;border:1px solid #142236;border-radius:14px;padding:14px;margin-bottom:10px;position:relative}
.prod-card-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.img-box{width:72px;height:72px;border-radius:10px;border:2px dashed #1e3a5f;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0;background:#020812;color:#2a4a6b}
.img-box:hover{border-color:#3b82f6;color:#3b82f6}
.img-box img{width:100%;height:100%;object-fit:cover;border-radius:8px}

/* ── financial summary bar ── */
.fin-bar{background:linear-gradient(135deg,#060f1e,#0c1e3a);border:1px solid #1e3a5f;border-radius:16px;padding:16px;margin-bottom:14px}
.fin-cell{flex:1;text-align:center;padding:0 8px}
.fin-val{font-size:20px;font-weight:900;letter-spacing:-.5px}
.fin-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-top:2px}
.fin-div{width:1px;background:#1e3a5f;margin:4px 0}

/* ── fab ── */
.fab{position:fixed;bottom:22px;right:20px;z-index:35;width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 4px 28px rgba(37,99,235,.55);display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:transform .18s}
.fab:hover{transform:scale(1.08)}
.fab:active{transform:scale(.92)}

/* ── toast ── */
#tst{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:#0a1628;border:1px solid #1e3a5f;color:#cbd5e1;padding:10px 18px;border-radius:12px;z-index:999;font-size:13px;opacity:0;transition:opacity .22s;pointer-events:none;white-space:nowrap;max-width:90vw;font-weight:600}
#tst.on{opacity:1}

/* ── receipt canvas element ── */
.rcv{position:fixed;left:-9999px;top:0;width:1080px;background:#fff;font-family:Arial,Helvetica,sans-serif}
