/* ==========================================================================
   Club Directory — WordPress Specificity Overrides (v2)
   
   Re-declares styles with .babesky-club-directory .class (0,2,0) specificity
   to beat the WP heading/button/input/link resets.
   
   Enqueued AFTER club-directory.css to guarantee cascade order.
   ========================================================================== */

/* --- Hero Title --- */
.babesky-club-directory .babesky-club-hero__title {
  font-family: var(--wp--preset--font-family--heading, 'Space Grotesk', sans-serif);
  font-size: 48px; font-weight: 700; margin: 0 0 1.25rem;
  line-height: 1.2; letter-spacing: -0.025em; padding: 0;
  color: transparent;
  background: linear-gradient(to right, rgb(196, 181, 253), rgb(251, 113, 133), rgb(196, 181, 253));
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* --- Hero Subtitle --- */
.babesky-club-directory .babesky-club-hero__subtitle {
  font-family: var(--wp--preset--font-family--body, 'DM Sans', sans-serif);
  font-size: 24px; font-weight: 500; color: inherit;
  opacity: 0.92;
  -webkit-text-fill-color: currentColor;
  margin: 0 0 1rem; padding: 0; max-width: 48rem;
  margin-left: auto; margin-right: auto; line-height: 1.3;
  letter-spacing: normal; background: none;
  -webkit-background-clip: unset; background-clip: unset;
}

/* --- Hero Description --- */
.babesky-club-directory .babesky-club-hero__desc {
  font-size: 16px; color: inherit;
  opacity: 0.82;
  margin: 0 0 1rem; max-width: 500px;
  margin-left: auto; margin-right: auto;
  line-height: 1.625; font-weight: 300;
}

/* --- Hero Safety --- */
.babesky-club-directory .babesky-club-hero__safety {
  font-size: 13px; color: inherit;
  opacity: 0.65;
  margin: 0 0 1rem;
  max-width: 480px; margin-left: auto; margin-right: auto;
  line-height: 1.5; font-style: italic;
}

/* --- Hero CTA --- */
.babesky-club-directory .babesky-club-hero__cta {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  background: linear-gradient(135deg, #e91e63 0%, #db2777 100%);
  color: #fff; font-weight: 600; font-size: 1rem; border-radius: 0.5rem;
  text-decoration: none; transition: box-shadow 0.2s, filter 0.2s;
  box-shadow: 0 4px 16px rgba(219, 39, 119, 0.35);
}
.babesky-club-directory .babesky-club-hero__cta:hover {
  filter: brightness(1.05); box-shadow: 0 6px 20px rgba(219, 39, 119, 0.45); color: #fff;
}

/* --- Filter Inputs --- */
.babesky-club-directory .babesky-club-filters__input,
.babesky-club-directory .babesky-club-filters__select {
  display: block; width: 100%; padding: 0.5rem 1rem; border-radius: 0.5rem;
  border: 1px solid rgba(255,255,255,0.2); border-color: var(--babesky-club-border); background: rgba(0,0,0,0.4); background: var(--babesky-club-surface);
  color: #fff; font-size: 1rem;
  font-family: var(--wp--preset--font-family--body, 'DM Sans', sans-serif);
}
.babesky-club-directory .babesky-club-filters__input:focus,
.babesky-club-directory .babesky-club-filters__select:focus {
  outline: none; box-shadow: 0 0 0 2px rgba(255,255,255,0.3);
  border-color: rgba(255,255,255,0.4);
}
.babesky-club-directory .babesky-club-filters__select { background: rgba(0,0,0,0.6); background: var(--babesky-club-surface-strong); cursor: pointer; }

/* --- Filter Buttons --- */
.babesky-club-directory .babesky-club-filter-btn {
  padding: 0.5rem 1rem; border-radius: 0.5rem;
  border: 1px solid rgba(255,255,255,0.3); background: rgba(255,255,255,0.1);
  color: #fff; font-size: 0.875rem; font-weight: 500;
  cursor: pointer; transition: all 0.2s;
}
.babesky-club-directory .babesky-club-filter-btn:hover { background: rgba(255,255,255,0.2); }
.babesky-club-directory .babesky-club-filter-btn.babesky-club-filter-btn--active {
  background: rgba(168, 85, 247, 0.3); border-color: rgba(168, 85, 247, 0.6); color: #d8b4fe;
}

/* --- Load More Button --- */
.babesky-club-directory .club-load-more__btn {
  padding: 14px 36px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.15); background: rgba(255,255,255,0.06);
  color: #fff; font-weight: 600; font-size: 15px; cursor: pointer;
  font-family: var(--wp--preset--font-family--body, 'DM Sans', sans-serif);
}

/* --- Card handle link --- */
.babesky-club-directory .club-card-handle { color: #a78bfa; }
.babesky-club-directory .club-card-handle:hover { color: #d8b4fe; text-decoration: underline; }

/* --- Card CTA link --- */
.babesky-club-directory .club-card-cta {
  background: rgba(147, 51, 234, 0.8); color: #fff; border-radius: 10px;
  font-weight: 600; font-size: 14px; text-decoration: none;
  font-family: var(--wp--preset--font-family--body, 'DM Sans', sans-serif);
}
.babesky-club-directory .club-card-cta:hover {
  background: rgb(147, 51, 234); color: #fff;
}

/* --- Bio links --- */
.babesky-club-directory .club-bio-link { color: #c084fc; text-decoration: none; }
.babesky-club-directory .club-bio-link:hover { color: #d8b4fe; text-decoration: underline; }

/* --- Filters label --- */
.babesky-club-directory .babesky-club-filters__label {
  display: block; color: rgba(255,255,255,0.9); font-size: 0.875rem;
  font-weight: 500; margin-bottom: 0.5rem;
}

/* --- Loading/Empty text --- */
.babesky-club-directory .babesky-club-loading p { color: rgba(255,255,255,0.8); font-size: 1rem; }
.babesky-club-directory .babesky-club-empty__main { font-size: 1.125rem; color: rgba(255,255,255,0.8); margin: 0 0 0.5rem; }
.babesky-club-directory .babesky-club-empty__hint { font-size: 0.875rem; color: rgba(255,255,255,0.6); }

/* ==========================================================================
   RESPONSIVE OVERRIDES
   ========================================================================== */

@media (max-width: 640px) {
  .babesky-club-directory .babesky-club-hero__title { font-size: 32px; }
  .babesky-club-directory .babesky-club-hero__subtitle { font-size: 18px; opacity: 0.95; }
}
