/* =========================================================================
   Volumes page - entries in book order
   ========================================================================= */

.vol-block { margin-bottom: 44px; }

.vol-heading {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: 1.6rem;
  color: var(--ink);
  margin: 0 0 14px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--claret);
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.vol-heading__count {
  font-family: var(--font-sans);
  font-size: .74rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 700;
  color: var(--muted);
}

.entry-index { width: 100%; border-collapse: collapse; }
.entry-index th {
  text-align: left;
  font-family: var(--font-sans);
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
  font-weight: 700;
  padding: 6px 10px;
  border-bottom: 1px solid var(--border);
}
.entry-index td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}
.entry-index tr:hover td { background: var(--parchment-2); }

.col-page {
  width: 1%;
  white-space: nowrap;
  font-family: var(--font-sans);
  font-size: .8rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
/* Fixed width, NOT the usual `width: 1%` shrink-to-fit trick. With lazy images
   the cell has no intrinsic content to size against until they load, so the
   column collapsed to ~2px - and site.css's global `img { max-width: 100% }`
   then clamped the image to that, leaving the whole of Volume 5 blank because
   it sits below the fold. */
.col-thumb { width: 84px; }
.col-thumb img {
  width: 64px; height: 44px;
  max-width: none;          /* must beat the global img rule above */
  object-fit: cover;
  border-radius: 3px;
  border: 1px solid var(--border);
  display: block;
  background: var(--parchment-2);
}
.thumb-none {
  width: 64px; height: 44px;
  display: block;
  border-radius: 3px;
  border: 1px dashed var(--border);
  background: var(--parchment-2);
}

.entry-ground a {
  font-family: var(--font-serif);
  font-size: 1.04rem;
  color: var(--claret);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.entry-ground a:hover { border-bottom-color: var(--claret); }
.entry-ground .club {
  display: block;
  font-family: var(--font-sans);
  font-size: .78rem;
  color: var(--muted);
  margin-top: 1px;
}

.col-date {
  white-space: nowrap;
  font-family: var(--font-sans);
  font-size: .85rem;
  color: var(--ink);
}
.col-fixture { font-family: var(--font-sans); font-size: .88rem; color: var(--ink); }
.col-fixture .comp { color: var(--muted); }
.col-fixture .score {
  font-weight: 700;
  background: var(--parchment-2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 6px;
  font-size: .82rem;
  white-space: nowrap;
}
/* the "no game" entries are real records, just quieter than the fixtures */
.no-game {
  font-size: .82rem;
  color: var(--muted);
  font-style: italic;
}
.is-nogame .col-page { color: var(--muted); }

.filter-count {
  font-size: .72rem;
  opacity: .75;
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}

@media (max-width: 860px) {
  /* drop the fixture column first - the ground and date carry the row */
  .entry-index .col-fixture { display: none; }
}
@media (max-width: 560px) {
  .entry-index .col-date { display: none; }
  .col-thumb img, .thumb-none { width: 48px; height: 34px; }
  .vol-heading { font-size: 1.35rem; }
}