
.swiper {
    width: 100%;
}

.swiper[data-overflow="visible"] {
    overflow: visible;
}

/* Rogne les slides qui débordent d'un côté (quand overflow est visible) */
.swiper.clip-left {
    clip-path: inset(-100vh -100vh -100vh 0);
}

.swiper.clip-right {
    clip-path: inset(-100vh 0 -100vh -100vh);
}

.swiper.clip-both {
    clip-path: inset(-100vh 0 -100vh 0);
}

.swiper .swiper-wrapper {
    display: flex;
    flex-wrap: nowrap;
    gap: 0 !important;
}

/* Éditeur Gutenberg : empile les slides verticalement pour faciliter l'édition */
.editor-styles-wrapper .swiper .swiper-wrapper {
    flex-direction: column;
}

/* En flex-column, les marges auto injectées par .is-layout-constrained
   désactivent le stretch transverse et écrasent les slides à min-content (~2px).
   On les neutralise pour rétablir la largeur pleine. */
.editor-styles-wrapper .swiper .swiper-wrapper > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none;
}

/* Nav + Pagination */
.swiper-nav {
    display: flex;
    align-items: center;
    margin-top: .5rem;
}

.swiper-nav .swiper-buttons {
    display: flex;
    gap: .5rem;
    margin-top: .5rem;
}

.swiper .swiper-buttons>* {
    font-size: 1.5rem;
    padding: .5rem;
    line-height: 1;
    border-radius: 2rem;
    color: var(--theme-palette-color-3);
    background: var(--theme-palette-color-1);
    cursor: pointer;
}

@media (max-width: 992px) {
    .swiper-nav,
    .swiper:has(.slider) .swiper-nav {
        justify-content: center !important;
    }
    .swiper-nav .swiper-buttons {
        display: none;
    }
}

.swiper .swiper-nav:has(.swiper-button-lock) {
    display: none;
}

/* ===========================
    Nav position (absolute)
    Drives .swiper-buttons placement via data-nav-position on .swiper.
   =========================== */
.swiper[data-nav-position]:not([data-nav-position="default"]) {
    position: relative;
}

/* Corner positions: keep both arrows grouped, anchor to the chosen corner */
.swiper[data-nav-position="bottom-left"] .swiper-buttons,
.swiper[data-nav-position="bottom-right"] .swiper-buttons,
.swiper[data-nav-position="top-left"] .swiper-buttons,
.swiper[data-nav-position="top-right"] .swiper-buttons {
    position: absolute;
    z-index: 10;
    margin: 0;
}
.swiper[data-nav-position="bottom-left"]  .swiper-buttons { bottom: 1rem; left: 1rem; }
.swiper[data-nav-position="bottom-right"] .swiper-buttons { bottom: 1rem; right: 1rem; }
.swiper[data-nav-position="top-left"]     .swiper-buttons { top: 1rem;    left: 1rem; }
.swiper[data-nav-position="top-right"]    .swiper-buttons { top: 1rem;    right: 1rem; }

/* Sides: split arrows on each edge, vertically centered on .swiper-wrapper */
.swiper[data-nav-position="sides"] .swiper-buttons,
.swiper[data-nav-position="sides-hover"] .swiper-buttons {
    display: contents;
}
.swiper[data-nav-position="sides"] .swiper-prev,
.swiper[data-nav-position="sides"] .swiper-next,
.swiper[data-nav-position="sides-hover"] .swiper-prev,
.swiper[data-nav-position="sides-hover"] .swiper-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
}
.swiper[data-nav-position="sides"]       .swiper-prev,
.swiper[data-nav-position="sides-hover"] .swiper-prev { left: 1rem; }
.swiper[data-nav-position="sides"]       .swiper-next,
.swiper[data-nav-position="sides-hover"] .swiper-next { right: 1rem; }

/* Hover variant: arrows only fade in on hover/focus */
.swiper[data-nav-position="sides-hover"] .swiper-prev,
.swiper[data-nav-position="sides-hover"] .swiper-next {
    opacity: 0;
    transition: opacity 0.2s ease;
}
.swiper[data-nav-position="sides-hover"]:hover .swiper-prev,
.swiper[data-nav-position="sides-hover"]:hover .swiper-next,
.swiper[data-nav-position="sides-hover"]:focus-within .swiper-prev,
.swiper[data-nav-position="sides-hover"]:focus-within .swiper-next {
    opacity: 1;
}

/* When arrows escape, collapse the .swiper-nav spacing so it doesn't add padding
   below the slides. Do NOT hide it: the arrows still live inside it (they are
   position:absolute / display:contents), so display:none would hide them too. */
.swiper[data-nav-position]:not([data-nav-position="default"]) .swiper-nav:not(:has(.swiper-pagination)) {
    margin-top: 0;
    padding: 0;
}

/* Pagination */
section .swiper-pagination {
    position: relative;
    top: unset;
    bottom: unset;
    z-index: 2;
    width: auto;
}

section .swiper-nav svg {
    fill: currentColor;
}

/* ===========================
    Hauteur égale des slides
    data-equal-height="true" + --cora-slide-height sur .swiper.
    Largeur auto (pilotée par le ratio de l'image), hauteur commune fixe.
   =========================== */
.swiper[data-equal-height="true"] .swiper-slide {
    width: auto;
    height: var(--cora-slide-height, 320px);
}

/* Les wrappers d'image (figure / .wp-block-image) remplissent la hauteur du slide */
.swiper[data-equal-height="true"] .swiper-slide :where(figure, .wp-block-image) {
    height: 100%;
    margin: 0;
}

/* L'image garde son ratio : hauteur pleine, largeur auto → 3/4 étroit, 16/9 large */
.swiper[data-equal-height="true"] .swiper-slide :where(figure, .wp-block-image) img,
.swiper[data-equal-height="true"] .swiper-slide > img {
    height: 100%;
    width: auto;
    max-width: none;
}

/* Éditeur : slides empilées en colonne, on neutralise la hauteur/largeur forcées */
.editor-styles-wrapper .swiper[data-equal-height="true"] .swiper-slide {
    width: auto;
    height: auto;
}
.editor-styles-wrapper .swiper[data-equal-height="true"] .swiper-slide :where(figure, .wp-block-image) img,
.editor-styles-wrapper .swiper[data-equal-height="true"] .swiper-slide > img {
    height: auto;
    width: 100%;
}

/* Coverflow */
.coverflow.swiper {
    border-radius: 1.5rem;
    overflow: hidden;
}

.coverflow.swiper .swiper-slide {
    /* width: auto !important; */
    height: auto;
    /* flex: 0 1 240px; 
    min-width: 240px; */
    transition: flex 0.4s ease;
}

/* .coverflow.swiper .swiper-slide-active {
    flex: 1 1 auto;
} */