/* ============================================
   DARK MODE
   ============================================ */
   html.dark-mode {
    --bg-primary: #0a151e;
    --bg-secondary: #13242f;
    --bg-card: #1a2e3f;
    --text-primary: #e8e0d6;
    --text-secondary: #b0a392;
    --text-muted: #8f7e6b;
    --border-color: rgba(255, 255, 255, 0.06);
    --shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    --shadow-hover: 0 8px 30px rgba(0, 0, 0, 0.4);
}

html.dark-mode .header {
    background: rgba(19, 36, 47, 0.96);
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

html.dark-mode .theme-toggle {
    background: var(--bg-primary);
    border-color: var(--border-color);
}

html.dark-mode .step {
    background: var(--bg-primary);
}

html.dark-mode .form-group input,
html.dark-mode .form-group select,
html.dark-mode .form-group textarea {
    background: var(--bg-primary);
    color: var(--text-primary);
}

html.dark-mode .donate-address {
    background: var(--bg-primary);
}

html.dark-mode .detail-container .detail-body .detail-tags span {
    background: var(--bg-primary);
}

html.dark-mode .bottom-nav {
    background: rgba(19, 36, 47, 0.96);
    border-top-color: rgba(255, 255, 255, 0.06);
}

html.dark-mode .btn-logout {
    background: var(--bg-primary);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

html.dark-mode .slider-btn-small {
    background: var(--bg-secondary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

html.dark-mode .login-box {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}

html.dark-mode .profile-menu-item {
    background: var(--bg-primary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

html.dark-mode .profile-box {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}

html.dark-mode .form-box {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}

html.dark-mode .how-it-works {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}

html.dark-mode .animal-card {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}

html.dark-mode .detail-container {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}