/* Consumables crosswalk — the RESULT-CARD vocabulary, shared.
 *
 * One definition for the product card wherever it renders: the search page
 * (consumables-crosswalk.html) and the server-rendered family pages
 * (api/consumables/family.js) each carried their own copy of these rules, and
 * the copies drifted — which is how the same product row looked different on
 * the two surfaces and neither looked finished (Mark, 2026-08-12: "the layout
 * here is not improved … we might need a style sheet definition for the
 * results pages"). Page LAYOUT (wrap widths, search bar, watch form) stays in
 * each page; what a product row IS lives here.
 *
 * Both pages link this BEFORE their inline styles, so a page-specific
 * override still wins by source order. Colour tokens fall back so the sheet
 * works even where a page defines fewer custom properties.
 */

.product{background:#fff;border:1px solid var(--border,#E2E8ED);padding:16px 20px;margin-bottom:12px;}
.product header{display:flex;justify-content:space-between;gap:12px;align-items:baseline;flex-wrap:wrap;}
.product h3{font-size:16px;font-weight:500;display:inline;}
.mfr{color:var(--muted,#555E6F);font-weight:400;font-size:12.5px;}

.grade{font-size:10px;text-transform:uppercase;letter-spacing:.12em;padding:2px 7px;border:1px solid var(--border,#E2E8ED);white-space:nowrap;vertical-align:middle;}
.confirmed .grade,.grade.confirmed{color:var(--ok,#2C7858);border-color:var(--ok,#2C7858);background:var(--okT,#E4F2EB);}
.possible .grade,.grade.possible{color:var(--warn,#B4456B);border-color:var(--warn,#B4456B);background:var(--warnT,#FBEAF1);}

.basis{font-size:12.5px;color:var(--ink-soft,#3A4250);margin-top:5px;}
.id{font-family:var(--mono,'JetBrains Mono',ui-monospace,monospace);font-size:11.5px;background:var(--bg,#F2F6F8);padding:1px 6px;margin-right:6px;white-space:nowrap;}
a.id{color:var(--acc,#0066CC);text-decoration:none;}
a.id:hover,a.id:focus-visible{text-decoration:underline;}
.ids{margin-top:6px;}
.chip{display:inline-block;font-size:10.5px;color:var(--muted,#555E6F);border:1px solid var(--rule,#EEF2F5);padding:1px 7px;margin:3px 6px 0 0;}
.packs{margin:8px 0 0 18px;font-size:12.5px;color:var(--ink-soft,#3A4250);}

/* Codification per NSN: one row per stock number — the number is the link to
 * its interchangeability group (the parts associated with that NSN), the
 * catalogue's stated characteristics beside it. Row rules keep a long trait
 * list from reading as the next NSN's. */
.nsntraits{border-collapse:collapse;margin:8px 0 2px;width:100%;}
.nsntraits th{font-weight:400;text-align:left;padding:4px 10px 4px 0;white-space:nowrap;vertical-align:top;width:1%;}
.nsntraits td{padding:4px 0;}
.nsntraits tr+tr th,.nsntraits tr+tr td{border-top:1px solid var(--rule,#EEF2F5);}