/* ClinicOS Inventory — Stock & Ordering workspace (Stage 6 CP2b). Every selector is scoped to #page-inventory and uses NEW class names (inv2-*):
   nothing here touches the shared .inv-tab / .tbl / .kpi styling used by other pages. Tokens come from the Shell 2 design system with
   classic-shell fallbacks, so the page also reads correctly outside Shell 2. Light is primary; Dark follows the tokens. */
#page-inventory {
  --inv2-ink: var(--cos-color-text-primary, var(--ink, #14202b));
  --inv2-ink-2: var(--cos-color-text-secondary, var(--ink-3, #4a5a68));
  --inv2-muted: var(--cos-color-text-muted, var(--ink-3, #6b7a88));
  --inv2-line: var(--cos-color-border-subtle, rgba(127, 140, 152, .22));
  --inv2-line-strong: var(--cos-color-border, rgba(127, 140, 152, .38));
  --inv2-surface: var(--cos-color-bg-surface, var(--bg2, #fff));
  --inv2-brand: var(--cos-color-brand-primary, var(--teal, #0f766e));
  --inv2-tint: color-mix(in srgb, var(--cos-color-brand-accent, #19b6a2) 7%, var(--inv2-surface));
  --inv2-ok: var(--cos-tone-teal, #1fa58f);
  --inv2-ok-ink: var(--cos-tone-teal-ink, #0f766e);
  --inv2-low: var(--cos-tone-amber, #d99a1e);
  --inv2-low-ink: var(--cos-color-warning, #9a6700);
  --inv2-out: var(--cos-color-danger, #c0392b);
  --inv2-neg: var(--cos-color-danger, #b3261e);
  --inv2-focus: var(--cos-color-focus, #2563eb);
}

/* ── view tabs (Stock · Ordering · Legacy stock · …) ───────────────────────────────────────────────────────────────────────── */
#page-inventory .inv2-tabs { display: flex; gap: 2px; margin: 0 0 18px; padding: 0; overflow-x: auto; scrollbar-width: thin; border-bottom: 1px solid var(--inv2-line); -webkit-overflow-scrolling: touch; }
#page-inventory .inv2-tab { flex: none; position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 0; background: transparent; color: var(--inv2-muted); font: 600 0.875rem/1 inherit; font-family: inherit; cursor: pointer; white-space: nowrap; border-radius: 8px 8px 0 0; }
#page-inventory .inv2-tab:hover { color: var(--inv2-ink); background: var(--inv2-tint); }
#page-inventory .inv2-tab:focus-visible { outline: 2px solid var(--inv2-focus); outline-offset: -2px; }
#page-inventory .inv2-tab.is-active { color: var(--inv2-brand); }
#page-inventory .inv2-tab.is-active::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--inv2-brand); }
#page-inventory .inv2-tabcount { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--inv2-low); color: #fff; font: 700 0.6875rem/1 inherit; font-family: inherit; }
#page-inventory .inv2-tabcount[hidden] { display: none; }

/* ── page-level context: office · location · this device · setup ───────────────────────────────────────────────────────────── */
#page-inventory .inv2-context { margin: 0 0 14px; }
#page-inventory .inv2-context-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 16px; }
#page-inventory .inv2-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
#page-inventory .inv2-field > span { font: 600 0.6875rem/1.2 inherit; font-family: inherit; letter-spacing: .06em; text-transform: uppercase; color: var(--inv2-muted); }
#page-inventory .inv2-field select { min-width: 190px; max-width: 100%; }
#page-inventory .inv2-device { align-self: center; display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 999px; background: var(--cos-color-neutral-bg, rgba(127, 140, 152, .16)); color: var(--cos-color-neutral, var(--inv2-muted)); font: 600 0.6875rem/1 inherit; font-family: inherit; letter-spacing: .05em; text-transform: uppercase; cursor: help; }
#page-inventory .inv2-link { padding: 4px 0; border: 0; background: none; color: var(--inv2-brand); font: 600 0.8125rem/1.2 inherit; font-family: inherit; cursor: pointer; }
#page-inventory .inv2-link:hover { text-decoration: underline; }
#page-inventory .inv2-link:focus-visible { outline: 2px solid var(--inv2-focus); outline-offset: 2px; border-radius: 3px; }
#page-inventory .inv2-state { margin: 12px 0 0; padding: 0; font: 0.875rem/1.5 inherit; font-family: inherit; color: var(--inv2-ink-2); }
#page-inventory .inv2-state.is-blocked { padding: 10px 14px; border-left: 3px solid var(--inv2-low); background: color-mix(in srgb, var(--inv2-low) 9%, var(--inv2-surface)); color: var(--inv2-ink); border-radius: 0 8px 8px 0; }
#page-inventory .inv2-state .btn { margin-left: 8px; }
#page-inventory .inv2-summary { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 8px 0 0; padding: 0; font: 0.8125rem/1.5 inherit; font-family: inherit; color: var(--inv2-muted); }
#page-inventory .inv2-summary b { font-weight: 700; color: var(--inv2-ink); font-variant-numeric: tabular-nums; }

/* ── record panel (the one place stock movements are entered) ──────────────────────────────────────────────────────────────── */
#page-inventory .inv2-record:not(.is-open) { display: none; }
#page-inventory .inv2-record .card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
#page-inventory .inv2-toolbar-action { margin-left: auto; }
#page-inventory .inv2-record { margin: 16px 0; padding: 14px 16px; border: 1px solid var(--inv2-line); border-radius: 12px; background: var(--inv2-surface); scroll-margin-top: 90px; }
#page-inventory .inv2-record .card-head { padding: 0; margin: 0 0 10px; border: 0; background: none; }
#page-inventory .inv2-record .card-head span { display: block; font: 600 0.6875rem/1.3 inherit; font-family: inherit; letter-spacing: .08em; text-transform: uppercase; color: var(--inv2-muted); }
#page-inventory .inv2-record .card-head h3 { margin: 2px 0 0; font: 700 1rem/1.3 inherit; font-family: inherit; color: var(--inv2-ink); }
#page-inventory .inv2-record .inventory-quick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 12px; align-items: end; }
#page-inventory .inv2-record .inventory-quick-item, #page-inventory .inv2-record .inventory-quick-reason { grid-column: span 2; }
#page-inventory .inv2-record label { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 0.8125rem; }
#page-inventory .inv2-record label > span { font: 600 0.6875rem/1.2 inherit; font-family: inherit; letter-spacing: .05em; text-transform: uppercase; color: var(--inv2-muted); }
#page-inventory .inv2-record select, #page-inventory .inv2-record input { width: 100%; min-width: 0; }

/* while the registry is locked / not set up / no office / not set up, the movement panel and filters are hidden: there is nothing to act on */
#page-inventory #inv-tab-control[data-state="blocked"] .inv2-record, #page-inventory #inv-tab-control[data-state="blocked"] .inv2-toolbar { display: none; }

/* ── stock table ───────────────────────────────────────────────────────────────────────────────────────────────────────────── */
#page-inventory .inv2-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0 8px; }
#page-inventory .inv2-chips { display: flex; flex-wrap: wrap; gap: 6px; }
#page-inventory .inv2-chip { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 0 12px; border: 1px solid var(--inv2-line-strong); border-radius: 999px; background: transparent; color: var(--inv2-ink-2); font: 600 0.8125rem/1 inherit; font-family: inherit; cursor: pointer; }
#page-inventory .inv2-chip b { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--inv2-muted); }
#page-inventory .inv2-chip:hover { background: var(--inv2-tint); }
#page-inventory .inv2-chip:focus-visible { outline: 2px solid var(--inv2-focus); outline-offset: 2px; }
#page-inventory .inv2-chip[aria-pressed="true"] { border-color: var(--inv2-brand); background: color-mix(in srgb, var(--inv2-brand) 11%, var(--inv2-surface)); color: var(--inv2-brand); }
#page-inventory .inv2-chip[aria-pressed="true"] b { color: inherit; }
#page-inventory .inv2-tablewrap { overflow-x: auto; }
#page-inventory .inv2-table { width: 100%; border-collapse: separate; border-spacing: 0; font: 0.875rem/1.4 inherit; font-family: inherit; }
#page-inventory .inv2-table thead th { padding: 0 12px 8px 0; text-align: left; font: 600 0.6875rem/1.3 inherit; font-family: inherit; letter-spacing: .06em; text-transform: uppercase; color: var(--inv2-muted); border-bottom: 1px solid var(--inv2-line-strong); white-space: nowrap; }
#page-inventory .inv2-table tbody th, #page-inventory .inv2-table tbody td { padding: 12px 12px 12px 0; vertical-align: middle; text-align: left; border-bottom: 1px solid var(--inv2-line); background: transparent; }
#page-inventory .inv2-table tbody tr:hover > * { background: var(--inv2-tint); }
#page-inventory .inv2-table tbody tr:last-child > * { border-bottom: 0; }
#page-inventory .inv2-item { display: block; font-weight: 600; font-size: 0.9375rem; color: var(--inv2-ink); overflow-wrap: anywhere; }
#page-inventory .inv2-sub { display: block; margin-top: 2px; font-weight: 400; font-size: 0.75rem; line-height: 1.35; color: var(--inv2-muted); }
#page-inventory .inv2-numcell { white-space: nowrap; }
#page-inventory .inv2-qty { font-size: 1.25rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.01em; color: var(--inv2-ink); }
#page-inventory .inv2-qty--none { color: var(--inv2-muted); font-weight: 500; }
#page-inventory .inv2-qty--neg { color: var(--inv2-neg); }
#page-inventory .inv2-unit { font-size: 0.8125rem; color: var(--inv2-muted); }
#page-inventory .inv2-par { display: block; font-size: 0.8125rem; color: var(--inv2-ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
#page-inventory .inv2-par b { font-weight: 700; color: var(--inv2-ink); }
#page-inventory .inv2-status { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 0.8125rem; color: var(--inv2-ink-2); white-space: nowrap; }
#page-inventory .inv2-status i { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--inv2-ok); }
#page-inventory .inv2-status[data-tone="low"] { color: var(--inv2-low-ink); } #page-inventory .inv2-status[data-tone="low"] i { background: var(--inv2-low); }
#page-inventory .inv2-status[data-tone="out"] { color: var(--inv2-out); } #page-inventory .inv2-status[data-tone="out"] i { background: var(--inv2-out); }
#page-inventory .inv2-status[data-tone="neg"] { color: var(--inv2-neg); } #page-inventory .inv2-status[data-tone="neg"] i { background: transparent; border: 2px solid var(--inv2-neg); width: 11px; height: 11px; }
#page-inventory .inv2-status[data-tone="none"] { color: var(--inv2-muted); font-weight: 500; } #page-inventory .inv2-status[data-tone="none"] i { background: transparent; border: 2px dashed var(--inv2-muted); width: 11px; height: 11px; }
#page-inventory .inv2-status[data-tone="ok"] { color: var(--inv2-ok-ink); }
#page-inventory .inv2-actcell { text-align: right; white-space: nowrap; }
#page-inventory .inv2-actions { display: inline-flex; align-items: center; gap: 8px; justify-content: flex-end; }
#page-inventory .inv2-btn { min-height: 32px; padding: 0 12px; border: 1px solid var(--inv2-line-strong); border-radius: 8px; background: transparent; color: var(--inv2-ink); font: 600 0.8125rem/1 inherit; font-family: inherit; cursor: pointer; white-space: nowrap; }
#page-inventory .inv2-btn:hover { background: var(--inv2-tint); }
#page-inventory .inv2-btn:focus-visible { outline: 2px solid var(--inv2-focus); outline-offset: 2px; }
#page-inventory .inv2-btn--primary { border-color: var(--inv2-brand); background: var(--inv2-brand); color: #fff; }
#page-inventory .inv2-btn--primary:hover { background: color-mix(in srgb, var(--inv2-brand) 88%, #000); }
#page-inventory .inv2-more { position: relative; }
#page-inventory .inv2-more > summary { display: inline-flex; align-items: center; min-height: 32px; padding: 0 8px; list-style: none; cursor: pointer; color: var(--inv2-muted); font: 600 0.8125rem/1 inherit; font-family: inherit; border-radius: 8px; }
#page-inventory .inv2-more > summary::-webkit-details-marker { display: none; }
#page-inventory .inv2-more > summary:hover { color: var(--inv2-ink); background: var(--inv2-tint); }
#page-inventory .inv2-more > summary:focus-visible { outline: 2px solid var(--inv2-focus); outline-offset: 2px; }
#page-inventory .inv2-menu { position: absolute; right: 0; z-index: 20; top: calc(100% + 4px); display: flex; flex-direction: column; gap: 2px; min-width: 150px; padding: 6px; border: 1px solid var(--inv2-line-strong); border-radius: 10px; background: var(--inv2-surface); box-shadow: 0 8px 24px rgba(15, 25, 35, .18); }
#page-inventory .inv2-menu .inv2-btn { border: 0; text-align: left; justify-content: flex-start; width: 100%; }
#page-inventory .inventory-empty { padding: 28px 8px; text-align: center; color: var(--inv2-ink-2); font-size: 0.9375rem; line-height: 1.5; }
#page-inventory .inv2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── sections (Ordering, usage): editorial headings + plain lists, no decorative cards ─────────────────────────────────────── */
#page-inventory .inv2-jump { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 4px 0 18px; }
#page-inventory .inv2-sec { margin: 0 0 34px; scroll-margin-top: 90px; }
#page-inventory .inv2-sec-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 4px; }
#page-inventory .inv2-sec-head h3 { margin: 0; font: 700 1.125rem/1.3 inherit; font-family: inherit; letter-spacing: -.01em; color: var(--inv2-ink); }
#page-inventory .inv2-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 999px; background: var(--cos-color-neutral-bg, rgba(127, 140, 152, .16)); color: var(--cos-color-neutral, var(--inv2-muted)); font: 600 0.6875rem/1 inherit; font-family: inherit; letter-spacing: .05em; text-transform: uppercase; }
#page-inventory .inv2-note { margin: 0 0 10px; max-width: 72ch; font-size: 0.8125rem; line-height: 1.5; color: var(--inv2-muted); }
#page-inventory .inv2-list { list-style: none; margin: 0; padding: 0; }
#page-inventory .inv2-list li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid var(--inv2-line); }
#page-inventory .inv2-list li:first-child { border-top: 1px solid var(--inv2-line-strong); }
#page-inventory .inv2-list .inv2-line strong { display: block; font-size: 0.9375rem; color: var(--inv2-ink); }
#page-inventory .inv2-list .inv2-right { flex: none; text-align: right; font-size: 0.875rem; color: var(--inv2-ink-2); }
#page-inventory .inv2-list .inv2-right b { font-size: 1.0625rem; color: var(--inv2-ink); font-variant-numeric: tabular-nums; }
#page-inventory .inv2-list .inv2-quiet { display: block; padding: 12px 0; color: var(--inv2-muted); font-size: 0.875rem; }
/* the legacy request/supplier blocks keep their markup and handlers; here they are flattened to match */
#page-inventory .inv2-sec .card { border: 1px solid var(--inv2-line); border-radius: 12px; background: var(--inv2-surface); box-shadow: none; }
#page-inventory .inv2-sec .exec-control-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 12px; padding: 0; border: 0; background: none; }

/* ── responsive: tablet keeps columns; phones turn each stock row into a compact operational row (not a card) ────────────────── */
@media (max-width: 899px) {
  #page-inventory .inv2-record .inventory-quick-item, #page-inventory .inv2-record .inventory-quick-reason { grid-column: 1 / -1; }
}
@media (max-width: 719px) {
  #page-inventory .inv2-field { flex: 1 1 100%; } #page-inventory .inv2-field select { width: 100%; }
  #page-inventory .inv2-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  #page-inventory .inv2-table, #page-inventory .inv2-table tbody, #page-inventory .inv2-table tr { display: block; }
  #page-inventory .inv2-table tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 12px 0; border-bottom: 1px solid var(--inv2-line); }
  #page-inventory .inv2-table tbody tr:last-child { border-bottom: 0; }
  #page-inventory .inv2-table tbody th, #page-inventory .inv2-table tbody td { display: block; padding: 0; border: 0; }
  #page-inventory .inv2-table tbody tr:hover > * { background: transparent; }
  #page-inventory .inv2-table tbody th { grid-column: 1; }
  #page-inventory .inv2-table .inv2-numcell { grid-column: 2; grid-row: 1; text-align: right; }
  #page-inventory .inv2-table .inv2-parcell { grid-column: 1; display: flex; gap: 12px; }
  #page-inventory .inv2-table td[data-label="Status"] { grid-column: 2; text-align: right; }
  #page-inventory .inv2-table .inv2-actcell { grid-column: 1 / -1; text-align: left; margin-top: 6px; }
  #page-inventory .inv2-actions { justify-content: flex-start; }
  #page-inventory .inv2-menu { right: auto; left: 0; }
  #page-inventory .inv2-list li { flex-direction: column; align-items: flex-start; gap: 4px; }
  #page-inventory .inv2-list .inv2-right { text-align: left; }
}
/* ── CP2d: Activity, Catalogue & setup, quiet "Not yet counted", context per view ────────────────────────────────────────────────── */
#page-inventory #inv-context[data-view="items"] .inv2-summary, #page-inventory #inv-context[data-view="movements"] .inv2-summary, #page-inventory #inv-context[data-view="items"] .inv2-field--location { display: none; }
#page-inventory .inv2-sum--quiet, #page-inventory .inv2-sum--quiet b { color: var(--inv2-muted); }
#page-inventory .inv2-sum--quiet b { font-weight: 600; }
#page-inventory .inv2-sum--quiet small { font-size: 0.75rem; color: var(--inv2-muted); }
#page-inventory .inv2-chip[data-quiet="true"] b { font-weight: 500; }
#page-inventory .inv2-tag--muted { background: transparent; border: 1px dashed var(--inv2-line-strong); }
#page-inventory .inv2-sec--tight { margin-bottom: 14px; }
#page-inventory .inv2-setup-actions { display: flex; flex-wrap: wrap; gap: 8px; }
#page-inventory .inv2-more-row { margin: 14px 0 0; }
/* Activity source switch: two labelled sources, one at a time */
#page-inventory .inv2-source { display: inline-flex; flex-wrap: wrap; gap: 0; margin: 0 0 18px; border: 1px solid var(--inv2-line-strong); border-radius: 10px; overflow: hidden; max-width: 100%; }
#page-inventory .inv2-seg { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; min-height: 44px; padding: 6px 16px; border: 0; background: transparent; color: var(--inv2-ink-2); font: 600 0.875rem/1.2 inherit; font-family: inherit; cursor: pointer; text-align: left; }
#page-inventory .inv2-seg + .inv2-seg { border-left: 1px solid var(--inv2-line-strong); }
#page-inventory .inv2-seg span { font-weight: 400; font-size: 0.6875rem; color: var(--inv2-muted); }
#page-inventory .inv2-seg:hover { background: var(--inv2-tint); }
#page-inventory .inv2-seg:focus-visible { outline: 2px solid var(--inv2-focus); outline-offset: -2px; }
#page-inventory .inv2-seg.is-active { background: color-mix(in srgb, var(--inv2-brand) 11%, var(--inv2-surface)); color: var(--inv2-brand); }
#page-inventory .inv2-seg.is-active span { color: var(--inv2-ink-2); }
/* Activity table: signed change, human type, quiet note */
#page-inventory .inv2-when { display: block; font-weight: 600; font-size: 0.8125rem; color: var(--inv2-ink); white-space: nowrap; }
#page-inventory .inv2-whencell { white-space: nowrap; }
#page-inventory .inv2-kind { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 6px; background: var(--cos-color-neutral-bg, rgba(127, 140, 152, .14)); color: var(--inv2-ink-2); font-weight: 600; font-size: 0.75rem; white-space: nowrap; }
#page-inventory .inv2-qty--sm { font-size: 1rem; }
#page-inventory .inv2-change[data-tone="up"] .inv2-qty { color: var(--inv2-ok-ink); }
#page-inventory .inv2-change[data-tone="flat"] .inv2-qty { color: var(--inv2-muted); font-weight: 500; }
#page-inventory .inv2-notecell { font-size: 0.8125rem; color: var(--inv2-ink-2); overflow-wrap: anywhere; min-width: 160px; }
@media (max-width: 719px) {
  #page-inventory .inv2-source { display: flex; width: 100%; }
  #page-inventory .inv2-seg { flex: 1 1 50%; }
  #page-inventory .inv2-table--activity tbody tr { grid-template-columns: minmax(0, 1fr) auto; }
  #page-inventory .inv2-table--activity tbody th { grid-column: 1; grid-row: 1; }
  #page-inventory .inv2-table--activity .inv2-change { grid-column: 2; grid-row: 1; text-align: right; }
  #page-inventory .inv2-table--activity td[data-label="Type"] { grid-column: 1; grid-row: 2; }
  #page-inventory .inv2-table--activity .inv2-whencell { grid-column: 2; grid-row: 2; text-align: right; }
  #page-inventory .inv2-table--activity .inv2-whencell .inv2-sub { display: inline; margin-left: 6px; }
  #page-inventory .inv2-table--activity .inv2-notecell { grid-column: 1 / -1; grid-row: 3; min-width: 0; }
  #page-inventory .inv2-table--activity .inv2-notecell--empty { display: none; }
}
@media (prefers-reduced-motion: reduce) { #page-inventory .inv2-tab, #page-inventory .inv2-btn, #page-inventory .inv2-chip { transition: none; } }
