/* ==========================================================================
   Previously — Mobile Bottom Navigation · pv-bottom-nav.css v20261006a
   --------------------------------------------------------------------------
   Unified bottom tab bar for mobile (<768px). Desktop untouched.
   5 items: Home · Sports · Podcasts · Games · Menu (opens side drawer).
   Replaces the games-section .gos-dock on mobile.
   AdSense anchor-ad aware: --pv-anchor-offset shifts the bar up when a
   Google anchor ad is present (set by pv-bottom-nav.js via MutationObserver).
   ========================================================================== */

.pv-bottom-nav {
  position: fixed;
  bottom: var(--pv-anchor-offset, 0px);
  left: 0;
  right: 0;
  z-index: 1000;
  display: none; /* shown by media query only */
  background: rgba(10, 10, 11, 0.97);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-top: 1px solid #26262c;
  padding: 8px 4px calc(8px + env(safe-area-inset-bottom, 0px));
  transition: bottom 0.25s ease;
}

.pv-bottom-nav__inner {
  display: flex;
  justify-content: space-around;
  align-items: stretch;
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
}

.pv-bottom-nav a,
.pv-bottom-nav button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 60px;
  padding: 4px 8px;
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: none;
  color: #7b766d;
  font-family: inherit;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  -webkit-tap-highlight-color: transparent;
}

.pv-bottom-nav a svg,
.pv-bottom-nav button svg {
  width: 22px;
  height: 22px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}

.pv-bottom-nav a.active,
.pv-bottom-nav button.active {
  color: #f4f2ee;
}

.pv-bottom-nav a.active svg,
.pv-bottom-nav button.active svg {
  stroke: #e63946;
}

/* Mobile only — desktop (768px+) never renders this bar */
@media (max-width: 767px) {
  .pv-bottom-nav {
    display: block;
  }

  /* Body padding so content never slides under the bar.
     Applied via JS (body.pv-has-bottom-nav) to avoid affecting pages
     where the script didn't load. Approx bar height: 58px + safe area. */
  body.pv-has-bottom-nav {
    padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* When a Google anchor ad is present, JS adds .pv-anchor-up which
     increases body padding by the anchor height via the CSS var. */
  body.pv-has-bottom-nav.pv-anchor-up {
    padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px) + var(--pv-anchor-h, 0px)) !important;
  }

  /* The games-section dock is superseded by the unified bar on mobile */
  body.pv-has-bottom-nav .gos-dock {
    display: none !important;
  }
}