/* Archive-specific styles. Reuses CSS custom properties from styles.css. */

.history-hero {
  padding: 6rem 1rem 2rem;
  text-align: center;
}

.history-hub-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.5rem;
  max-width: 1100px;
  margin: 0 auto 4rem;
  padding: 0 1rem;
}

.history-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  padding: 1.5rem;
  text-decoration: none;
  color: inherit;
  transition: transform 0.15s, box-shadow 0.15s;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.history-card:hover,
.history-card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}

.history-card.inert { opacity: 0.55; pointer-events: none; }

.history-card__year { font-size: 2rem; font-weight: 700; }
.history-card__dates { color: #555; font-size: 0.95rem; }
.history-card__venue { color: #666; font-size: 0.9rem; }
.history-card__result { margin-top: 0.5rem; font-weight: 600; }

/* Detail page (Task 7) */
.history-detail { max-width: 1100px; margin: 0 auto; padding: 6rem 1rem 4rem; }
.history-detail section { margin-bottom: 3rem; }
.history-detail h2 { margin-bottom: 1rem; border-bottom: 2px solid #eee; padding-bottom: 0.5rem; }

.roster-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 2rem;
}
@media (max-width: 640px) { .roster-grid { grid-template-columns: 1fr; } }

.roster-column h3 { margin-bottom: 0.75rem; }
.roster-list { list-style: none; padding: 0; margin: 0; columns: 2; }
.roster-list li { padding: 0.25rem 0; break-inside: avoid; }

.pairings-table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.pairings-table th, .pairings-table td { padding: 0.5rem 0.75rem; border-bottom: 1px solid #eee; text-align: left; }
.pairings-table .winner-usa { color: #b91c1c; font-weight: 600; }
.pairings-table .winner-intl { color: #1e3a8a; font-weight: 600; }
.pairings-table .winner-tie { color: #666; font-style: italic; }

.news-archive-list { list-style: none; padding: 0; }
.news-archive-item { border-bottom: 1px solid #eee; padding: 1rem 0; }
.news-archive-item h3 { margin: 0 0 0.25rem; }
.news-archive-item time { color: #888; font-size: 0.85rem; }

.deep-results-cta {
  display: inline-block; margin-top: 1rem; padding: 0.75rem 1.5rem;
  background: #667eea; color: #fff; border-radius: 8px; text-decoration: none; font-weight: 600;
}
.deep-results-cta:hover { background: #5568d3; }

/* Per-format / per-segment pairings tables (Day 1 + Day 2). */
.pairings-note {
  color: #666; font-size: 0.9rem; margin: 0 0 0.75rem;
}
.pairings-table.pairings-day1,
.pairings-table.pairings-day2 {
  font-size: 0.9rem;
  table-layout: auto;
}
.pairings-table .match-num { width: 2.5rem; font-weight: 600; text-align: center; color: #555; }
.pairings-table .pair-cell { font-weight: 500; line-height: 1.35; white-space: nowrap; }
.pairings-table .format-cell,
.pairings-table .seg-cell {
  text-align: center;
  min-width: 5rem;
  vertical-align: middle;
}
.pairings-table .format-cell.empty,
.pairings-table .seg-cell.empty { color: #ccc; }
.pairings-table .format-status,
.pairings-table .seg-status {
  font-weight: 600;
  font-size: 0.9rem;
  line-height: 1.2;
}
.pairings-table .format-points,
.pairings-table .seg-points {
  font-size: 0.75rem;
  color: #666;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}
.pairings-table .format-cell.winner-intl .format-points,
.pairings-table .format-cell.winner-usa .format-points,
.pairings-table .seg-cell.winner-intl .seg-points,
.pairings-table .seg-cell.winner-usa .seg-points {
  color: inherit; opacity: 0.75;
}
.pairings-table th .format-name {
  display: block;
  font-size: 0.75rem;
  font-weight: 400;
  color: #888;
  margin-top: 0.15rem;
}
.pairings-table .total-cell {
  text-align: center;
  font-variant-numeric: tabular-nums;
  min-width: 4rem;
}

/* Small screens: let the tables scroll horizontally rather than break layout. */
@media (max-width: 900px) {
  .pairings-day1, .pairings-day2 { display: block; overflow-x: auto; white-space: nowrap; }
}
