/**
 * Event Filter Styles
 *
 * AJAX category filter for events.
 * Design matched to Business Directory filter UI.
 *
 * @package BD_Event_Aggregator
 * @version 1.9.35
 */

/* ==========================================================================
   Design Tokens
   ========================================================================== */

:root {
	/* Primary colors */
	--bdea-primary: #133453; /* Can be overridden by theme */
	--bdea-navy: #133453;
	--bdea-navy-light: #2a7a94;
	--bdea-navy-dark: #0f2530;
	--bdea-gold: #C9A227;

	/* Neutrals */
	--bdea-white: #fff;
	--bdea-gray-50: #f8fafc;
	--bdea-gray-100: #f1f5f9;
	--bdea-gray-200: #e2e8f0;
	--bdea-gray-300: #cbd5e1;
	--bdea-gray-400: #94a3b8;
	--bdea-gray-500: #64748b;
	--bdea-gray-600: #475569;
	--bdea-gray-700: #334155;
	--bdea-gray-900: #0f172a;

	/* Category colors */
	--bdea-cat-wine: #133453;
	--bdea-cat-entertainment: #8b5cf6;
	--bdea-cat-food: #f59e0b;
	--bdea-cat-arts: #2a7a94;
	--bdea-cat-family: #3b82f6;
	--bdea-cat-fitness: #10b981;
	--bdea-cat-classes: #C9A227;
	--bdea-cat-markets: #ec4899;

	/* Typography */
	--bdea-font-heading: 'Onest', -apple-system, BlinkMacSystemFont, sans-serif;
	--bdea-font-body: 'Source Sans 3', -apple-system, BlinkMacSystemFont, sans-serif;

	/* Transitions */
	--bdea-transition-fast: 150ms ease;
	--bdea-transition-base: 200ms ease;
	--bdea-transition-slow: 300ms ease;
}


/* ==========================================================================
   Filter Bar - Expand/Collapse Layout
   ========================================================================== */

/* Anti-flicker: Reserve space during TEC AJAX transitions */
.bdea-filter-bar {
	min-height: 50px !important;
	contain: layout style !important;
}

.bdea-filter-bar {
	display: flex !important;
	align-items: flex-start !important;
	justify-content: space-between !important;
	gap: 1rem !important;
	margin-bottom: 1.5rem !important;
	padding: 0.75rem 0 !important;
	background: transparent !important;
	border: none !important;
	box-sizing: border-box !important;
	flex-wrap: wrap !important;
}

/* Left side container: toggle + label + pills */
.bdea-filter-bar .bdea-filter-left {
	display: flex !important;
	align-items: flex-start !important;
	gap: 0.75rem !important;
	flex: 1 !important;
	min-width: 0 !important;
}

/* Right side container: city dropdown + clear button */
.bdea-filter-bar .bdea-filter-right {
	display: flex !important;
	align-items: center !important;
	gap: 0.75rem !important;
	flex-shrink: 0 !important;
}

/* Toggle Button */
.bdea-filter-bar .bdea-filter-toggle {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 44px !important;
	height: 44px !important;
	padding: 0 !important;
	background: var(--bdea-navy) !important;
	border: none !important;
	border-radius: 0.5rem !important;
	color: var(--bdea-white) !important;
	cursor: pointer !important;
	flex-shrink: 0 !important;
	transition: all var(--bdea-transition-fast) !important;
}

.bdea-filter-bar .bdea-filter-toggle:hover {
	background: var(--bdea-navy-dark) !important;
}

.bdea-filter-bar .bdea-filter-toggle i {
	font-size: 0.875rem !important;
	transition: transform var(--bdea-transition-base) !important;
	color: var(--bdea-white) !important;
}

.bdea-filter-bar.expanded .bdea-filter-toggle i {
	transform: rotate(180deg) !important;
}

/* EXPLORE: label */
.bdea-filter-bar .bdea-filter-label {
	font-family: var(--bdea-font-body) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	color: var(--bdea-gray-700) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.025em !important;
	white-space: nowrap !important;
	flex-shrink: 0 !important;
	margin: 0 !important;
	padding-top: 0.625rem !important;
	line-height: 1.4 !important;
}

/* Pills Container */
.bdea-filter-bar .bdea-filter-pills {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 0.5rem !important;
	flex: 1 !important;
	max-height: 44px !important;
	overflow: hidden !important;
	transition: max-height var(--bdea-transition-slow) !important;
}

.bdea-filter-bar.expanded .bdea-filter-pills {
	max-height: 500px !important;
}


/* ==========================================================================
   Filter Pills
   ========================================================================== */

/* Aggressive theme reset - works with Kadence and other themes */
.bdea-filter-bar button,
.bdea-filter-bar .bdea-filter-pill,
body .bdea-filter-bar button,
.entry-content .bdea-filter-bar button,
.kb-row-layout-wrap .bdea-filter-bar button {
	background-image: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	-webkit-box-shadow: none !important;
	border-image: none !important;
}

.bdea-filter-bar button.bdea-filter-pill,
.bdea-filter-bar .bdea-filter-pill,
button.bdea-filter-pill {
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.5rem !important;
	padding: 0.5rem 1rem !important;
	background: #fff !important;
	background-color: #fff !important;
	background-image: none !important;
	border: 1px solid #cbd5e1 !important;
	border-top: 1px solid #cbd5e1 !important;
	border-right: 1px solid #cbd5e1 !important;
	border-bottom: 1px solid #cbd5e1 !important;
	border-left: 1px solid #cbd5e1 !important;
	border-radius: 9999px !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: #475569 !important;
	white-space: nowrap !important;
	cursor: pointer !important;
	transition: all var(--bdea-transition-fast) !important;
	user-select: none !important;
	text-decoration: none !important;
	box-shadow: none !important;
	outline: none !important;
	outline-offset: 0 !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	min-height: auto !important;
	height: auto !important;
	position: relative !important;
	overflow: visible !important;
}

/* Remove any pseudo-elements from theme */
.bdea-filter-bar .bdea-filter-pill::before,
.bdea-filter-bar .bdea-filter-pill::after,
button.bdea-filter-pill::before,
button.bdea-filter-pill::after {
	content: none !important;
	display: none !important;
}

.bdea-filter-bar .bdea-filter-pill:hover {
	border-color: #94a3b8 !important;
	border-top-color: #94a3b8 !important;
	color: #334155 !important;
	background: #f8fafc !important;
	background-color: #f8fafc !important;
}

.bdea-filter-bar .bdea-filter-pill:focus {
	outline: none !important;
	box-shadow: 0 0 0 2px rgba(19, 52, 83, 0.3) !important;
}

.bdea-filter-bar .bdea-filter-pill:focus:not(:focus-visible) {
	box-shadow: none !important;
}

/* Active state */
.bdea-filter-bar .bdea-filter-pill.active {
	background: var(--bdea-navy) !important;
	background-color: var(--bdea-navy) !important;
	border: 1px solid var(--bdea-navy) !important;
	border-color: var(--bdea-navy) !important;
	border-top-color: var(--bdea-navy) !important;
	color: #fff !important;
}

.bdea-filter-bar .bdea-filter-pill.active:hover {
	background: var(--bdea-navy-dark) !important;
	background-color: var(--bdea-navy-dark) !important;
	border-color: var(--bdea-navy-dark) !important;
	border-top-color: var(--bdea-navy-dark) !important;
}

/* Icons */
.bdea-filter-bar .bdea-filter-pill i {
	font-size: 0.8125rem !important;
	color: #94a3b8 !important;
	transition: color var(--bdea-transition-fast) !important;
}

.bdea-filter-bar .bdea-filter-pill:hover i {
	color: #64748b !important;
}

.bdea-filter-bar .bdea-filter-pill.active i {
	color: #fff !important;
}

/* Count badge */
.bdea-filter-bar .bdea-filter-count {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 1.25rem !important;
	height: 1.125rem !important;
	padding: 0 0.375rem !important;
	background: #f1f5f9 !important;
	border-radius: 9999px !important;
	font-size: 0.6875rem !important;
	font-weight: 600 !important;
	color: #64748b !important;
	line-height: 1 !important;
	margin-left: 0.125rem !important;
}

.bdea-filter-bar .bdea-filter-pill.active .bdea-filter-count {
	background: rgba(255, 255, 255, 0.2) !important;
	color: #fff !important;
}

/* Hide zero count pills */
.bdea-filter-bar .bdea-filter-pill[data-count="0"] {
	opacity: 0.4 !important;
	pointer-events: none !important;
}


/* ==========================================================================
   Category-Specific Active Colors
   ========================================================================== */

.bdea-filter-bar .bdea-filter-pill.active[data-category="wine-spirits"] {
	background: var(--bdea-cat-wine) !important;
	background-color: var(--bdea-cat-wine) !important;
	border: 1px solid var(--bdea-cat-wine) !important;
	border-color: var(--bdea-cat-wine) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="live-entertainment"] {
	background: var(--bdea-cat-entertainment) !important;
	background-color: var(--bdea-cat-entertainment) !important;
	border: 1px solid var(--bdea-cat-entertainment) !important;
	border-color: var(--bdea-cat-entertainment) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="food-dining"] {
	background: var(--bdea-cat-food) !important;
	background-color: var(--bdea-cat-food) !important;
	border: 1px solid var(--bdea-cat-food) !important;
	border-color: var(--bdea-cat-food) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="arts-culture"] {
	background: var(--bdea-cat-arts) !important;
	background-color: var(--bdea-cat-arts) !important;
	border: 1px solid var(--bdea-cat-arts) !important;
	border-color: var(--bdea-cat-arts) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="family-fun"] {
	background: var(--bdea-cat-family) !important;
	background-color: var(--bdea-cat-family) !important;
	border: 1px solid var(--bdea-cat-family) !important;
	border-color: var(--bdea-cat-family) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="fitness-outdoors"] {
	background: var(--bdea-cat-fitness) !important;
	background-color: var(--bdea-cat-fitness) !important;
	border: 1px solid var(--bdea-cat-fitness) !important;
	border-color: var(--bdea-cat-fitness) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="classes-workshops"] {
	background: var(--bdea-cat-classes) !important;
	background-color: var(--bdea-cat-classes) !important;
	border: 1px solid var(--bdea-cat-classes) !important;
	border-color: var(--bdea-cat-classes) !important;
}

.bdea-filter-bar .bdea-filter-pill.active[data-category="markets-community"] {
	background: var(--bdea-cat-markets) !important;
	background-color: var(--bdea-cat-markets) !important;
	border: 1px solid var(--bdea-cat-markets) !important;
	border-color: var(--bdea-cat-markets) !important;
}


/* ==========================================================================
   Loading State
   ========================================================================== */

.bdea-filter-bar.loading .bdea-filter-pill {
	pointer-events: none;
	opacity: 0.6;
}

/* Hide TEC content when we're actively filtering - prevents flicker */
body.bdea-filtering .tribe-events-calendar-list,
body.bdea-filtering .tribe-events-pro-photo,
body.bdea-filtering .tribe-events-l-container {
	position: relative !important;
	visibility: hidden !important;
	min-height: 300px !important;
}

body.bdea-filtering .tribe-events-calendar-list::before,
body.bdea-filtering .tribe-events-pro-photo::before,
body.bdea-filtering .tribe-events-l-container::before {
	content: '' !important;
	position: absolute !important;
	top: 150px !important;
	left: 50% !important;
	width: 48px !important;
	height: 48px !important;
	margin-left: -24px !important;
	border: 3px solid var(--bdea-gray-200) !important;
	border-top-color: var(--bdea-navy) !important;
	border-radius: 50% !important;
	animation: bdea-spin 0.8s linear infinite !important;
	visibility: visible !important;
	z-index: 100 !important;
}

.bdea-events-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4rem 2rem;
	min-height: 300px;
}

.bdea-events-loading::before {
	content: '';
	width: 48px;
	height: 48px;
	border: 3px solid var(--bdea-gray-200);
	border-top-color: var(--bdea-navy);
	border-radius: 50%;
	animation: bdea-spin 0.8s linear infinite;
}

@keyframes bdea-spin {
	to { transform: rotate(360deg); }
}


/* ==========================================================================
   Filter Results Header
   ========================================================================== */

.bdea-filter-results-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--bdea-gray-200);
}

/* List mode filter header - inside TEC's structure */
.bdea-list-filter-header {
	background: var(--bdea-gray-50) !important;
	padding: 1rem 1.5rem !important;
	margin: 0 0 1.5rem 0 !important;
	border-radius: 0.5rem !important;
	border: 1px solid var(--bdea-gray-200) !important;
	border-bottom: 1px solid var(--bdea-gray-200) !important;
}

/* ==========================================================================
   Grid View Button in TEC Selector
   ========================================================================== */

/* Reset any background from TEC's active state on our Grid button */
.bdea-grid-view-item,
.bdea-grid-view-item.tribe-events-c-view-selector__list-item--active {
	background: transparent !important;
	background-color: transparent !important;
}

.bdea-grid-view-item a,
.bdea-grid-view-item.tribe-events-c-view-selector__list-item--active a {
	background: transparent !important;
	background-color: transparent !important;
}

/* 
 * TEC uses aria-current="page" AND --active class for underline styling.
 * We need to override BOTH when Grid is active.
 */

/* Remove active underline from List when Grid is active - target ALL possible selectors */
body.bdea-grid-mode .tribe-events-c-view-selector__list-item a[href*="/list/"]::after,
body.bdea-grid-mode .tribe-events-c-view-selector__list-item--active a[href*="/list/"]::after,
body.bdea-grid-mode .tribe-events-c-view-selector__list-item a[aria-current]::after,
body.bdea-grid-mode a[href*="/list/"][aria-current="page"]::after,
body.bdea-grid-mode .tribe-events-c-view-selector__list-item:not(.bdea-grid-view-item) a[aria-current]::after {
	content: none !important;
	display: none !important;
	opacity: 0 !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
}

/* Also hide underline by zeroing it out */
body.bdea-grid-mode .tribe-events-c-view-selector__list-item:not(.bdea-grid-view-item).tribe-events-c-view-selector__list-item--active::after,
body.bdea-grid-mode .tribe-events-c-view-selector__list-item:not(.bdea-grid-view-item) a::after {
	display: none !important;
	content: none !important;
}

/* Grid link needs relative positioning for the ::after pseudo-element */
.bdea-grid-view-item a {
	position: relative !important;
	display: inline-block !important;
	transition: color 0.2s ease, background-color 0.2s ease !important;
}

/* Hover effect for Grid button - matches TEC's other view buttons */
.bdea-grid-view-item a:hover {
	color: var(--tec-color-link-primary, #141827) !important;
	background-color: rgba(20, 24, 39, 0.05) !important;
	border-radius: 4px !important;
}

/* When NOT in grid mode, show hover underline preview */
body:not(.bdea-grid-mode) .bdea-grid-view-item a:hover::after {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	bottom: -4px !important;
	left: 0 !important;
	right: 0 !important;
	height: 3px !important;
	background-color: var(--tec-color-link-primary, #141827) !important;
	opacity: 0.4 !important;
	visibility: visible !important;
}

/* Ensure Grid gets underline when active - ALWAYS in grid mode */
body.bdea-grid-mode .bdea-grid-view-item a::after {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	bottom: -4px !important;
	left: 0 !important;
	right: 0 !important;
	height: 3px !important;
	background-color: var(--bdea-primary, var(--bdea-navy, #133453)) !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Also style when explicitly marked active */
.bdea-grid-view-item.tribe-events-c-view-selector__list-item--active a::after {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	bottom: -4px !important;
	left: 0 !important;
	right: 0 !important;
	height: 3px !important;
	background-color: var(--bdea-primary, var(--bdea-navy, #133453)) !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* ==========================================================================
   Grid Mode Content Area
   ========================================================================== */

/* When in Grid mode, our filtered events container should take over */
body.bdea-grid-mode .bdea-filtered-events {
	display: grid !important;
}

/* Hide TEC's native month separators in Grid mode since we're replacing content */
body.bdea-grid-mode.bdea-filtering .tribe-events-calendar-list__month-separator {
	display: none !important;
}

/* ==========================================================================
   City Dropdown Filter (Always visible, right-aligned, pill-style)
   ========================================================================== */

.bdea-filter-right .bdea-city-filter,
.bdea-filter-bar > .bdea-city-filter {
	position: relative;
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
	margin-top: 0;
}

.bdea-city-select {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	padding: 0.625rem 2.25rem 0.625rem 2.25rem !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: var(--bdea-navy) !important;
	background-color: var(--bdea-white) !important;
	border: 2px solid var(--bdea-navy) !important;
	border-radius: 9999px !important;
	cursor: pointer !important;
	transition: all var(--bdea-transition-fast) !important;
	min-width: 160px !important;
	height: auto !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
}

/* Extra specificity for theme overrides */
.bdea-filter-bar .bdea-city-select,
.bdea-filter-right .bdea-city-select,
.bdea-city-filter .bdea-city-select,
select.bdea-city-select {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	padding: 0.625rem 2.25rem 0.625rem 2.25rem !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.9375rem !important;
	font-weight: 600 !important;
	color: var(--bdea-navy) !important;
	background-color: var(--bdea-white) !important;
	background-image: none !important;
	border: 2px solid var(--bdea-navy) !important;
	border-radius: 9999px !important;
	cursor: pointer !important;
	min-width: 160px !important;
	height: auto !important;
	line-height: 1.4 !important;
	box-shadow: none !important;
}

.bdea-city-select:hover,
.bdea-filter-bar .bdea-city-select:hover,
select.bdea-city-select:hover {
	background-color: var(--bdea-gray-50) !important;
	box-shadow: 0 2px 8px rgba(19, 52, 83, 0.15) !important;
}

.bdea-city-select:focus,
.bdea-filter-bar .bdea-city-select:focus,
select.bdea-city-select:focus {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(19, 52, 83, 0.2) !important;
}

/* City has been selected (not "All Cities") - filled pill style */
.bdea-city-select.city-active,
.bdea-filter-bar .bdea-city-select.city-active,
select.bdea-city-select.city-active {
	background-color: var(--bdea-navy) !important;
	color: var(--bdea-white) !important;
}

/* Icon turns white when city is active */
.bdea-city-filter:has(.city-active) .bdea-city-icon,
.bdea-city-filter.city-active .bdea-city-icon {
	color: var(--bdea-white);
}

.bdea-city-icon {
	position: absolute;
	left: 0.875rem;
	color: var(--bdea-navy);
	font-size: 0.875rem;
	pointer-events: none;
	transition: color var(--bdea-transition-fast);
}

/* Dropdown arrow */
.bdea-filter-right .bdea-city-filter::after,
.bdea-filter-bar > .bdea-city-filter::after {
	content: '';
	position: absolute;
	right: 0.875rem;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 6px solid var(--bdea-navy);
	pointer-events: none;
	transition: border-color var(--bdea-transition-fast);
}

/* Arrow color when city active */
.bdea-city-filter:has(.city-active)::after,
.bdea-city-filter.city-active::after {
	border-top-color: var(--bdea-white);
}

/* ==========================================================================
   Clear Button (in filter bar)
   ========================================================================== */

.bdea-clear-btn,
.bdea-filter-bar .bdea-clear-btn,
.bdea-filter-right .bdea-clear-btn,
button.bdea-clear-btn {
	/* display controlled by JS */
	align-items: center;
	gap: 0.375rem;
	padding: 0.625rem 1rem !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	color: #dc2626 !important;
	background-color: #fef2f2 !important;
	background-image: none !important;
	border: 2px solid #fecaca !important;
	border-radius: 9999px !important;
	cursor: pointer !important;
	transition: all var(--bdea-transition-fast) !important;
	white-space: nowrap !important;
	box-shadow: none !important;
	height: auto !important;
	line-height: 1.4 !important;
}

.bdea-clear-btn:hover,
.bdea-filter-bar .bdea-clear-btn:hover,
button.bdea-clear-btn:hover {
	background-color: #fee2e2 !important;
	border-color: #fca5a5 !important;
	box-shadow: 0 2px 8px rgba(220, 38, 38, 0.15) !important;
}

.bdea-clear-btn:focus,
.bdea-filter-bar .bdea-clear-btn:focus,
button.bdea-clear-btn:focus {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.2) !important;
}

.bdea-clear-btn i {
	font-size: 0.75rem;
}

/* Mobile: stack city and clear button */
@media (max-width: 768px) {
	.bdea-filter-bar {
		flex-direction: column !important;
	}
	
	.bdea-filter-bar .bdea-filter-right {
		width: 100%;
		order: -1; /* Move to top on mobile */
		margin-bottom: 0.5rem;
		justify-content: space-between;
	}
	
	.bdea-filter-right .bdea-city-filter {
		flex: 1;
	}
	
	.bdea-city-select {
		width: 100%;
	}
}

.bdea-filter-results-count {
	font-family: var(--bdea-font-body);
	font-size: 1rem;
	color: var(--bdea-gray-600);
}

.bdea-filter-results-count strong {
	color: var(--bdea-gray-900);
	font-weight: 600;
}

.bdea-clear-filters,
a.bdea-clear-filters {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.5rem !important;
	padding: 0.5rem 1rem !important;
	background: transparent !important;
	border: 1px solid var(--bdea-gray-300) !important;
	border-radius: 0.5rem !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.875rem !important;
	font-weight: 500 !important;
	color: var(--bdea-gray-600) !important;
	cursor: pointer !important;
	transition: all var(--bdea-transition-fast) !important;
	text-decoration: none !important;
}

.bdea-clear-filters:hover,
a.bdea-clear-filters:hover {
	background: var(--bdea-gray-50) !important;
	border-color: var(--bdea-gray-400) !important;
	color: var(--bdea-gray-700) !important;
}


/* ==========================================================================
   Events Grid - Modern Cards
   ========================================================================== */

.bdea-filtered-events {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 1.5rem !important;
	animation: bdea-fade-in 0.3s ease !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

@keyframes bdea-fade-in {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}


/* ==========================================================================
   Event Card - Premium Modern Design
   ========================================================================== */

.bdea-filtered-events .bdea-event-card,
article.bdea-event-card {
	background: var(--bdea-white) !important;
	border-radius: 1rem !important;
	overflow: hidden !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.1) !important;
	transition: all var(--bdea-transition-base) !important;
	display: flex !important;
	flex-direction: column !important;
	border: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.bdea-filtered-events .bdea-event-card:hover,
article.bdea-event-card:hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.05) !important;
}

/* Card Image */
.bdea-event-card .bdea-event-card-image,
.bdea-event-card-image {
	position: relative !important;
	height: 200px !important;
	overflow: hidden !important;
	background: linear-gradient(135deg, var(--bdea-gray-100) 0%, var(--bdea-gray-200) 100%) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.bdea-event-card-image a {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
}

.bdea-event-card-image img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform var(--bdea-transition-slow) !important;
	display: block !important;
}

.bdea-event-card:hover .bdea-event-card-image img {
	transform: scale(1.05) !important;
}

/* Image gradient overlay for text readability */
.bdea-event-card-image::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0) 50%,
		rgba(0, 0, 0, 0.03) 100%
	);
	pointer-events: none;
}

/* Date Badge - Modern floating style */
.bdea-event-card .bdea-event-card-date-badge,
.bdea-event-card-date-badge {
	position: absolute !important;
	top: 1rem !important;
	left: 1rem !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	padding: 0.5rem 0.75rem !important;
	background: var(--bdea-white) !important;
	border-radius: 0.75rem !important;
	text-align: center !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
	z-index: 2 !important;
	border: none !important;
}

.bdea-event-card-date-badge .bdea-date-month {
	font-family: var(--bdea-font-body) !important;
	font-size: 0.6875rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.05em !important;
	color: var(--bdea-navy) !important;
	line-height: 1 !important;
	margin: 0 !important;
	padding: 0 !important;
}

.bdea-event-card-date-badge .bdea-date-day {
	font-family: var(--bdea-font-heading) !important;
	font-size: 1.5rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	color: var(--bdea-gray-900) !important;
	margin-top: 0.125rem !important;
	padding: 0 !important;
}

/* Date without image */
.bdea-event-card-date {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 2rem 1rem;
	background: linear-gradient(135deg, var(--bdea-gray-50) 0%, var(--bdea-gray-100) 100%);
	text-align: center;
	min-height: 140px;
}

.bdea-event-card-date .bdea-date-month {
	font-family: var(--bdea-font-body);
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--bdea-navy);
}

.bdea-event-card-date .bdea-date-day {
	font-family: var(--bdea-font-heading);
	font-size: 2.5rem;
	font-weight: 800;
	line-height: 1;
	color: var(--bdea-gray-900);
	margin-top: 0.25rem;
}

/* Card Content */
.bdea-event-card-content {
	padding: 1.25rem 1.25rem 1rem 1.25rem !important;
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
	background: var(--bdea-white) !important;
}

/* Card Title */
.bdea-event-card .bdea-event-card-title,
.bdea-event-card-title {
	margin: 0 0 0.875rem 0 !important;
	padding: 0 !important;
	font-family: var(--bdea-font-heading) !important;
	font-size: 1.125rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	background: none !important;
	border: none !important;
}

.bdea-event-card-title a {
	color: var(--bdea-gray-900) !important;
	text-decoration: none !important;
	transition: color var(--bdea-transition-fast) !important;
	background: none !important;
}

.bdea-event-card-title a:hover {
	color: var(--bdea-navy) !important;
}

/* Card Meta */
.bdea-event-card .bdea-event-card-meta,
.bdea-event-card-meta {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.5rem !important;
	margin-bottom: 0 !important;
}

.bdea-event-card-meta span {
	display: flex !important;
	align-items: center !important;
	gap: 0.5rem !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.875rem !important;
	color: var(--bdea-gray-500) !important;
	line-height: 1.4 !important;
	background: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.bdea-event-card-meta i,
.bdea-event-card-meta span i {
	width: 16px !important;
	text-align: center !important;
	color: var(--bdea-gray-400) !important;
	font-size: 0.8125rem !important;
	flex-shrink: 0 !important;
}

/* Category Tags - Colored Pills */
.bdea-event-card-cats {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 0.5rem !important;
	margin-top: auto !important;
	padding-top: 1rem !important;
	border-top: 1px solid var(--bdea-gray-100) !important;
}

.bdea-event-card .bdea-cat-tag,
.bdea-filtered-events .bdea-cat-tag,
span.bdea-cat-tag {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.375rem !important;
	padding: 0.375rem 0.75rem !important;
	border-radius: 0.375rem !important;
	font-family: var(--bdea-font-body) !important;
	font-size: 0.6875rem !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.02em !important;
	text-decoration: none !important;
	transition: all var(--bdea-transition-fast) !important;
	line-height: 1 !important;
	background: var(--bdea-gray-100) !important;
	color: var(--bdea-gray-600) !important;
}

.bdea-event-card .bdea-cat-tag i,
span.bdea-cat-tag i {
	font-size: 0.625rem !important;
	line-height: 1 !important;
}

/* Category tag colors */
.bdea-event-card .bdea-cat-tag[data-cat="wine-spirits"],
span.bdea-cat-tag[data-cat="wine-spirits"] {
	background: rgba(19, 52, 83, 0.1) !important;
	color: var(--bdea-cat-wine) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="live-entertainment"],
span.bdea-cat-tag[data-cat="live-entertainment"] {
	background: rgba(139, 92, 246, 0.1) !important;
	color: var(--bdea-cat-entertainment) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="food-dining"],
span.bdea-cat-tag[data-cat="food-dining"] {
	background: rgba(245, 158, 11, 0.1) !important;
	color: var(--bdea-cat-food) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="arts-culture"],
span.bdea-cat-tag[data-cat="arts-culture"] {
	background: rgba(42, 122, 148, 0.1) !important;
	color: var(--bdea-cat-arts) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="family-fun"],
span.bdea-cat-tag[data-cat="family-fun"] {
	background: rgba(59, 130, 246, 0.1) !important;
	color: var(--bdea-cat-family) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="fitness-outdoors"],
span.bdea-cat-tag[data-cat="fitness-outdoors"] {
	background: rgba(16, 185, 129, 0.1) !important;
	color: var(--bdea-cat-fitness) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="classes-workshops"],
span.bdea-cat-tag[data-cat="classes-workshops"] {
	background: rgba(201, 162, 39, 0.1) !important;
	color: var(--bdea-cat-classes) !important;
}
.bdea-event-card .bdea-cat-tag[data-cat="markets-community"],
span.bdea-cat-tag[data-cat="markets-community"] {
	background: rgba(236, 72, 153, 0.1) !important;
	color: var(--bdea-cat-markets) !important;
}


/* ==========================================================================
   No Events State
   ========================================================================== */

.bdea-no-events {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 4rem 2rem;
	text-align: center;
	background: var(--bdea-gray-50);
	border-radius: 1rem;
	min-height: 300px;
}

.bdea-no-events i {
	font-size: 3rem;
	color: var(--bdea-gray-300);
	margin-bottom: 1.5rem;
}

.bdea-no-events p {
	margin: 0 0 1.5rem 0;
	font-family: var(--bdea-font-body);
	font-size: 1.0625rem;
	color: var(--bdea-gray-500);
}


/* ==========================================================================
   Pagination
   ========================================================================== */

.bdea-filter-pagination {
	margin-top: 2rem;
	display: flex;
	justify-content: center;
}

.bdea-filter-pagination ul {
	display: flex;
	gap: 0.375rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bdea-filter-pagination a,
.bdea-filter-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	height: 2.5rem;
	padding: 0 0.75rem;
	background: var(--bdea-white);
	border: 1px solid var(--bdea-gray-200);
	border-radius: 0.5rem;
	font-family: var(--bdea-font-body);
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--bdea-gray-600);
	text-decoration: none;
	transition: all var(--bdea-transition-fast);
}

.bdea-filter-pagination a:hover {
	background: var(--bdea-gray-50);
	border-color: var(--bdea-gray-300);
	color: var(--bdea-gray-700);
}

.bdea-filter-pagination .current {
	background: var(--bdea-navy);
	border-color: var(--bdea-navy);
	color: var(--bdea-white);
}


/* ==========================================================================
   TEC Native Category Tags Override
   ========================================================================== */

.tribe-events .tribe-events-calendar-list__event-categories,
.tribe-events .tribe-events-pro-photo__event-categories {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
	margin-top: 0.75rem;
}

.tribe-events .tribe-events-calendar-list__event-categories a,
.tribe-events .tribe-events-pro-photo__event-categories a {
	display: inline-flex;
	align-items: center;
	padding: 0.25rem 0.625rem;
	font-size: 0.6875rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	text-decoration: none;
	border-radius: 0.375rem;
	background: var(--bdea-gray-100);
	color: var(--bdea-gray-600);
	border: 1px solid var(--bdea-gray-200);
	transition: all var(--bdea-transition-fast);
}

/* Category-specific TEC tag colors */
.tribe-events a[href*="wine-spirits"] {
	background: rgba(19, 52, 83, 0.08);
	color: var(--bdea-cat-wine);
	border-color: rgba(19, 52, 83, 0.15);
}
.tribe-events a[href*="wine-spirits"]:hover {
	background: var(--bdea-cat-wine);
	color: white;
}

.tribe-events a[href*="live-entertainment"] {
	background: rgba(139, 92, 246, 0.08);
	color: var(--bdea-cat-entertainment);
	border-color: rgba(139, 92, 246, 0.15);
}
.tribe-events a[href*="live-entertainment"]:hover {
	background: var(--bdea-cat-entertainment);
	color: white;
}

.tribe-events a[href*="food-dining"] {
	background: rgba(245, 158, 11, 0.08);
	color: var(--bdea-cat-food);
	border-color: rgba(245, 158, 11, 0.15);
}
.tribe-events a[href*="food-dining"]:hover {
	background: var(--bdea-cat-food);
	color: white;
}

.tribe-events a[href*="arts-culture"] {
	background: rgba(42, 122, 148, 0.08);
	color: var(--bdea-cat-arts);
	border-color: rgba(42, 122, 148, 0.15);
}
.tribe-events a[href*="arts-culture"]:hover {
	background: var(--bdea-cat-arts);
	color: white;
}

.tribe-events a[href*="family-fun"] {
	background: rgba(59, 130, 246, 0.08);
	color: var(--bdea-cat-family);
	border-color: rgba(59, 130, 246, 0.15);
}
.tribe-events a[href*="family-fun"]:hover {
	background: var(--bdea-cat-family);
	color: white;
}

.tribe-events a[href*="fitness-outdoors"] {
	background: rgba(16, 185, 129, 0.08);
	color: var(--bdea-cat-fitness);
	border-color: rgba(16, 185, 129, 0.15);
}
.tribe-events a[href*="fitness-outdoors"]:hover {
	background: var(--bdea-cat-fitness);
	color: white;
}

.tribe-events a[href*="classes-workshops"] {
	background: rgba(201, 162, 39, 0.08);
	color: var(--bdea-cat-classes);
	border-color: rgba(201, 162, 39, 0.15);
}
.tribe-events a[href*="classes-workshops"]:hover {
	background: var(--bdea-cat-classes);
	color: white;
}

.tribe-events a[href*="markets-community"] {
	background: rgba(236, 72, 153, 0.08);
	color: var(--bdea-cat-markets);
	border-color: rgba(236, 72, 153, 0.15);
}
.tribe-events a[href*="markets-community"]:hover {
	background: var(--bdea-cat-markets);
	color: white;
}


/* ==========================================================================
   View Selector Underline Fix
   Ensure only the ACTUAL current view shows the underline
   ========================================================================== */

/* When on Month view, remove any accidental underline from List */
body.tribe-events-month .tribe-events-c-view-selector__list-item a[href*="/list"]::after,
body.tribe-events-month .tribe-events-c-view-selector__list-item a[href$="/events/"]::after,
.tribe-events-view--month .tribe-events-c-view-selector__list-item a[href*="/list"]::after {
	display: none !important;
	content: none !important;
	opacity: 0 !important;
}

/* When on Day view, remove any accidental underline from List */
body.tribe-events-day .tribe-events-c-view-selector__list-item a[href*="/list"]::after,
body.tribe-events-day .tribe-events-c-view-selector__list-item a[href$="/events/"]::after,
.tribe-events-view--day .tribe-events-c-view-selector__list-item a[href*="/list"]::after {
	display: none !important;
	content: none !important;
	opacity: 0 !important;
}

/* ==========================================================================
   Active View Selector Styling - Bold Text & Underline
   ========================================================================== */

/* Bold text for ALL active view items */
.tribe-events-c-view-selector__list-item--active a,
.tribe-events-c-view-selector__list-item a[aria-current="page"],
body.tribe-events-month .tribe-events-c-view-selector__list-item a[href*="/month"],
body.tribe-events-day .tribe-events-c-view-selector__list-item a[href*="/day"],
body.tribe-events-day .tribe-events-c-view-selector__list-item a[href*="/today"],
body.bdea-grid-mode .bdea-grid-view-item a {
	font-weight: 700 !important;
}

/* Underline for Month view when active */
body.tribe-events-month .tribe-events-c-view-selector__list-item a[href*="/month"]::after,
.tribe-events-view--month .tribe-events-c-view-selector__list-item a[href*="/month"]::after {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	bottom: -4px !important;
	left: 0 !important;
	right: 0 !important;
	height: 3px !important;
	background-color: var(--bdea-primary, var(--bdea-navy, #133453)) !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Underline for Day view when active */
body.tribe-events-day .tribe-events-c-view-selector__list-item a[href*="/day"]::after,
body.tribe-events-day .tribe-events-c-view-selector__list-item a[href*="/today"]::after,
.tribe-events-view--day .tribe-events-c-view-selector__list-item a[href*="/day"]::after,
.tribe-events-view--day .tribe-events-c-view-selector__list-item a[href*="/today"]::after {
	content: '' !important;
	display: block !important;
	position: absolute !important;
	bottom: -4px !important;
	left: 0 !important;
	right: 0 !important;
	height: 3px !important;
	background-color: var(--bdea-primary, var(--bdea-navy, #133453)) !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Ensure Month/Day links have relative positioning for ::after */
.tribe-events-c-view-selector__list-item a[href*="/month"],
.tribe-events-c-view-selector__list-item a[href*="/day"],
.tribe-events-c-view-selector__list-item a[href*="/today"] {
	position: relative !important;
}


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

@media (max-width: 1024px) {
	.bdea-filtered-events {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.bdea-filter-bar {
		flex-wrap: wrap !important;
	}

	.bdea-filter-bar .bdea-filter-toggle {
		width: 40px !important;
		height: 40px !important;
	}

	.bdea-filter-bar .bdea-filter-label {
		padding-top: 0.5rem !important;
	}

	.bdea-filter-bar .bdea-filter-pills {
		max-height: 40px !important;
	}

	.bdea-filter-bar .bdea-filter-pill {
		padding: 0.375rem 0.875rem !important;
		font-size: 0.8125rem !important;
	}

	.bdea-filtered-events {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.bdea-event-card-image {
		height: 180px;
	}
}

@media (max-width: 480px) {
	.bdea-filter-bar .bdea-filter-label {
		display: none !important;
	}

	.bdea-event-card-content {
		padding: 1rem;
	}

	.bdea-event-card-title {
		font-size: 1rem !important;
	}
}

/* ==========================================================================
   Anti-Flicker: TEC AJAX Transition Smoothing
   ========================================================================== */

/* Prevent layout shift during TEC view changes */
.tribe-events {
	min-height: 200px;
}

/* Smooth transitions for TEC content area */
.tribe-events-l-container,
.tribe-common-l-container {
	transition: opacity 0.15s ease-out;
}

/* When TEC is loading (it adds this class) */
.tribe-common--breakpoint-medium.tribe-events--loading .tribe-events-l-container,
.tribe-events-view--loading .tribe-common-l-container {
	opacity: 0.6;
}

/* Keep filter bar stable during transitions */
.bdea-filter-bar {
	position: relative;
	z-index: 10;
	transition: none !important;
}

/* Prevent filter bar from being affected by TEC's loading states */
.tribe-events--loading .bdea-filter-bar,
.tribe-events-view--loading .bdea-filter-bar {
	opacity: 1 !important;
	visibility: visible !important;
}