/**
 * Events Calendar — Full Calendar search form layout
 * Scope: .mec-full-calendar-wrap (works for mec2 / numeric skin ids)
 *
 * Remove Elementor custom CSS for this form — this file owns the layout.
 */

/* -------------------------------------------------------------------------
 * Grid shell
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap {
	position: relative;
	overflow: visible;
}

.mec-full-calendar-wrap .select2-dropdown {
	z-index: 99999 !important;
}

.mec-full-calendar-wrap .mec-search-form.mec-totalcal-box {
	padding: 16px !important;
	overflow: visible !important;
}

.mec-full-calendar-wrap form.mec-dropdown-wrap > div,
.mec-full-calendar-wrap form.mec-dropdown-wrap > div > div.mec-dropdown-wrap,
.mec-full-calendar-wrap .mec-full-calendar-search-ends {
	display: contents !important;
}

.mec-full-calendar-wrap form.mec-dropdown-wrap {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	column-gap: 16px !important;
	row-gap: 12px !important;
	width: 100% !important;
	float: none !important;
}

/* Kill MEC float/table leftovers inside the grid */
.mec-full-calendar-wrap form.mec-dropdown-wrap .mec-dropdown-search,
.mec-full-calendar-wrap form.mec-dropdown-wrap .mec-checkboxes-search,
.mec-full-calendar-wrap form.mec-dropdown-wrap .mec-text-input-search,
.mec-full-calendar-wrap form.mec-dropdown-wrap .mec-date-search,
.mec-full-calendar-wrap form.mec-dropdown-wrap .mec-tab-loader,
.mec-full-calendar-wrap form.mec-dropdown-wrap .mec-search-reset-button {
	float: none !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
}

/* -------------------------------------------------------------------------
 * Field order (tablet / laptop / desktop — 2 columns)
 * 1 Category (full)
 * 2 Group + My Groups (same row)
 * 3 Location | 4 Organizer
 * 5 Text (full)
 * 6 Date | 7 View tabs
 * 8 Reset
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-checkboxes-search {
	grid-column: 1 / -1 !important;
	order: 1 !important;
	display: flex !important;
	align-items: stretch !important;
	align-self: start !important;
}

.mec-full-calendar-wrap .mec-dropdown-search:not(.cns-mec-bb-group-sf) {
	display: flex !important;
	align-items: stretch !important;
}

.mec-full-calendar-wrap .cns-mec-group-row {
	grid-column: 1 / -1 !important;
	order: 2 !important;
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

.mec-full-calendar-wrap .cns-mec-group-row .cns-mec-bb-group-sf.mec-dropdown-search {
	grid-column: auto !important;
	order: 0 !important;
	flex: 1 1 auto !important;
	width: auto !important;
	min-width: 0 !important;
	display: flex !important;
	align-items: stretch !important;
	align-self: stretch !important;
	margin: 0 !important;
}

/* Fallback if wrapper JS has not run yet */
.mec-full-calendar-wrap form.mec-dropdown-wrap > .cns-mec-bb-group-sf.mec-dropdown-search {
	grid-column: 1 / -1 !important;
	order: 2 !important;
	display: flex !important;
	align-items: stretch !important;
	align-self: start !important;
}

/* Field labels hidden — Category/Group use in-field placeholders like Location */
.mec-full-calendar-wrap .mec-checkboxes-search > label,
.mec-full-calendar-wrap .cns-mec-bb-group-sf > label {
	display: none !important;
}

.mec-full-calendar-wrap .cns-mec-group-row .cns-mec-my-groups-cb,
.mec-full-calendar-wrap .cns-mec-my-groups-cb {
	grid-column: auto !important;
	order: 0 !important;
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: 100% !important;
	align-self: center !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex !important;
	align-items: center !important;
	white-space: nowrap !important;
}

/* Location / Organizer — avoid fragile nth-child (BB Group may sit 2nd or last) */
.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_location_"]) {
	grid-column: 1 / 2 !important;
	order: 3 !important;
}

.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_organizer_"]) {
	grid-column: 2 / 3 !important;
	order: 4 !important;
}

.mec-full-calendar-wrap .mec-text-input-search {
	grid-column: 1 / -1 !important;
	order: 5 !important;
	display: flex !important;
	align-items: stretch !important;
	min-height: unset !important;
}

.mec-full-calendar-wrap .mec-date-search {
	grid-column: 1 / 2 !important;
	order: 6 !important;
	display: flex !important;
	align-items: stretch !important;
}

.mec-full-calendar-wrap .mec-tab-loader {
	grid-column: 2 / 3 !important;
	order: 7 !important;
	display: flex !important;
	justify-content: flex-start !important;
	align-items: center !important;
}

.mec-full-calendar-wrap .mec-search-reset-button {
	grid-column: 1 / -1 !important;
	order: 8 !important;
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	position: relative !important;
	margin: 8px 0 0 0 !important;
	visibility: visible !important;
	opacity: 1 !important;
	overflow: visible !important;
	z-index: 5;
}

.mec-full-calendar-wrap .mec-search-reset-button .mec-button,
.mec-full-calendar-wrap button[id$="_reset"] {
	position: static !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	top: auto !important;
	margin: 0 auto !important;
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
	height: auto !important;
	min-height: 36px !important;
	overflow: visible !important;
}

/* Kill legacy absolute offset (was hiding Reset on mobile) */
#mec_search_form_mec2_reset {
	position: static !important;
	left: auto !important;
	right: auto !important;
	margin: 0 auto !important;
}

.mec-full-calendar-wrap .mec-there-reset-button.mec-totalcal-box {
	padding-bottom: 16px !important;
}

/* -------------------------------------------------------------------------
 * Category (single-select) + BB Group (single) — shared 40px height
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-checkboxes-search {
	width: 100% !important;
	min-width: 0 !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .mec-searchbar-category-wrap {
	flex: 1 1 auto !important;
	width: calc(100% - 40px) !important;
	max-width: calc(100% - 40px) !important;
	min-width: 0 !important;
	height: 40px !important;
	min-height: 40px !important;
	max-height: 40px !important;
	position: relative !important;
	box-sizing: border-box !important;
	overflow: visible !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .mec-searchbar-category-wrap > div,
.mec-full-calendar-wrap .mec-checkboxes-search [id^="mec_sf_category_"] {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
	position: relative !important;
	overflow: visible !important;
	min-height: 40px !important;
	height: 40px !important;
	max-height: 40px !important;
}

/* Native <select> must stay out of layout or Category grows to option-list height */
.mec-full-calendar-wrap .mec-checkboxes-search select.select2-hidden-accessible,
.mec-full-calendar-wrap .cns-mec-bb-group-sf select.select2-hidden-accessible {
	border: 0 !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	width: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	white-space: nowrap !important;
	min-height: 0 !important;
	max-height: 1px !important;
	z-index: -1 !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .select2-container,
.mec-full-calendar-wrap .mec-checkboxes-search .select2-container.select2-container--default {
	width: 100% !important;
	max-width: 100% !important;
	display: block !important;
}

/* Category single-select — match Group/Location/Organizer height */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--single {
	height: 40px !important;
	min-height: 40px !important;
	max-height: 40px !important;
	border: 0 !important;
	background: transparent !important;
	border-radius: 0 !important;
	display: flex !important;
	align-items: center !important;
	box-sizing: border-box !important;
	box-shadow: none !important;
	line-height: 38px !important;
	color: #777 !important;
	font-size: 13px !important;
	padding: 0 !important;
	overflow: hidden !important;
}

/*
 * Kill MEC multiselect "pill" flash: Category must never look like chips,
 * even for the split-second MEC re-inits Select2 as --multiple before our JS.
 */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple {
	min-height: 40px !important;
	height: 40px !important;
	max-height: 40px !important;
	overflow: hidden !important;
	border: 0 !important;
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	padding: 0 28px 0 8px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	line-height: 38px !important;
	color: #555 !important;
	font-size: 13px !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple .select2-selection__rendered {
	display: flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	gap: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	overflow: hidden !important;
}

/* Choice chips → plain label text (no pill chrome) */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple .select2-selection__choice {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
	color: #555 !important;
	font-size: 13px !important;
	line-height: 38px !important;
	max-width: 100% !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple .select2-selection__choice__remove,
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple .select2-selection__clear,
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple .select2-search--inline {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: hidden !important;
	visibility: hidden !important;
}

/* Hide any extra chips beyond the first during the flash */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple .select2-selection__choice ~ .select2-selection__choice {
	display: none !important;
}

/* Group single — match search field height (40px) */
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection--single {
	height: 40px !important;
	min-height: 40px !important;
	border: 1px solid #efefef !important;
	box-shadow: none !important;
	background: #fff !important;
	display: flex !important;
	align-items: center !important;
	box-sizing: border-box !important;
	line-height: 38px !important;
	color: #777 !important;
	font-size: 13px !important;
}

.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection--single {
	margin: 0 0 0 -1px !important;
	border-radius: 0 var(--mec-secondary-border-radius, 3px) var(--mec-secondary-border-radius, 3px) 0 !important;
	width: 100% !important;
}

.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection__rendered,
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--single .select2-selection__rendered {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	width: auto !important;
	max-width: none !important;
	padding: 0 28px 0 8px !important;
	line-height: 38px !important;
	color: #555 !important;
	font-size: 13px !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	box-sizing: border-box !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--single .select2-selection__placeholder {
	color: #777 !important;
}

.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection__arrow,
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection__arrow {
	height: 38px !important;
	top: 1px !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection__clear,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection__clear {
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Search field — same initial height as Category/Group controls */
.mec-full-calendar-wrap .mec-text-input-search input[type="search"],
.mec-full-calendar-wrap .mec-text-input-search input[type="text"] {
	height: 40px !important;
	min-height: 40px !important;
	box-sizing: border-box !important;
}

/* My Groups — checkbox + label on one baseline, top of its grid row */
.mec-full-calendar-wrap .cns-mec-my-groups-cb {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	align-self: start !important;
	gap: 8px 12px !important;
	padding: 4px 0 !important;
	min-height: 28px !important;
	overflow: visible !important;
	z-index: 2;
}

.mec-full-calendar-wrap .cns-mec-my-groups-cb label {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.2 !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #555 !important;
	cursor: pointer;
	white-space: nowrap !important;
}

.mec-full-calendar-wrap .cns-mec-my-groups-cb input[type="checkbox"] {
	margin: 0 !important;
	position: static !important;
	flex: 0 0 16px !important;
	width: 16px !important;
	height: 16px !important;
}

.mec-full-calendar-wrap .cns-mec-my-groups-cb label > span {
	position: static !important;
	display: inline !important;
	transform: none !important;
	top: auto !important;
	left: auto !important;
}

/* -------------------------------------------------------------------------
 * Shared dropdown / text / date field widths (icon + control)
 * Icon boxes and inputs share a fixed 40px height.
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-checkboxes-search > i,
.mec-full-calendar-wrap .mec-dropdown-search > i,
.mec-full-calendar-wrap .mec-text-input-search > i,
.mec-full-calendar-wrap .mec-date-search > i,
.mec-full-calendar-wrap .cns-mec-bb-group-sf > i,
.mec-full-calendar-wrap .cns-mec-bb-group-sf > .mec-svg-icon,
.mec-full-calendar-wrap .cns-mec-bb-group-sf > img.mec-custom-image-icon {
	flex: 0 0 40px !important;
	width: 40px !important;
	min-width: 40px !important;
	max-width: 40px !important;
	height: 40px !important;
	min-height: 40px !important;
	max-height: 40px !important;
	box-sizing: border-box !important;
	padding: 0 !important;
	margin: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	align-self: stretch !important;
	line-height: 1 !important;
	text-align: center !important;
	vertical-align: middle !important;
}

.mec-full-calendar-wrap .mec-dropdown-search .select2-container,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-container,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-container.select2-container--default,
.mec-full-calendar-wrap .cns-mec-bb-group-sf__select {
	width: calc(100% - 40px) !important;
	max-width: calc(100% - 40px) !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: block !important;
}

.mec-full-calendar-wrap .mec-dropdown-search .select2-selection--single,
.mec-full-calendar-wrap .mec-date-search .select2-selection--single {
	height: 40px !important;
	min-height: 40px !important;
	max-height: 40px !important;
	box-sizing: border-box !important;
	display: flex !important;
	align-items: center !important;
	line-height: 38px !important;
}

.mec-full-calendar-wrap .mec-dropdown-search .select2-selection--single .select2-selection__rendered,
.mec-full-calendar-wrap .mec-date-search .select2-selection--single .select2-selection__rendered {
	line-height: 38px !important;
	padding-left: 8px !important;
}

.mec-full-calendar-wrap .mec-dropdown-search .select2-selection__arrow,
.mec-full-calendar-wrap .mec-date-search .select2-selection__arrow {
	height: 38px !important;
	top: 1px !important;
}

.mec-full-calendar-wrap .mec-text-input-search input[type="search"] {
	width: calc(100% - 40px) !important;
	height: 40px !important;
	min-height: 40px !important;
	margin-bottom: 0 !important;
	box-sizing: border-box !important;
}

.mec-full-calendar-wrap .mec-date-search .select2-container:first-of-type {
	width: calc(60% - 24px) !important;
}

.mec-full-calendar-wrap .mec-date-search .select2-container:last-of-type {
	width: calc(40% - 16px) !important;
}

/* BB Group — match Location/Organizer icon chrome */
.mec-full-calendar-wrap .cns-mec-bb-group-sf {
	display: flex !important;
	align-items: stretch !important;
	min-height: 40px !important;
	position: relative !important;
	width: 100% !important;
}

/* Keep placeholder SR text from painting into the field chrome */
.mec-full-calendar-wrap .cns-mec-bb-group-sf > .mec-screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.mec-full-calendar-wrap .mec-totalcal-view {
	display: flex !important;
	justify-content: flex-start !important;
	flex-wrap: nowrap !important;
	text-align: left !important;
	width: 100% !important;
}

.mec-full-calendar-wrap .mec-totalcal-view span {
	margin: 2px !important;
}

.mec-full-calendar-wrap .mec-tab-loader.col-md-6 {
	margin: 0 !important;
	padding: 0 !important;
}

/* -------------------------------------------------------------------------
 * Month prev/next (from former Elementor CSS)
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-previous-month,
.mec-full-calendar-wrap .mec-next-month {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 8px 24px !important;
	background-color: #ffffff !important;
	border: 2px solid #2a7a5a !important;
	border-radius: 6px !important;
	transition: all 0.3s ease-in-out !important;
	text-decoration: none !important;
	cursor: pointer !important;
}

.mec-full-calendar-wrap .mec-previous-month,
.mec-full-calendar-wrap .mec-previous-month a,
.mec-full-calendar-wrap .mec-previous-month span,
.mec-full-calendar-wrap .mec-previous-month i,
.mec-full-calendar-wrap .mec-next-month,
.mec-full-calendar-wrap .mec-next-month a,
.mec-full-calendar-wrap .mec-next-month span,
.mec-full-calendar-wrap .mec-next-month i {
	color: #2a7a5a !important;
	transition: all 0.3s ease-in-out !important;
}

.mec-full-calendar-wrap .mec-previous-month:hover,
.mec-full-calendar-wrap .mec-previous-month:focus,
.mec-full-calendar-wrap .mec-next-month:hover,
.mec-full-calendar-wrap .mec-next-month:focus {
	background-color: #7cae15 !important;
	border-color: #7cae15 !important;
}

.mec-full-calendar-wrap .mec-previous-month:hover,
.mec-full-calendar-wrap .mec-previous-month:hover a,
.mec-full-calendar-wrap .mec-previous-month:hover span,
.mec-full-calendar-wrap .mec-previous-month:hover i,
.mec-full-calendar-wrap .mec-next-month:hover,
.mec-full-calendar-wrap .mec-next-month:hover a,
.mec-full-calendar-wrap .mec-next-month:hover span,
.mec-full-calendar-wrap .mec-next-month:hover i {
	color: #ffffff !important;
}

.mec-full-calendar-wrap .mec-previous-month:active,
.mec-full-calendar-wrap .mec-next-month:active {
	background-color: #1a4a3a !important;
	border-color: #1a4a3a !important;
	transform: scale(0.96) !important;
}

.mec-full-calendar-wrap .mec-previous-month:active,
.mec-full-calendar-wrap .mec-previous-month:active a,
.mec-full-calendar-wrap .mec-previous-month:active span,
.mec-full-calendar-wrap .mec-previous-month:active i,
.mec-full-calendar-wrap .mec-next-month:active,
.mec-full-calendar-wrap .mec-next-month:active a,
.mec-full-calendar-wrap .mec-next-month:active span,
.mec-full-calendar-wrap .mec-next-month:active i {
	color: #ffffff !important;
}

/* Keep topsec as block (former Elementor override). Do NOT force
 * .mec-calendar-table-head to block — that breaks table-layout:fixed and
 * lets day cells blow past the viewport (~650px in a ~335px column), which
 * enables overflow-x:scroll and clips the month nav button borders. */
.mec-full-calendar-wrap .mec-calendar .mec-calendar-topsec {
	display: block !important;
}

/* Month prev/next sit at top/left/right:0 inside an overflow clip — inset
 * so the 2px border is never flush with the scrollport edge. */
.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-previous-month,
.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-next-month,
.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-previous-month,
.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-next-month {
	position: absolute !important;
	top: 4px !important;
	box-sizing: border-box !important;
}

.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-previous-month,
.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-previous-month {
	left: 4px !important;
}

.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-next-month,
.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-next-month {
	right: 4px !important;
}

.mec-slider-t2-wrap,
.mec-owl-carousel .owl-stage-outer {
	border-radius: 15px;
}

@media (min-width: 1440px) {
	.mec-full-calendar-wrap .mec-totalcal-view {
		margin-top: -10px;
	}
}

/* -------------------------------------------------------------------------
 * Mobile — one field per line, full width
 * Desktop nth-child grid-column rules are more specific; must override them here.
 * ------------------------------------------------------------------------- */

@media (max-width: 991px) {
	.mec-full-calendar-wrap form.mec-dropdown-wrap {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		grid-auto-columns: minmax(0, 1fr) !important;
		column-gap: 0 !important;
		row-gap: 12px !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.mec-full-calendar-wrap .mec-checkboxes-search,
	.mec-full-calendar-wrap .mec-text-input-search,
	.mec-full-calendar-wrap .mec-date-search,
	.mec-full-calendar-wrap .mec-tab-loader,
	.mec-full-calendar-wrap .mec-search-reset-button,
	.mec-full-calendar-wrap .mec-dropdown-search,
	.mec-full-calendar-wrap .cns-mec-group-row,
	.mec-full-calendar-wrap .cns-mec-bb-group-sf.mec-dropdown-search,
	.mec-full-calendar-wrap .cns-mec-my-groups-cb,
	.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_location_"]),
	.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_organizer_"]) {
		grid-column: 1 / -1 !important;
		grid-row: auto !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		float: none !important;
		display: flex !important;
		box-sizing: border-box !important;
	}

	/* Stack order: Category → Group+My Groups → Location → Organizer → Text → Date → Tabs → Reset */
	.mec-full-calendar-wrap .mec-checkboxes-search { order: 1 !important; }
	.mec-full-calendar-wrap .cns-mec-group-row { order: 2 !important; }
	.mec-full-calendar-wrap form.mec-dropdown-wrap > .cns-mec-bb-group-sf.mec-dropdown-search { order: 2 !important; }
	.mec-full-calendar-wrap form.mec-dropdown-wrap > .cns-mec-my-groups-cb { order: 2 !important; }
	.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_location_"]) { order: 3 !important; }
	.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_organizer_"]) { order: 4 !important; }
	.mec-full-calendar-wrap .mec-text-input-search { order: 5 !important; }
	.mec-full-calendar-wrap .mec-date-search { order: 6 !important; }
	.mec-full-calendar-wrap .mec-tab-loader { order: 7 !important; }
	.mec-full-calendar-wrap .mec-search-reset-button { order: 8 !important; margin: 12px 0 4px !important; }

	.mec-full-calendar-wrap .cns-mec-group-row {
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 10px !important;
	}

	.mec-full-calendar-wrap .cns-mec-group-row .cns-mec-bb-group-sf,
	.mec-full-calendar-wrap .cns-mec-group-row .cns-mec-my-groups-cb {
		width: 100% !important;
		flex: 1 1 auto !important;
	}

	.mec-full-calendar-wrap .mec-checkboxes-search .mec-searchbar-category-wrap,
	.mec-full-calendar-wrap .mec-checkboxes-search .select2-container,
	.mec-full-calendar-wrap .mec-checkboxes-search .select2-container.select2-container--default {
		width: calc(100% - 40px) !important;
		max-width: calc(100% - 40px) !important;
	}

	.mec-full-calendar-wrap .mec-dropdown-search .select2-container,
	.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-container,
	.mec-full-calendar-wrap .cns-mec-bb-group-sf__select,
	.mec-full-calendar-wrap .mec-text-input-search input[type="search"] {
		width: calc(100% - 40px) !important;
		max-width: calc(100% - 40px) !important;
	}

	.mec-full-calendar-wrap .mec-date-search {
		flex-wrap: nowrap !important;
		height: auto !important;
		align-items: stretch !important;
	}

	.mec-full-calendar-wrap .mec-date-search .select2-container:first-of-type,
	.mec-full-calendar-wrap .mec-date-search .select2-container:last-of-type {
		width: calc((100% - 36px) / 2 - 4px) !important;
		max-width: calc((100% - 36px) / 2 - 4px) !important;
		margin-left: 0 !important;
		margin-bottom: 0 !important;
		flex: 1 1 auto !important;
		min-width: 0 !important;
	}

	.mec-full-calendar-wrap .mec-date-search .select2-container:last-of-type {
		margin-left: 8px !important;
	}

	.mec-full-calendar-wrap .mec-tab-loader,
	.mec-full-calendar-wrap .mec-totalcal-view {
		justify-content: flex-start !important;
		flex-wrap: wrap !important;
		height: auto !important;
		width: 100% !important;
	}

	.mec-full-calendar-wrap .mec-search-reset-button .mec-button,
	.mec-full-calendar-wrap button[id$="_reset"] {
		position: static !important;
		left: auto !important;
		right: auto !important;
		width: auto !important;
		max-width: 100% !important;
	}

	/* Keep monthly grid within the column so nav buttons aren't clipped
	 * by .mec-calendar { overflow-x: scroll }. MEC novel/simple skins set
	 * min-width: 650px !important under 768px — that is the root cause. */
	.mec-full-calendar-wrap .mec-calendar {
		max-width: 100% !important;
		overflow-x: hidden !important;
		box-sizing: border-box !important;
	}

	.mec-full-calendar-wrap .mec-calendar.mec-event-container-novel .mec-calendar-side,
	.mec-full-calendar-wrap .mec-calendar.mec-event-container-simple .mec-calendar-side,
	.mec-full-calendar-wrap .mec-event-container-novel .mec-calendar-side,
	.mec-full-calendar-wrap .mec-event-container-simple .mec-calendar-side,
	.mec-full-calendar-wrap .mec-calendar-side {
		min-width: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	.mec-full-calendar-wrap .mec-skin-monthly-view-month-navigator-container,
	.mec-full-calendar-wrap .mec-month-navigator,
	.mec-full-calendar-wrap .mec-calendar-header,
	.mec-full-calendar-wrap .mec-calendar-table,
	.mec-full-calendar-wrap .mec-calendar-table-head,
	.mec-full-calendar-wrap .mec-calendar dl {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	.mec-full-calendar-wrap .mec-calendar.mec-event-calendar-classic dl dt,
	.mec-full-calendar-wrap .mec-calendar dt {
		width: 14.2857% !important;
		max-width: 14.2857% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
	}

	.mec-full-calendar-wrap .mec-month-navigator {
		position: relative !important;
		min-height: 36px !important;
		overflow: visible !important;
		margin-bottom: 6px !important;
	}

	/*
	 * Month prev/next — icon-only on phone.
	 * Full month names ("September"/"November") at ~120px each crowd a 390px
	 * viewport; keep chevrons only so the current month heading stays primary.
	 */
	.mec-full-calendar-wrap .mec-previous-month,
	.mec-full-calendar-wrap .mec-next-month,
	.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-previous-month,
	.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-next-month,
	.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-previous-month,
	.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-next-month {
		padding: 6px 8px !important;
		min-width: 36px !important;
		max-width: 44px !important;
		width: 40px !important;
		font-size: 0 !important;
		line-height: 1 !important;
		border-width: 1.5px !important;
		gap: 0 !important;
		white-space: nowrap !important;
		overflow: hidden !important;
	}

	.mec-full-calendar-wrap .mec-previous-month a,
	.mec-full-calendar-wrap .mec-next-month a {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		font-size: 0 !important;
		line-height: 1 !important;
		width: 100% !important;
		min-height: 24px !important;
	}

	.mec-full-calendar-wrap .mec-previous-month i,
	.mec-full-calendar-wrap .mec-next-month i,
	.mec-full-calendar-wrap .mec-previous-month a i,
	.mec-full-calendar-wrap .mec-next-month a i {
		font-size: 16px !important;
		line-height: 1 !important;
		margin: 0 !important;
		speak: normal;
	}

	.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-previous-month,
	.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-previous-month {
		top: 2px !important;
		left: 2px !important;
	}

	.mec-full-calendar-wrap .mec-calendar .mec-calendar-side .mec-next-month,
	.mec-full-calendar-wrap .mec-box-calendar.mec-calendar.mec-event-calendar-classic .mec-calendar-side .mec-next-month {
		top: 2px !important;
		right: 2px !important;
	}
}

/* -------------------------------------------------------------------------
 * Tile view — multi-day date/time overlap + readable titles
 * Scope: Full Calendar Tile only (.mec-full-calendar-wrap).
 * MEC places multi-day time with position:absolute;top:50px under a fixed
 * 40px / ~185px date badge; narrow 4-col cards make date, time, and title collide.
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item .mec-event-title {
	line-height: 1.25 !important;
	overflow-wrap: anywhere;
	word-break: break-word;
	hyphens: auto;
}

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item .mec-event-loc-place,
.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item .mec-categories-wrapper,
.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item .mec-shortcode-organizers {
	overflow-wrap: anywhere;
	word-break: break-word;
	max-width: 100%;
}

/* Multi-day: stack date + time in normal flow; grow the color badge behind them. */
.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item.tile-multipleday-event .event-tile-view-head {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	gap: 2px !important;
	min-height: 56px !important;
	height: auto !important;
	margin-bottom: 28px !important;
	padding: 8px 10px !important;
	box-sizing: border-box !important;
	position: relative !important;
	z-index: 3 !important;
	max-width: calc(100% - 12px) !important;
}

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item.tile-multipleday-event .event-tile-view-head > div {
	display: block !important;
	position: static !important;
	float: none !important;
	width: auto !important;
	max-width: 100% !important;
}

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item.tile-multipleday-event .mec-start-date-label {
	display: inline-block !important;
	line-height: 1.2 !important;
	white-space: normal !important;
}

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item.tile-multipleday-event .mec-event-time {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	padding-top: 0 !important;
	margin: 0 !important;
	line-height: 1.2 !important;
	max-width: 100% !important;
	color: #fff !important;
}

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item.tile-multipleday-event .mec-event-time i {
	float: none !important;
	vertical-align: middle !important;
}

.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item.tile-multipleday-event:after {
	width: min(210px, calc(100% - 30px)) !important;
	height: auto !important;
	min-height: 64px !important;
	top: 28px !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

/* Narrow cards (tablet / 3-col desktop): keep single-day time from colliding with date badge. */
@media (max-width: 1200px) {
	.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item:not(.tile-multipleday-event) .event-tile-view-head {
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: baseline !important;
		gap: 6px 12px !important;
		min-height: 40px !important;
	}

	.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item:not(.tile-multipleday-event) .mec-event-time {
		position: static !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		padding-top: 0 !important;
		margin-left: auto !important;
	}
}

@media (max-width: 760px) {
	.mec-full-calendar-wrap .mec-event-tile-view article.mec-tile-item .mec-event-title {
		font-size: 20px !important;
	}
}
