/* ============================================================
   FullPage Sections for Elementor — assets/css/fullpage.css
   ============================================================ */

:root {
    --fpse-duration: 800ms;
    --fpse-easing: cubic-bezier(0.645, 0.045, 0.355, 1);
}

/* ---------- Base ---------- */
body.fp-enabled {
    overflow: hidden;
    background: #000;
}

.fpse-section {
    z-index: 1;
    pointer-events: none;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.fpse-section::-webkit-scrollbar {
    display: none;
}

.fpse-section[data-state="current"] {
    z-index: 10;
    pointer-events: auto;
}

/* Conteneurs Elementor modernes */
.fpse-section.e-con {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
}

/* ---------- Transition "slide" (vertical par défaut) ---------- */
body.fp-transition-slide .fpse-section {
    transition: transform var(--fpse-duration) var(--fpse-easing);
}
body.fp-transition-slide .fpse-section[data-state="above"]   { transform: translateY(-100vh); }
body.fp-transition-slide .fpse-section[data-state="current"] { transform: translateY(0); }
body.fp-transition-slide .fpse-section[data-state="below"]   { transform: translateY(100vh); }

/* ---------- Transition "fade" ---------- */
body.fp-transition-fade .fpse-section {
    transition: opacity var(--fpse-duration) var(--fpse-easing);
    opacity: 0;
    pointer-events: none;
}
body.fp-transition-fade .fpse-section[data-state="current"] {
    opacity: 1;
    pointer-events: auto;
}

/* ---------- Transition "fadeUp" ---------- */
body.fp-transition-fadeUp .fpse-section {
    transition: opacity var(--fpse-duration) var(--fpse-easing),
                transform var(--fpse-duration) var(--fpse-easing);
    opacity: 0;
    transform: translateY(40px);
    pointer-events: none;
}
body.fp-transition-fadeUp .fpse-section[data-state="current"] {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* ---------- Transition "zoom" ---------- */
body.fp-transition-zoom .fpse-section {
    transition: opacity var(--fpse-duration) var(--fpse-easing),
                transform var(--fpse-duration) var(--fpse-easing);
    opacity: 0;
    transform: scale(1.3);
    pointer-events: none;
}
body.fp-transition-zoom .fpse-section[data-state="current"] {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}

/* ---------- Transition "flip" (3D) ---------- */
body.fp-transition-flip .fpse-section {
    transition: transform var(--fpse-duration) var(--fpse-easing),
                opacity var(--fpse-duration) var(--fpse-easing);
    transform-origin: center center;
    backface-visibility: hidden;
    opacity: 0;
    transform: rotateX(-90deg);
    pointer-events: none;
}
body.fp-transition-flip .fpse-section[data-state="current"] {
    opacity: 1;
    transform: rotateX(0);
    pointer-events: auto;
}
body.fp-transition-flip .fpse-section[data-state="above"] {
    transform: rotateX(90deg);
}

/* ---------- Transition "cube" (3D) ---------- */
body.fp-transition-cube .fpse-section {
    backface-visibility: hidden;
    transition: transform var(--fpse-duration) var(--fpse-easing);
    pointer-events: none;
}
body.fp-transition-cube .fpse-section[data-state="above"] {
    transform: rotateX(90deg) translateZ(-50vh);
    transform-origin: center bottom;
}
body.fp-transition-cube .fpse-section[data-state="current"] {
    transform: rotateX(0) translateZ(0);
    transform-origin: center center;
    pointer-events: auto;
}
body.fp-transition-cube .fpse-section[data-state="below"] {
    transform: rotateX(-90deg) translateZ(-50vh);
    transform-origin: center top;
}

/* ---------- Navigation : dots ---------- */
.fpse-dots {
    position: fixed;
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.fpse-dots button {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid rgba(255,255,255,0.7);
    background: transparent;
    cursor: pointer;
    padding: 0;
    transition: all .3s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}
.fpse-dots button.active {
    background: #fff;
    transform: scale(1.3);
}
.fpse-dots button:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

/* ---------- Navigation : progress bar ---------- */
.fpse-progress {
    position: fixed;
    left: 0;
    top: 0;
    height: 4px;
    width: 0;
    background: linear-gradient(90deg, #6366f1, #a855f7);
    z-index: 9999;
    transition: width var(--fpse-duration) var(--fpse-easing);
}

/* ---------- Message d'erreur si aucune section ---------- */
.fpse-error {
    position: fixed;
    bottom: 20px;
    left: 20px;
    background: #dc2626;
    color: #fff;
    padding: 12px 18px;
    border-radius: 8px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 13px;
    z-index: 99999;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
    max-width: 400px;
}

/* ---------- Notice éditeur Elementor ---------- */
.fpse-editor-notice {
    background: #1e293b;
    color: #f8fafc;
    padding: 14px 18px;
    border-radius: 10px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 14px;
    border-left: 4px solid #6366f1;
}
.fpse-editor-notice strong {
    color: #a5b4fc;
}
.fpse-editor-notice small {
    opacity: 0.7;
    margin-top: 4px;
    display: block;
}

/* ---------- Responsive mobile ---------- */
@media (max-width: 768px) {
    /* Fullpage TOTALEMENT desactive sur mobile : le contenu ne doit jamais etre coupe. */
    body.fp-enabled { overflow: auto !important; height: auto !important; }

    .fp-section,
    .fpse-section,
    .fpse-section.e-con {
        position: static !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
        opacity: 1 !important;
        overflow: visible !important;
        pointer-events: auto !important;
        transition: none !important;
    }

    /* On masque la navigation fullpage (dots / barre de progression) sur mobile. */
    .fpse-dots,
    .fpse-progress { display: none !important; }
}