/**
 * Particles Background - Styles
 * Fond avec particules animées
 */

/* ========================
   WIDGET WRAPPER
   ======================== */
.particles-bg-widget {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}

/* Assurer que le widget Elementor ne prend pas de place */
.elementor-widget-particles_bg {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.elementor-widget-particles_bg > .elementor-widget-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Quand appliqué au parent */
.has-particles-bg {
    position: relative !important;
    overflow: hidden;
}

/* Assurer que le contenu du parent reste au-dessus */
.has-particles-bg > *:not(.particles-bg-widget):not(.elementor-widget-particles_bg) {
    position: relative;
    z-index: 1;
}

.has-particles-bg > .elementor-widget-particles_bg {
    z-index: 0 !important;
}

/* ========================
   CANVAS
   ======================== */
.particles-canvas {
    display: block;
    width: 100%;
    height: 100%;
}

/* Permettre l'interaction souris quand nécessaire */
.particles-bg-widget.has-mouse-interaction {
    pointer-events: auto;
}

.particles-bg-widget.has-mouse-interaction .particles-canvas {
    pointer-events: auto;
}

/* ========================
   EDITOR NOTICE
   ======================== */
.particles-editor-notice {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(99, 102, 241, 0.9);
    color: white;
    padding: 15px 25px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    z-index: 10;
    pointer-events: none;
    box-shadow: 0 4px 20px rgba(99, 102, 241, 0.3);
}

/* Masquer la notice en frontend */
body:not(.elementor-editor-active) .particles-editor-notice {
    display: none;
}

/* ========================
   RESPONSIVE
   ======================== */
@media (max-width: 768px) {
    .particles-bg-widget {
        /* Réduire le nombre de particules visuellement sur mobile */
    }
}

/* ========================
   ACCESSIBILITÉ
   ======================== */
@media (prefers-reduced-motion: reduce) {
    .particles-canvas {
        animation: none !important;
    }
    
    .particles-bg-widget {
        display: none;
    }
}