/* nfl-links.css — the plain-HTML internal links that build_nfl_internal_links.py
   writes into the NFL hub (/nfl/) and every NFL weekly map page: the linked
   featured-map title, the week-by-week strip, the team grid and the per-week
   game list. Everything here is static markup in the page source (for
   crawlers); nothing in this file styles JS-built DOM. Colors, radii and the
   heading face all come from redesign.css's tokens. */

/* ---------- Featured map title on /nfl/ (links to that week's page) ---------- */
.featured-title-link { color: inherit; text-decoration: none; }
.featured-title-link:hover,
.featured-title-link:focus-visible {
  text-decoration: underline;
  text-decoration-color: var(--color-primary);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}
.featured-title-link-arrow { color: var(--color-primary); font-size: .8em; margin-left: .15em; }
.featured-updated { margin: 0 0 4px; font-size: .85rem; line-height: 1.4; color: var(--color-text-muted); }
/* Title, Updated line and first map sit close together: the base
   .section-title line-height left a ~46px box around ~28px text
   (the pre-rendered .section-header carries margin-bottom:0 itself). */
#featuredHeader[data-listing-id] .section-title { line-height: 1.15; }

/* ---------- Section shell (hub sections and the weekly-page footer) ---------- */
.nfl-links-section { padding-block: 28px 8px; }
/* Jump-nav targets land just under .sticky-chrome, same as #schedule in redesign.css. */
#maps-by-week, #maps-by-team { scroll-margin-top: 110px; }
/* On weekly pages the section IS the .container (no inner wrapper); give it the
   same inset as .listing-maps.container in redesign.css so it lines up with the
   map cards: flush on desktop, 16px on mobile. */
.nfl-links-section.container, .nfl-week-games.container { padding-left: 0; padding-right: 0; }
.nfl-links-title {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: clamp(1.2rem, 2.2vw, 1.5rem);
  line-height: 1.2;
  color: var(--color-text);
  margin: 0 0 6px;
  text-wrap: balance;
}
.nfl-links-subtitle { margin: 0 0 16px; font-size: .9rem; color: var(--color-text-muted); max-width: 70ch; }
.nfl-links-more { margin: 12px 0 0; font-size: .85rem; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.nfl-links-more a { color: var(--color-primary); font-weight: 600; text-decoration: none; }
.nfl-links-more a:hover { text-decoration: underline; }

/* ---------- Week strip ---------- */
.nfl-week-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.nfl-week-strip > li { display: flex; }
.nfl-week-tile {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 9px 4px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
  text-decoration: none;
  text-align: center;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
}
.nfl-week-tile-num { font-weight: 700; font-size: .9rem; }
.nfl-week-tile-date { font-size: .72rem; color: var(--color-text-muted); }
a.nfl-week-tile:hover { border-color: var(--color-primary); }
a.nfl-week-tile:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.nfl-week-tile.is-current { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.nfl-week-tile.is-current .nfl-week-tile-date { color: rgba(255,255,255,.85); }
.nfl-week-tile.is-unmapped { background: transparent; border-style: dashed; color: var(--color-text-muted); }

/* ---------- Team grid (hub) ---------- */
.nfl-team-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px 20px;
}
.nfl-team-links-division-title {
  margin: 0 0 6px;
  font-family: var(--font-main);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.nfl-team-links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.nfl-team-links a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  border-radius: 8px;
  color: var(--color-text);
  font-size: .88rem;
  font-weight: 600;
  text-decoration: none;
}
.nfl-team-links a:hover { background: var(--color-primary-dim); }
.nfl-team-links img { width: 22px; height: 22px; flex: none; object-fit: contain; }

/* ---------- This week's games (weekly pages) ---------- */
.nfl-week-games { padding-block: 32px 4px; }
.nfl-week-games-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px 24px;
}
.nfl-week-games-slot h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 6px;
  font-family: var(--font-main);
  font-size: .85rem;
  font-weight: 700;
  color: var(--color-text);
}
.nfl-week-games-slot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.nfl-week-games-slot li { font-size: .9rem; color: var(--color-text-muted); }
.nfl-week-games-slot a,
.broadcast-description-list a.nfl-team-link {
  color: var(--color-text);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(198,113,57,.45);
  text-underline-offset: 3px;
}
.nfl-week-games-slot a:hover,
.broadcast-description-list a.nfl-team-link:hover { text-decoration-color: currentColor; }

@media (max-width: 768px) {
  .nfl-links-section.container, .nfl-week-games.container { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 900px) {
  .nfl-team-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
  .nfl-week-strip { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); }
}
.featured-updated a { color: var(--color-primary); font-weight: 600; text-decoration: none; }
.featured-updated a:hover { text-decoration: underline; }

/* ---------- Jump-nav divider (app.js) ----------
   Separates the week's map links from the page's other in-page sections
   (All Weeks / Teams / Schedule) on the left side of the bar. */
.page-jump-nav-divider {
  flex: none;
  align-self: center;
  width: 1px;
  height: 18px;
  margin: 0 8px;
  background: rgba(32,30,29,.28);
}
/* The divider and the three in-page links moved to the left side make the bar
   ~28px too wide at 1280px; trim each link's side padding (16px -> 13px) so
   it fits. Phones keep redesign.css's own smaller padding (the bar scrolls). */
@media (min-width: 769px) {
  .page-jump-nav-inner:has(> .page-jump-nav-divider) .page-jump-nav-link { padding-left: 13px; padding-right: 13px; }
}

/* ---------- Upcoming weeks (generate_nfl_week_previews.py) ----------
   Week tiles that link to a schedule page because the map isn't out yet:
   dashed like an unmapped week, but a real link. */
a.nfl-week-tile.is-upcoming:not(.is-current) { border-style: dashed; }
#nfl-week-regional, #nfl-week-national, #nfl-week-tbd, #nfl-week-faq { scroll-margin-top: 110px; }
.nfl-week-preview-when { font-variant-numeric: tabular-nums; }
.nfl-week-preview-final { font-variant-numeric: tabular-nums; }
.nfl-week-preview-faq-item { border-bottom: 1px solid var(--color-border); max-width: 80ch; }
.nfl-week-preview-faq-item summary { cursor: pointer; padding: 10px 0; font-weight: 600; color: var(--color-text); }
.nfl-week-preview-faq-item p { margin: 0 0 12px; font-size: .9rem; line-height: 1.55; color: var(--color-text-muted); }

/* Week-preview hero: the /nfl/ hub's hero (its inline <style>), scoped so the
   hub itself, which also loads this file, is untouched. Fixed 250px card next
   to the 300x250 ad at >=1280px; the hub's fit script sizes the text to it. */
.nfl-week-hero.page-hero { padding-top: 8px; padding-bottom: 4px; }
.nfl-week-hero .page-hero-inner { position: relative; padding-bottom: 28px; }
.nfl-week-hero .hero-ad-col { display: none; }
.nfl-week-hero .hero-note {
  position: absolute; left: 40px; right: 40px; bottom: 7px; margin: 0;
  font-family: var(--font-heading); font-weight: 400; font-size: .9rem;
  line-height: 1.2; letter-spacing: .01em; color: var(--color-primary);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nfl-week-hero .hero-note a { color: inherit; text-decoration: none; }
.nfl-week-hero .hero-note a:hover { text-decoration: underline; }
@media (max-width: 1279px) {
  .nfl-week-hero .hero-subtitle-wrap > summary.hero-subtitle-toggle { display: flex; }
}
@media (max-width: 768px) {
  .nfl-week-hero .page-hero-inner { padding-bottom: 30px; }
  .nfl-week-hero .hero-note { left: 22px; right: 22px; font-size: .74rem; }
}
@media (min-width: 1280px) {
  .nfl-week-hero.page-hero { padding-top: 16px; padding-bottom: 12px; }
  .nfl-week-hero > .container { display: flex; align-items: center; gap: 28px; }
  .nfl-week-hero .page-hero-inner {
    flex: 1 1 auto; min-width: 0; height: 250px; padding-bottom: 30px;
    justify-content: center; overflow: hidden;
  }
  .nfl-week-hero .page-hero-title { font-size: 1.6rem; line-height: 1.15; }
  .nfl-week-hero .page-hero-subtitle { font-size: .95rem; line-height: 1.45; }
  .nfl-week-hero .hero-ad-col { display: flex; flex: 0 0 300px; width: 300px; }
  .nfl-week-hero .hero-ad-slot { width: 300px; height: 250px; }
}

/* ---------- This week's SEO blocks (nfl_seo.py via build_nfl_internal_links.py) ----------
   Full-size map image inside each map's description box, market links in the
   descriptions, the primetime games, the top-markets table and the FAQ. */
.map-figure { margin: 4px 0 14px; max-width: 640px; }
.map-figure img {
  display: block; width: 100%; height: auto;
  border: 1px solid var(--color-border); border-radius: var(--radius-sm);
  background: var(--color-surface);
}
.map-figure figcaption { margin-top: 6px; font-size: .8rem; line-height: 1.45; color: var(--color-text-muted); }
.map-figure figcaption a { color: var(--color-primary); font-weight: 600; text-decoration: none; white-space: nowrap; }
.map-figure figcaption a:hover { text-decoration: underline; }
.broadcast-description-list a.nfl-market-link {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: rgba(198,113,57,.45);
  text-underline-offset: 3px;
}
.broadcast-description-list a.nfl-market-link:hover { text-decoration-color: currentColor; }

#primetime-games, #top-markets, #faq { scroll-margin-top: 110px; }
.nfl-primetime-slot h3 { font-size: .9rem; }
.nfl-primetime-when, .nfl-primetime-venue {
  margin: 4px 0 0; font-size: .8rem; color: var(--color-text-muted); font-variant-numeric: tabular-nums;
}
.nfl-week-games-slot.nfl-primetime-slot li a { color: var(--color-text); }

.nfl-links-subtitle a { color: var(--color-primary); font-weight: 600; text-decoration: none; }
.nfl-links-subtitle a:hover { text-decoration: underline; }
.nfl-top-markets-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--color-border); border-radius: var(--radius-sm); }
.nfl-top-markets { width: 100%; border-collapse: collapse; font-size: .86rem; background: var(--color-surface); }
.nfl-top-markets th, .nfl-top-markets td { padding: 7px 12px; text-align: left; border-bottom: 1px solid var(--color-border); white-space: nowrap; }
.nfl-top-markets thead th {
  font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--color-text-muted); background: var(--color-bg, transparent);
}
.nfl-top-markets tbody tr:last-child > * { border-bottom: 0; }
.nfl-top-markets tbody th { font-weight: 600; }
.nfl-top-markets tbody th a { color: var(--color-text); text-decoration: underline; text-decoration-color: rgba(198,113,57,.45); text-underline-offset: 3px; }
.nfl-top-markets tbody th a:hover { text-decoration-color: currentColor; }
.nfl-top-markets td { color: var(--color-text); }
.nfl-top-markets td.is-none { color: var(--color-text-muted); }
.nfl-top-markets-split { color: var(--color-text-muted); font-size: .78rem; }
/* Markets beyond the 25 largest stay hidden until the toggle expands the section. */
.nfl-top-markets tr.is-more { display: none; }
.is-expanded .nfl-top-markets tr.is-more { display: table-row; }
:not(.is-expanded) > .nfl-top-markets-wrap .nfl-top-markets tbody tr:nth-child(25) > * { border-bottom: 0; }
.nfl-top-markets tr.nfl-top-markets-divider td {
  font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--color-text-muted); background: var(--color-bg, transparent);
}
.nfl-top-markets-toggle {
  display: block; margin: 12px auto 0; padding: 8px 18px; cursor: pointer;
  font: inherit; font-size: .88rem; font-weight: 600; color: var(--color-primary);
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 999px;
}
.nfl-top-markets-toggle:hover { border-color: var(--color-primary); }
@media (max-width: 768px) {
  .nfl-top-markets { font-size: .8rem; }
  .nfl-top-markets th, .nfl-top-markets td { padding: 6px 9px; }
  /* Market column stays put while the windows scroll sideways. */
  .nfl-top-markets tbody th, .nfl-top-markets thead th:first-child { position: sticky; left: 0; background: var(--color-surface); z-index: 1; }
  .nfl-top-markets tbody th { white-space: normal; min-width: 112px; max-width: 132px; line-height: 1.3; }
}

.nfl-faq .nfl-week-preview-faq-item p a { color: var(--color-primary); font-weight: 600; text-decoration: none; }
.nfl-faq .nfl-week-preview-faq-item p a:hover { text-decoration: underline; }
.nfl-faq-disclosure { margin: 12px 0 0; font-size: .75rem; color: var(--color-text-muted); }
.nfl-faq-disclosure a { color: inherit; }

/* ---------- Raised section cards (nfl_seo.card) ----------
   Same surface as the hero card (.page-hero-inner in redesign.css), lined up
   with the map cards' outer edges: flush on desktop, 16px in on phones. */
.nfl-card {
  background: rgba(249,244,237,.95);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  padding: 22px 40px 24px;
}
.nfl-card-section { padding-top: 24px; padding-bottom: 0; }
.schedule-section.nfl-card-section { padding: 24px 0 0; border-top: 0; }
.nfl-card-section:last-of-type { padding-bottom: 8px; }
.container.nfl-card-wrap { padding-left: 0; padding-right: 0; }
.nfl-card .nfl-links-subtitle:last-child, .nfl-card > :last-child { margin-bottom: 0; }
.nfl-card .schedule-section-subtitle { margin-bottom: 20px; }
@media (max-width: 768px) {
  .nfl-card { padding: 18px 22px 20px; }
  .container.nfl-card-wrap { padding-left: 16px; padding-right: 16px; }
}

/* ---------- Early / late groups in a Single map's legend (SMMapCore.legendGroups) ----------
   Late-window games get striped swatches to match their striped counties. */
.map-legend-group, .map-game-pills-group {
  font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: var(--color-text-muted); margin: 10px 0 5px 2px;
}
.map-legend-body > .map-legend-group:first-of-type, .map-game-pills > .map-game-pills-group:first-child { margin-top: 0; }
.map-overlay-matchups .map-game-pills-group + .map-game-pill { margin-top: 0; }
.map-overlay-matchups .map-legend-group + .map-legend-row { margin-top: 0; }
.map-overlay-matchups .map-legend-row i.is-late,
.map-overlay-matchups .map-game-pill-swatch.is-late { width: 12px; height: 12px; }