document.addEventListener('DOMContentLoaded', () => {
    const loginBtn = document.getElementById('loginBtn');
    const addToServerBtn = document.getElementById('addToServerBtn');
    const learnMoreBtn = document.getElementById('learnMoreBtn');

    loginBtn.addEventListener('click', () => {
        // Hier können Sie die Login-Logik implementieren
        alert('Login-Funktion wird implementiert...');
    });

    addToServerBtn.addEventListener('click', () => {
        // Hier können Sie die Logik zum Hinzufügen des Bots implementieren
        window.open('https://discord.com/api/oauth2/authorize?client_id=YOUR_CLIENT_ID&permissions=8&scope=bot%20applications.commands', '_blank');
    });

    learnMoreBtn.addEventListener('click', () => {
        // Scrollen Sie sanft zum Features-Abschnitt
        document.querySelector('#features').scrollIntoView({ behavior: 'smooth' });
    });

    // Smooth Scrolling für alle internen Links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            document.querySelector(this.getAttribute('href')).scrollIntoView({
                behavior: 'smooth'
            });
        });
    });

    // Einfache Animationen beim Scrollen
    const animateOnScroll = () => {
        const elements = document.querySelectorAll('.feature-card, .pricing-card, .testimonial-card, .faq-item');
        elements.forEach(el => {
            const rect = el.getBoundingClientRect();
            const windowHeight = window.innerHeight || document.documentElement.clientHeight;
            if (rect.top <= windowHeight * 0.75) {
                el.classList.add('animate__animated', 'animate__fadeInUp');
            }
        });
    };

    window.addEventListener('scroll', animateOnScroll);
    animateOnScroll(); // Initial-Aufruf für bereits sichtbare Elemente

    // Einfacher Darkmode-Toggle (optional)
    const darkModeToggle = document.createElement('button');
    darkModeToggle.innerHTML = '🌓';
    darkModeToggle.style.position = 'fixed';
    darkModeToggle.style.bottom = '20px';
    darkModeToggle.style.right = '20px';
    darkModeToggle.style.zIndex = '1000';
    darkModeToggle.style.background = 'none';
    darkModeToggle.style.border = 'none';
    darkModeToggle.style.fontSize = '24px';
    darkModeToggle.style.cursor = 'pointer';
    document.body.appendChild(darkModeToggle);

    darkModeToggle.addEventListener('click', () => {
        document.body.classList.toggle('dark-mode');
    });