/* Firefly Visual Theme Styles */

.firefly-glow {
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,200,0.9), rgba(255,200,100,0.7), rgba(255,150,50,0.5));
    box-shadow: 
        0 0 15px rgba(255,255,200,0.8),
        0 0 30px rgba(255,200,100,0.6),
        0 0 45px rgba(255,150,50,0.4),
        inset 0 0 10px rgba(255,255,220,0.6);
    pointer-events: none;
    z-index: 1000;
    animation: firefly-pulse 2s ease-in-out infinite;
}

.firefly-trail {
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,200,0.6), rgba(255,200,100,0.3), transparent);
    box-shadow: 0 0 8px rgba(255,255,200,0.5);
    pointer-events: none;
    z-index: 999;
    animation: firefly-trail-fade 3s ease-in-out infinite;
}

@keyframes firefly-pulse {
    0%, 100% {
        opacity: 0.6;
        transform: scale(1);
        box-shadow: 
            0 0 15px rgba(255,255,200,0.6),
            0 0 30px rgba(255,200,100,0.4),
            0 0 45px rgba(255,150,50,0.3),
            inset 0 0 10px rgba(255,255,220,0.4);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
        box-shadow: 
            0 0 25px rgba(255,255,200,1),
            0 0 50px rgba(255,200,100,0.8),
            0 0 75px rgba(255,150,50,0.6),
            inset 0 0 15px rgba(255,255,220,0.8);
    }
}

@keyframes firefly-trail-fade {
    0%, 100% {
        opacity: 0.3;
        transform: scale(0.8);
    }
    50% {
        opacity: 0.7;
        transform: scale(1);
    }
}

@keyframes firefly-birth {
    from {
        opacity: 0;
        transform: scale(0);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes firefly-end {
    from {
        opacity: 1;
        transform: scale(1);
    }
    to {
        opacity: 0;
        transform: scale(0);
    }
}

.firefly-pulse {
    animation: firefly-pulse-enhanced 2s ease-in-out infinite;
}

@keyframes firefly-pulse-enhanced {
    0%, 100% {
        opacity: 0.75;
        transform: scale(1);
        box-shadow: 
            0 0 22px rgba(255,255,200,0.9),
            0 0 45px rgba(255,200,100,0.7),
            0 0 68px rgba(255,150,50,0.6),
            inset 0 0 13px rgba(255,255,220,0.7);
    }
    50% {
        opacity: 1;
        transform: scale(1.35);
        box-shadow: 
            0 0 38px rgba(255,255,200,1),
            0 0 75px rgba(255,200,100,0.95),
            0 0 110px rgba(255,150,50,0.8),
            inset 0 0 22px rgba(255,255,220,1);
    }
}

.firefly-glow.aurora-animate {
    animation: firefly-wander 6s ease-in-out infinite, firefly-pulse 2s ease-in-out infinite;
}

@keyframes firefly-wander {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    25% {
        transform: translate(30px, -20px) scale(1.1);
    }
    50% {
        transform: translate(-25px, 25px) scale(0.9);
    }
    75% {
        transform: translate(20px, 30px) scale(1.05);
    }
}

.firefly-trail.aurora-animate {
    animation: firefly-trail-fade 2s ease-in-out infinite, firefly-trail-wander 6s ease-in-out infinite;
}

@keyframes firefly-trail-wander {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    25% {
        transform: translate(25px, -15px) scale(0.95);
    }
    50% {
        transform: translate(-20px, 20px) scale(0.85);
    }
    75% {
        transform: translate(15px, 25px) scale(0.9);
    }
}

/* Enhanced styling for colored fireflies (when grayscale is removed) */
.firefly-glow[style*="background"] {
    opacity: 0.85 !important;
}

.firefly-glow[style*="background"]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 120%;
    height: 120%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255,255,200,0.4), transparent 70%);
    pointer-events: none;
    animation: firefly-glow-expand 2s ease-in-out infinite;
}

@keyframes firefly-glow-expand {
    0%, 100% {
        opacity: 0.3;
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        opacity: 0.6;
        transform: translate(-50%, -50%) scale(1.3);
    }
}

.firefly-trail[style*="background"] {
    box-shadow: 
        0 0 12px rgba(255,255,200,0.7),
        0 0 24px rgba(255,200,100,0.5);
}