/* Dark/Light logic */

:root {
    --bg-light: #ffffff;
    --bg-dark: #1a1a1a;
    --text-light: #000000;
    --text-dark: #ffffff;
}

body {
    background-color: var(--bg-light);
    color: var(--text-light);
    transition: background-color 0.4s, color 0.4s;
}

body.dark-mode {
    background: linear-gradient(135deg, #0a0908, #22333b, #53503f, #c6ac8f, #eae0d5);
    background-size: 400% 400%;
    animation: gradientAnimation 15s ease infinite;
    color: #eae0d5; 
}

body.dark-mode {
    --text-color: white; 
}

body.dark-mode .nav-links a,
body.dark-mode .nav-links span {
    color: var(--text-color);
}

@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.dark-mode .nav-links a {
    color: #eae0d5;
}

.dark-mode .name {
    color: #eae0d5;
}

.dark-mode * {
    border: none !important;
}