/**
 * MedicMarket Rentals - Carousel Styles
 * Complete Swiper structure, slides, navigation controls, responsive layout and Elementor preview.
 */

/* ── Estructura del Contenedor del Carrusel ── */
.medicmarket-rentals-carousel-wrapper {
	--medicmarket-rentals-gap: var(--grid-columns-gap, 30px);
	position: relative;
	padding: 0 40px;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper {
	margin: -12px 0 -18px;
	overflow: hidden;
	padding: 12px 0 18px;
	width: 100%;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper .swiper-wrapper {
	box-sizing: content-box;
	display: flex;
	flex-wrap: nowrap !important;
	gap: var(--medicmarket-rentals-gap);
	position: relative;
	transition-property: transform;
	width: 100%;
	z-index: 1;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper.swiper-initialized .swiper-wrapper {
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
	transition-timing-function: linear;
}

/* ── Tarjetas de Producto dentro del Carrusel ── */
.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper .swiper-slide {
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	border-radius: 12px;
	background-color: #ffffff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	height: auto;
	overflow: hidden;
	padding: 16px;
	margin-left: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease !important;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper .swiper-slide:hover {
	border-color: rgba(0, 0, 0, 0.15) !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
	transform: translateY(-6px) !important;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper .product {
	margin-bottom: 0 !important;
}

/* ── Reglas preventivas previas a la inicialización de JS (sin FOUC) ── */
.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper:not(.swiper-initialized) li.product.swiper-slide {
	flex: 0 0 100%;
	width: 100%;
}

@media (min-width: 600px) {
	.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper:not(.swiper-initialized) li.product.swiper-slide {
		flex-basis: calc((100% - var(--grid-columns-gap, 30px)) / 2);
		width: calc((100% - var(--grid-columns-gap, 30px)) / 2);
	}
}

@media (min-width: 1000px) {
	.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper:not(.swiper-initialized) li.product.swiper-slide {
		flex-basis: calc((100% - (var(--grid-columns-gap, 30px) * 2)) / 3);
		width: calc((100% - (var(--grid-columns-gap, 30px) * 2)) / 3);
	}
}

@media (min-width: 1200px) {
	.medicmarket-rentals-carousel-wrapper .medicmarket-rentals-swiper:not(.swiper-initialized) li.product.swiper-slide {
		flex-basis: calc((100% - (var(--grid-columns-gap, 30px) * 3)) / 4);
		width: calc((100% - (var(--grid-columns-gap, 30px) * 3)) / 4);
	}
}

/* ── Botones de Navegación (Prev / Next) ── */
.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-prev,
.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-next {
	background: #ffffff !important;
	border: 1px solid #e1e8ed !important;
	border-radius: 50% !important;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05) !important;
	color: var(--theme-palette-color-1, #0164b0) !important;
	height: 32px !important;
	transition: all 0.2s ease !important;
	width: 32px !important;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-prev::after,
.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-next::after {
	font-size: 12px !important;
	font-weight: 700 !important;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-prev:hover,
.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-next:hover {
	background: var(--theme-palette-color-1, #0164b0) !important;
	border-color: var(--theme-palette-color-1, #0164b0) !important;
	box-shadow: 0 4px 10px rgba(1, 100, 176, 0.2) !important;
	color: #ffffff !important;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-prev {
	left: 0 !important;
}

.medicmarket-rentals-carousel-wrapper .medicmarket-swiper-next {
	right: 0 !important;
}

/* ── Compatibilidad con Editor y Preview de Elementor ── */
.medicmarket-rentals-carousel-wrapper.is-elementor-preview {
	padding: 0 40px;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview .medicmarket-rentals-swiper {
	overflow: hidden;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview .swiper-wrapper {
	display: flex !important;
	gap: var(--grid-columns-gap, 30px) !important;
	flex-wrap: nowrap !important;
	transform: none !important;
	transition: none !important;
	width: 100%;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview .swiper-slide {
	flex: 0 0 calc((100% - (var(--grid-columns-gap, 30px) * (var(--medicmarket-preview-columns, 4) - 1))) / var(--medicmarket-preview-columns, 4)) !important;
	margin: 0 !important;
	width: calc((100% - (var(--grid-columns-gap, 30px) * (var(--medicmarket-preview-columns, 4) - 1))) / var(--medicmarket-preview-columns, 4)) !important;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product figure,
.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product .ct-media-container {
	aspect-ratio: 1 / 1;
	display: block !important;
	margin-bottom: 20px;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product figure > a,
.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product .ct-media-container > a {
	display: block !important;
	height: 100%;
	position: relative;
	width: 100%;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product figure img,
.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product .ct-media-container img {
	display: none !important;
}

.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product figure img:first-of-type,
.medicmarket-rentals-carousel-wrapper.is-elementor-preview li.product .ct-media-container img:first-of-type {
	display: block !important;
	height: 100% !important;
	object-fit: contain;
	width: 100% !important;
}

@media (max-width: 999.98px) {
	.medicmarket-rentals-carousel-wrapper.is-elementor-preview {
		--medicmarket-preview-columns: var(--medicmarket-preview-tablet-cols, 3) !important;
	}
}

@media (max-width: 689.98px) {
	.medicmarket-rentals-carousel-wrapper.is-elementor-preview {
		--medicmarket-preview-columns: var(--medicmarket-preview-mobile-cols, 1) !important;
	}
}