/**
 * Chalets Grid Listing Styles
 * Copied from theme to ensure compatibility when theme is deactivated
 */

/* Z-index quand filtre sticky - classe add_z_index_sticky sur la section */
.add_z_index_sticky.chalet-sticky-z-active {
	z-index: 10000 !important;
	position: relative !important;
}

/* Bouton Recherche Mobile - sticky, centré, Montserrat (default bg #E8E2D2, color #907B5F) - sans animation gauche/droite */
.elementor-widget-chalets-grid .sticky-wrapper .filter_chalet_mobile.elementor-mobile-filter-btn,
.elementor-widget-chalets-grid .sticky-wrapper.is-sticky .filter_chalet_mobile.elementor-mobile-filter-btn,
#open-filter-chalets-grid {
	transition: none !important;
	animation: none !important;
}

/* Hide mobile filter button on desktop (>= 1024px), show only on mobile (< 1024px) */
.elementor-widget-chalets-grid .filter_chalet_mobile.elementor-mobile-filter-btn,
#open-filter-chalets-grid,
a#open-filter-chalets-grid,
.filter_chalet_mobile.elementor-mobile-filter-btn {
	display: none !important;
}

@media (max-width: 1023px) {
	.elementor-widget-chalets-grid .filter_chalet_mobile.elementor-mobile-filter-btn,
	.elementor-widget-chalets-grid .sticky-wrapper .filter_chalet_mobile.elementor-mobile-filter-btn,
	#open-filter-chalets-grid,
	a#open-filter-chalets-grid,
	.filter_chalet_mobile.elementor-mobile-filter-btn {
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 100%;
		/* max-width: 280px; */
		margin: 17px auto;
		padding: 10px 20px;
		border-radius: 10px;
		cursor: pointer;
		font-family: 'Montserrat', sans-serif;
		font-size: 16px;
		font-weight: 600;
		line-height: 24px;
		text-align: center;
		transition: none !important;
		animation: none !important;
	}
	.elementor-widget-chalets-grid .filter_chalet_mobile.elementor-mobile-filter-btn i,
	.elementor-widget-chalets-grid .sticky-wrapper .filter_chalet_mobile.elementor-mobile-filter-btn i {
		margin-right: 15px;
	}
	.elementor-widget-chalets-grid .sticky-wrapper.is-sticky .filter_chalet_mobile.elementor-mobile-filter-btn {
		left: 50%;
		transform: translateX(-50%);
		transition: none !important;
		animation: none !important;
	}
}

/* Dispo listing mobile - Chalets Grid widget (thème utilise .listing_chalets, ici .elementor-widget-chalets-grid) */
@media (max-width: 1023px) {
	.elementor-widget-chalets-grid .dispo-form.dispo-listing {
		padding: 0 19px;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .offcanvas-header-mobile {
		display: none;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing form > div:first-child {
		padding: 0 19px;
		margin-bottom: 10px;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing form > div:first-child .dispo-input {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
		margin-bottom: 10px;
		padding: 15px 20px;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .trigger-filters-mobile {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		height: 75px;
		cursor: pointer;
		margin-bottom: 0;
		border: 1px solid #000;
		border-radius: 8px;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .trigger-filters-mobile > span:not(.button) {
		display: flex;
		align-items: center;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .trigger-filters-mobile span.button {
		display: flex !important;
		background: #B09E86;
		color: #8d785c;
		font-weight: 600;
		border-radius: 100%;
		width: 26px;
		height: 26px;
		line-height: 26px;
		border: none;
		align-items: center;
		justify-content: center;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .trigger-filters-mobile.open {
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
		border-bottom: none;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .filters {
		display: none;
		margin: 0 19px;
		border: 1px solid #000;
		border-top: none;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		padding: 20px;
		position: relative;
		top: -1px;
		z-index: 9;
		background: #fff;
	}
	.elementor-widget-chalets-grid .dispo-form.dispo-listing .trigger-filters-desktop {
		display: none !important;
	}
}

/* Datepicker - z-index au-dessus du sticky, position via JS pour sticky filter */
body:has(.elementor-chalets-grid) #ui-datepicker-div {
	z-index: 9999999999 !important;
}
@media (max-width: 767px) {
	body:has(.elementor-chalets-grid) #ui-datepicker-div {
		left: 35px !important;
		width: calc(100vw - 70px) !important;
		right: 36px !important;
	}
}

.listing-chalets {
	padding-top: 25px;
	padding-bottom: 140px;
}

.listing-chalets .found-post-text {
	font-size: 24px;
	font-weight: 600;
	color: #fff;
	padding-bottom: 25px;
}

@media (max-width: 575px) {
	.listing-chalets .found-post-text {
		font-size: 18px;
	}
}

.nos_chalet_listing_placeholder {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.nos_chalet_listing_items {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	margin: 0;
	width: 100%;
	justify-content: center;
}

.nos_chalet_listing_items > * {
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) * 0.5);
	padding-left: calc(var(--bs-gutter-x) * 0.5);
	margin-top: var(--bs-gutter-y);
}

@media (max-width: 767px) {
	.nos_chalet_listing_items > * {
		width: 100%;
	}
}

.chalet-item-wrap {
	position: relative;
}

.chalet-item-wrap.col-md-4 {
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
}

@media (max-width: 991px) {
	.chalet-item-wrap.col-md-4 {
		flex: 0 0 50%;
		max-width: 50%;
	}
}

@media (max-width: 767px) {
	.chalet-item-wrap.col-md-4 {
		flex: 0 0 100%;
		max-width: 100%;
	}
}

.chalet-item {
	position: relative;
}

.chalet-image-wrap {
	position: relative;
}

.chalet-image {
	position: relative;
	overflow: hidden;
}

.chalet-image-item {
	position: relative;
	background: #e8e8e8;
	min-height: 180px;
}

.chalet-image-item img {
	width: 100%;
	height: auto;
	display: block;
}

/* Pagination Styles */
.listing-chalets .ajax-pagination {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	padding-top: 1rem;
	position: relative;
	transition: all 0.35s;
	margin-bottom: 2rem;
}

.listing-chalets .ajax-pagination.loading::before {
	content: "";
	width: 100%;
	height: 100%;
	display: block;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	z-index: -1;
	left: 0;
	top: 0;
}

/* Loading states - override theme styles */
.nos_chalet_listing_placeholder.loading .chalet-item-wrap .chalet-item::before {
	display: block !important;
}

.nos_chalet_listing_placeholder.loading .chalet-item-wrap .chalet-item::after {
	opacity: 1 !important;
	visibility: visible !important;
	z-index: 101 !important;
}

/* Hide loading when class is removed */
.nos_chalet_listing_placeholder:not(.loading) .chalet-item-wrap .chalet-item::before {
	display: none !important;
}

.nos_chalet_listing_placeholder:not(.loading) .chalet-item-wrap .chalet-item::after {
	opacity: 0 !important;
	visibility: hidden !important;
	z-index: -1 !important;
}

.listing-chalets .ajax-pagination .pagination-prev,
.listing-chalets .ajax-pagination .pagination-next {
	display: flex;
	width: 36px;
	height: 36px;
	background-color: #8d785c;
	border-radius: 100%;
	font-size: 0.75rem;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-decoration: none;
	cursor: pointer;
}

.listing-chalets .ajax-pagination .pagination-prev:hover,
.listing-chalets .ajax-pagination .pagination-next:hover {
	opacity: 1;
	background-color: #b09e86;
}

.listing-chalets .ajax-pagination .pagination-prev.disabled,
.listing-chalets .ajax-pagination .pagination-next.disabled {
	opacity: 0.5;
	cursor: default;
	pointer-events: none;
}

.listing-chalets .ajax-pagination .pagination-prev {
	padding-right: 3px;
	margin-right: auto;
}

.listing-chalets .ajax-pagination .pagination-next {
	padding-left: 3px;
	margin-left: auto;
}

.listing-chalets .ajax-pagination .pagination-numbers {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	font-size: 1.2rem;
}

.listing-chalets .ajax-pagination .pagination-numbers .pagination-number {
	display: block;
	visibility: hidden;
	opacity: 0;
	padding: 0;
	font-size: 0;
	font-weight: 600;
	color: #fff;
	transition: all 0.35s;
	text-decoration: none;
	margin: 0 5px;
}

.listing-chalets .ajax-pagination .pagination-numbers .pagination-number.visible {
	font-size: 1.3rem;
	visibility: visible;
	padding: 3px 8px;
	opacity: 1;
}

.listing-chalets .ajax-pagination .pagination-numbers .pagination-number.current {
	text-decoration: underline;
	cursor: default;
}

.listing-chalets .ajax-pagination .pagination-numbers .pagination-number:hover {
	opacity: 1;
	color: #8d785c;
	text-decoration: underline;
}

@media (max-width: 767px) {
	.listing-chalets .ajax-pagination {
		width: 100%;
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		padding: 1rem 0.5rem;
		gap: 10px;
	}

	.listing-chalets .ajax-pagination .pagination-prev,
	.listing-chalets .ajax-pagination .pagination-next {
		width: 36px;
		height: 36px;
		flex-shrink: 0;
		font-size: 0.75rem;
	}

	.listing-chalets .ajax-pagination .pagination-numbers {
		flex: 1;
		min-width: 0;
		gap: 5px;
	}

	.listing-chalets .ajax-pagination .pagination-numbers .pagination-number {
		font-size: 1rem;
		padding: 3px 8px;
		margin: 0 2px;
		min-width: 30px;
	}
}

/* Elementor Chalets Grid - CSS Grid layout */
.elementor-chalets-grid .nos_chalet_listing_placeholder {
	display: block !important;
	width: 100%;
	margin: 0;
}

.elementor-chalets-grid .nos_chalet_listing_items {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	gap: 20px;
	justify-items: stretch;
	align-items: stretch;
	justify-content: start;
	box-sizing: border-box;
}

@media (max-width: 767px) {
	.elementor-chalets-grid article.chalet-item-wrap.col-md-4 {
		display: flex;
		justify-content: center;
	}
	.elementor-chalets-grid .col-md-12.found-post-text {
		justify-content: center;
		display: flex;
	}
}

@media (max-width: 1024px) {
	.elementor-chalets-grid .nos_chalet_listing_placeholder {
		display: flex !important;
		justify-content: center !important;
	}
	.elementor-chalets-grid .nos_chalet_listing_items {
		justify-content: center;
		justify-items: center;
		margin: 0 auto;
	}
	.elementor-chalets-grid .nos_chalet_listing_items > * {
		justify-self: center;
		margin-left: auto !important;
		margin-right: auto !important;
	}
}

.elementor-chalets-grid .nos_chalet_listing_items > * {
	margin: 0 !important;
	padding: 0 !important;
	min-width: 0 !important;
	box-sizing: border-box;
}

/* Override Bootstrap col-md-4 (flex: 0 0 auto; width: 33.33%) - grid defines layout */
.elementor-chalets-grid .nos_chalet_listing_items .col-md-4,
.elementor-chalets-grid .nos_chalet_listing_items .chalet-item-wrap.col-md-4 {
	flex: none !important;
	width: 100% !important;
	max-width: 100% !important;
}

@media (min-width: 768px) {
	.elementor-chalets-grid .nos_chalet_listing_items .col-md-4,
	.elementor-chalets-grid .nos_chalet_listing_items .chalet-item-wrap.col-md-4 {
		flex: none !important;
		width: 100% !important;
		max-width: 100% !important;
	}
}

.elementor-chalets-grid .chalet-item {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

.elementor-chalets-grid .chalet-image-wrap {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.elementor-chalets-grid .chalet-image {
	width: 100%;
	overflow: hidden;
}

.elementor-chalets-grid .chalet-image-item {
	width: 100%;
}

.elementor-chalets-grid .chalet-image-item img {
	width: 100%;
	height: auto;
	display: block;
}