/**
 * Nova skin for The Events Calendar + Event Tickets (RSVP).
 *
 * Event Tickets ships a self-contained "tribe-common" design system driven by
 * --tec-* CSS custom properties. Rather than fight hundreds of selectors, we
 * (1) retheme those tokens to Nova's palette + type, then (2) add a handful of
 * targeted polish rules on the concrete RSVP classes so the block reads as a
 * modern card instead of the stock 2019 look. Loaded AFTER event-tickets CSS.
 */

/* 1. Retheme the design tokens ------------------------------------------- */
.tribe-common,
.tribe-tickets,
.tribe-events {
  --tec-color-accent-primary: var(--nova-primary, #21458c);
  --tec-color-accent-secondary: var(--nova-primary-dark, #173265);  /* darker blue for hovers */
  --tec-color-background: #ffffff;
  --tec-color-text-primary: var(--nova-ink, #1b2340);
  --tec-color-border-active: var(--nova-teal, #0d8a7c);
  --tec-border-radius-default: 10px;
  --tec-font-family-sans-serif: var(--nova-font, 'Inter', system-ui, sans-serif);
}

/* 2. RSVP block as a modern card ---------------------------------------- */
.tribe-tickets__rsvp-wrapper {
  background: #fff;
  border: 1px solid rgba(33, 69, 140, 0.14);
  border-radius: 16px;
  padding: 1.6rem 1.8rem;
  box-shadow: 0 10px 30px rgba(16, 32, 74, 0.08);
  margin: 1.6rem 0;
}

.tribe-tickets__rsvp.tribe-common-g-row {
  align-items: center;
  gap: 1rem 1.5rem;
}

/* Title */
.tribe-tickets__rsvp-title {
  font-family: var(--nova-display, 'Space Grotesk', 'Inter', sans-serif);
  color: var(--nova-primary, #21458c);
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 0.4rem;
}

/* Attendance count — the social-proof number, in Nova teal */
.tribe-tickets__rsvp-attendance {
  display: flex;
  align-items: baseline;
  gap: 0.4rem;
  margin-top: 0.5rem;
}
.tribe-tickets__rsvp-attendance-number {
  color: var(--nova-teal, #0d8a7c);
  font-weight: 800;
  line-height: 1;
}
.tribe-tickets__rsvp-attendance-going {
  color: var(--nova-muted, #5a6482);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.tribe-tickets__rsvp-availability {
  color: var(--nova-muted, #5a6482);
  margin-top: 0.35rem;
}
.tribe-tickets__rsvp-availability-quantity { color: var(--nova-ink, #1b2340); }

/* 3. Buttons — pill, bold, Nova gradient feel --------------------------- */
.tribe-tickets__rsvp-actions-button-going,
.tribe-tickets .tribe-common-c-btn,
.tribe-tickets__rsvp-form-button--submit {
  background: var(--nova-primary, #21458c);
  border: 0;
  border-radius: 999px;
  color: #fff !important;
  font-family: var(--nova-font, 'Inter', sans-serif);
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0.7rem 1.6rem;
  min-height: 0;
  transition: background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  box-shadow: 0 6px 16px rgba(33, 69, 140, 0.22);
}
.tribe-tickets__rsvp-actions-button-going:hover,
.tribe-tickets .tribe-common-c-btn:hover,
.tribe-tickets__rsvp-form-button--submit:hover {
  background: var(--nova-primary-dark, #173265);
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(33, 69, 140, 0.28);
}

/* Secondary / bordered buttons (e.g. cancel) */
.tribe-tickets .tribe-common-c-btn-border,
.tribe-tickets__rsvp-form-button--cancel {
  background: #fff;
  border: 2px solid var(--nova-primary, #21458c);
  border-radius: 999px;
  color: var(--nova-primary, #21458c) !important;
  font-weight: 700;
  padding: 0.6rem 1.4rem;
  box-shadow: none;
}
.tribe-tickets .tribe-common-c-btn-border:hover,
.tribe-tickets__rsvp-form-button--cancel:hover {
  background: rgba(33, 69, 140, 0.06);
  transform: translateY(-1px);
}

/* 4. RSVP form (name / email / quantity) — modern inputs ---------------- */
.tribe-tickets__rsvp-form-wrapper,
.tribe-tickets__rsvp-ar {
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(33, 69, 140, 0.1);
}
.tribe-tickets .tribe-common-form-control-text__input,
.tribe-tickets input[type="text"],
.tribe-tickets input[type="email"],
.tribe-tickets input[type="number"],
.tribe-tickets select {
  border: 1px solid rgba(33, 69, 140, 0.22);
  border-radius: 10px;
  padding: 0.65rem 0.8rem;
  font-family: var(--nova-font, 'Inter', sans-serif);
  color: var(--nova-ink, #1b2340);
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.tribe-tickets .tribe-common-form-control-text__input:focus,
.tribe-tickets input[type="text"]:focus,
.tribe-tickets input[type="email"]:focus,
.tribe-tickets input[type="number"]:focus,
.tribe-tickets select:focus {
  outline: none;
  border-color: var(--nova-teal, #0d8a7c);
  box-shadow: 0 0 0 3px rgba(13, 138, 124, 0.18);
}
.tribe-tickets__rsvp-form-title,
.tribe-tickets .tribe-common-form-control-text__label {
  color: var(--nova-ink, #1b2340);
  font-weight: 600;
}

/* Quantity stepper */
.tribe-tickets__rsvp-form-quantity {
  border-radius: 10px;
  overflow: hidden;
}

/* 5. Confirmed / success state ----------------------------------------- */
.tribe-tickets__rsvp-message--success,
.tribe-tickets__rsvp-ar-going {
  background: rgba(13, 138, 124, 0.08);
  border: 1px solid rgba(13, 138, 124, 0.25);
  border-radius: 12px;
  padding: 0.9rem 1.1rem;
  color: var(--nova-ink, #1b2340);
}
.tribe-tickets__rsvp-message--success svg,
.tribe-tickets__rsvp-ar-going svg { color: var(--nova-teal, #0d8a7c); }

/* Links inside the block (e.g. "log in to RSVP") */
.tribe-tickets__rsvp-wrapper a {
  color: var(--nova-primary, #21458c);
  font-weight: 600;
}
.tribe-tickets__rsvp-wrapper a:hover { color: var(--nova-teal, #0d8a7c); }

/* 6. Loader dots in Nova teal ------------------------------------------ */
.tribe-tickets-loader__dots .tribe-common-c-loader__dot { background-color: var(--nova-teal, #0d8a7c); }

/* Small screens: stack the details + action columns cleanly */
@media (max-width: 600px) {
  .tribe-tickets__rsvp-wrapper { padding: 1.2rem 1.1rem; }
  .tribe-tickets__rsvp.tribe-common-g-row { gap: 0.9rem; }
}

/* PIC uses a native, server-handled RSVP (pic-community) instead of Event
   Tickets' AJAX RSVP block, which does not render its form reliably here.
   Hide the stock block on single events so members see only the working one. */
.single-tribe_events .tribe-tickets__rsvp-wrapper,
.single-tribe_events .tribe-tickets__rsvp { display: none !important; }

/* =======================================================================
   Nova layout for The Events Calendar — single event + list archive.
   CSS only; no backend/template/logic changes.
   ======================================================================= */

/* ---- Single event: center + constrain the classic template ---- */
.single-tribe_events .tribe-events-pg-template {
  width: min(860px, calc(100% - 3rem));
  margin-inline: auto;
  padding: 2.4rem 0 3.5rem;
}
.single-tribe_events #tribe-events-content.tribe-events-single { margin: 0; padding: 0; }

/* TEC makes .tribe_events a flex container (its sidebar layout), which shrink-
   wraps our meta card and leaves dead space beside it. Force normal block flow
   so title, description, RSVP, and the meta card stack full-width top-to-bottom. */
.single-tribe_events .tribe-events-single > .tribe_events,
.single-tribe_events #tribe-events-content > .tribe_events {
  display: block !important;
  width: 100% !important;
}

/* Back to all events */
.single-tribe_events .tribe-events-back { margin: 0 0 1.4rem; font-size: .92rem; }
.single-tribe_events .tribe-events-back a {
  display: inline-flex; align-items: center; gap: .35rem;
  color: var(--nova-primary, #21458c); font-weight: 600;
}
.single-tribe_events .tribe-events-back a:hover { color: var(--nova-teal, #0d8a7c); }

/* Title */
.single-tribe_events .tribe-events-single-event-title {
  font-family: var(--nova-display, 'Space Grotesk', sans-serif);
  color: var(--nova-ink, #10192e);
  font-size: clamp(2rem, 4.5vw, 3rem);
  line-height: 1.08;
  letter-spacing: -0.02em;
  margin: 0 0 1.1rem;
}

/* Schedule banner (date/time) as a Nova gradient bar */
.single-tribe_events .tribe-events-schedule {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
  background: var(--nova-grad-cool, linear-gradient(120deg, #21458c 0%, #0d8a7c 100%));
  color: #fff;
  border-radius: 14px;
  padding: 1rem 1.4rem;
  margin: 0 0 1rem;
  font-family: var(--nova-display, 'Space Grotesk', sans-serif);
  font-weight: 600;
  font-size: 1.08rem;
}
.single-tribe_events .tribe-events-schedule h2 { margin: 0; color: #fff; font-size: inherit; font-weight: inherit; }
.single-tribe_events .tribe-events-schedule .tribe-event-date-start,
.single-tribe_events .tribe-events-schedule .tribe-event-time,
.single-tribe_events .tribe-events-schedule .tribe-events-start-date { color: #fff; }
.single-tribe_events .tribe-events-cost {
  display: inline-block;
  margin: 0 0 1.8rem;
  padding: .3em .95em;
  background: rgba(13, 138, 124, .12);
  color: var(--nova-teal, #0d8a7c);
  border-radius: 999px;
  font-weight: 700;
  font-size: .9rem;
}

/* Description / prose */
.single-tribe_events .tribe-events-single-event-description {
  color: var(--nova-ink-soft, #3d485f);
  font-size: 1.05rem;
  line-height: 1.75;
  margin: 0 0 1.5rem;
}
.single-tribe_events .tribe-events-single-event-description p { margin: 0 0 1rem; }

/* Details + Venue meta as a Nova card, two balanced columns.
   !important + double-class selector to beat The Events Calendar's
   #tribe-events-content / .tribe-events-event-meta{display:flex} rules. */
.single-tribe_events .tribe-events-event-meta.tribe-events-single-section {
  background: #fff;
  border: 1px solid rgba(33, 69, 140, .12);
  border-radius: 16px;
  padding: 1.6rem 1.8rem;
  box-shadow: 0 8px 24px rgba(16, 32, 74, .06);
  margin: 0 0 2rem;
  width: 100% !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 1.4rem 2.5rem !important;
  align-items: start !important;
}
.single-tribe_events .tribe-events-event-meta .tribe-events-meta-group {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Divider between columns on wide screens */
@media (min-width: 620px) {
  .single-tribe_events .tribe-events-event-meta .tribe-events-meta-group + .tribe-events-meta-group {
    border-left: 1px solid rgba(33, 69, 140, .1);
    padding-left: 2.5rem !important;
  }
}
/* Venue address lines: readable, spaced */
.single-tribe_events .tribe-events-meta-group-venue .tribe-events-meta-value,
.single-tribe_events .tribe-events-meta-group-venue address,
.single-tribe_events .tribe-events-venue-details {
  font-style: normal;
  color: var(--nova-ink, #10192e);
  line-height: 1.55;
}
.single-tribe_events .tribe-events-meta-group-venue .tribe-address { color: var(--nova-ink-soft, #3d485f); }

/* Admin "see who's attending" link inside the RSVP panel */
.pic-rsvp__admin { margin: .2rem 0 1rem; }
.pic-rsvp__admin a {
  display: inline-flex; align-items: center; gap: .35rem;
  font-weight: 600; font-size: .92rem;
  color: var(--nova-teal, #0d8a7c);
}
.pic-rsvp__admin a:hover { color: var(--nova-primary, #21458c); }
.single-tribe_events .tribe-events-single-section-title {
  font-family: var(--nova-display, 'Space Grotesk', sans-serif);
  color: var(--nova-primary, #21458c);
  font-size: 1.2rem;
  margin: 0 0 1rem;
}
.single-tribe_events .tribe-events-meta-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.single-tribe_events .tribe-events-meta-item { display: flex; flex-wrap: wrap; gap: .3rem .8rem; align-items: baseline; margin: 0; }
.single-tribe_events .tribe-events-meta-label {
  color: var(--nova-muted, #667089);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .72rem;
  font-weight: 700;
  min-width: 5.5rem;
}
.single-tribe_events .tribe-events-meta-value { color: var(--nova-ink, #10192e); font-weight: 600; margin: 0; }
.single-tribe_events .tribe-events-meta-value a { color: var(--nova-primary, #21458c); }

/* Add to Calendar dropdown -> Nova ghost pill */
.single-tribe_events .tribe-events-c-subscribe-dropdown__container { margin: 0 0 2rem; }
.single-tribe_events .tribe-events-c-subscribe-dropdown__button {
  border-radius: 999px;
  border: 2px solid var(--nova-primary, #21458c);
  background: #fff;
  color: var(--nova-primary, #21458c);
  font-weight: 700;
  padding: .55rem 1.2rem;
}
.single-tribe_events .tribe-events-c-subscribe-dropdown__button:hover { background: rgba(33, 69, 140, .06); }

/* Prev / next nav */
.single-tribe_events .tribe-events-sub-nav {
  display: flex; justify-content: space-between; gap: 1rem;
  list-style: none; margin: 2rem 0 0; padding: 1.3rem 0 0;
  border-top: 1px solid rgba(33, 69, 140, .12);
}
.single-tribe_events .tribe-events-sub-nav li { margin: 0; background: none; }
.single-tribe_events .tribe-events-sub-nav a { color: var(--nova-primary, #21458c); font-weight: 600; }
.single-tribe_events .tribe-events-sub-nav a:hover { color: var(--nova-teal, #0d8a7c); }

/* Native RSVP panel spacing within the flow */
.single-tribe_events .pic-rsvp { margin: 0 0 2rem; }

/* Hide Event Tickets' redundant "You have N RSVP … View RSVP" notice — our
   native RSVP panel already shows the going state and a cancel action. */
.single-tribe_events .tribe-link-view-attendee { display: none; }

/* ---- Events archive (list view): light card polish ---- */
.tribe-events-calendar-list__event {
  background: #fff;
  border: 1px solid rgba(33, 69, 140, .1);
  border-radius: 14px;
  padding: 1.1rem 1.3rem;
  margin-bottom: 1rem;
  box-shadow: 0 6px 18px rgba(16, 32, 74, .05);
  transition: transform .18s ease, box-shadow .18s ease;
}
.tribe-events-calendar-list__event:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(16, 32, 74, .1); }
.tribe-events-calendar-list__event-title-link { color: var(--nova-primary, #21458c) !important; }
.tribe-events-calendar-list__event-date-tag-daynum { color: var(--nova-teal, #0d8a7c); }

/* 2026-10: The Events Calendar 6.18 moved the cost into the dark schedule band and
   its link colours now beat the theme's button text colour. */
.single-tribe_events .tribe-events-schedule .tribe-events-cost {
  margin: 0 0 0 .8rem;
  background: rgba(255, 255, 255, .18);
  color: #fff;
  vertical-align: middle;
}
body.single-tribe_events a.pia-btn.pia-btn--solid,
body.single-tribe_events a.pia-btn.pia-btn--accent,
body.single-tribe_events a.pia-btn.pia-btn--solid:visited,
body.single-tribe_events a.pia-btn.pia-btn--accent:visited,
body.single-tribe_events a.pia-btn.pia-btn--solid:hover,
body.single-tribe_events a.pia-btn.pia-btn--accent:hover { color: #fff; }
body.single-tribe_events a.pia-btn.pia-btn--ghost,
body.single-tribe_events a.pia-btn.pia-btn--ghost:visited { color: var(--nova-primary, #21458c); }

/* 2026-10-18: TEC's grid rules reset the card's padding and pull it outward with
   negative gutters, so the white box hugged the text and overhung the page edge.
   Give the card real breathing room and keep it inside the content width. */
.tribe-events .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event.tribe-common-g-row {
  padding: 1.6rem 1.75rem 1.5rem;
  margin: 0 0 1.25rem;
}
.tribe-events .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event > .tribe-common-g-col {
  padding-left: 0;
  padding-right: 0;
}
.tribe-events .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event-datetime-wrapper { margin-bottom: .35rem; }
.tribe-events .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event-cost { margin-top: .9rem; }
.tribe-events .tribe-events-calendar-list__event-date-tag-datetime { padding-top: 1.6rem; }
@media (max-width: 767px) {
  .tribe-events .tribe-events-calendar-list__event-row .tribe-events-calendar-list__event.tribe-common-g-row { padding: 1.25rem 1.2rem 1.2rem; }
  .tribe-events .tribe-events-calendar-list__event-date-tag-datetime { padding-top: 1.25rem; }
}

/* 2026-10-18: Events views (List/Month/Day) have no page hero, and TEC's container
   adds 96px above the search bar. Match the site's standard top-of-content gap
   (same clamp as .pia-page-hero + .pia-section) and trim the bottom to match. */
.tribe-events .tribe-common-l-container.tribe-events-l-container {
  padding-top: clamp(1.6rem, 3vw, 2.4rem);
  padding-bottom: clamp(2.4rem, 5vw, 4rem);
}