/* --- KONTRAST WECHSEL --- */
/* Der Button selbst */
#contrast-toggle {
    position: fixed;
    bottom: 90px; /* Über dem Back-to-Top Button */
    right: 30px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: var(--primary);
    color: white;
    cursor: pointer;
    z-index: 1001;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    transition: transform 0.3s ease;
}

#contrast-toggle:hover {
    transform: scale(1.1);
}

/* Die Dark-Mode Farben */
body.dark-mode {
    --white: #1d1d1b;
    --light: #2a2a28;
    --dark: #f8f9fa;
    --primary: #4da3ff; /* Ein helleres Blau für besseren Kontrast auf Schwarz */
    background-color: var(--white);
    color: var(--dark);
}

/* Anpassung für Karten und Header im Dark Mode */
body.dark-mode .card, 
body.dark-mode header, 
body.dark-mode .form-container {
    background: #2a2a28;
    color: #f8f9fa;
    box-shadow: 0 5px 15px rgba(0,0,0,0.5);
}

body.dark-mode h1, 
body.dark-mode h2, 
body.dark-mode h3 {
    color: var(--primary);
}

#footer {
    background: var(--dark);
    color: var(--white);
    padding: 60px 0;
    text-align: center;
}