document.addEventListener('DOMContentLoaded', function() {
    const spinButton = document.getElementById('spinButton');
    const statusDisplay = document.getElementById('statusDisplay');
    const resultPanel = document.getElementById('resultPanel');
    
    // Simulate spin animation
    spinButton.addEventListener('click', function() {
        // Disable button during spin
        spinButton.disabled = true;
        statusDisplay.textContent = "Rolling...";
        
        // Trigger loot box and multiplier animations
        const lootBoxComponent = document.querySelector('custom-lootbox');
        const multiplierComponent = document.querySelector('custom-multiplier');
        
        if (lootBoxComponent && multiplierComponent) {
            lootBoxComponent.startSpin();
            multiplierComponent.startSpin();
            
            // Simulate spin completion
            setTimeout(() => {
                lootBoxComponent.stopSpin();
                
                // Second spin starts after first completes
                setTimeout(() => {
                    multiplierComponent.stopSpin();
                    
                    // Show results
                    setTimeout(() => {
                        resultPanel.style.opacity = '1';
                        statusDisplay.textContent = "Landed on: EPIC BOX";
                        spinButton.disabled = false;
                    }, 500);
                }, 1000);
            }, 3000);
        }
    });
    
    // Initialize feather icons
    feather.replace();
});