/* ==========================================================================
   ZodiacPro - Dark Mode Overrides
   ========================================================================== */

[data-theme="dark"] {
    --color-bg: #0F0D1A;
    --color-surface: #1A1730;
    --color-text: #E5E7EB;
    --color-text-muted: #9CA3AF;
    --color-text-light: #6B7280;
    --color-border: #2D2A4A;
    --color-border-light: #1F1C35;
    --color-primary: #818CF8;
    --color-primary-light: #A5B4FC;
    --color-primary-dark: #0F0D1A;
    --color-accent: #F0D878;
    --color-accent-light: #FBF0C4;
    --color-accent-dark: #D4AF37;
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -4px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .site-header {
    background: #161328;
    border-bottom-color: var(--color-border);
}

[data-theme="dark"] .site-title {
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .nav-wrapper {
    background: #161328;
}

[data-theme="dark"] .menu-toggle:hover,
[data-theme="dark"] .search-toggle:hover,
[data-theme="dark"] .dark-mode-toggle:hover {
    background: var(--color-border);
}

[data-theme="dark"] .search-overlay {
    background: #161328;
}

[data-theme="dark"] .hero {
    background: linear-gradient(135deg, #0A0820 0%, #1A1740 50%, #2D2660 100%);
}

[data-theme="dark"] .site-footer {
    background: #0A0820;
}

[data-theme="dark"] .zodiac-card:hover {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .sign-header {
    background: linear-gradient(135deg, #0A0820, #1A1740);
}

[data-theme="dark"] .ad-zone--header {
    background: var(--color-border-light);
    border-bottom-color: var(--color-border);
}

[data-theme="dark"] .error-404__code {
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] img {
    opacity: 0.9;
}

[data-theme="dark"] .page-content .container--narrow {
    background: var(--color-surface);
    border-color: var(--color-border);
}

[data-theme="dark"] .sign-info-box {
    background: var(--color-surface);
    border-color: var(--color-border);
}

[data-theme="dark"] .sign-info-item {
    background: var(--color-border-light);
}

[data-theme="dark"] .sign-personality {
    background: var(--color-surface);
    border-color: var(--color-border);
}

[data-theme="dark"] .sign-personality__desc {
    background: var(--color-border-light);
    border-left-color: var(--color-primary);
}

[data-theme="dark"] .trait-card {
    background: var(--color-border-light);
    border-left-color: var(--color-accent);
}

[data-theme="dark"] .tool-content-block {
    background: var(--color-surface);
    border-color: var(--color-border);
}

[data-theme="dark"] .how-step {
    background: var(--color-surface);
    border-color: var(--color-border);
}

[data-theme="dark"] .element-card {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}