/* Brand-locked Bandsintown widget styling.
 * Used on home page (.tz-shows__widget) and shows page (.tz-shows-bit).
 *
 * The widget renders its DOM via JS at runtime - we can't pick exact selectors
 * for every variant, but the .bit-* class names are stable across versions.
 * Everything here uses !important because the widget sets some styles inline.
 */

/* ============================================================
 * Container
 * ============================================================ */
.tz-shows-bit,
.tz-shows__widget {
  min-height: 200px;
  font-family: var(--font-body);
}

/* Outer widget chrome */
.tz-shows-bit .bit-widget-container,
.tz-shows__widget .bit-widget-container,
.tz-shows-bit .bit-widget,
.tz-shows__widget .bit-widget {
  background: transparent !important;
  font-family: var(--font-body) !important;
  color: var(--tz-cream) !important;
}

/* ============================================================
 * Event rows
 * ============================================================ */
.tz-shows-bit .bit-event,
.tz-shows__widget .bit-event {
  background: rgba(229,26,26,0.04) !important;
  border: 1px solid rgba(245,239,226,0.08) !important;
  border-bottom: 1px solid rgba(245,239,226,0.12) !important;
  border-radius: 0 !important;
  padding: 20px 18px !important;
  margin: 0 0 8px !important;
  transition: background var(--dur-fast) var(--ease-out) !important;
  box-shadow: none !important;
}
.tz-shows-bit .bit-event:hover,
.tz-shows__widget .bit-event:hover { background: rgba(229,26,26,0.08) !important; }

/* Date column */
.tz-shows-bit .bit-date,
.tz-shows__widget .bit-date {
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  color: var(--tz-cream) !important;
  font-size: 22px !important;
  line-height: 1.05 !important;
  letter-spacing: -0.01em !important;
}
.tz-shows-bit .bit-month,
.tz-shows__widget .bit-month {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--tz-red) !important;
}

/* Event info (venue / city / country) */
.tz-shows-bit .bit-event-info,
.tz-shows-bit .bit-venueName,
.tz-shows-bit .bit-venueRow,
.tz-shows-bit .bit-titleRow,
.tz-shows-bit .bit-city,
.tz-shows-bit .bit-venue-location,
.tz-shows__widget .bit-event-info,
.tz-shows__widget .bit-venueName,
.tz-shows__widget .bit-venueRow,
.tz-shows__widget .bit-titleRow,
.tz-shows__widget .bit-city,
.tz-shows__widget .bit-venue-location {
  color: var(--tz-cream) !important;
  font-family: var(--font-body) !important;
}

.tz-shows-bit .bit-venueName,
.tz-shows__widget .bit-venueName {
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  font-size: 18px !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
}

.tz-shows-bit .bit-city,
.tz-shows__widget .bit-city {
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  letter-spacing: 0.08em !important;
  color: rgba(245,239,226,0.7) !important;
}

/* ============================================================
 * Buttons - primary (Buy Tickets)
 * ============================================================ */
.tz-shows-bit .bit-button,
.tz-shows__widget .bit-button {
  background: var(--tz-red) !important;
  color: var(--tz-cream) !important;
  border: 2px solid var(--tz-red) !important;
  border-radius: 4px !important;
  padding: 10px 20px !important;
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: background var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out) !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.tz-shows-bit .bit-button:hover,
.tz-shows__widget .bit-button:hover {
  background: var(--tz-cream) !important;
  color: var(--tz-red) !important;
  border-color: var(--tz-red) !important;
}

/* Ghost buttons (RSVP, Track) */
.tz-shows-bit .bit-rsvp-button,
.tz-shows-bit .bit-track-button,
.tz-shows-bit .bit-followers-link,
.tz-shows__widget .bit-rsvp-button,
.tz-shows__widget .bit-track-button,
.tz-shows__widget .bit-followers-link {
  background: transparent !important;
  border: 2px solid rgba(245,239,226,0.3) !important;
  color: var(--tz-cream) !important;
}
.tz-shows-bit .bit-rsvp-button:hover,
.tz-shows-bit .bit-track-button:hover,
.tz-shows-bit .bit-followers-link:hover,
.tz-shows__widget .bit-rsvp-button:hover,
.tz-shows__widget .bit-track-button:hover,
.tz-shows__widget .bit-followers-link:hover {
  border-color: var(--tz-red) !important;
  color: var(--tz-red) !important;
  background: transparent !important;
}

/* ============================================================
 * Empty state - "no dates"
 * ============================================================ */
.tz-shows-bit .bit-no-dates-block,
.tz-shows__widget .bit-no-dates-block {
  background: transparent !important;
  border: 1px dashed rgba(245,239,226,0.15) !important;
  padding: 40px var(--space-5) !important;
  text-align: center !important;
}
.tz-shows-bit .bit-no-dates-message,
.tz-shows-bit .bit-no-dates-heading,
.tz-shows__widget .bit-no-dates-message,
.tz-shows__widget .bit-no-dates-heading {
  color: var(--tz-cream) !important;
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  font-size: clamp(20px, 2.5vw, 28px) !important;
  margin: 0 0 var(--space-3) !important;
}

/* ============================================================
 * Show more / Show less + pagination
 * ============================================================ */
.tz-shows-bit .bit-show-more-button,
.tz-shows-bit .bit-show-less-button,
.tz-shows__widget .bit-show-more-button,
.tz-shows__widget .bit-show-less-button {
  background: transparent !important;
  border: 1px solid rgba(245,239,226,0.25) !important;
  color: var(--tz-cream) !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  padding: 10px 22px !important;
  border-radius: 0 !important;
  margin-top: var(--space-3) !important;
}
.tz-shows-bit .bit-show-more-button:hover,
.tz-shows-bit .bit-show-less-button:hover,
.tz-shows__widget .bit-show-more-button:hover,
.tz-shows__widget .bit-show-less-button:hover {
  background: var(--tz-red) !important;
  color: var(--tz-cream) !important;
  border-color: var(--tz-red) !important;
}

/* ============================================================
 * Followers banner ("Follow The Tazers")
 * ============================================================ */
.tz-shows-bit .bit-followers-banner,
.tz-shows__widget .bit-followers-banner {
  background: rgba(229,26,26,0.06) !important;
  border: 1px solid rgba(229,26,26,0.3) !important;
  border-radius: 0 !important;
  padding: var(--space-4) !important;
  margin-bottom: var(--space-3) !important;
}
.tz-shows-bit .bit-followers-text,
.tz-shows__widget .bit-followers-text {
  color: var(--tz-cream) !important;
  font-family: var(--font-body) !important;
}

/* ============================================================
 * Any link inside the widget
 * ============================================================ */
.tz-shows-bit a:not(.bit-button):not(.bit-rsvp-button):not(.bit-track-button):not(.bit-followers-link):not(.bit-show-more-button):not(.bit-show-less-button),
.tz-shows__widget a:not(.bit-button):not(.bit-rsvp-button):not(.bit-track-button):not(.bit-followers-link):not(.bit-show-more-button):not(.bit-show-less-button) {
  color: var(--tz-red) !important;
  text-decoration: none !important;
}
.tz-shows-bit a:not(.bit-button):not(.bit-rsvp-button):not(.bit-track-button):not(.bit-followers-link):not(.bit-show-more-button):not(.bit-show-less-button):hover,
.tz-shows__widget a:not(.bit-button):not(.bit-rsvp-button):not(.bit-track-button):not(.bit-followers-link):not(.bit-show-more-button):not(.bit-show-less-button):hover {
  color: var(--tz-cream) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Loader spinner */
.tz-shows-bit .bit-loader,
.tz-shows__widget .bit-loader {
  filter: hue-rotate(-30deg) saturate(2) !important;
}

/* ============================================================
 * Modal / popup styling
 * ============================================================ */
.bit-modal,
.bit-modal-content {
  background: var(--tz-black) !important;
  color: var(--tz-cream) !important;
  border: 1px solid rgba(229,26,26,0.3) !important;
  border-radius: 0 !important;
}
.bit-modal-close { color: var(--tz-cream) !important; }
.bit-modal-close:hover { color: var(--tz-red) !important; }