/* Standard - Normale Farben */
:root {
    --color-primary: var(--e-global-color-primary);     /* Primärfarbe */
    --color-secondary: var(--e-global-color-secondary); /* Sekundärfarbe */
    --color-accent: var(--e-global-color-accent);       /* Accentfarbe */
    --color-text: #202B38;                               /* Textfarbe */
    --color-background: #ffffff;                         /* Hintergrundfarbe */
}

/* Dark Mode */
body.dark-mode {
    --color-text: #ffffff;                               /* Dark Mode Textfarbe */
    --color-background: #121212;                         /* Dark Mode Hintergrund */
    transition: background-color 0.3s ease, color 0.3s ease; /* Sanfte Übergänge für den Dark Mode */
}

/* Verwenden der Farben auf den wichtigsten Elementen */
body {
    background-color: var(--color-background);
    color: var(--color-text);
    transition: background-color 0.3s ease, color 0.3s ease; /* Übergang für den normalen Modus */
}

a {
    color: var(--color-primary);
    transition: color 0.3s ease; /* Übergang für Links */
}

button {
    background-color: var(--color-primary);
    color: var(--color-text);
    transition: background-color 0.3s ease, color 0.3s ease; /* Übergang für Buttons */
}

/* Beispiel für Überschriften */
h1, h2, h3, h4, h5, h6 {
    color: var(--color-secondary);
    transition: color 0.3s ease; /* Übergang für Überschriften */
}
