/* Bromley LTSC — theme styles ported from the prototype's <style> block. */

html, body { background: #F6F1E8; color: #0F2A1D; }
body { font-family: 'Inter', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }

.display {
  font-family: var(--display-font, '"General Sans"'), 'Inter', system-ui, sans-serif;
  letter-spacing: -0.025em;
  font-weight: 600;
}
.display .italic, .display em, .display i {
  font-family: var(--display-italic, '"Inter Tight"'), 'General Sans', system-ui, sans-serif;
  font-style: italic;
  font-weight: 500;
  letter-spacing: -0.015em;
}
.mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }

/* placeholder photo panel (used where a post has no featured image) */
.photo-ph {
  background-color: #E8DFC8;
  background-image: repeating-linear-gradient(135deg, rgba(15,42,29,0.05) 0 10px, rgba(15,42,29,0.00) 10px 20px);
  position: relative; overflow: hidden;
}
.photo-ph::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(120% 80% at 30% 20%, rgba(255,255,255,0.4), transparent 60%);
  pointer-events: none;
}
.photo-ph > .lbl {
  position: absolute; left: 12px; bottom: 10px;
  font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.08em;
  text-transform: uppercase; color: #0F2A1D; opacity: 0.65;
  background: rgba(246,241,232,0.8); padding: 4px 8px; border-radius: 4px; backdrop-filter: blur(2px);
}

@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.fade-up { animation: fadeUp 0.5s ease-out both; }

.nav-link { position: relative; }
.nav-link[data-active="true"]::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -6px; height: 2px; background: #2D5A3F;
}

[id] { scroll-margin-top: 96px; }
::selection { background: #C4623C; color: #FBF8F2; }

.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

/* What's On tab underline */
.tab-btn[data-active="true"] { border-color: #0F2A1D; color: #0F2A1D; }

/* Sports page pill tabs */
.sport-tab[data-active="true"] { background: #0F2A1D; color: #FBF8F2; border-color: #0F2A1D; }

/* Pickleball dot — lime-green, visible on both light and active-dark backgrounds */
.sport-dot--pickle { background-color: #9DC535; }

/* Fixtures sport filter + membership form sport buttons */
.fixture-filter[data-active="true"] { background: #0F2A1D; color: #FBF8F2; border-color: #0F2A1D; }
.sport-option[data-active="true"]  { background: #C4623C; color: #FBF8F2; border-color: #C4623C; }

/* Rich-text body (ACF wysiwyg output) */
.bltsc-prose > p { margin: 0 0 1.15em; }
.bltsc-prose > p:last-child { margin-bottom: 0; }
.bltsc-prose a { text-decoration: underline; text-underline-offset: 2px; }
.bltsc-prose ul { list-style: disc; padding-left: 1.25em; margin: 0 0 1.15em; }

/* Sticky in-page sub-nav (About anchors, Coaching "Jump to", Sports tabs).
   Pins flush under the sticky site header — h-16 mobile / h-20 desktop. */
.bltsc-subnav { position: sticky; top: 4rem; z-index: 10; }
@media (min-width: 768px) { .bltsc-subnav { top: 5rem; } }

/* Scroll targets on those pages clear the header + the pinned sub-nav.
   Declared after [id] above so it wins on equal specificity. */
.bltsc-anchor { scroll-margin-top: 8.5rem; }
@media (min-width: 768px) { .bltsc-anchor { scroll-margin-top: 9.5rem; } }

/* header states driven by assets/js/main.js */
.site-header { position: sticky; top: 0; z-index: 40; transition: background-color .03s ease-out, color .03s ease-out, backdrop-filter .03s ease-out; }
.site-header[data-over-video="true"] { background: transparent; color: #FBF8F2; }
.site-header[data-over-video="false"] { background: rgba(246,241,232,0.4); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #0F2A1D; }
.site-header[data-over-video="true"] .hero-scrim {
  content: ''; position: absolute; inset: 0 0 auto 0; height: 7rem;
  background: linear-gradient(to bottom, rgba(15,42,29,0.6), transparent); pointer-events: none;
}