/* ============================================================================
   Replenishment · By Style — nested-MOQ demo surface
   (spec/PLAN_replenishment_by_style_v1.md §3.3 + the 2026-08-24 design-review
   pass). Collapsed style cards + lazily-loaded two-level roll-up bodies. Loads
   globally via the :app glob, so every class is `.rbs-`-prefixed; meter/pill/
   impact visuals REUSE the editor's `.mqe-*` classes from moq_groups.css (one
   visual language) — with this sheet explicitly OWNING the sub-group row grid
   so the layout never depends on glob cascade order. The frozen by_moq_group
   `.moq-group-card` classes are NOT reused. NO inline styles.
   ========================================================================== */

.rbs-list { display: flex; flex-direction: column; gap: 10px; }

.rbs-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.rbs-card.is-expanded { border-color: var(--border-hover); }
.rbs-card--untagged { border-style: dashed; background: var(--surface-alt); }

.rbs-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  cursor: pointer;
  min-width: 0;
}
.rbs-card--untagged .rbs-head { cursor: default; flex-wrap: wrap; }
.rbs-head__name-wrap { display: inline-flex; align-items: baseline; gap: 6px; min-width: 0; }
.rbs-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 280px;
}
.rbs-name:hover { color: var(--accent); text-decoration: underline; }
.rbs-edit-link {
  font-size: 11px;
  color: var(--muted);
  text-decoration: none;
  white-space: nowrap;
}
.rbs-edit-link:hover { color: var(--accent); text-decoration: underline; }

/* Neutral configuration-metadata chip (design review: purple means AI/excess
   in this system — a config chip is an info badge). */
.rbs-chip {
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--stone);
  background: #f0f0ee;
  border: 1px solid var(--border);
  white-space: nowrap;
}
.rbs-counts { font-size: 12px; color: var(--muted); white-space: nowrap; }
.rbs-nofloor { font-size: 12px; color: var(--muted); font-style: italic; }
.rbs-untagged-note { font-size: 12px; color: var(--muted); }

/* Right-side metrics in a FIXED grid so meters/nums column-align down the page
   (the projector scan — design review SF1/F4). Empty cells keep the columns.
   Col 1 must FIT label + pill at its widest ("QUALIFYING" + "⚠ 100%" ≈ 190px)
   — at 150px the pill painted over the nums column (founder QA 2026-08-24). */
.rbs-head__metrics {
  margin-left: auto;
  display: grid;
  grid-template-columns: 200px 96px 318px 88px;
  gap: 10px;
  align-items: center;
  justify-items: start;
  flex-shrink: 0;
}
.rbs-metric { min-width: 0; }
.rbs-metric--meter { display: inline-flex; align-items: center; gap: 6px; }
.rbs-qual-label {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--muted);
}
/* The card's primary number reads at projector distance (design review SF11). */
.rbs-head .rbs-nums { font-size: 13px; color: var(--ink); }
.rbs-order-total,
.rbs-clearcount {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

@media (max-width: 1360px) {
  .rbs-head__metrics { grid-template-columns: 200px 96px 88px; }
  .rbs-order-total { display: none; }
}

/* Min-Sugg-Qty input in the filters card (a CLASS, not the inline style the
   older by_moq_group card carries — that's baselined tech debt). */
.rbs-min-sugg { max-width: 100px; }

/* ── Expanded body ─────────────────────────────────────────────────────── */
.rbs-body { border-top: 1px solid var(--border-light); }
.rbs-detail { padding: 14px 16px; }

.rbs-sg-list { display: flex; flex-direction: column; gap: 8px; margin: 12px 0; }
.rbs-sg {
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 8px 12px;
}
.rbs-sg[data-state="deferred"] { border-style: dashed; background: var(--surface-alt); }
/* .rbs-sg is the ONE box — strip the editor row's own card chrome so deferred
   never renders dashed-inside-dashed (design review F3). */
.rbs-sg .mqe-prow,
.rbs-sg .rbs-prow {
  border: none;
  background: transparent;
  padding: 0;
  border-radius: 0;
}

/* This sheet OWNS the row grid (never cascade-order-dependent): label · meter ·
   math · floor · state. Full labels ellipsize; floor column drops first. */
.rbs-prow {
  display: grid;
  grid-template-columns: minmax(140px, 220px) 46px minmax(210px, 1fr) 88px auto;
  align-items: center;
  gap: 10px;
}
.rbs-prow__labelwrap { display: flex; flex-direction: column; min-width: 0; }
.rbs-prow__label {
  font-weight: 600;
  font-size: 13px;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rbs-prow__members {
  font-size: 10px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rbs-prow__floor {
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}
@media (max-width: 1100px) {
  .rbs-prow { grid-template-columns: minmax(110px, 1fr) 46px minmax(180px, 1.2fr) auto; }
  .rbs-prow__floor { display: none; }
}

/* ── SKU drill-downs ───────────────────────────────────────────────────── */
.rbs-sg-skus { margin-top: 6px; }
.rbs-sg-skus__summary {
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  color: var(--blue);
  list-style: none;
}
.rbs-sg-skus__summary::-webkit-details-marker { display: none; }
.rbs-sg-skus__summary::before { content: "▸ "; }
.rbs-sg-skus[open] > .rbs-sg-skus__summary::before { content: "▾ "; }
.rbs-sg-skus .table-wrapper { margin-top: 8px; }

.rbs-sku-note {
  margin: 8px 0 0;
  font-size: 11px;
  color: var(--muted);
}
.rbs-sku-tiefoot td {
  font-size: 12px;
  color: var(--ink);
  background: var(--surface-alt);
  border-top: 1px solid var(--border);
  padding: 6px 10px;
}

/* This surface is read-only: the canonical row's selection/edit affordances
   have no bulk bar or recompute here — dead controls are a demo liability
   (design review SF7/F6). Hidden page-scoped; the frozen partial is untouched. */
.rbs-sg-skus .replen-checkbox-cell,
.rbs-sg-skus .replen-edit-cell { display: none; }
