/* qc module styles — owned by the qc module; use the variables from css/app.css only. The .qcf-* form kit is shared with the Test module (js/test.js). */
/* ── the inspection form (modal) ── */
.qcf-title{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:4px} .qcf-title h3{margin:0;font-size:17px;font-weight:800;letter-spacing:-.01em}
.qcf{width:min(1040px,92vw);display:flex;flex-direction:column;gap:10px}
.qcf-sec{border:1px solid var(--rule);border-radius:12px;padding:12px 14px;background:var(--paper)}
.qcf-h{display:flex;align-items:center;gap:8px;margin:0 0 10px;flex-wrap:wrap}
.qcf-h i{font-style:normal;width:22px;height:22px;border-radius:50%;background:var(--indigo-l);color:var(--indigo);display:grid;place-items:center;font-size:11.5px;font-weight:800;flex:none}
.qcf-h b{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.qcf-hint{font-size:11.5px;color:var(--ink3);font-weight:500;flex:1}
.qcf-req{color:var(--red);font-style:normal;font-weight:800;margin-left:2px}
.qcf-auto{display:flex;flex-wrap:wrap;gap:8px 24px;background:var(--hover);border:1px solid var(--rule);border-radius:10px;padding:8px 12px}
.qcf-auto div span{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)} .qcf-auto div b{font-size:13.5px} .qcf-auto small{font-weight:600}
.qcf-build{font-size:12px;color:var(--ink2);margin-top:6px;line-height:1.4}
.qcf-jobpick{display:grid;grid-template-columns:1.2fr 1fr;gap:10px 14px;margin-bottom:8px}
.qcf-f .qcf-l,.qcf-f>span{display:block;font-size:11.5px;font-weight:700;color:var(--ink2);letter-spacing:.02em;margin-bottom:5px}
.qcf-err{color:var(--red);font-size:11.5px;font-weight:700;min-height:0;margin-top:3px} .qcf-err:empty{display:none}
.qcf-bad input,.qcf-bad select,.qcf-bad textarea{border-color:var(--red);box-shadow:0 0 0 3px var(--red-l)}
.qcf-bad .qcf-pick,.qcf-bad .qcf-res{border-radius:10px;box-shadow:0 0 0 2px var(--red);padding:3px}
/* inspection pickers: pill buttons instead of selects */
.qcf-insp{display:grid;grid-template-columns:1.6fr 1fr 1.1fr;gap:12px 16px}
.qcf-pick{display:flex;flex-wrap:wrap;gap:6px}
.qcf-pick button{border:1px solid var(--rule);background:var(--paper2);color:var(--ink2);border-radius:999px;padding:5px 12px;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;line-height:1.4}
.qcf-pick button:hover{border-color:var(--indigo);color:var(--indigo)} .qcf-pick button.on{background:var(--indigo);border-color:var(--indigo);color:var(--on-accent,#fff)}
.qcf-meta{display:grid;grid-template-columns:1.2fr 1.1fr .7fr 1.5fr;gap:10px 14px;margin-top:12px;align-items:end}
.qcf-meta input,.qcf-meta select{width:100%} .qcf-meta input[type=datetime-local]{font-size:12.5px}
/* quantities + result side by side */
.qcf-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.qcf-qty{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.qcf-num span{text-transform:uppercase;letter-spacing:.06em;font-size:11px!important}
.qcf-num input{width:100%;font-size:24px;font-weight:800;font-family:var(--mono);text-align:left;padding:8px 10px;border-width:1.5px}
.qcf-num.ok input{border-left:5px solid var(--green)} .qcf-num.bad input{border-left:5px solid var(--red)} .qcf-num:first-child input{border-left:5px solid var(--indigo)}
.qcf-yield{display:flex;align-items:center;gap:10px;margin-top:12px} .qcf-yield span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)} .qcf-yield b{font-family:var(--mono);font-size:15px;min-width:62px;text-align:right}
.qcf-ybar{flex:1;height:8px;border-radius:4px;background:var(--grey-l);overflow:hidden} .qcf-ybar i{display:block;height:100%;width:0;background:var(--grey);transition:width .2s} .qcf-ybar i.g{background:var(--green)} .qcf-ybar i.a{background:var(--amber)} .qcf-ybar i.r{background:var(--red)}
.qcf-res{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.qcf-res button{--rc:var(--grey);border:2px solid var(--rule);border-left:6px solid var(--rc);background:var(--paper);color:var(--ink);border-radius:10px;padding:10px 12px;font:inherit;cursor:pointer;text-align:left;transition:background .12s,border-color .12s}
.qcf-res button b{display:block;font-size:17px;font-weight:800;letter-spacing:-.01em} .qcf-res button small{display:block;font-size:11px;color:var(--ink3);font-weight:600}
.qcf-res button:hover{border-color:var(--rc)}
.qcf-res .r-pass{--rc:var(--green)} .qcf-res .r-fail{--rc:var(--red)} .qcf-res .r-conditional{--rc:var(--amber)} .qcf-res .r-partial{--rc:var(--amber)}
.qcf-res button.on{background:var(--rc);border-color:var(--rc);color:var(--on-accent,#fff);box-shadow:0 4px 14px var(--rule)} .qcf-res button.on small{color:var(--on-accent,#fff);opacity:.9}
.qcf-res .r-conditional.on,.qcf-res .r-partial.on{color:var(--dark)} .qcf-res .r-conditional.on small,.qcf-res .r-partial.on small{color:var(--dark)}
/* rejects: one row per serial, colour-coded defect chips */
/* round 5: one clean card per rejected serial — # · serial · where on the left, plain-name defect chips under their group heading on the right */
.qcf-row{display:grid;grid-template-columns:minmax(190px,230px) 1fr;gap:8px 18px;padding:10px 12px;border:1px solid var(--rule);border-radius:10px;background:var(--paper2);margin-top:8px}
.qcf-row:first-child{margin-top:0} .qcf-row>.qcf-err{grid-column:1/-1;margin-top:0}
.qcf-row.qcf-bad{background:var(--red-l);border-color:var(--red)}
.qcf-rid{display:flex;flex-direction:column;gap:6px;min-width:0}
.qcf-rtop{display:flex;align-items:center;gap:8px;min-height:22px}
.qcf-rn{font-family:var(--mono);font-size:12.5px;font-weight:800;color:var(--ink2);min-width:26px}
.qcf-rsum{flex:1;font-size:11.5px;font-weight:700;color:var(--red)}
.qcf-row .rj-serial{width:100%;font-family:var(--mono);font-weight:700;font-size:14px} .qcf-row .rj-note{width:100%;font-size:12.5px}
.qcf-dgs{display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start;align-items:center}
.qcf-dgs .qd{--dc:var(--ink3);display:inline-flex;align-items:center;gap:6px;border:1px solid var(--rule);border-left:1px solid var(--rule);background:var(--paper);color:var(--ink);border-radius:999px;padding:4px 12px 4px 9px;font-size:13px;font-weight:600;line-height:1.35}
.qcf-dgs .qd[data-c]::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--dc);flex:none}
.qcf-dgs .qd:hover{border-color:var(--dc);color:var(--ink)}
.qcf-dgs .qd.on{background:var(--dc);border-color:var(--dc);color:var(--on-accent,#fff)} .qcf-dgs .qd.on::before{background:var(--on-accent,#fff)}
.qcf-dgs .qd-more,.qcf-dgs .qd-other{color:var(--ink2);border-style:dashed}
.qcf-more:not([hidden]){display:contents}
.qcf-dgs .rj-other{flex:1;min-width:150px;padding:4px 8px;font-size:13px}
.qcf-passes button{min-width:44px;text-align:center;padding:5px 10px} #qfPassHint{font-weight:600;text-transform:none;letter-spacing:0}
.qcf-row .rj-del{border:0;background:none;color:var(--ink3);font-size:18px;cursor:pointer;line-height:1;padding:2px 6px;border-radius:6px} .qcf-row .rj-del:hover{color:var(--red);background:var(--red-l)}
.qd{--dc:var(--indigo);display:inline-flex;align-items:center;gap:5px;border:1px solid var(--rule);border-left:4px solid var(--dc);background:var(--paper2);color:var(--ink2);border-radius:7px;padding:3px 9px 3px 6px;font:inherit;font-size:11.5px;font-weight:600;cursor:pointer;line-height:1.5}
.qd b{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--dc)} .qd:hover{border-color:var(--dc);color:var(--ink)}
.qd.on{background:var(--dc);border-color:var(--dc);color:var(--on-accent,#fff)} .qd.on b{color:var(--on-accent,#fff)}
.qcf-empty{margin:2px 0;font-size:12.5px;color:var(--ink3)} .qcf-empty[hidden]{display:none}
.qd-tag{--dc:var(--indigo);display:inline-flex;align-items:center;gap:4px;border-left:3px solid var(--dc);background:var(--paper2);border-radius:5px;padding:0 7px 0 5px;font-size:11.5px;font-weight:600;color:var(--ink2);white-space:nowrap;line-height:1.7} .qd-tag b{font-family:var(--mono);font-size:11px;color:var(--dc)}
/* notes: grows while typing, user-resizable */
.qcf-notes{width:100%;min-height:68px;resize:vertical;line-height:1.5;font-size:13.5px;overflow:hidden}
.qcf-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;position:sticky;bottom:-18px;background:var(--paper);padding:10px 0 4px;border-top:1px solid var(--rule)}
@media (max-width:860px){.qcf-two,.qcf-jobpick,.qcf-insp{grid-template-columns:1fr} .qcf-meta{grid-template-columns:1fr 1fr} .qcf-row{grid-template-columns:1fr}}
/* records table */
.qc-rec-notes{display:inline-block;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
#qcPicked{min-width:120px}
/* clocked-in QC operations */
.qc-clock.mine{border-color:var(--amber);box-shadow:0 0 0 3px var(--amber-l)}
.qc-clock-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.qc-clock-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 10px;border:1px solid var(--rule);border-radius:10px;background:var(--paper2)}
/* fallback chip at zero specificity: css/ui.css .chip wins wherever it is defined (ctb, eco, psched, rfi, scorecard, standards use .chip) */
:where(.chip){border:1px solid var(--rule);background:var(--paper);color:var(--ink2);border-radius:999px;padding:2px 10px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;line-height:1.6}
:where(.chip.on){background:var(--indigo);border-color:var(--indigo);color:var(--on-accent,#fff)}
/* round 6 (Q22): Yield by work cell — the cell name stays on one line (full name in its title); the table scrolls inside its card */
#qcCells .qc-cellnm{display:inline-block;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
#qcCells table.mt th{white-space:nowrap}
/* v1 polish (V1-H): WO names stay on one line in the records tables */
.qc-nw{white-space:nowrap}
/* round 10 (G9): QC page on the shared design system (.card-h, .kpis, .empty, .howto from css/ui.css) */
.qc-page{display:flex;flex-direction:column;gap:14px;min-width:0}
.qc-page .card{margin:0}
.qc-page .kpis{margin:0}
.qc-clock-main{min-width:0}
.qc-clock-row .row.tight{flex:none}
.qc-recrow{display:grid;grid-template-columns:minmax(200px,1fr) minmax(180px,auto) auto;gap:10px;align-items:center}
.qc-recrow #qcPicked,.qc-recrow #tsPicked{grid-row:2;grid-column:1/-1}
.qc-recrow #qcPicked:empty,.qc-recrow #tsPicked:empty{display:none}
.qc-bot{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
.qc-sec .mt-wrap{box-shadow:none}
.qc-h-sub{font-weight:500}
.qc-mbtns{margin-top:10px}
.qcf-foot-t{font-size:12px;color:var(--ink3)}
.qcf-hint2{margin:6px 0 0;font-size:12px;color:var(--ink2)} .qcf-hint2[hidden]{display:none}
.qc-dt{white-space:nowrap}
.qc-acts{display:inline-flex;gap:4px;white-space:nowrap}
@media (max-width:1100px){.qc-dt{white-space:normal;display:inline-block;min-width:56px}.qc-acts{flex-direction:column;align-items:stretch}}
.qc-wo-acct{font-size:var(--fs-12,12px);color:var(--ink3);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* numbers in QC / Test tables: body font with tabular figures (mono stays for WO numbers, Eng # and serials) */
.qc-page table.mt td.c,.qc-page table.mt tfoot tr.mt-total td{font-family:var(--font);font-variant-numeric:tabular-nums}
.qc-page table.mt td.c{font-size:inherit}
#qcTbl table.mt td.n,#tsTbl table.mt td.n{white-space:nowrap}
.qc-y-ok{color:var(--green-t,var(--green));font-weight:700} .qc-y-warn{color:var(--amber-t,var(--ink));font-weight:700} .qc-y-bad{color:var(--red-t,var(--red));font-weight:700}
@media (max-width:700px){.qc-recrow{grid-template-columns:1fr}}
/* in-app confirm / prompt (qcAsk in js/qc.js; also used by lots, msl, ship, repair) */
.qc-ask{min-width:min(420px,86vw);max-width:560px}
.qc-ask h3{margin:0 0 8px;font-size:16px}
.qc-ask-t{margin:0 0 10px;font-size:14px;color:var(--ink2);line-height:1.45}
.qc-ask-l{margin:0 0 10px;padding-left:18px;font-size:13px;color:var(--ink)}
.qc-ask-f{margin:0 0 12px} .qc-ask-f input{font:inherit;font-size:14px;padding:8px 10px}
.qc-ask-f input.qc-ask-bad{border-color:var(--red);box-shadow:0 0 0 3px var(--red-l)}
.qc-ask-b{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}
/* spacer in dialog button rows (lots, msl, ship, repair, qc and test dialogs) */
#modal .row>.sp,#modal .qcf-foot>.sp,.qc-page .row>.sp{flex:1}