/* =============================================================================
 * summary-row.css — PROTOTYPE-ONLY component for run PL_Report.
 * Host: .umag-summary-row (parity with the eventual DS selector umag-summary-row).
 * Matched to Figma `Summary` (file oxVeydrVMJy9Y3CSu0Zv2C, node 5075-8594).
 *
 * A P&L *result/summary* row: a filled (grey) bar — [label] … [amount + ₸], medium
 * weight, no chevron, no level indent. The companion to .umag-tree-view-item: the tree
 * rows are the breakdown, the summary rows are the totals (Валовая/Чистая прибыль).
 *
 * BOUNDARIES: Layer-2 tokens ONLY. NO raw hex, NO rgb(), NO Layer-1 primitive.
 * Layout-only bare px is allowed. Typography via the real DS .text-m-strong (ds.css).
 * Maps to code tokens with ZERO divergence: bg --bg-secondary-default (#f5f5f5),
 * radius --radius-2x (12px), padding space-3x/2x. Prototype-only (promote on human say-so).
 * ========================================================================== */

.umag-summary-row {
  display: flex;
  align-items: center;
  gap: var(--space-4x);                                                   /* 16 — label ↔ amount */
  overflow: hidden;
  width: 100%;
  /* Figma: pl-3x (12) · pr-2x (8) · py-3x (12) → height = 12 + 18 line + 12 = 42px */
  padding: var(--space-3x) var(--space-2x) var(--space-3x) var(--space-3x);
  border-radius: var(--radius-2x);                                        /* 12px (exact token match) */
  background: var(--bg-secondary-default);                                /* #f5f5f5 grey fill */
  color: var(--text-primary-default);
}

/* Label — flexes, truncates with ellipsis. Weight comes from .text-m-strong (medium). */
.umag-summary-row .sr-label {
  flex: 1 1 0;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Amount — value + tenge symbol, right-aligned, never wraps. */
.umag-summary-row .sr-amount {
  display: flex;
  align-items: center;
  gap: var(--space-1x);                 /* 4 — between value and ₸ */
  padding-right: var(--space-1x);       /* 4 */
  flex-shrink: 0;
  text-align: right;
  white-space: nowrap;
}