/**
 * Lycée Image Slider – styles
 */

.lycee-image-slider-wrap {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #f5f5f5;
    padding: 0 20px;
}

.lycee-image-slider-wrap .lycee-image-slider {
    width: 100%;
}

.lycee-image-slider-wrap .lycee-slider-slide {
    outline: none;
}

/* Espace entre les slides */
.lycee-image-slider-wrap .lycee-image-slider .slick-list {
    margin: 0 -8px;
}
.lycee-image-slider-wrap .lycee-image-slider .slick-slide {
    margin: 0 8px;
}

.lycee-image-slider-wrap .lycee-slider-slide img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

/* Hauteur fixe (height="400px" ou height="50vh") : les images remplissent le slide */
.lycee-slider-fixed-height .lycee-image-slider .slick-list,
.lycee-slider-fixed-height .lycee-image-slider .slick-track {
    height: 100%;
}
.lycee-slider-fixed-height .lycee-slider-slide {
    display: flex;
    align-items: stretch;
    height: 100%;
}
.lycee-slider-fixed-height .lycee-slider-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Flèches */
.lycee-image-slider-wrap .lycee-slider-prev,
.lycee-image-slider-wrap .lycee-slider-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.lycee-image-slider-wrap .lycee-slider-prev:hover,
.lycee-image-slider-wrap .lycee-slider-next:hover {
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
}

.lycee-image-slider-wrap .lycee-slider-prev {
    left: 12px;
}

.lycee-image-slider-wrap .lycee-slider-next {
    right: 12px;
}

/* Masquer les flèches par défaut de Slick (on utilise les nôtres) */
.lycee-image-slider-wrap .lycee-image-slider .slick-arrow {
    display: none !important;
}

/* Dots */
.lycee-image-slider-wrap .lycee-image-slider.slick-dotted {
    margin-bottom: 28px;
}

.lycee-image-slider-wrap .lycee-image-slider .slick-dots {
    bottom: -28px;
}

.lycee-image-slider-wrap .lycee-image-slider .slick-dots li button:before {
    font-size: 10px;
    opacity: 0.5;
}

.lycee-image-slider-wrap .lycee-image-slider .slick-dots li.slick-active button:before {
    opacity: 1;
}