/* Glowing Cursor Component Styles */

/* Main glowing cursor effect */
.glow-cursor {
    position: fixed;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(102, 126, 234, 0.3) 0%, transparent 70%);
    pointer-events: none;
    z-index: 9999;
    transition: transform 0.1s ease;
    mix-blend-mode: screen;
}

/* Enhanced cursor with multiple layers */
.glow-cursor.enhanced {
    background: 
        radial-gradient(circle at center, rgba(102, 126, 234, 0.4) 0%, transparent 30%),
        radial-gradient(circle at center, rgba(118, 75, 162, 0.3) 20%, transparent 60%),
        radial-gradient(circle at center, rgba(255, 255, 255, 0.1) 40%, transparent 70%);
    filter: blur(0.5px);
}

/* Cursor variants */
.glow-cursor.large {
    width: 30px;
    height: 30px;
}

.glow-cursor.small {
    width: 12px;
    height: 12px;
}

/* Cursor states */
.glow-cursor.hover {
    transform: scale(1.5);
    background: radial-gradient(circle, rgba(102, 126, 234, 0.5) 0%, transparent 70%);
}

.glow-cursor.click {
    transform: scale(0.8);
    background: radial-gradient(circle, rgba(118, 75, 162, 0.6) 0%, transparent 70%);
}

.glow-cursor.hidden {
    opacity: 0;
    transform: scale(0);
}

/* Click particles animation */
@keyframes particleAnimation {
    0% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(var(--x), var(--y)) scale(0);
        opacity: 0;
    }
}

.cursor-particle {
    position: fixed;
    width: 4px;
    height: 4px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    border-radius: 50%;
    pointer-events: none;
    z-index: 1000;
    animation: particleAnimation 1000ms cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

/* Trail effect */
.cursor-trail {
    position: fixed;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(102, 126, 234, 0.2) 0%, transparent 70%);
    pointer-events: none;
    z-index: 9998;
    transition: opacity 0.3s ease;
}

/* Responsive behavior */
@media (max-width: 768px) {
    .glow-cursor,
    .cursor-trail,
    .cursor-particle {
        display: none;
    }
}

@media (hover: none) and (pointer: coarse) {
    /* Hide on touch devices */
    .glow-cursor,
    .cursor-trail,
    .cursor-particle {
        display: none;
    }
}

/* Dark theme adjustments */
@media (prefers-color-scheme: dark) {
    .glow-cursor {
        background: radial-gradient(circle, rgba(102, 126, 234, 0.4) 0%, transparent 70%);
    }
    
    .glow-cursor.enhanced {
        background: 
            radial-gradient(circle at center, rgba(102, 126, 234, 0.5) 0%, transparent 30%),
            radial-gradient(circle at center, rgba(118, 75, 162, 0.4) 20%, transparent 60%),
            radial-gradient(circle at center, rgba(255, 255, 255, 0.2) 40%, transparent 70%);
    }
}

/* Light theme adjustments */
@media (prefers-color-scheme: light) {
    .glow-cursor {
        background: radial-gradient(circle, rgba(102, 126, 234, 0.2) 0%, transparent 70%);
    }
    
    .cursor-particle {
        background: linear-gradient(135deg, rgba(102, 126, 234, 0.8), rgba(118, 75, 162, 0.8));
    }
}