/* ==========================================================================
   COMPONENTS · LIBRARY SHELF — the member's OWNED offprints, presented as a
   personal shelf of the journal: each report a re-openable filed copy, escorted
   by its Finding identity (the s2 Badge) and its provenance (sources tally,
   purchase record). A ruled list on a leaf sheet — not the storefront index, no
   prices to pay, no asks. It is what the reader already owns. Composes op-badge,
   op-tally, op-btn, op-kicker. New (clean-room p-library); harvest candidate.
   ITCSS: 06-components.
   ========================================================================== */

.op-shelf {
  background: var(--surface-raised);
  border: 1px solid var(--rule);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-raised);
}
.op-shelf__list { list-style: none; margin: 0; padding: 0; }

/* A filed offprint: identity (with its owned mark) ↔ escorted score ↔ the
   provenance record ↔ the re-open action. Ruled like a contents list. */
.op-shelf__row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-md);
  border-top: 1px solid var(--rule);
}
.op-shelf__row:first-child { border-top: 0; }
.op-shelf__row:hover { background: color-mix(in oklab, var(--surface-sunken) 40%, var(--surface-raised)); }

.op-shelf__identity { min-width: 0; display: grid; gap: 0.2em; }
.op-shelf__kicker {
  display: flex;
  align-items: center;
  gap: 0.6em;
  font-family: var(--font-furniture);
  font-size: var(--text-3xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-muted);
}
.op-shelf__title {
  font-family: var(--font-reading);
  font-weight: var(--weight-semibold);
  font-size: var(--text-md);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  text-decoration: none;
}
.op-shelf__title:hover { color: var(--accent); text-decoration: underline; text-decoration-color: var(--link-underline); text-underline-offset: 0.16em; }
.op-shelf__iso {
  font-family: var(--font-data);
  font-weight: var(--weight-medium);
  font-size: 0.78em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-left: 0.4em;
}

/* The owned press-mark — a letterpress register that this copy is filed to the
   reader. Quiet ink, never the accent; the proof of ownership, not a reward. */
.op-shelf__owned {
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  font-family: var(--font-furniture);
  font-size: var(--text-3xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-secondary);
}
.op-shelf__owned::before {
  content: "";
  inline-size: 0.9em;
  block-size: 0.9em;
  border: 1.5px solid currentColor;
  border-radius: var(--radius-seal);
  background:
    linear-gradient(45deg, transparent 44%, currentColor 44%, currentColor 56%, transparent 56%),
    linear-gradient(-45deg, transparent 60%, currentColor 60%, currentColor 70%, transparent 70%);
  flex: none;
}
/* covered-by-membership variant of the owned line reads how access is held */
.op-shelf__owned--member { color: var(--text-muted); }

/* The escorted-score column */
.op-shelf__score { justify-self: end; }

/* The provenance record block — the purchase / access facts, mono where measured */
.op-shelf__record {
  display: grid;
  gap: var(--space-3xs);
  justify-items: end;
  text-align: right;
  min-inline-size: 9rem;
}
.op-shelf__meta {
  font-family: var(--font-furniture);
  font-size: var(--text-2xs);
  letter-spacing: var(--tracking-wide);
  color: var(--text-muted);
}
.op-shelf__meta [data-numeric],
.op-shelf__meta time {
  font-family: var(--font-data);
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--text-secondary);
}
.op-shelf__actions { display: flex; gap: var(--space-2xs); margin-top: var(--space-3xs); }

/* — Mobile: identity over score over record, the action full-width — */
@media (max-width: 48rem) {
  .op-shelf__row {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "identity score"
      "record   record";
    gap: var(--space-xs) var(--space-sm);
  }
  .op-shelf__identity { grid-area: identity; }
  .op-shelf__score    { grid-area: score; justify-self: end; }
  .op-shelf__record   {
    grid-area: record;
    justify-items: start;
    text-align: left;
    min-inline-size: 0;
    padding-top: var(--space-2xs);
    border-top: 1px solid var(--rule-faint);
  }
  .op-shelf__actions { margin-top: var(--space-2xs); }
}