/* Enhanced Night Mode */
:root {
    --night-primary: #0a1929;
    --night-secondary: #132f4c;
    --night-accent: #3399ff;
    --night-text: #e6f7ff;
    --night-border: #1e4976;
    --night-gradient: linear-gradient(135deg, #0a1929 0%, #132f4c 100%);
    --night-card: linear-gradient(145deg, #132f4c 0%, #0a1929 100%);
}

body.night-mode {
    background-color: var(--night-primary);
    color: var(--night-text);
    background-image: 
        radial-gradient(at 40% 20%, hsla(240, 100%, 20%, 0.5) 0px, transparent 50%),
        radial-gradient(at 80% 0%, hsla(189, 100%, 20%, 0.15) 0px, transparent 50%),
        radial-gradient(at 0% 50%, hsla(355, 100%, 20%, 0.3) 0px, transparent 50%);
}

body.night-mode main {
    background: var(--night-card);
    border-color: var(--night-border);
}

body.night-mode .box {
    background: var(--night-card);
    border-color: var(--night-border);
    color: var(--night-text);
}

body.night-mode .box:hover {
    border-color: var(--night-accent);
}

body.night-mode h1, 
body.night-mode h2, 
body.night-mode h3 {
    background: linear-gradient(135deg, #66b3ff 0%, #3399ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

body.night-mode .flex-item {
    background: var(--night-card);
    border-color: var(--night-border);
}

body.night-mode .flex-item p {
    color: var(--night-text);
}

body.night-mode .search-input {
    background: linear-gradient(var(--night-secondary), var(--night-secondary)) padding-box,
                var(--gradient-accent) border-box;
    color: var(--night-text);
}

body.night-mode .search-input::placeholder {
    color: #a0c4e0;
}

body.night-mode .button-link {
    background: linear-gradient(135deg, #3399ff 0%, #66b3ff 100%);
}

body.night-mode .button-link:hover {
    background: linear-gradient(135deg, #66b3ff 0%, #99ccff 100%);
}

/* Enhanced night mode transitions */
body.night-mode * {
    transition: color 0.3s ease, background-color 0.5s ease, border-color 0.3s ease;
}