/* wholesale.css - the Wholesale tab (app/wholesale.js): only what no other
   screen uses, tokens only (DESIGN.md, Workbench). The sections themselves
   still wear the console's kit exactly as they did before wave 4 (.ordercard,
   .otwrap, .lrow, .prow, table.buy, .fchip, .stat and the rest stay in
   staff.html's own styles, shared with Home, Payroll and Approvals), so the
   lift changed nothing a person sees inside them.

   The section chips wrap, and on a phone every chip is a 44 px target. The
   rule is scoped to the chip row so the filter chips inside each section
   keep their size. */
#v-wholesale .ws-tabs{flex-wrap:wrap}
@media (max-width:760px){
  #v-wholesale .ws-tabs .fchip{min-height:44px}
}

/* ---- wave 4 phase B (lane W): Offer, Sales archive, the book's marks ----
   The panels are the board's (.lfb-panel, .lfb-kicker with its quiet note);
   what follows lays out what sits inside them. One primary button on the
   Offer section (Refresh now), every other one .btn.ghost. A status always
   carries its word: the pills and the strip say it, the tint only repeats. */
#v-wholesale .ws-offer, #v-wholesale .ws-sales{display:flex;flex-direction:column;gap:14px;margin:2px 0 14px}
#v-wholesale .ws-offer *, #v-wholesale .ws-sales *{box-sizing:border-box;min-width:0}
#v-wholesale .ws-panel{padding:14px 16px}
#v-wholesale .ws-panel > .lfb-kicker{margin-bottom:8px}
#v-wholesale .ws-strip{font-family:var(--mono);font-size:11.5px;color:var(--ink2);line-height:1.5;margin:2px 0 10px}
#v-wholesale .ws-strip.ws-stale{color:var(--warn);font-weight:600}
#v-wholesale .ws-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
#v-wholesale .ws-headacts{margin:0 0 8px}
#v-wholesale .ws-filters{padding:4px 0 0}
#v-wholesale .ws-look{margin:0}
#v-wholesale .ws-empty{padding:24px 0}
#v-wholesale .ws-handmade{margin:0}

/* One item: its name and word on the first line, then what it is, the facts
   (price, the shops' and the distributor's order-by dates, demand), where it
   parts from the book, its doors. */
#v-wholesale .ws-item{padding:10px 0;border-top:1px solid var(--line2)}
#v-wholesale .ws-block .ws-item:first-of-type{border-top:0;padding-top:2px}
#v-wholesale .ws-item-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px}
#v-wholesale .ws-name{font-size:14px;font-weight:600;color:var(--ink)}
#v-wholesale .ws-facts{color:var(--ink2)}
#v-wholesale .ws-facts .mono, #v-wholesale .ws-differs .mono{font-variant-numeric:tabular-nums}
#v-wholesale .ws-differs{color:var(--ink2);display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.pill.ws-pill{font-size:10.5px;letter-spacing:.06em}
.pill.ws-good{background:color-mix(in srgb, var(--good) 14%, var(--surface));color:var(--good)}
.pill.ws-warn{background:color-mix(in srgb, var(--warn) 14%, var(--surface));color:var(--warn)}
.pill.ws-off{background:var(--surface2);color:var(--ink2)}
.pill.ws-out{background:var(--surface);color:var(--ink2);box-shadow:inset 0 0 0 1px var(--line)}
.tag.ws-cut{background:color-mix(in srgb, var(--sky) 14%, var(--surface));color:var(--sky);font-family:var(--mono);letter-spacing:.06em}
/* Below MSRP OK (the owner's mark, Josh Oct 19 2026): the words carry it; the
   info hue only repeats it on the covering mark, the others read as notes. */
.ws-msrpok{color:var(--ink2)}
.ws-msrpok.ws-msrpok-covers{color:var(--sky);font-weight:600}

/* The order-by editor under an item. */
#v-wholesale .ws-ob{margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper)}
#v-wholesale .ws-ob input[type="date"]{width:100%;max-width:220px;min-height:36px}
#v-wholesale .ws-obnote{margin:4px 0 8px}

/* The owner's switch: a checkbox row, not an uppercase field label. */
#v-wholesale .ws-switch{display:flex;align-items:center;gap:8px;margin:2px 0 6px;font-size:13.5px;font-weight:500;
  text-transform:none;letter-spacing:0;color:var(--ink)}
#v-wholesale .ws-switch input{width:18px;height:18px;margin:0}

/* Products: the BOOK pill, its hint, and the sheet's book block. */
.tag.ws-book{background:color-mix(in srgb, var(--accent) 14%, var(--surface));color:var(--accent);font-family:var(--mono);letter-spacing:.06em}
#v-wholesale .ws-bookhint{margin:0 0 8px}
.ws-bookblock{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface2)}
.ws-bookblock[hidden]{display:none}
.ws-bookblock .lfb-kicker{margin-bottom:6px}
.ws-bookline{font-size:12.5px;color:var(--ink2);line-height:1.5;margin-top:3px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.ws-bookk{color:var(--ink3);font-family:var(--mono);font-size:11px;letter-spacing:.06em}

/* Sales archive: one row per sale, the figures mono and right-aligned. */
#v-wholesale .ws-sfilters{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:0 0 8px}
#v-wholesale .ws-years{display:inline-flex;flex-wrap:wrap;gap:6px}
#v-wholesale .ws-oneyear{cursor:default}
#v-wholesale .ws-shoplabel{margin:0 0 0 6px}
#v-wholesale .ws-sfilters select{min-height:34px;max-width:100%}
#v-wholesale .ws-totals{font-size:12px;color:var(--ink2);padding:2px 0 8px;font-variant-numeric:tabular-nums}
#v-wholesale .ws-srow{display:grid;grid-template-columns:64px minmax(120px,220px) minmax(0,1fr) auto minmax(0,240px);gap:4px 14px;align-items:baseline;
  padding:7px 0;border-top:1px solid var(--line2);font-size:13px}
#v-wholesale .ws-frow{grid-template-columns:64px minmax(0,1fr) auto auto}
#v-wholesale .ws-sday{color:var(--ink3);font-size:12px}
#v-wholesale .ws-samt{text-align:right;font-variant-numeric:tabular-nums}
#v-wholesale .ws-sbox{font-family:var(--mono);font-size:11.5px;text-align:right}
#v-wholesale .ws-sbox a{color:var(--accent)}
#v-wholesale .ws-collected{color:var(--good)}

/* A phone: every button, chip and field of the new sections is a 44 px
   target, and a sale row stacks instead of squeezing. */
@media (max-width:760px){
  #v-wholesale .ws-offer .btn, #v-wholesale .ws-offer .fchip, #v-wholesale .ws-sales .fchip,
  #v-wholesale .ws-sales select, #v-wholesale .ws-ob input[type="date"], .ws-bookblock .btn{min-height:44px}
  #v-wholesale .ws-switch input{width:22px;height:22px}
  /* The kicker's quiet note goes under it, not squeezed beside it. */
  #v-wholesale .ws-panel > .lfb-kicker{flex-wrap:wrap;gap:4px 10px}
  #v-wholesale .ws-panel > .lfb-kicker span{flex-basis:100%}
  #v-wholesale .ws-srow{grid-template-columns:minmax(0,1fr) auto;gap:2px 10px}
  #v-wholesale .ws-srow .ws-sprod{grid-column:1 / -1}
}
