/*
 * Football Results page styles (Task 1.27). Loaded only by
 * templates/football/results.html, on top of predictions-listing.css
 * (reused for the shared header/filter layout - .predictions-listing__*).
 * Built entirely from existing tokens/primitives (.card, .pill,
 * .crest-badge, fixture_row.html's own styles) - no new colors, no new
 * spacing scale.
 */

/* Results has exactly one filter field (Competition) - reusing predictions-
   listing.css's shared `.predictions-listing__filters` 4-column grid as-is
   (built for Today/Tomorrow's 4 real fields) left 3 columns of dead space
   and stranded Apply/Clear on their own row underneath. This modifier
   narrows the field to a sensible max-width and keeps the buttons on the
   same row beside it once there's room, instead of stretching one control
   across a grid sized for four. */
@media (min-width: 768px) {
  .results-filters {
    grid-template-columns: minmax(220px, 320px) auto;
  }

  .results-filters .predictions-listing__filter-actions {
    grid-column: auto;
  }
}

.results-date-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-16);
  margin-bottom: var(--space-8);
}

.results-date-nav__current {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  text-align: center;
}

/* Below 1024px (this codebase's established tablet+mobile tier - the same
   breakpoint the header/Prediction Slip already switch on) the plain flex
   row above has no room for "<- Previous Day", the date, and "Next Day ->"
   on one line. `flex-wrap` alone left Previous Day and the date sharing
   line 1 while Next Day was stranded alone on line 2 - both edge-aligned
   by the row's own `justify-content: space-between`, never centered or
   balanced against each other. Recomposed instead (never shrunk) into two
   rows: the date centered on its own line, Previous/Next as a balanced,
   equal-width, full-width button pair underneath - a clearer, more
   deliberate mobile/tablet composition, not a squeezed desktop layout. */
@media (max-width: 1023px) {
  .results-date-nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-12);
  }

  .results-date-nav__current {
    grid-column: 1 / -1;
    order: -1;
    justify-content: center;
  }

  .results-date-nav__prev,
  .results-date-nav__next {
    justify-content: center;
    text-align: center;
  }
}

.results-date-nav__today-link {
  text-align: center;
  margin-bottom: var(--space-24);
}

.results-competition-group {
  margin-bottom: var(--space-32);
}

.results-competition-group__heading {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  margin-bottom: var(--space-12);
}

.results-competition-group__fixtures {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
}
