// Dark Mode
document.addEventListener("DOMContentLoaded", () => {
    const toggle = document.getElementById("dark-mode-toggle");

    // Falls der Button nicht existiert, abbrechen
    if (!toggle) return;

    // Gespeicherten Zustand laden
    if (localStorage.getItem("darkMode") === "true") {
        document.body.classList.add("dark");
        toggle.textContent = "Light Mode";
    } else {
        toggle.textContent = "Dark Mode";
    }

    // Klick auf Button
    toggle.addEventListener("click", () => {
        document.body.classList.toggle("dark");

        const isDark = document.body.classList.contains("dark");

        // Zustand speichern
        localStorage.setItem("darkMode", isDark);

        // Button-Text ändern
        if (isDark) {
            toggle.textContent = "Light Mode";
        } else {
            toggle.textContent = "Dark Mode";
        }
    });
});


// Dein bisheriger Code
console.log("Meine Seite läuft!");

const canvas = document.getElementById('bg');
const ctx = canvas.getContext('2d');
let W, H, particles = [];

function resize() {
    W = canvas.width = canvas.offsetWidth;
    H = canvas.height = canvas.offsetHeight;
}

function createParticles() {
    particles = [];
    const count = Math.floor(W * H / 6500);

    for (let i = 0; i < count; i++) {
        particles.push({
            x: Math.random() * W,
            y: Math.random() * H,
            r: Math.random() * 1.8 + 0.4,
            dx: (Math.random() - 0.5) * 0.3,
            dy: (Math.random() - 0.5) * 0.3,
            alpha: Math.random() * 0.5 + 0.1
        });
    }
}

function drawBg() {
    const g = ctx.createRadialGradient(W * 0.3, H * 0.4, 0, W * 0.3, H * 0.4, W * 0.85);
    g.addColorStop(0, '#0057c2');
    g.addColorStop(0.5, '#001f44');
    g.addColorStop(1, '#000d22');
    ctx.fillStyle = g;
    ctx.fillRect(0, 0, W, H);
}

function animate() {
    ctx.clearRect(0, 0, W, H);
    drawBg();

    particles.forEach(p => {
        p.x += p.dx;
        p.y += p.dy;

        if (p.x < 0 || p.x > W) p.dx *= -1;
        if (p.y < 0 || p.y > H) p.dy *= -1;

        ctx.beginPath();
        ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2);
        ctx.fillStyle = `rgba(255,255,255,${p.alpha})`;
        ctx.fill();
    });

    requestAnimationFrame(animate);
}

window.addEventListener('resize', () => {
    resize();
    createParticles();
});

resize();
createParticles();
animate();