/* ════════════════════════════════
   DARK THEME — structural + component overrides
   Scoped under .tb-dark-theme (site-brand.php adds this body class
   when tb_site_brand.dark_theme is true). The base palette swap
   (--bg-primary/--text-primary/etc) lives in style.css; this file
   covers what that token swap alone doesn't reach: the hero's photo
   fallback gradient, heading font, and the DryVia-style redesigns of
   pilots/gallery/sponsors/donation/footer.

   .tb-dark-chrome (tb_site_brand.dark_chrome) is the lighter-weight
   sibling flag: light content sections, but the nav/footer/pilots/
   donation "chrome" stays dark — e.g. DryVia's white-background site
   with a charcoal header/footer. Rules that only make sense on a
   fully dark background (hero fallback gradient, sponsor white cards,
   tight gallery grid) stay .tb-dark-theme-only; rules for elements
   that render on their OWN dark background regardless of the page's
   base palette (nav bar, footer, pilot photo caption overlay, donation
   card) apply under both.
   ════════════════════════════════ */

.tb-dark-theme .tb-hero {
  background: linear-gradient(135deg, #0C0C0E 0%, #1A1A2E 50%, #0C0C0E 100%);
}
.tb-dark-theme .tb-nav,
.tb-dark-chrome .tb-nav {
  background: rgba(12,12,14,0.95);
  border-bottom: 0.5px solid rgba(255,255,255,0.06);
}

/* .tb-dark-theme's nav text already goes light via the --text-primary/
   --text-muted root swap in style.css. .tb-dark-chrome keeps the light
   palette for those tokens (content stays white), so the nav's resting
   state (not .scrolled, not .is-overlay) needs its own explicit light
   text here or it renders dark-on-charcoal on any page without a hero. */
.tb-dark-chrome .tb-nav__logo { color: #FFFFFF; }
.tb-dark-chrome .tb-nav__links a { color: rgba(255,255,255,.7); }
.tb-dark-chrome .tb-nav__links a:hover,
.tb-dark-chrome .tb-nav__links li.current-menu-item > a { color: #FFFFFF; }
.tb-dark-chrome .tb-nav__cta { color: #FFFFFF; border-color: rgba(255,255,255,.35); }
.tb-dark-chrome .tb-nav__burger span { background: rgba(255,255,255,.85); }

/* ── Headings use the site's heading_font (falls back to the base font) ── */
.tb-dark-theme h1,
.tb-dark-theme h2,
.tb-dark-theme .section-title,
.tb-dark-theme .tb-events-section__title,
.tb-dark-chrome h1,
.tb-dark-chrome h2,
.tb-dark-chrome .section-title,
.tb-dark-chrome .tb-events-section__title {
  font-family: var(--tb-heading-font, var(--tb-font));
  letter-spacing: 2px;
}

/* ── Pilots — vertical photo cards, gradient caption, greyscale->color hover ── */
.tb-dark-theme .tb-pilots__grid,
.tb-dark-chrome .tb-pilots__grid { grid-template-columns: repeat(4, 1fr); }
.tb-dark-theme .tb-pilots__card,
.tb-dark-chrome .tb-pilots__card {
  position: relative;
  aspect-ratio: 3/4;
  overflow: hidden;
  text-align: left;
}
.tb-dark-theme .tb-pilots__photo,
.tb-dark-chrome .tb-pilots__photo {
  position: absolute; inset: 0;
  border-radius: 0; margin: 0; max-width: none;
  filter: grayscale(100%);
  transition: filter .3s;
}
.tb-dark-theme .tb-pilots__card:hover .tb-pilots__photo,
.tb-dark-chrome .tb-pilots__card:hover .tb-pilots__photo { filter: grayscale(0%); }
.tb-dark-theme .tb-pilots__card::after,
.tb-dark-chrome .tb-pilots__card::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.85) 0%, transparent 55%);
  pointer-events: none;
}
.tb-dark-theme .tb-pilots__name,
.tb-dark-theme .tb-pilots__team,
.tb-dark-theme .tb-pilots__social,
.tb-dark-chrome .tb-pilots__name,
.tb-dark-chrome .tb-pilots__team,
.tb-dark-chrome .tb-pilots__social {
  position: relative; z-index: 1;
}
.tb-dark-theme .tb-pilots__card,
.tb-dark-chrome .tb-pilots__card {
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: var(--tb-space-4);
}
.tb-dark-theme .tb-pilots__name,
.tb-dark-chrome .tb-pilots__name {
  font-family: var(--tb-heading-font, var(--tb-font));
  letter-spacing: 1px;
  color: #FFFFFF;
}
.tb-dark-theme .tb-pilots__team,
.tb-dark-chrome .tb-pilots__team { color: var(--tb-red-500); }
.tb-dark-theme .tb-pilots__social,
.tb-dark-chrome .tb-pilots__social { color: rgba(255,255,255,.7); font-size: 10px; }

@media (max-width: 960px) {
  .tb-dark-theme .tb-pilots__grid,
  .tb-dark-chrome .tb-pilots__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ── Gallery — tight grid, minimal radius ── */
.tb-dark-theme .tb-gallery-grid {
  gap: 4px;
}
.tb-dark-theme .tb-gallery-grid__item {
  aspect-ratio: 16/10;
  border-radius: 4px;
}

/* ── Sponsors — white cards so dark-colored logos stay visible on charcoal ── */
.tb-dark-theme .tb-sponsors__grid {
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: var(--tb-space-4);
  justify-items: center;
}
.tb-dark-theme .tb-sponsors__item {
  width: 120px; height: 80px;
  background: #FFFFFF;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1);
  transition: border-color .2s, transform .2s;
}
.tb-dark-theme .tb-sponsors__item:hover {
  border-color: var(--tb-red-500);
  transform: translateY(-2px);
}
.tb-dark-theme .tb-sponsors__item img {
  max-height: 56px; max-width: 100px;
  padding: 8px;
  filter: none; opacity: 1; /* logos are already legible on the white card */
}

/* ── Donation — gold-tinted card, monospace bank values ── */
.tb-dark-theme .tb-donation__container h2,
.tb-dark-chrome .tb-donation__container h2 {
  font-family: var(--tb-heading-font, var(--tb-font));
  letter-spacing: 2px;
}
.tb-dark-theme .tb-donation__bank,
.tb-dark-chrome .tb-donation__bank {
  background: rgba(212,175,55,0.06);
  border: 1px solid rgba(212,175,55,0.2);
}
.tb-dark-theme .tb-donation__label,
.tb-dark-chrome .tb-donation__label {
  font-size: 10px;
  color: var(--text-muted);
}
.tb-dark-theme .tb-donation__value,
.tb-dark-chrome .tb-donation__value {
  font-family: var(--font-mono);
}

/* ── Footer — near-black, circular bordered social icons ── */
.tb-dark-theme .tb-footer,
.tb-dark-chrome .tb-footer {
  background: #08080A;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.tb-dark-theme .tb-footer__social,
.tb-dark-chrome .tb-footer__social {
  gap: var(--tb-space-4);
}
.tb-dark-theme .tb-footer__social a,
.tb-dark-chrome .tb-footer__social a {
  width: 36px; height: 36px;
  flex-shrink: 0;
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50%;
  color: rgba(255,255,255,.75);
}
.tb-dark-theme .tb-footer__social a:hover,
.tb-dark-chrome .tb-footer__social a:hover {
  border-color: var(--tb-red-500);
  color: var(--tb-red-500);
}
