.slider-simple {
position: relative;
width: 100%;
margin: var(--wp--preset--spacing--3) 0;
}
.slider-simple-container {
position: relative;
display: flex;
align-items: center;
gap: var(--wp--preset--spacing--1);
}
.slider-simple .swiper {
flex: 1;
overflow: hidden;
}
.slider-simple .swiper-wrapper {
display: flex;
}
.slider-simple .swiper-slide {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.slider-simple-image-container {
position: relative;
width: 100%;
aspect-ratio: var(--aspect-ratio, 16/9);
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
}
.slider-simple-image {
max-width: 100%;
max-height: 100%;
object-fit: contain;
object-position: center;
border-radius: 50px;
}
.slider-simple-caption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
color: var(--wp--preset--color--custom-blanc);
padding: var(--wp--preset--spacing--1);
font-size: var(--wp--preset--font-size--1);
line-height: 1.4;
} .slider-simple-nav {
display: flex;
align-items: center;
justify-content: center;
width: 41px;
height: 41px;
background: var(--wp--preset--color--custom-blanc);
border-radius: 50%;
cursor: pointer;
z-index: 10;
}
.slider-simple-nav.swiper-button-disabled {
opacity: 0.5;
cursor: not-allowed;
}
.slider-simple-nav .nav-arrow {
width: 100%;
height: 100%;
}
.slider-simple-prev .nav-arrow {
transform: rotate(180deg);
} .slider-simple .swiper-pagination {
position: relative;
margin-top: var(--wp--preset--spacing--2);
text-align: center;
}
.slider-simple .swiper-pagination-bullet {
width: 12px;
height: 12px;
background: var(--wp--preset--color--custom-beige-1);
opacity: 1;
margin: 0 4px;
}
.slider-simple .swiper-pagination-bullet-active {
background: var(--wp--preset--color--custom-bleu);
} .slider-simple-placeholder {
padding: var(--wp--preset--spacing--4) var(--wp--preset--spacing--3);
text-align: center;
background: var(--wp--preset--color--custom-beige-2);
border: 2px dashed var(--wp--preset--color--custom-beige-1);
border-radius: 50px;
color: var(--wp--preset--color--custom-noir);
}
.slider-simple-placeholder p {
margin: 0;
font-style: italic;
}
@media (max-width: 768px) {
.slider-simple-nav {
width: 32px;
height: 32px;
}
.slider-simple-container {
display: flex;
flex-flow: wrap;
justify-content: center;
align-items: center;
}
.slider-simple .swiper {
width: 100%;
flex: 100%;
}
.slider-simple-container .slider-simple-nav:first-child {
order: 2;
}
.slider-simple-container .slider-simple-nav:last-child {
order: 3;
}
}