/* Splide — carrousels Hermes3 (@splidejs/splide, init js-front.js) */

/* --- Galerie .splide-carousel (contenu libre + sections) --- */
.splide-carousel {
    --splide-carousel-arrow-size: 2.5rem;
    --splide-carousel-breakpoint: 992px;
    max-width: 100%;
}

@media (max-width: 991.98px) {
    .splide-carousel--fullwidth {
        width: 100vw;
        max-width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
    }

    .splide-carousel--ratio {
        --splide-carousel-height: min(62vw, 420px);
    }

    .splide-carousel:not(.splide-carousel--cards) .splide__track {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .splide-carousel:not(.splide-carousel--cards) .splide__slide {
        box-sizing: border-box;
        width: 100% !important;
        margin-right: 0 !important;
    }

    .splide-carousel--ratio .splide__slide img {
        border-radius: 0;
        box-shadow: none;
        width: 100%;
        max-width: none;
    }

    .post-content .splide-carousel img {
        margin-left: 0;
        margin-right: 0;
        max-width: none;
    }

    .splide-carousel--effect-focus .splide__slide:not(.is-active) img,
    .splide-carousel--effect-focus .splide__slide.is-active img {
        transform: none;
        opacity: 1;
    }
}

@media (min-width: 992px) {
    .splide-carousel .splide__slide {
        box-sizing: border-box;
    }

    .splide-carousel--effect-focus .splide__slide img {
        width: 100%;
        max-width: 100%;
        opacity: 1;
    }
}

.splide-carousel .splide__track {
    overflow: hidden;
}

.splide-carousel .splide__list {
    align-items: stretch;
}

.splide-carousel .splide__slide {
    display: flex;
    align-items: stretch;
}

.splide-carousel--natural .splide__list {
    align-items: center;
}

.splide-carousel--natural .splide__slide {
    display: flex;
    align-items: center;
    justify-content: center;
}

.hermes-front-sections .splide-carousel--natural {
    margin-block: 0;
    padding-block: 0;
}

.hermes-front-sections .splide-carousel--natural .splide__track,
.hermes-front-sections .splide-carousel--natural .splide__list,
.hermes-front-sections .splide-carousel--natural .splide__slide {
    margin-block: 0;
    padding-block: 0;
}

.hermes-front-sections .splide-carousel--natural .splide__list,
.hermes-front-sections .splide-carousel--natural .splide__slide {
    align-items: center;
}

.hermes-front-sections .splide-carousel--natural .splide__slide img {
    margin-block: 0;
}

.splide-carousel--natural .splide__slide a {
    display: block;
    width: 100%;
}

.splide-carousel--natural .splide__slide img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

@media (min-width: 992px) {
    .splide-carousel--natural .splide__track,
    .splide-carousel--natural .splide__list {
        height: auto !important;
    }

    .splide-carousel--natural .splide__list {
        align-items: center;
    }
}

.splide-carousel--ratio {
    --splide-carousel-height: min(56vw, 360px);
}

@media (min-width: 992px) {
    .splide-carousel--ratio {
        --splide-carousel-height: min(20vw, 260px);
    }
}

.splide-carousel--ratio .splide__slide img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: var(--splide-carousel-height);
    object-fit: cover;
    transition: opacity var(--splide-carousel-speed, 700ms) cubic-bezier(0.33, 1, 0.68, 1);
}

@media (min-width: 992px) {
    .splide-carousel--ratio:not(.splide-carousel--effect-fade) .splide__slide img {
        border-radius: var(--bs-border-radius);
    }
}

.splide-carousel--effect-focus .splide__slide:not(.is-active) img {
    opacity: 0.72;
}

.splide-carousel--effect-focus .splide__slide.is-active img {
    opacity: 1;
}

.splide-carousel--effect-peek .splide__slide:not(.is-active) img {
    opacity: 0.78;
}

.splide-carousel--effect-peek .splide__slide.is-active img {
    opacity: 1;
}

.splide-carousel .splide__arrow {
    top: 50%;
    width: var(--splide-carousel-arrow-size);
    height: var(--splide-carousel-arrow-size);
    background: color-mix(in srgb, var(--splide-carousel-accent, #0d6efd) 90%, #fff);
    opacity: 0.94;
    transform: translateY(-50%);
    transition: opacity 0.2s ease;
    z-index: 3;
    box-shadow: 0 0.15rem 0.65rem rgb(0 0 0 / 22%);
}

.splide-carousel .splide__arrow:hover:not(:disabled),
.splide-carousel .splide__arrow:focus-visible {
    opacity: 1;
    transform: translateY(-50%);
}

.splide-carousel .splide__arrow--prev {
    left: 0.75rem;
}

.splide-carousel .splide__arrow--next {
    right: 0.75rem;
}

/* Carrousels de cartes — gouttières CSS (pas padding Splide = pas d’aperçu latéral) */
.splide-carousel--cards {
    --splide-carousel-gutter: 3rem;
    --splide-carousel-arrow-inset: calc((var(--splide-carousel-gutter) - var(--splide-carousel-arrow-size)) / 2);
    box-sizing: border-box;
    padding-inline: var(--splide-carousel-gutter);
}

@media (max-width: 991.98px) {
    .splide-carousel--cards {
        --splide-carousel-gutter: 1.5rem;
    }
}

.splide-carousel--cards .splide__track {
    overflow: hidden;
}

.splide-carousel--cards .splide__arrow--prev {
    left: var(--splide-carousel-arrow-inset);
}

.splide-carousel--cards .splide__arrow--next {
    right: var(--splide-carousel-arrow-inset);
}

.splide-carousel--cards .splide__slide .card {
    width: 100%;
}

.splide-carousel .splide__arrow svg {
    fill: #fff;
}

.splide-carousel .splide__pagination {
    bottom: -2.25rem;
    left: 0;
    right: 0;
    padding: 0;
}

.splide-carousel .splide__pagination__page {
    background: color-mix(in srgb, var(--splide-carousel-accent, #6c757d) 35%, transparent);
    transition: background 0.25s ease;
}

.splide-carousel .splide__pagination__page.is-active {
    background: var(--splide-carousel-accent, #0d6efd);
    transform: none;
}

/* --- Hero plein écran .splide-carousel--hero-present --- */
.splide-carousel--hero-present {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    height: 100vh;
    max-height: 100vh;
    overflow: hidden;
    --splide-carousel-accent: var(--hermes-hero-accent, #6b9fd4);
}

.splide-carousel--hero-present .splide__track,
.splide-carousel--hero-present .splide__list,
.splide-carousel--hero-present .splide__slide {
    height: 100%;
}

.splide-carousel--hero-present .splide__slide {
    display: flex;
    align-items: stretch;
}

.splide-carousel--hero-present .splide__pagination {
    bottom: 1.35rem;
    padding: 0;
    z-index: 4;
}

.splide-carousel--hero-present .splide__pagination__page {
    background: color-mix(in srgb, var(--hermes-hero-text, #f4f6f8) 28%, transparent);
    opacity: 1;
}

.splide-carousel--hero-present .splide__pagination__page.is-active {
    background: var(--hermes-hero-accent, #6b9fd4);
    transform: scale(1.15);
}

.splide-carousel--hero-present .splide__track {
    z-index: 1;
}

.splide-carousel--hero-present .splide__arrows {
    z-index: 6;
    pointer-events: none;
}

.splide-carousel--hero-present .splide__arrow {
    z-index: 6;
    pointer-events: auto;
    background: color-mix(in srgb, var(--hermes-hero-bg-a, #0f1419) 72%, var(--hermes-hero-accent, #6b9fd4));
    border: 1px solid color-mix(in srgb, var(--hermes-hero-text, #f4f6f8) 18%, transparent);
    transition: opacity 0.22s ease, background 0.2s ease;
}

@media (max-width: 991.98px) {
    .splide-carousel--hero-present {
        height: 100svh !important;
        height: 100dvh !important;
        max-height: 100svh !important;
        max-height: 100dvh !important;
    }

    .splide-carousel--hero-present .splide__pagination {
        bottom: max(1.15rem, calc(env(safe-area-inset-bottom, 0px) + 0.85rem));
        z-index: 6;
    }

    .splide-carousel--hero-present .splide__arrow {
        opacity: 0 !important;
    }

    .splide-carousel--hero-present.is-arrows-active .splide__arrow,
    .splide-carousel--hero-present .splide__arrow:hover,
    .splide-carousel--hero-present .splide__arrow:focus-visible {
        opacity: 1 !important;
    }
}

/* --- Carte restaurant : slide Repas ↔ Boissons --- */
.hermes-carte-pages {
    width: min(100%, var(--hermes-carte-max));
    margin: clamp(0.85rem, 2.5vw, 1.25rem) auto clamp(1.5rem, 4vw, 2.5rem);
    padding: 0 clamp(0.5rem, 2.5vw, 1rem);
}

.hermes-carte-pages .splide__track {
    overflow: hidden;
}

.hermes-carte-pages .splide__slide {
    width: 100% !important;
}

.hermes-carte-pages .splide__arrow {
    width: 2.35rem;
    height: 2.35rem;
    background: color-mix(in srgb, var(--splide-carousel-accent, var(--hermes-carte-accent)) 92%, #fff);
    opacity: 0.94;
    box-shadow: 0 0.2rem 0.75rem rgb(0 0 0 / 18%);
}

.hermes-carte-pages .splide__arrow svg {
    fill: #fff;
}

.hermes-carte-pages .splide__arrow--prev {
    left: 0.15rem;
}

.hermes-carte-pages .splide__arrow--next {
    right: 0.15rem;
}

@media (min-width: 992px) {
    .hermes-carte-pages .splide__arrow--prev {
        left: -0.35rem;
    }

    .hermes-carte-pages .splide__arrow--next {
        right: -0.35rem;
    }
}
