
.static-demo-banner{font:500 13px/1.5 system-ui,-apple-system,Segoe UI,sans-serif;
  padding:10px 16px;background:rgba(125,211,252,.10);border-bottom:1px solid rgba(125,211,252,.28);
  color:inherit;text-align:center}
.static-demo-banner a{color:#38bdf8;text-decoration:underline;text-underline-offset:2px}
.static-demo-banner__warn{opacity:.8}


/* Availability strip - shared shape on Products and Sales Reps.
   Reads the theme tokens, so it follows the light/dark toggle. */
.inv-strip { border: 1px solid var(--wa-hairline); border-radius: var(--wa-radius); background: var(--wa-surface); padding: 1.1rem 1.25rem; margin-bottom: 1.25rem; }
.inv-strip__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.6rem; margin-bottom: 0.9rem; }
.inv-strip__eyebrow { font-size: 0.66rem; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase; color: var(--wa-text-faint); }
.inv-strip__note { font-size: 0.8rem; color: var(--wa-text-dim); flex: 1 1 20ch; }
.inv-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1px; background: var(--wa-hairline); border: 1px solid var(--wa-hairline); border-radius: var(--wa-radius-sm); overflow: hidden; }
.inv-kpi { background: var(--wa-surface); padding: 0.75rem 0.85rem; border-top: 2px solid transparent; }
.inv-kpi--warn { border-top-color: var(--wa-warn); }
.inv-kpi--danger { border-top-color: var(--wa-bad); }
.inv-kpi__label { font-size: 0.62rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wa-text-faint); }
.inv-kpi__value { font-family: var(--wa-font-display); font-variant-numeric: tabular-nums; font-size: 1.35rem; font-weight: 600; letter-spacing: -0.02em; color: var(--wa-text); line-height: 1.2; }
.inv-kpi__note { font-size: 0.72rem; color: var(--wa-text-dim); }
.inv-table { width: 100%; border-collapse: collapse; margin-top: 1rem; font-variant-numeric: tabular-nums; font-size: 0.85rem; }
.inv-table th { text-align: left; font-size: 0.64rem; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; color: var(--wa-text-faint); border-bottom: 1px solid var(--wa-hairline-strong); padding: 0.4rem 0.6rem; }
.inv-table td { padding: 0.45rem 0.6rem; border-bottom: 1px solid var(--wa-hairline-soft); color: var(--wa-text); }
.inv-table .num { text-align: right; }
.inv-table tr.is-critical td:first-child { box-shadow: inset 2px 0 0 var(--wa-bad); }
.inv-chip { display: inline-block; padding: 0.08rem 0.45rem; border-radius: 999px; font-size: 0.66rem; font-weight: 600; }
.inv-chip--ok { background: var(--wa-good-wash); color: var(--wa-good); }
.inv-chip--watch { background: var(--wa-warn-wash); color: var(--wa-warn); }
.inv-chip--critical { background: var(--wa-bad-wash); color: var(--wa-bad); }
.inv-chip--unknown { background: var(--wa-surface-3); color: var(--wa-text-faint); }
.inv-strip__empty { color: var(--wa-text-dim); font-size: 0.85rem; }
@media (max-width: 760px) { .inv-table th:nth-child(n+5), .inv-table td:nth-child(n+5) { display: none; } }


      :root {
        --wa-primary: #0d6efd;
        --bs-primary: #0d6efd;
      }
    