/**
 * 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 .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 | 2 BB Group
 * 3 Location | 4 Organizer
 * 5 Text (full)
 * 6 Date | 7 View tabs
 * 8 Reset (after tabs)
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-checkboxes-search {
	grid-column: 1 / 2 !important;
	order: 1 !important;
	display: flex !important;
	align-items: stretch !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-bb-group-sf.mec-dropdown-search {
	grid-column: 2 / 3 !important;
	order: 2 !important;
	display: flex !important;
	align-items: stretch !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 + BB Group multiselect — equal height to Location/Organizer
 * Select2 often puts .select2-search as a sibling of the UL; width:100% on
 * the UL + a tall textarea made Category stretch and BB Group collapse.
 * ------------------------------------------------------------------------- */

.mec-full-calendar-wrap .mec-checkboxes-search .mec-searchbar-category-wrap {
	flex: 1 1 auto !important;
	width: calc(100% - 36px) !important;
	max-width: none !important;
	min-width: 0 !important;
	height: 36px !important;
	min-height: 36px !important;
	position: relative !important;
	box-sizing: border-box !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: hidden !important;
	min-height: 36px !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;
}

.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;
}

/* MEC sets height:0 on category multiple — lock to icon height (36px) */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple {
	height: 36px !important;
	min-height: 36px !important;
	max-height: 36px !important;
	width: 100% !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 6px !important;
	box-sizing: border-box !important;
	line-height: 34px !important;
}

/* BB Group multiselect — same 36px line as Location/Organizer + field chrome */
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection--multiple {
	height: 36px !important;
	min-height: 36px !important;
	max-height: 36px !important;
	width: 100% !important;
	border: 1px solid #efefef !important;
	border-radius: 0 var(--mec-secondary-border-radius, 3px) var(--mec-secondary-border-radius, 3px) 0 !important;
	box-shadow: none !important;
	background: #fff !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	overflow: hidden !important;
	margin: 0 0 0 -1px !important;
	padding: 0 6px !important;
	box-sizing: border-box !important;
	line-height: 34px !important;
	color: #777 !important;
	font-size: 13px !important;
}

.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection--single {
	background: #fff !important;
	border: 1px solid #efefef !important;
}

/* Choices UL — do NOT force 100% width (pushes sibling search onto next line) */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection__rendered,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection__rendered {
	display: flex !important;
	flex: 0 1 auto !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Search sits beside choices (or alone when empty) */
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection--multiple > .select2-search--inline,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection--multiple > .select2-search--inline,
.mec-full-calendar-wrap .mec-checkboxes-search .select2-selection__rendered > .select2-search--inline,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-selection__rendered > .select2-search--inline {
	flex: 1 1 auto !important;
	float: none !important;
	width: auto !important;
	min-width: 6em !important;
	margin: 0 !important;
	padding: 0 !important;
}

.mec-full-calendar-wrap .mec-checkboxes-search .select2-search--inline .select2-search__field,
.mec-full-calendar-wrap .cns-mec-bb-group-sf .select2-search--inline .select2-search__field,
.mec-full-calendar-wrap .mec-checkboxes-search textarea.select2-search__field,
.mec-full-calendar-wrap .cns-mec-bb-group-sf textarea.select2-search__field {
	margin: 0 !important;
	min-width: 6em !important;
	width: 100% !important;
	height: 34px !important;
	min-height: 34px !important;
	max-height: 34px !important;
	line-height: 34px !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	resize: none !important;
	overflow: hidden !important;
	vertical-align: middle !important;
}

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

/* -------------------------------------------------------------------------
 * Shared dropdown / text / date field widths (icon + control)
 * ------------------------------------------------------------------------- */

.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% - 36px) !important;
	max-width: calc(100% - 36px) !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: block !important;
}

.mec-full-calendar-wrap .mec-text-input-search input[type="search"] {
	width: calc(100% - 36px) !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% - 21px) !important;
}

.mec-full-calendar-wrap .mec-date-search .select2-container:last-of-type {
	width: calc(40% - 15px) !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: 36px !important;
	position: relative !important;
}

.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 36px;
	align-self: stretch;
}

/* 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-bb-group-sf.mec-dropdown-search,
	.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 → Location → Organizer → Group → Text → Date → Tabs → Reset */
	.mec-full-calendar-wrap .mec-checkboxes-search { order: 1 !important; }
	.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_location_"]) { order: 2 !important; }
	.mec-full-calendar-wrap .mec-dropdown-search:has([id^="mec_sf_organizer_"]) { order: 3 !important; }
	.mec-full-calendar-wrap .cns-mec-bb-group-sf.mec-dropdown-search { 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 .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% - 36px) !important;
		max-width: calc(100% - 36px) !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% - 36px) !important;
		max-width: calc(100% - 36px) !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: 44px !important;
		overflow: visible !important;
	}
}