/* ---------- product options (editor) ---------- */
.optbox{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:10px 0;background:var(--bg)}
.opthead{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-bottom:8px}
.opthead .f{flex:1;max-width:280px;margin:0}
.chip .chipname{width:auto;height:auto;border-radius:6px;font-size:13.5px;font-weight:600;color:var(--ink);padding:0 2px}
.chip .chipname:hover{background:var(--wash);color:var(--ink)}
.optadd{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0}
.optadd input{flex:1;min-width:160px;max-width:260px;padding:7px 10px;border:1px solid var(--line-2);border-radius:8px;font-size:14px;background:var(--bg)}
.optsugg{display:flex;flex-wrap:wrap;gap:4px}
.btn.ghost{background:transparent;border-style:dashed}
.vtab{max-height:min(60vh,560px);overflow:auto;border:1px solid var(--line);border-radius:10px;margin-top:8px}
.vtab .vdet thead th{position:sticky;top:0;background:var(--bg);z-index:2;padding:8px 4px}
.vtab .vdet thead th:nth-child(2){left:0;z-index:3}
.vdet td.ck,.vdet th.ck{width:34px;text-align:center}
.vdet td.ck input,.vdet th.ck input{width:18px;height:18px;min-width:0}
.vdet tr.off th,.vdet tr.off td:not(.ck){opacity:.5}
.vdet small.new{font-size:10.5px;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.coderow{display:flex;gap:6px;align-items:center}
.coderow input{flex:1;min-width:130px}
.codeprev{display:block;min-height:0;margin-top:3px;line-height:0}
.codeprev svg{max-width:100%;height:auto}
.codebad{font-size:11.5px;color:var(--crit);line-height:1.2}
.codetype{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:6px 0}
.codetype small{color:var(--ink-3)}
.edprint{display:flex;gap:6px;flex-wrap:wrap}
@media (max-width:699px){
  .vtab{max-height:none}
  .edfoot{flex-wrap:wrap}
  .opthead{flex-wrap:wrap}
}

/* ---------- stickers ---------- */
.sheet.stickers{max-width:720px}
.stk-fields{display:flex;flex-wrap:wrap;gap:6px 16px;margin:8px 0}
.stk-grid{display:flex;flex-wrap:wrap;gap:12px;padding:12px;background:var(--wash);border-radius:12px;max-height:46vh;overflow:auto;align-items:flex-start}
.stk-prev{background:#fff;box-shadow:var(--shadow-sm);line-height:0}
.stk-prev svg{width:auto;max-width:100%;height:auto;min-height:90px;max-height:200px}

/* ---------- supplier bill import ---------- */
.sheet.billimp{max-width:1100px;width:min(1100px,100vw)}
.bi-pick{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin:10px 0}
.bi-pick label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:110px;border:1.5px dashed var(--line-2);border-radius:14px;font-weight:700;cursor:pointer;text-align:center;padding:12px}
.bi-pick label:hover,.bi-pick label:focus-within{border-color:var(--accent);background:var(--accent-soft)}
.bi-pick small{font-weight:500;color:var(--ink-3)}
.bi-busy{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 10px;text-align:center}
.bi-spin{width:34px;height:34px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--accent);animation:bi-spin 1s linear infinite}
@keyframes bi-spin{to{transform:rotate(360deg)}}
.bi-warn{background:var(--warn-soft);color:var(--warn-ink);border-radius:10px;padding:10px 12px;margin:8px 0;font-size:14px}
.bi-head{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));margin-bottom:8px}
.bi-filter{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
.bi-filter button[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.bi-lines{display:flex;flex-direction:column;gap:10px;max-height:58vh;overflow:auto;padding:2px}
.bi-line{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--bg)}
.bi-line.nr{border-color:var(--warn);box-shadow:inset 3px 0 0 var(--warn)}
.bi-line.ok{box-shadow:inset 3px 0 0 var(--good-ink)}
.bi-line.skip{opacity:.5}
.bi-top{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.bi-top b{font-size:14.5px}
.bi-grid{display:grid;gap:6px 8px;grid-template-columns:repeat(2,1fr);margin-top:8px}
.bi-grid label{display:flex;flex-direction:column;gap:2px;font-size:11.5px;color:var(--ink-3);font-weight:600}
.bi-grid input,.bi-grid select{padding:6px 8px;border:1px solid var(--line-2);border-radius:8px;font-size:14px;background:var(--bg);color:var(--ink);min-width:0}
.bi-grid .wide{grid-column:1/-1}
.bi-match{margin-top:8px;padding:8px 10px;border-radius:10px;background:var(--wash);font-size:13.5px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bi-match b{margin-right:auto}
.bi-reasons{margin:6px 0 0;font-size:12.5px;color:var(--warn-ink)}
.bi-acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.bi-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:10px 0}
.bi-sum div{background:var(--wash);border-radius:12px;padding:12px}
.bi-sum b{display:block;font-size:22px}
.bi-errs{color:var(--crit);font-size:13.5px;margin:6px 0;padding-left:18px}
@media (min-width:700px){
  .bi-grid{grid-template-columns:2fr 1fr 1fr 1fr 1fr 1fr}
  .bi-grid .name{grid-column:span 2}
}

/* ---------- phone-first selling: quantity sheet, bill lines, touch targets ---------- */
.qsheet{display:flex;flex-direction:column;align-items:center;gap:14px;padding:12px 0 6px}
.qs-info{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;justify-content:center}
.qs-price{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums}
.qs-left{font-weight:600;color:var(--ink-2)}.qs-left.low{color:var(--warn-ink)}.qs-left.out{color:var(--crit)}
.qs-sku{font-size:12.5px;color:var(--ink-3)}
.qs-step{display:flex;align-items:center;gap:10px}
.qs-step button{display:inline-flex;align-items:center;justify-content:center;padding:0;width:58px;height:58px;border-radius:16px;border:1px solid var(--line-2);font-size:28px;font-weight:700;background:var(--bg);color:var(--ink)}
.qs-step button:disabled{opacity:.35}
.qs-step input{width:88px;height:58px;border:1px solid var(--line-2);border-radius:14px;text-align:center;font-size:26px;font-weight:800;background:var(--bg);color:var(--ink);-moz-appearance:textfield}
.qs-step input::-webkit-outer-spin-button,.qs-step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pk-last{display:block;font-size:12px;color:var(--ink-3);font-weight:500}
.li .sub{flex-wrap:wrap}
.li .lsku{font-size:11.5px;color:var(--ink-3)}
.li .rmline{margin-top:4px;padding:2px 0;color:var(--crit)}
@media (max-width:699px){
  .step button{width:44px;height:44px;font-size:22px}
  .step input{width:48px;height:44px;font-size:17px}
  .vc-tap{min-height:58px}
  .vc-q button{min-width:40px;min-height:40px}
  .hit-row .btn{min-height:44px;min-width:64px}
  #sellSearch{font-size:16px;min-height:46px}
  .li .rmline{padding:8px 0}
}

/* ---------- camera scanner (Sell → Scan) ---------- */
#scanHost{position:fixed;inset:0;z-index:80;background:rgba(10,12,20,.92);display:flex;align-items:center;justify-content:center}
.scan{width:100%;height:100%;max-width:560px;display:flex;flex-direction:column;color:#fff}
@media (min-width:700px){.scan{height:auto;max-height:92vh;background:#111522;border-radius:20px;overflow:hidden}}
.scan-top{display:flex;align-items:center;justify-content:space-between;padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px}
.scan-top b{font-size:17px}
.scan-x{width:48px;height:48px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:rgba(255,255,255,.12)}
.scan-x svg{width:22px;height:22px}
.scan-view{position:relative;flex:1;min-height:260px;background:#000;overflow:hidden}
.scan-view video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scan-frame{position:absolute;left:5%;right:5%;top:20%;bottom:20%;border:3px solid rgba(255,255,255,.9);border-radius:16px;box-shadow:0 0 0 100vmax rgba(0,0,0,.35)}
.scan-status{min-height:56px;padding:12px 16px;font-size:15px;font-weight:600;display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:#1b2030}
.scan-status svg{width:20px;height:20px;flex:none}
.scan-status.ok{background:#0f5132}
.scan-status.err{background:#6b1d1d}
.scan-acts{display:flex;gap:6px;flex-wrap:wrap;width:100%}
.scan-foot{display:flex;align-items:center;gap:8px;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));background:#111522}
.scan-foot .btn{min-height:44px}
.scan-bill{margin-right:auto;font-size:14px;color:#cfd3e0}
.scan{background:#0b0e17}
.scan-foot .btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.scan-foot .btn.primary{background:#fff;color:#10131F;border-color:#fff}
.scan-status .btn{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.35)}

/* ---------- customers ---------- */
.ctype{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;font-size:11px;font-weight:700;background:var(--accent-soft);color:var(--good-ink);vertical-align:middle}
.ctypes{display:flex;gap:8px;margin-bottom:10px}
.ctypeopt{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;border:1px solid var(--line-2);border-radius:12px;font-weight:600;cursor:pointer}
.ctypeopt:has(input:checked){border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.cgst{font-size:12.5px;color:var(--ink-3)}
.custh{margin:14px 0 6px;font-size:14px}
.custbill{display:flex;flex-direction:column;align-items:stretch;gap:4px;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:var(--bg)}
.cb-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}.cb-top span{color:var(--ink-3);font-size:12.5px}.cb-tot{margin-left:auto}
.cb-items{display:flex;flex-direction:column;font-size:13px;color:var(--ink-2)}
.cb-foot{font-size:12px;color:var(--ink-3)}
.custtools{display:flex;gap:8px;align-items:center;margin-bottom:10px}.custtools .search{flex:1}.custtools .btn{min-height:44px;flex:none}
.custpage{display:flex;flex-direction:column;gap:8px}
.custcard{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;text-align:left;padding:10px 12px;min-height:60px;border:1px solid var(--line);border-radius:14px;background:var(--bg)}
.custcard:hover{border-color:var(--line-2)}
.cc-main,.cc-side{display:flex;flex-direction:column;min-width:0}.cc-main b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-main small,.cc-side small{color:var(--ink-3);font-size:12.5px}.cc-side{align-items:flex-end;text-align:right}
@media (max-width:699px){.custtools{flex-wrap:wrap}.custtools .btn{width:100%}#custSearch,#custQ{font-size:16px;min-height:46px}}
/* The shop's own product fields and units (section 3z): the editor's "More details", options from a field, the settings
   sheets and the import's columns without a field */
.edfields > summary{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;cursor:pointer;list-style:none}
.edfields > summary::-webkit-details-marker{display:none}
.edfields > summary h4::after{content:" ▸";color:var(--ink-3);font-weight:500}
.edfields[open] > summary h4::after{content:" ▾"}
.attrmulti{border:0;padding:0;margin:0;min-width:0}
.attrmulti legend{padding:0;margin-bottom:4px}
.chkrow{display:flex;flex-wrap:wrap;gap:4px 14px}
.chkrow .chk{margin:2px 0}
.attrro{display:block;padding:8px 0;color:var(--ink-2);overflow-wrap:anywhere}
.optfield{display:flex;align-items:baseline;gap:6px;min-height:40px;padding-top:6px;overflow-wrap:anywhere}
.optfield small{color:var(--ink-3)}
.optfieldsugg{border-style:dashed}
.atopts{display:flex;flex-direction:column;gap:6px;margin:4px 0 8px}
.atoptrow{display:flex;align-items:center;gap:8px;min-width:0}
.atoptrow input{flex:1;min-width:80px}
.atoptrow small{flex:none}
.im-unknown{border:1px solid var(--line-2);border-radius:12px;padding:10px 12px;margin:10px 0;background:var(--wash)}
.im-unknown ul{margin:6px 0 8px;padding-left:18px}
.im-unknown li{margin:2px 0;overflow-wrap:anywhere}
.im-attr{background:var(--wash)}
.im-export{margin:10px 0 0}
.pv-fields{margin-top:10px}
@media (max-width:699px){.atoptrow{flex-wrap:wrap}.atoptrow input{flex-basis:100%}}