/* Inventory page: a card grid on every width. Loads after queue.css (shared tokens, bar, gate, menus, buttons)
   and only adds to it or overrides what the queue's row layout would do to the shared class names. */
.wrap--inv{max-width:1800px}
.bar--inv .row2{grid-template-columns:1fr auto auto}
.bar--inv .sortsel{display:inline-flex}
/* narrow phones: the search field must stay usable beside the type segment and the sort select */
@media (max-width:599px){.bar--inv .sortsel > span{display:none}.bar--inv .sortsel{padding:4px 6px}.bar--inv .seg--type button{padding:5px 7px}}

/* ---------- grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:10px}
@media (max-width:599px){.grid{grid-template-columns:repeat(2,1fr);gap:8px}}
@media (max-width:359px){.grid{grid-template-columns:1fr}}
.grid .empty{grid-column:1 / -1}
.more{padding:16px;text-align:center;color:var(--muted);font-size:12.5px}

/* ---------- card */
.vcard{background:var(--surface);border:1px solid var(--line-card);border-radius:var(--r-card);overflow:hidden;display:grid;grid-template-rows:auto 1fr;min-width:0}
.vcard__photo{position:relative;aspect-ratio:4 / 3;background:var(--inset);overflow:hidden}
/* contain, not cover: real shoots are 4:3 and fill the box; factory images are 2:1 and show whole with thin bars */
.vcard__photo img,.vcard__ph{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.vcard__ph{display:grid;place-items:center;color:var(--faint);background:linear-gradient(160deg,var(--raised),var(--inset))}
.vcard__ph svg{width:30px;height:30px}
/* chips over the photo sit on a dark glass so they read on any image */
.vcard__photo .badge,.vcard__photo .step,.vcard__photos{position:absolute;background:rgba(8,9,13,.74);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.vcard__photo .badge{top:8px;left:8px;padding:3px 7px;min-width:0;font-size:10.5px;border-color:rgba(255,255,255,.18);color:var(--fg)}
.vcard__photo .badge--New{color:var(--blue);border-color:var(--blue)}
.vcard__photo .step{top:8px;right:8px;text-decoration:none;border:1px solid var(--step);padding:3px 8px}
.vcard__photo .step:hover{filter:brightness(1.15)}
.vcard__photos{right:8px;bottom:8px;font-family:var(--num);font-size:13px;font-weight:500;letter-spacing:.03em;color:var(--muted);padding:2px 7px;border-radius:var(--r-btn);line-height:1.4}
.vcard__photos small{font-size:11px;color:var(--faint)}
.vcard__photos.is-low,.vcard__photos.is-none{color:var(--gold)}
.vcard__photos.is-none{font-weight:700}
.vcard__body{padding:10px 12px 12px;display:grid;gap:4px;align-content:start;min-width:0}
.vcard__l1{display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-width:0}
.vcard .stock{font-size:17px;min-width:0;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.vcard .age{font-size:14px;color:var(--muted);flex:none}
.vcard .age.is-warn{color:var(--warn);font-weight:600}
.vcard .age.is-urgent{color:var(--urgent);font-weight:600}
.vcard__veh{font-size:14px;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vcard__veh b{color:var(--heading);font-weight:600}
.vcard__meta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--muted);min-width:0}
.vcard .where{display:inline-flex;flex-direction:row;align-items:center;gap:4px;min-width:0;overflow:hidden;white-space:nowrap;font-size:12.5px;font-weight:500;letter-spacing:0;text-transform:none;justify-content:flex-start;color:var(--muted)}
.vcard .where svg{display:inline;width:12px;height:12px;flex:none;color:var(--faint)}
.vcard .where > span{overflow:hidden;text-overflow:ellipsis}
.vcard .where--live{color:var(--heading);font-weight:600}
.vcard .where--live svg{color:var(--heading)}
.vcard .price{font-family:var(--num);font-weight:500;letter-spacing:.02em;color:var(--fg);flex:none}
.vcard__btn{margin-top:6px;width:100%;min-width:0;padding:7px 10px;font-size:12.5px}

/* ---------- vehicle popup: tap a card. Bottom sheet on phones (the .addform rules under 640px), centred dialog above. */
.vcard{cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease}
.vcard:hover{border-color:var(--line-btn-hover);box-shadow:0 8px 24px var(--shadow)}
.vcard:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* block flow, not the .addform grid: a capped, scrolling sheet must not squash the photo row under the facts */
.vsheet{padding:0;gap:0;width:min(100%,760px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;display:block}
.vsheet__photo{flex:none}
.vsheet__photo{position:relative;width:100%;aspect-ratio:4 / 3;background:var(--inset);overflow:hidden;touch-action:pan-y}
@media (min-width:640px){.vsheet__photo{aspect-ratio:auto;height:400px}}
.vsheet__photo img,.vsheet__photo .vcard__ph{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.vsheet__photo .gal__bg{object-fit:cover;filter:blur(28px) brightness(.45) saturate(.8);transform:scale(1.15)}
/* gallery: arrows at the sides, counter at the bottom; only rendered when there is more than one photo */
.gal__btn{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:rgba(8,9,13,.6);border:1px solid rgba(255,255,255,.18);color:var(--heading);padding:0;display:grid;place-items:center;transition:background .2s ease}
.gal__btn:hover{background:rgba(8,9,13,.9)}
.gal__btn svg{width:18px;height:18px}
.gal__btn--prev{left:10px}.gal__btn--next{right:10px}
.gal__n{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);font-family:var(--num);font-size:12.5px;letter-spacing:.04em;color:var(--heading);background:rgba(8,9,13,.6);padding:2px 9px;border-radius:var(--r-btn)}
.vsheet__chips{position:absolute;top:10px;left:10px;display:flex;gap:6px;align-items:center}
.vsheet__chips .badge,.vsheet__chips .step{background:rgba(8,9,13,.74);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.vsheet__chips .badge{padding:3px 7px;min-width:0;font-size:10.5px;border-color:rgba(255,255,255,.18);color:var(--fg)}
.vsheet__chips .badge--New{color:var(--blue);border-color:var(--blue)}
.vsheet__chips .step{text-decoration:none;border:1px solid var(--step);padding:3px 8px}
.vsheet__close{position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;background:rgba(8,9,13,.74);border:1px solid rgba(255,255,255,.18);color:var(--heading);font-size:16px;line-height:1;padding:0;display:grid;place-items:center}
.vsheet__close:hover{background:rgba(8,9,13,.9)}
.vsheet__head{display:flex;align-items:baseline;gap:10px;padding:12px 16px 4px;min-width:0}
.vsheet__head .stock{font-size:20px;flex:none}
.vsheet__veh{font-size:15px;color:var(--fg);min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vsheet__veh b{color:var(--heading);font-weight:600}
.vsheet__age{font-family:var(--num);font-size:14px;color:var(--muted);flex:none}
.vsheet__cols{display:grid;grid-template-columns:1fr;gap:6px 24px;padding:6px 16px 12px;font-size:13px}
.vsheet .kv{grid-template-columns:104px 1fr}
.vsheet .hint{margin:0;padding:0 16px;font-size:12.5px;color:var(--muted)}
/* step picker at the foot of the popup (0009) */
.vsheet__set{display:grid;gap:8px;padding:10px 16px 16px;border-top:1px solid var(--line)}
.vsheet__setrow{display:grid;gap:6px}
.vsheet__set .lbl{font-size:11px;font-weight:600}
.stepbtns{display:flex;flex-wrap:wrap;gap:6px}
.stepbtn{border:1px solid var(--line-btn);background:transparent;color:var(--muted);border-radius:var(--r-btn);padding:6px 10px;font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;display:inline-flex;align-items:center;gap:6px;transition:background .2s ease,border-color .2s ease,color .2s ease}
.stepbtn::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--step)}
.stepbtn:hover{color:var(--heading);border-color:var(--line-btn-hover)}
.stepbtn.is-on{background:var(--step-soft);border-color:var(--step);color:var(--step)}
.vsheet .notes{min-height:40px;background:var(--inset)}
.vsheet__acts{display:flex;gap:8px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
.vsheet__acts .err{color:var(--red);font-size:12.5px;margin-right:auto}
.vsheet__acts .btn--claim:disabled{opacity:.45}
@media (min-width:640px){.vsheet__cols{grid-template-columns:1fr 1fr}}
@media (max-width:639px){.vsheet{max-height:92vh;max-height:92dvh}}

/* ---------- summary row: the two menus, counts at the right edge */
.summary__n{margin-left:auto;font-size:12.5px;color:var(--muted);white-space:nowrap}
.summary__n b{font-family:var(--num);font-weight:500;font-size:13px;letter-spacing:.02em;color:var(--heading)}
@media (max-width:479px){.summary__n{width:100%;margin-left:0;margin-top:2px}}

/* ---------- desktop: one bar row, like the queue, with this page's fewer controls */
@media (min-width:960px){
  .bar--inv{grid-template-columns:auto auto 1fr auto auto auto}
  .bar--inv .search{order:3;width:260px;justify-self:end}
  .bar--inv .seg--type{order:4}
  .bar--inv .sortsel{order:5;display:inline-flex}
  .bar--inv .who{order:9}
  .vcard .stock{display:block;text-align:left;padding-left:4px}
  .vcard__btn{padding:6px 10px}
}