document.addEventListener('DOMContentLoaded', () => {
    // Get the body element to update the cursor position
    const body = document.documentElement;
    let mouseX = 0;
    let mouseY = 0;
    let smoothX = 0;
    let smoothY = 0;
    
    // Smoothing factor (lower = smoother, higher = snappier)
    const smoothing = 0.1;
    
    // Handle mouse movement
    const handleMouseMove = (e) => {
        mouseY = e.clientY + window.scrollY;
        mouseX = e.clientX + window.scrollX;

    };
    
    // Smooth the cursor movement
    const updateCursorLight = () => {
        // Apply smoothing
        smoothX += (mouseX - smoothX) * smoothing;
        smoothY += (mouseY - smoothY) * smoothing;
        
        // Update CSS variables for the cursor position
        body.style.setProperty('--cursor-x', `${smoothX}px`);
        body.style.setProperty('--cursor-y', `${smoothY}px`);
        
        // Continue the animation loop
        requestAnimationFrame(updateCursorLight);
    };
    
    // Add event listeners
    window.addEventListener('mousemove', handleMouseMove);
    
    // Handle touch events for mobile
    window.addEventListener('touchmove', (e) => {
        e.preventDefault();
        const touch = e.touches[0];
        handleMouseMove({
            clientX: touch.clientX,
            clientY: touch.clientY
        });
    }, { passive: false });
    
    // Initialize cursor position to center of screen
    mouseX = window.innerWidth / 2;
    mouseY = window.innerHeight / 2;
    smoothX = mouseX;
    smoothY = mouseY;
    
    // Start the animation loop
    updateCursorLight();
});