function triggerConfetti() {
    const colors = ['#2563eb', '#10b981', '#f59e0b', '#ef4444', '#8b5cf6'];
    const confettiCount = 150;
    const container = document.createElement('div');
    container.style.cssText = `
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 99999;
        overflow: hidden;
    `;
    document.body.appendChild(container);

    for (let i = 0; i < confettiCount; i++) {
        createConfettiPiece(container, colors);
    }

    setTimeout(() => {
        container.remove();
    }, 4000);
}

function createConfettiPiece(container, colors) {
    const piece = document.createElement('div');
    const color = colors[Math.floor(Math.random() * colors.length)];
    const size = Math.random() * 10 + 5;
    const startX = Math.random() * 100;
    const startY = -10;
    const duration = Math.random() * 2 + 2;
    const delay = Math.random() * 0.5;
    const rotation = Math.random() * 360;
    const rotationSpeed = Math.random() * 720 - 360;
    const drift = Math.random() * 100 - 50;

    piece.style.cssText = `
        position: absolute;
        width: ${size}px;
        height: ${size}px;
        background: ${color};
        left: ${startX}%;
        top: ${startY}%;
        border-radius: ${Math.random() > 0.5 ? '50%' : '0'};
        transform: rotate(${rotation}deg);
        animation: confettiFall ${duration}s ease-out ${delay}s forwards;
    `;

    const keyframes = `
        @keyframes confettiFall {
            0% {
                transform: translateY(0) translateX(0) rotate(${rotation}deg);
                opacity: 1;
            }
            100% {
                transform: translateY(100vh) translateX(${drift}px) rotate(${rotation + rotationSpeed}deg);
                opacity: 0;
            }
        }
    `;

    const style = document.createElement('style');
    style.textContent = keyframes;
    document.head.appendChild(style);

    container.appendChild(piece);

    setTimeout(() => {
        style.remove();
    }, (duration + delay) * 1000 + 100);
}

window.triggerConfetti = triggerConfetti;
