/*
 * Football landing page styles (Task 1.20). Loaded only by
 * templates/football/football_landing.html - built entirely from
 * existing tokens/primitives (.card, .surface-analytical, .badge,
 * .pill, u-grid-auto-fit, .fixture-row from sports-components.css), no
 * new colors. The Prediction Slip sidecar needs no layout here:
 * static/css/responsive.css already reserves `.site-main` space for it
 * at >=1024px, and this page places no second slip.
 */

.football-landing__header {
  max-width: 720px;
  margin-bottom: var(--space-32);
}

.football-landing__section {
  padding-block: var(--section-spacing-mobile);
  border-bottom: 1px solid var(--color-border);
  /* The footer's "Leagues" link jumps to #leagues (Task 1.72A Phase 1
     repair) - matches the same scroll-margin-top treatment already
     established for League Detail's own in-page section anchors
     (league-detail.css), so the sticky header doesn't sit directly on
     top of the section heading after the jump. */
  scroll-margin-top: var(--space-24);
}

.football-landing__section:last-of-type {
  border-bottom: none;
}

@media (min-width: 1024px) {
  .football-landing__section {
    padding-block: var(--section-spacing-desktop);
  }
}

.football-landing__section-header {
  max-width: 720px;
  margin-bottom: var(--space-24);
}

.football-landing__section-footer {
  margin-top: var(--space-24);
}

.football-landing__fixtures {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
}

/* Upcoming Fixtures and Recent Results are both grouped by league
   (Task 1.72A) - the league name is shown once per group instead of
   being repeated on every fixture-row's own metadata column
   (fixture_row.html's show_league flag is omitted in both sections
   for exactly that reason). The adjacent-sibling selector only ever
   matches within one section at a time, since each section renders
   its own independent set of groups. */
.football-landing__league-group + .football-landing__league-group {
  margin-top: var(--space-32);
}

/* The competition's stored badge (initials fallback) beside its name - launch polish. */
.football-landing__league-group-heading {
  display: flex;
  align-items: center;
  gap: var(--space-8);
  margin-bottom: var(--space-12);
}