/**
 * NXTRUNN Community Tickets — Calendar Filter & Event Styling
 *
 * CSS overrides injected into EventON's existing calendar at /app/events/.
 * Styles EventON's native filter buttons as marathon pills and event type
 * pills, restyles the "Learn More" / "Grab Tickets" button, and adds
 * featured event treatment.
 *
 * NO custom HTML layout. Everything here targets EventON's generated
 * markup — filter buttons, event list items, lightbox, and event cards.
 *
 * EventON filter buttons use: .eventon_filter_btn with data-filter_val
 * matching the taxonomy term slug. event_type_3 = marathon tags,
 * event_type = event categories.
 */

/* ==========================================================================
   CSS Custom Properties
   ========================================================================== */

:root {
	/* Marathon filter pill colors */
	--nxtrunn-boston-bg: #002D72;
	--nxtrunn-boston-text: #FFD700;
	--nxtrunn-london-bg: #012169;
	--nxtrunn-london-text: #FF2D55;
	--nxtrunn-chicago-bg: #FFFFFF;
	--nxtrunn-chicago-text: #41B6E6;
	--nxtrunn-nyc-bg: #003DA5;
	--nxtrunn-nyc-text: #FF6720;
	--nxtrunn-berlin-bg: #1A1A1A;
	--nxtrunn-berlin-text: #D4AF37;
	--nxtrunn-tokyo-bg: #C8102E;
	--nxtrunn-tokyo-text: #FFFFFF;
	--nxtrunn-sydney-bg: #006847;
	--nxtrunn-sydney-text: #FFD700;

	/* Community identity pills */
	--nxtrunn-bipoc-bg: #8B6340;
	--nxtrunn-bipoc-text: #FFFFFF;
	--nxtrunn-women-bg: #D4617A;
	--nxtrunn-women-text: #FFFFFF;

	/* Featured pill */
	--nxtrunn-featured-bg: #E8740C;
	--nxtrunn-featured-text: #FFFFFF;

	/* Event type pill colors (on event cards / filter bar) */
	--nxtrunn-shakeout-bg: #e8f4f0;
	--nxtrunn-shakeout-text: #1B4D3E;
	--nxtrunn-party-bg: #fdf0e8;
	--nxtrunn-party-text: #b35a00;
	--nxtrunn-popup-bg: #e8eef8;
	--nxtrunn-popup-text: #1a3a6e;
	--nxtrunn-cheerzone-bg: #f5e8f5;
	--nxtrunn-cheerzone-text: #5a2a6e;
	--nxtrunn-panel-bg: #fff3e0;
	--nxtrunn-panel-text: #8b4513;
	--nxtrunn-race-bg: #fce8e8;
	--nxtrunn-race-text: #8b0000;

	/* NXTRUNN brand */
	--nxtrunn-primary: #7C5A78;
	--nxtrunn-primary-dark: #5a3558;
	--nxtrunn-border: #e2dae6;
	--nxtrunn-text-muted: #8a7a88;
}


/* ==========================================================================
   EventON Filter Bar — Pill Shape Override
   ========================================================================== */

/* Make all EventON filter buttons pill-shaped with DM Sans */
.eventon_filter_line .eventon_filter_btn,
.evo_filter_s .eventon_filter_btn {
	border-radius: 999px !important;
	font-family: 'DM Sans', sans-serif !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	letter-spacing: 0.02em;
	padding: 6px 16px !important;
	text-transform: uppercase;
	transition: all 0.2s ease;
	border: 1.5px solid transparent !important;
}


/* ==========================================================================
   Marathon Filter Pills (event_type_3 taxonomy terms)
   ========================================================================== */

/* Boston — BAA blue / yellow */
.eventon_filter_btn[data-filter_val="boston"],
.eventon_filter_btn.boston {
	background-color: var(--nxtrunn-boston-bg) !important;
	color: var(--nxtrunn-boston-text) !important;
	border-color: var(--nxtrunn-boston-bg) !important;
}

/* London — navy / red */
.eventon_filter_btn[data-filter_val="london"],
.eventon_filter_btn.london {
	background-color: var(--nxtrunn-london-bg) !important;
	color: var(--nxtrunn-london-text) !important;
	border-color: var(--nxtrunn-london-bg) !important;
}

/* Chicago — navy / orange */
.eventon_filter_btn[data-filter_val="chicago"],
.eventon_filter_btn.chicago {
	background-color: var(--nxtrunn-chicago-bg) !important;
	color: var(--nxtrunn-chicago-text) !important;
	border-color: var(--nxtrunn-chicago-bg) !important;
}

/* NYC — blue / orange */
.eventon_filter_btn[data-filter_val="nyc"],
.eventon_filter_btn.nyc {
	background-color: var(--nxtrunn-nyc-bg) !important;
	color: var(--nxtrunn-nyc-text) !important;
	border-color: var(--nxtrunn-nyc-bg) !important;
}

/* Berlin — black / gold */
.eventon_filter_btn[data-filter_val="berlin"],
.eventon_filter_btn.berlin {
	background-color: var(--nxtrunn-berlin-bg) !important;
	color: var(--nxtrunn-berlin-text) !important;
	border-color: var(--nxtrunn-berlin-bg) !important;
}

/* Tokyo — red / white */
.eventon_filter_btn[data-filter_val="tokyo"],
.eventon_filter_btn.tokyo {
	background-color: var(--nxtrunn-tokyo-bg) !important;
	color: var(--nxtrunn-tokyo-text) !important;
	border-color: var(--nxtrunn-tokyo-bg) !important;
}

/* Sydney — green / gold */
.eventon_filter_btn[data-filter_val="sydney"],
.eventon_filter_btn.sydney {
	background-color: var(--nxtrunn-sydney-bg) !important;
	color: var(--nxtrunn-sydney-text) !important;
	border-color: var(--nxtrunn-sydney-bg) !important;
}

/* Featured — orange / white */
.eventon_filter_btn[data-filter_val="featured"],
.eventon_filter_btn.featured {
	background-color: var(--nxtrunn-featured-bg) !important;
	color: var(--nxtrunn-featured-text) !important;
	border-color: var(--nxtrunn-featured-bg) !important;
}

/* BIPOC — warm brown / white */
.eventon_filter_btn[data-filter_val="bipoc"],
.eventon_filter_btn.bipoc {
	background-color: var(--nxtrunn-bipoc-bg) !important;
	color: var(--nxtrunn-bipoc-text) !important;
	border-color: var(--nxtrunn-bipoc-bg) !important;
}

/* Women — rose / white */
.eventon_filter_btn[data-filter_val="women"],
.eventon_filter_btn.women {
	background-color: var(--nxtrunn-women-bg) !important;
	color: var(--nxtrunn-women-text) !important;
	border-color: var(--nxtrunn-women-bg) !important;
}


/* ==========================================================================
   Event Type Filter Pills (event_type taxonomy terms)
   ========================================================================== */

.eventon_filter_btn[data-filter_val="shakeout-run"],
.eventon_filter_btn.shakeout-run {
	background-color: var(--nxtrunn-shakeout-bg) !important;
	color: var(--nxtrunn-shakeout-text) !important;
	border-color: var(--nxtrunn-shakeout-bg) !important;
}

.eventon_filter_btn[data-filter_val="party"],
.eventon_filter_btn.party {
	background-color: var(--nxtrunn-party-bg) !important;
	color: var(--nxtrunn-party-text) !important;
	border-color: var(--nxtrunn-party-bg) !important;
}

.eventon_filter_btn[data-filter_val="pop-up"],
.eventon_filter_btn.pop-up {
	background-color: var(--nxtrunn-popup-bg) !important;
	color: var(--nxtrunn-popup-text) !important;
	border-color: var(--nxtrunn-popup-bg) !important;
}

.eventon_filter_btn[data-filter_val="cheer-zone"],
.eventon_filter_btn.cheer-zone {
	background-color: var(--nxtrunn-cheerzone-bg) !important;
	color: var(--nxtrunn-cheerzone-text) !important;
	border-color: var(--nxtrunn-cheerzone-bg) !important;
}

.eventon_filter_btn[data-filter_val="panel"],
.eventon_filter_btn.panel {
	background-color: var(--nxtrunn-panel-bg) !important;
	color: var(--nxtrunn-panel-text) !important;
	border-color: var(--nxtrunn-panel-bg) !important;
}

.eventon_filter_btn[data-filter_val="race"],
.eventon_filter_btn.race {
	background-color: var(--nxtrunn-race-bg) !important;
	color: var(--nxtrunn-race-text) !important;
	border-color: var(--nxtrunn-race-bg) !important;
}


/* ==========================================================================
   "Grab Tickets" Button (EventON Learn More)
   ========================================================================== */

/* Restyle EventON's Learn More / external link button as NXTRUNN CTA */
.eventon_list_event .evo_learnmore_btn a,
.evo_lightbox .evo_learnmore_btn a {
	background-color: var(--nxtrunn-primary) !important;
	color: #FFFFFF !important;
	border-radius: 999px !important;
	font-family: 'DM Sans', sans-serif !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	padding: 10px 24px !important;
	text-decoration: none !important;
	border: none !important;
	cursor: pointer;
	transition: background-color 0.2s ease;
	display: inline-block;
}

.eventon_list_event .evo_learnmore_btn a:hover,
.evo_lightbox .evo_learnmore_btn a:hover {
	background-color: var(--nxtrunn-primary-dark) !important;
}


/* ==========================================================================
   Marathon Pill Badges (on event cards, next to FEATURED tag)
   ========================================================================== */

.nxtrunn-marathon-pill {
	margin-left: 4px !important;
}

/* Lightbox header pill */
.evo_lightbox .nxtrunn-marathon-pill {
	display: inline-block !important;
	margin-left: 6px;
	vertical-align: middle;
}

/* Boston pill — BAA blue / yellow */
.nxtrunn-pill-boston {
	background-color: var(--nxtrunn-boston-bg) !important;
	color: var(--nxtrunn-boston-text) !important;
}

/* London pill — navy / red */
.nxtrunn-pill-london {
	background-color: var(--nxtrunn-london-bg) !important;
	color: var(--nxtrunn-london-text) !important;
}

/* Chicago pill — navy / orange */
.nxtrunn-pill-chicago {
	background-color: var(--nxtrunn-chicago-bg) !important;
	color: var(--nxtrunn-chicago-text) !important;
}

/* NYC pill — NYRR blue / orange */
.nxtrunn-pill-nyc {
	background-color: var(--nxtrunn-nyc-bg) !important;
	color: var(--nxtrunn-nyc-text) !important;
}

/* Berlin pill — black / gold */
.nxtrunn-pill-berlin {
	background-color: var(--nxtrunn-berlin-bg) !important;
	color: var(--nxtrunn-berlin-text) !important;
}

/* Tokyo pill — red / white */
.nxtrunn-pill-tokyo {
	background-color: var(--nxtrunn-tokyo-bg) !important;
	color: var(--nxtrunn-tokyo-text) !important;
}

/* Sydney pill — green / gold */
.nxtrunn-pill-sydney {
	background-color: var(--nxtrunn-sydney-bg) !important;
	color: var(--nxtrunn-sydney-text) !important;
}

/* BIPOC pill — warm brown / white */
.nxtrunn-pill-bipoc {
	background-color: var(--nxtrunn-bipoc-bg) !important;
	color: var(--nxtrunn-bipoc-text) !important;
}

/* Women pill — rose / white */
.nxtrunn-pill-women {
	background-color: var(--nxtrunn-women-bg) !important;
	color: var(--nxtrunn-women-text) !important;
}


/* ==========================================================================
   Featured Event Highlight
   ========================================================================== */

/* Featured events get a warm amber left accent border on the event row */
.eventon_list_event.nxtrunn-featured .evcal_list_a {
	border-left: 4px solid var(--nxtrunn-featured-bg) !important;
}


/* ==========================================================================
   Action User Form — Visible "Create New" Buttons
   ========================================================================== */

/*
 * EventON Action User's "Create New" buttons for Location and Organizer
 * use transparent background (evobgclt) with no explicit text color, making
 * them invisible on white/light BuddyBoss backgrounds. This gives them a
 * visible NXTRUNN-branded style so users can see and tap them on mobile.
 */
.evoau_submission_form .evoau_term_trig.evoaunew {
	background-color: var(--nxtrunn-primary, #7C5A78) !important;
	color: #FFFFFF !important;
	border-radius: 999px !important;
	padding: 10px 20px !important;
	font-family: 'DM Sans', sans-serif !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	cursor: pointer !important;
	opacity: 1 !important;
	transition: background-color 0.2s ease;
}

.evoau_submission_form .evoau_term_trig.evoaunew:hover {
	background-color: var(--nxtrunn-primary-dark, #5a3558) !important;
	opacity: 1 !important;
}

.evoau_submission_form .evoau_term_trig.evoaunew i {
	color: #FFFFFF !important;
}


/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 480px) {
	.eventon_filter_line .eventon_filter_btn,
	.evo_filter_s .eventon_filter_btn {
		font-size: 11px !important;
		padding: 5px 12px !important;
	}

	.eventon_list_event .evo_learnmore_btn a,
	.evo_lightbox .evo_learnmore_btn a {
		font-size: 13px !important;
		padding: 8px 20px !important;
		width: 100%;
		text-align: center;
	}

	/* Get Directions — stack input, address, and button vertically on mobile.
	   Gives the "your address" input field full width so users can see what they type. */
	.evo_get_direction_content {
		flex-direction: column !important;
	}

	/* "Type your address" input — full width on its own line. */
	.evogetdir_field {
		width: 100% !important;
		margin-bottom: 8px !important;
	}

	.evogetdir_field input[type="text"] {
		width: 100% !important;
		font-size: 14px !important;
		padding: 10px 12px !important;
	}

	/* Destination address + button row — full width below the input. */
	.evo_get_direction_content > .evodfx.evofxdrr {
		width: 100% !important;
	}

	.evo_get_direction_content > .evodfx.evofxdrr .evoposr {
		min-width: 0 !important;
	}

	.evo_get_direction_content > .evodfx.evofxdrr .evoposr input[readonly] {
		white-space: normal !important;
		overflow: visible !important;
		text-overflow: unset !important;
		font-size: 13px !important;
	}
}