/**
 * ============================================
 * SLIDER-PROJET.CSS - ELSO.FR
 * ============================================
 * Styles pour les sliders de projets (images + vidéos) sur la page d'accueil
 * Note: Les curseurs custom sont définis dans style.css
 */

/* ========================================
   Slider Navigation Zones
======================================== */

/* Fix pour z-index - garantit que les flèches apparaissent toujours */
.slider-nav-zone {
    z-index: 50;
    position: absolute;
}

/* ========================================
   Slider Track & Animations
======================================== */

.slider-track {
    transition: transform 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Isolation pour éviter les conflits de z-index */
.slider-container {
    isolation: isolate;
}

/* ========================================
   Slider Indicators
======================================== */

.slider-indicators {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    align-items: center;
}

.slider-indicators > div {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
    background-color: white;
    transition: opacity 0.3s ease;
}

/* ========================================
   Optimisation Performance
======================================== */

/* Will-change pour optimiser les animations */
.slider-track {
    will-change: transform;
}

/* GPU acceleration pour les slides */
.slider-track > div {
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}