.swiper-content {
	--swiper-navigation-size: var(--wp--preset--spacing--40) !important;
	--swiper-theme-color: white;
	--swiper-pagination-bullet-height: 4px;
	--swiper-pagination-bullet-inactive-opacity: 0.3;
	--swiper-pagination-bullet-inactive-color: white;
	--swiper-pagination-bullet-border-radius: 24px;

	position: relative;
	width: 100%;
	max-width: 100% !important;
	overflow: hidden;
	border-radius: 24px;
}

.swiper-button-prev-content,
.swiper-button-next-content {
	position: relative !important;
	inset: 0 !important;
	width: 44px !important;
	height: 44px !important;
	border: 1px solid rgb(255 255 255 / 20%);
	border-radius: 50%;
	background-color: rgb(255 255 255 / 10%);
	color: white;
	transition: background-color 0.3s ease-in-out;
}

.swiper-button-prev-content:hover,
.swiper-button-next-content:hover {
	background-color: rgb(255 255 255 / 20%);
}

.swiper-content .swiper-slide {
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 100%;
	height: auto;
}

.swiper-content--controls > * {
	margin: 0 !important;
}

.swiper-pagination-content > * {
	flex: 1;
	transition: all 0.3s ease-in-out;
}

.swiper-content .swiper-slide > * {
	flex: 1;
	height: 100%;
}

.swiper-content .wp-block-cover__inner-container {
	height: 100%;
}

.swiper-content .wp-block-cover {
	max-width: 100%;
}

.swiper-content--controls {
	position: absolute;
	bottom: 0;
	left: 50%;
	z-index: 10;
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	width: 100%;
	padding: var(--wp--preset--spacing--40);
	transform: translateX(-50%);
}

.swiper-pagination-content {
	position: relative !important;
	inset: 0 !important;
	display: flex;
	flex: 1;
	justify-content: center;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
}

.swiper-content:has(.swiper-slide.swiper-slide-active.has-background)
	.swiper-content--controls
	.swiper-button-prev-content,
.swiper-content:has(.swiper-slide.swiper-slide-active.has-background)
	.swiper-content--controls
	.swiper-button-next-content {
	background-color: var(--wp--preset--color--custom-bleu-fonc);
}

.swiper-content:has(.swiper-slide.swiper-slide-active.has-background) {
	--swiper-pagination-color: var(--wp--preset--color--custom-bleu-fonc);
	--swiper-pagination-bullet-inactive-color: var(
		--wp--preset--color--custom-gris-clair
	);
}
