/* Case Packet Sorter: extras on top of the Postal Control Center styles (style.css + crm.css). */
:root{--nop:#2e90fa;--ef:#7a5af8;--pet:#12b76a;--other:#98a2b3}
.small{font-size:12.5px}
.t-red{color:#d92d20} html[data-theme="dark"] .t-red{color:#f97066}
.mono{font-family:Consolas,"Cascadia Mono",monospace}
.dot{width:9px;height:9px;border-radius:3px;display:inline-block;flex:none}
.dot.NOP{background:var(--nop)} .dot.EF{background:var(--ef)} .dot.PET{background:var(--pet)} .dot.OTHER{background:var(--other)}
.crumbs a{color:var(--muted);text-decoration:none} .crumbs a:hover{color:var(--accent)}
.phead p{margin:2px 0 0}

/* upload box in the page header (like the postal "Choose or drop Excel…") */
.pickbox{display:inline-flex;align-items:center;min-width:250px;max-width:380px;height:40px;padding:0 14px;border:1.5px dashed var(--line2);border-radius:10px;
  color:var(--muted);font-size:14px;cursor:pointer;background:var(--card-bg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:border-color .2s,background-color .2s,color .2s}
.pickbox span{overflow:hidden;text-overflow:ellipsis}
.pickbox:hover,.pickbox:focus-visible{border-color:var(--accent);color:var(--ink);outline:none}
.pickbox.has{border-style:solid;border-color:var(--accent);color:var(--accent);background:var(--accent-soft);font-weight:600}
.up2.drag .pickbox{border-color:var(--accent);background:var(--accent-soft)}
.up2.pulse{animation:pulse 1.2s ease 2}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(79,70,229,0)}50%{box-shadow:0 0 0 6px rgba(79,70,229,.22)}}
.up2 .btn[disabled]{opacity:.55;pointer-events:none}

.sortprog{padding:14px 18px;margin-bottom:14px;animation:rise .4s both}
.sortprog .sp-row{display:flex;align-items:center;gap:12px}
.sortprog .sp{flex:1}
.sortprog .spin{width:22px;height:22px;border-radius:50%;border:3px solid var(--accent-soft);border-top-color:var(--accent);animation:spinr .8s linear infinite;flex:none}
@keyframes spinr{to{transform:rotate(360deg)}}
.sp-bar{height:8px;border-radius:6px;background:var(--glass2);overflow:hidden;margin-top:12px}
.sp-bar i{display:block;height:100%;width:2%;background:var(--accent);border-radius:6px;transition:width .5s ease}
.batchbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 16px;margin-bottom:12px;font-size:14px}
.batchbar .sp{flex:1}

/* parts row (re-uses the postal pipeline look) */
.pipe.parts .stg{cursor:default}
.part-NOP .stg-bar span{background:var(--nop)} .part-EF .stg-bar span{background:var(--ef)} .part-PET .stg-bar span{background:var(--pet)} .part-OTHER .stg-bar span{background:var(--other)}
.stg-h .dot{border-radius:50%}

/* case cards */
.cases2 .hd{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}
.cases2 .hd .sp{flex:1}
.hint-click{font-size:12.5px}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:12px;padding:14px;background:var(--raise)}
.cgrid.swap{animation:swap .35s ease both}
a.kc{text-decoration:none;color:inherit}
.kc-m{font-size:16px!important;letter-spacing:-.01em}
.kc-addr{display:flex;gap:6px;align-items:flex-start;font-size:12.5px;color:var(--ink)}
.kc-addr .ico{width:14px;height:14px;color:var(--faint);margin-top:2px}
.pbar{display:flex;height:8px;border-radius:5px;overflow:hidden;background:var(--glass2);gap:2px;min-width:120px}
.pbar i{display:block;height:100%;transform-origin:left;animation:grow .7s cubic-bezier(.2,.7,.2,1) .15s both}
.pbar i.NOP{background:var(--nop)} .pbar i.EF{background:var(--ef)} .pbar i.PET{background:var(--pet)} .pbar i.OTHER{background:var(--other)}
.kc-legend{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--muted)}
.kc-legend span{display:inline-flex;align-items:center;gap:5px}
.kc .flag{font-size:12px;color:#b42318;background:#fef3f2;border:1px solid #fecdca;border-radius:8px;padding:4px 8px}
html[data-theme="dark"] .kc .flag{background:rgba(240,68,56,.1);border-color:rgba(240,68,56,.35);color:#fda29b}
.kc-foot .open{color:var(--accent);font-weight:600;margin-left:10px}
.kc:hover .kc-foot .open{text-decoration:underline}
.ctable{width:100%;border-collapse:collapse}
.ctable th{text-align:left;font-size:12px;color:var(--muted);font-weight:600;padding:10px 12px;background:var(--th);border-bottom:1px solid var(--line)}
.ctable td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top;font-size:13.5px}
.ctable tbody tr{cursor:pointer;transition:background-color .15s}
.ctable tbody tr:hover{background:var(--hover)}
.ctable .tname{font-weight:600;color:var(--hd);text-decoration:none} .ctable .tname:hover{color:var(--accent)}
.ctable .jobid{color:var(--accent);font-weight:600;font-size:13px}

.firstrun{padding:48px 24px;text-align:center}
.firstrun .fr-ic{width:64px;height:64px;margin:0 auto 12px;border-radius:18px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.firstrun .fr-ic svg{width:34px;height:34px}
.firstrun h2{font-size:20px;color:var(--hd);margin:0 0 6px}
.firstrun p{max-width:560px;margin:0 auto 16px;line-height:1.6}
.order{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center}
.order .blk{padding:7px 12px;border-radius:9px;color:#fff;font-weight:600;font-size:13px}
.blk.NOP{background:var(--nop)} .blk.EF{background:var(--ef)} .blk.PET{background:var(--pet)}
.order i{font-style:normal;color:var(--faint)}

/* ---------- case page ---------- */
.case-head{display:flex;gap:20px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;padding:20px 22px;margin-bottom:12px;animation:rise .45s both}
.case-head h1{font-size:28px;letter-spacing:-.02em;color:var(--hd);margin:2px 0 2px}
.ch-sub{font-size:15px;color:var(--muted)}
.ch-addr{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:14px;color:var(--ink)}
.ch-addr .ico{width:15px;height:15px;color:var(--faint)}
.ch-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.ch-side .btn{display:inline-flex;align-items:center;gap:7px}
.prevnext{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch;margin-bottom:12px}
.pn{display:flex;flex-direction:column;gap:1px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card-bg);text-decoration:none;color:inherit;transition:border-color .2s,transform .2s}
.pn:hover{border-color:var(--accent);transform:translateY(-1px)}
.pn span{font-size:12px;color:var(--muted)} .pn b{color:var(--hd);font-size:14.5px} .pn em{font-style:normal;font-size:12px;color:var(--accent)}
.pn.next{text-align:right;align-items:flex-end}
.pn.none{border:0;background:none}
.pn-pos{align-self:center;text-align:center;font-size:12.5px;color:var(--muted);line-height:1.5}
.flash.keep{margin-bottom:12px}
.case-grid{display:grid;grid-template-columns:minmax(300px,400px) minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:1100px){.case-grid{grid-template-columns:1fr}}
.cg-left{display:flex;flex-direction:column;gap:14px}
.facts,.partlist{padding:16px}
.facts h4,.partlist h4{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 10px;display:flex;align-items:center;gap:6px}
.partlist h4 span{font-size:11px;background:var(--glass2);border:1px solid var(--line);border-radius:999px;padding:0 7px;color:var(--ink);letter-spacing:0;text-transform:none}
.facts .dgrid .wide{grid-column:1 / -1}
.facts .notes{margin:10px 0 0;padding-left:18px;color:var(--muted);font-size:12.5px}
.psec{border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:10px;border-top:3px solid var(--sec,var(--line2));background:var(--raise)}
.psec[data-sec="NOP"]{--sec:var(--nop)} .psec[data-sec="EF"]{--sec:var(--ef)} .psec[data-sec="PET"]{--sec:var(--pet)} .psec[data-sec="OTHER"]{--sec:var(--other)}
.psec-h{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:13.5px}
.psec-h b{color:var(--hd)} .psec-h .sp{flex:1}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(62px,1fr));gap:7px}
.th{position:relative;padding:0;border:2px solid transparent;border-radius:7px;overflow:hidden;background:#fff;cursor:pointer;transition:transform .15s,border-color .15s,box-shadow .15s}
.th:hover{transform:translateY(-2px);box-shadow:0 8px 16px -10px var(--shadow2)}
.th.on{border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,70,229,.2)}
.th img{display:block;width:100%;aspect-ratio:612/792;object-fit:cover}
.th .no{position:absolute;left:3px;bottom:3px;background:rgba(16,24,40,.8);color:#fff;font-size:10.5px;font-weight:700;padding:0 5px;border-radius:5px}
.th .scan{position:absolute;right:3px;top:3px;background:var(--ef);color:#fff;font-size:9px;font-weight:700;padding:0 4px;border-radius:4px}
.viewer{overflow:hidden;display:flex;flex-direction:column;position:sticky;top:68px}
.vbar2{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.vbar2 b{color:var(--hd)} .vbar2 .sp{flex:1}
.tag{font-size:12px;padding:2px 9px;border-radius:99px;color:#fff;font-weight:600}
.tag.NOP{background:var(--nop)} .tag.EF{background:var(--ef)} .tag.PET{background:var(--pet)} .tag.OTHER{background:var(--other)}
.facts2{padding:8px 14px;border-bottom:1px solid var(--line);background:var(--raise)}
.facts2 b{color:var(--ink);font-weight:600}
.stage{overflow:auto;background:var(--pdf-bg);padding:16px;display:flex;justify-content:center;height:calc(100vh - 180px);min-height:420px}
.stage img{width:100%;max-width:820px;height:auto;align-self:flex-start;background:#fff;box-shadow:0 10px 30px -10px rgba(16,24,40,.35);border-radius:2px;animation:fadein .25s both}

/* ---------- sort history ---------- */
.hist{display:flex;flex-direction:column;gap:10px}
.hrun{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:14px 18px;animation:rise .45s both;animation-delay:calc(var(--i) * 50ms)}
.hr-t{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--hd)}
.hr-names{font-size:14px;color:var(--ink);margin:3px 0 2px}
.hr-act{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.hr-act form{margin:0}
.btn.ghost{background:none;box-shadow:none;color:var(--muted)}
.review-grid{display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:14px}
@media (max-width:900px){.review-grid{grid-template-columns:1fr}.prevnext{grid-template-columns:1fr 1fr}.pn-pos{display:none}}

.flash[hidden],.sortprog[hidden]{display:none!important}