/* Dark Theme for Resume Website */
/* Automatically switches with macOS system theme */

/* Dark theme styles - only apply when in dark mode */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        /* Override the CSS variables from the main styles */
        --primary-color: #58a6ff !important;
        --text-color: #e6edf3 !important;
        --border-color: #30363d !important;
        --bg-color: #0d1117 !important;
        --white: #161b22 !important;
        --nav-bg: #161b22 !important;
        --nav-hover: #21262d !important;
    }
    
    :root:not([data-theme="light"]) body {
        background-color: #0d1117 !important;
        color: #e6edf3 !important;
    }
    
    :root:not([data-theme="light"]) nav {
        background-color: #161b22 !important;
        border-bottom-color: #30363d !important;
        box-shadow: 0 1px 2px rgba(0,0,0,0.3) !important;
    }
    
    :root:not([data-theme="light"]) nav .nav-links a {
        color: #e6edf3 !important;
    }
    
    :root:not([data-theme="light"]) nav .nav-links a:hover {
        color: #58a6ff !important;
    }
    
    :root:not([data-theme="light"]) nav .nav-links a.active {
        color: #58a6ff !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body {
        background-color: #161b22 !important;
        color: #e6edf3 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.5) !important;
    }
    
    /* Override GitHub markdown CSS for dark theme */
    :root:not([data-theme="light"]) .markdown-body h1,
    :root:not([data-theme="light"]) .markdown-body h2,
    :root:not([data-theme="light"]) .markdown-body h3,
    :root:not([data-theme="light"]) .markdown-body h4,
    :root:not([data-theme="light"]) .markdown-body h5,
    :root:not([data-theme="light"]) .markdown-body h6 {
        color: #e6edf3 !important;
        border-color: #30363d !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body h1 {
        border-bottom-color: #58a6ff !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body a {
        color: #58a6ff !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body a:hover {
        color: #79c0ff !important;
        text-decoration: underline !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body table tr {
        background-color: #161b22 !important;
        border-color: #30363d !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body table tr:nth-child(2n) {
        background-color: #21262d !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body table th,
    :root:not([data-theme="light"]) .markdown-body table td {
        border-color: #30363d !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body blockquote {
        color: #8b949e !important;
        border-left-color: #30363d !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body code,
    :root:not([data-theme="light"]) .markdown-body pre {
        background-color: #161b22 !important;
        border-color: #21262d !important;
        color: #e6edf3 !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body hr {
        background-color: #30363d !important;
        border-color: #30363d !important;
    }
    
    :root:not([data-theme="light"]) .markdown-body kbd {
        background-color: #21262d !important;
        border-color: #30363d !important;
        color: #e6edf3 !important;
        box-shadow: none !important;
    }
    
    /* Floating print button dark theme */
    :root:not([data-theme="light"]) .print-button {
        background-color: #1f6feb !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
    }
    
    :root:not([data-theme="light"]) .print-button:hover {
        background-color: #58a6ff !important;
        box-shadow: 0 6px 20px rgba(0,0,0,0.5) !important;
    }
    
    /* Version footer dark theme */
    :root:not([data-theme="light"]) #version-info {
        color: #8b949e !important;
    }
    
    /* Loading state */
    :root:not([data-theme="light"]) .loading {
        color: #8b949e !important;
    }
    
    /* Error state */
    :root:not([data-theme="light"]) .error {
        background-color: rgba(248, 81, 73, 0.1) !important;
        border-color: rgba(248, 81, 73, 0.3) !important;
        color: #f85149 !important;
    }
}

/* Manual dark theme when data-theme="dark" is set */
:root[data-theme="dark"] {
    --primary-color: #58a6ff !important;
    --text-color: #e6edf3 !important;
    --border-color: #30363d !important;
    --bg-color: #0d1117 !important;
    --white: #161b22 !important;
    --nav-bg: #161b22 !important;
    --nav-hover: #21262d !important;
}

:root[data-theme="dark"] body {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
}

:root[data-theme="dark"] nav {
    background-color: #161b22 !important;
    border-bottom-color: #30363d !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.3) !important;
}

:root[data-theme="dark"] nav .nav-links a {
    color: #e6edf3 !important;
}

:root[data-theme="dark"] nav .nav-links a:hover {
    color: #58a6ff !important;
}

:root[data-theme="dark"] nav .nav-links a.active {
    color: #58a6ff !important;
}

:root[data-theme="dark"] .markdown-body {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.5) !important;
}

:root[data-theme="dark"] .markdown-body h1,
:root[data-theme="dark"] .markdown-body h2,
:root[data-theme="dark"] .markdown-body h3,
:root[data-theme="dark"] .markdown-body h4,
:root[data-theme="dark"] .markdown-body h5,
:root[data-theme="dark"] .markdown-body h6 {
    color: #e6edf3 !important;
    border-color: #30363d !important;
}

:root[data-theme="dark"] .markdown-body h1 {
    border-bottom-color: #58a6ff !important;
}

:root[data-theme="dark"] .markdown-body a {
    color: #58a6ff !important;
}

:root[data-theme="dark"] .markdown-body a:hover {
    color: #79c0ff !important;
    text-decoration: underline !important;
}

:root[data-theme="dark"] .markdown-body table tr {
    background-color: #161b22 !important;
    border-color: #30363d !important;
}

:root[data-theme="dark"] .markdown-body table tr:nth-child(2n) {
    background-color: #21262d !important;
}

:root[data-theme="dark"] .markdown-body table th,
:root[data-theme="dark"] .markdown-body table td {
    border-color: #30363d !important;
}

:root[data-theme="dark"] .markdown-body blockquote {
    color: #8b949e !important;
    border-left-color: #30363d !important;
}

:root[data-theme="dark"] .markdown-body code,
:root[data-theme="dark"] .markdown-body pre {
    background-color: #161b22 !important;
    border-color: #21262d !important;
    color: #e6edf3 !important;
}

:root[data-theme="dark"] .markdown-body hr {
    background-color: #30363d !important;
    border-color: #30363d !important;
}

:root[data-theme="dark"] .markdown-body kbd {
    background-color: #21262d !important;
    border-color: #30363d !important;
    color: #e6edf3 !important;
    box-shadow: none !important;
}

:root[data-theme="dark"] .print-button {
    background-color: #1f6feb !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
}

:root[data-theme="dark"] .print-button:hover {
    background-color: #58a6ff !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.5) !important;
}

:root[data-theme="dark"] #version-info {
    color: #8b949e !important;
}

:root[data-theme="dark"] .loading {
    color: #8b949e !important;
}

:root[data-theme="dark"] .error {
    background-color: rgba(248, 81, 73, 0.1) !important;
    border-color: rgba(248, 81, 73, 0.3) !important;
    color: #f85149 !important;
}

/* Theme transition for smooth switching */
.theme-transition,
.theme-transition *,
.theme-transition *:before,
.theme-transition *:after {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

/* Theme toggle dark mode styling */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) #theme-toggle {
        color: #8b949e !important;
    }
}

:root[data-theme="dark"] #theme-toggle {
    color: #8b949e !important;
}

/* Hide theme toggle in print */
@media print {
    #theme-toggle {
        display: none !important;
    }
}