/* ==========================================================================
   COMPONENTS · COLLECT — the per-row selection slot: the one quiet affordance
   by which ANY listing row (a country, a factor, a report) joins a collection
   (the comparison tray). A printer's register mark, not an "add to cart" button
   — a small hairline square that takes an ink check when collected. Composes
   cleanly beside the Finding's badge (s2) and the row identity (s1).
   New component (clean-room s3); merge candidate. ITCSS: 06-components.
   ========================================================================== */

.op-collect {
  --collect-size: 1.45rem;
  display: inline-grid;
  place-items: center;
  inline-size: var(--collect-size);
  block-size: var(--collect-size);
  flex: none;
  padding: 0;
  background: var(--surface-raised);
  border: 1px solid var(--rule-strong);
  border-radius: var(--radius-xs);
  cursor: pointer;
  color: var(--text-muted);
  transition: var(--transition-ink);
  -webkit-tap-highlight-color: transparent;
}
/* the register mark: a faint cross when free, hovering up to ink on intent */
.op-collect::before {
  content: "+";
  font-family: var(--font-data);
  font-size: 0.95em;
  line-height: 1;
  color: currentColor;
}
.op-collect:hover { border-color: var(--text); color: var(--text); }
.op-collect:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* — Collected: an ink-pressed mark, paper check — */
.op-collect[aria-pressed="true"] {
  background: var(--surface-inverse);
  border-color: var(--surface-inverse);
  color: var(--text-inverse);
  box-shadow: var(--shadow-deboss);
}
.op-collect[aria-pressed="true"]::before { content: "\2713"; } /* ✓ */

/* — Disabled: the tray is full (4). The slot stays legible but inert, so the
   ceiling is felt as a quiet limit, never an urgent prompt. — */
.op-collect[disabled],
.op-collect[aria-disabled="true"] {
  opacity: 0.4;
  cursor: not-allowed;
  box-shadow: none;
}

/* — Sizes — */
.op-collect--sm { --collect-size: 1.2rem; font-size: var(--text-xs); }

/* ==========================================================================
   COLLECTED ROW — a collected listing row earns a restrained INK left keyline
   (the same record-not-reward emphasis as rank one) and the faintest wash, so
   the eye can find its picks in a long index without any colour signal.
   Works on a table row via :has(), with a .is-collected fallback class for JS.
   ========================================================================== */

.op-table tbody tr:has(.op-collect[aria-pressed="true"]),
.op-table tbody tr.is-collected {
  background: var(--accent-wash);
}
/* the ink keyline rides the leading selection cell */
.op-table tbody tr:has(.op-collect[aria-pressed="true"]) .op-collect-cell,
.op-table tbody tr.is-collected .op-collect-cell {
  box-shadow: inset 2px 0 0 var(--surface-inverse);
}

/* The selection cell: a narrow, content-hugging leading column, centred. */
.op-collect-cell {
  inline-size: 1%;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}