#aef-filter-wrap {
	/* Adjust these to match your site's palette. */
	--aef-accent: #b3242c;      /* red used for buttons, pills, date banners */
	--aef-active-tab: #e0a92e;  /* gold used for the active view tab */
	--aef-dark: #1a1a1a;        /* dark tab/button background */
	--aef-border: #e0e0e0;
	--aef-panel-bg: #ffffff;
	--aef-panel-text: #1a1a1a;
	margin-bottom: 30px;
}

#aef-view-tabs {
	display: flex;
	gap: 8px;
	margin-bottom: 16px;
}

.aef-tab {
	padding: 10px 20px;
	border: none;
	border-radius: 4px;
	background: var(--aef-dark);
	color: #fff;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
}

.aef-tab.active {
	background: var(--aef-active-tab);
	color: #1a1a1a;
}

#aef-filter-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: flex-start;
	margin-bottom: 12px;
}

/* Dropdown buttons (Dates, Genre) */
.aef-dropdown {
	position: relative;
}

.aef-dropdown-btn {
	padding: 10px 18px;
	border-radius: 20px;
	border: 1.5px solid var(--aef-accent);
	background: transparent;
	color: var(--aef-accent);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.aef-caret {
	font-size: 11px;
	margin-left: 4px;
}

.aef-dropdown-panel {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	min-width: 240px;
	max-height: 320px;
	overflow-y: auto;
	background: var(--aef-panel-bg);
	color: var(--aef-panel-text);
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
	padding: 12px;
	z-index: 20;
}

.aef-dropdown-panel.open {
	display: block;
}

.aef-dropdown-panel input[type="date"] {
	width: 100%;
	padding: 8px 10px;
	border: 1px solid var(--aef-border);
	border-radius: 4px;
	font-size: 14px;
}

.aef-genre-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 6px 2px;
	font-size: 14px;
	cursor: pointer;
}

.aef-genre-count {
	color: #888;
	font-size: 13px;
}

/* Search field */
.aef-search-wrap {
	position: relative;
	flex: 1;
	min-width: 220px;
}

#aef-search {
	width: 100%;
	padding: 10px 40px 10px 16px;
	border-radius: 20px;
	border: 1px solid var(--aef-border);
	background: var(--aef-dark);
	color: #fff;
	font-size: 14px;
	box-sizing: border-box;
}

#aef-search::placeholder {
	color: #bbb;
}

.aef-search-icon {
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--aef-accent);
	pointer-events: none;
}

/* Active filter pills */
#aef-active-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 20px;
	min-height: 1px;
}

.aef-pill {
	padding: 6px 14px;
	border-radius: 16px;
	border: 1.5px solid var(--aef-accent);
	background: transparent;
	color: var(--aef-accent);
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}

.aef-pill-clear {
	border-color: var(--aef-border);
	color: #666;
}

/* Date-grouped section headers in the List view */
.aef-date-header {
	background: var(--aef-accent);
	color: #fff;
	font-size: 20px;
	font-weight: 700;
	padding: 14px 20px;
	margin: 20px 0 12px;
	border-radius: 4px;
}

.aef-date-panel {
	min-width: 320px;
	padding: 16px;
}

.aef-date-panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
	font-size: 14px;
}

#aef-date-reset {
	padding: 6px 16px;
	border: none;
	border-radius: 16px;
	background: var(--aef-active-tab);
	color: #1a1a1a;
	font-weight: 700;
	cursor: pointer;
}

#aef-date-picker {
	background: #efece4;
	border: 1px solid var(--aef-border);
	border-radius: 6px;
	padding: 10px;
}

#aef-date-picker .fc-toolbar-title {
	font-size: 16px;
	font-weight: 700;
}

#aef-date-picker .fc-daygrid-day-frame {
	cursor: pointer;
}

#aef-date-picker .aef-day-past {
	opacity: 0.4;
	cursor: default;
}

#aef-date-picker .aef-day-past .fc-daygrid-day-frame {
	cursor: default;
}

#aef-date-picker .aef-day-today .fc-daygrid-day-number {
	background: var(--aef-active-tab);
	border-radius: 4px;
	font-weight: 700;
}

#aef-date-picker .aef-day-selected .fc-daygrid-day-number {
	background: var(--aef-accent);
	color: #fff;
	border-radius: 4px;
	font-weight: 700;
}


#aef-calendar-view {
	background: #ffffff;
	border: 1px solid var(--aef-border);
	padding: 16px;
}