/* Dark Mode Theme Override */
[data-theme="dark"] {
    /* Colors — Background */
    --bg: #0f1117;
    --bg-secondary: #1a1d27;
    --bg-tertiary: #252836;
    --bg-card: #1e2130;
    --surface: #1e2130;
    --surface-hover: #282b3a;

    /* Colors — Borders */
    --border: #2e3348;
    --border-light: #252836;
    --border-dark: #3d4260;

    /* Colors — Text */
    --text: #e8eaf0;
    --text-secondary: #b0b6c4;
    --text-muted: #7c839a;
    --link-color: #34d399;

    /* Colors — Primary */
    --primary: #10b981;
    --primary-hover: #34d399;
    --primary-light: rgba(16, 185, 129, 0.15);

    /* Colors — Success */
    --success: #10b981;
    --success-hover: #34d399;
    --success-light: rgba(16, 185, 129, 0.12);
    --success-dark: #059669;

    /* Colors — Warning */
    --warning: #fbbf24;
    --warning-light: rgba(251, 191, 36, 0.12);
    --warning-dark: #f59e0b;

    /* Colors — Danger */
    --danger: #f87171;
    --danger-hover: #ef4444;
    --danger-light: rgba(248, 113, 113, 0.12);

    /* Colors — Accents */
    --accent-green: #10b981;
    --accent-green-light: rgba(16, 185, 129, 0.15);
    --accent-red: #f87171;
    --accent-red-light: rgba(248, 113, 113, 0.15);
    --accent-yellow: #fbbf24;
    --accent-yellow-light: rgba(251, 191, 36, 0.15);
    --accent-blue: #60a5fa;
    --accent-blue-light: rgba(96, 165, 250, 0.15);
    --accent-purple: #a78bfa;
    --accent-purple-light: rgba(167, 139, 250, 0.15);
    --accent-orange: #fb923c;
    --accent-orange-light: rgba(251, 146, 60, 0.15);
    --accent-pink: #f472b6;
    --accent-pink-light: rgba(244, 114, 182, 0.15);
    --accent-teal: #2dd4bf;
    --accent-teal-light: rgba(45, 212, 191, 0.15);

    /* Shadows */
    --shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.5);

    /* Aliases */
    --border-color: var(--border);

    color-scheme: dark;
}

/* ═══════════ Global Dark Mode Overrides ═══════════ */

/* Form inputs */
[data-theme="dark"] .form-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%237c839a' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}

/* Catch-all: elements with hardcoded white/light backgrounds via inline styles */
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#ffffff"],
[data-theme="dark"] [style*="background: #ffffff"],
[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background-color:#fff"],
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color:white"],
[data-theme="dark"] [style*="background-color: white"] {
    background: var(--surface) !important;
    color: var(--text) !important;
}

/* Catch-all: inline style color overrides for light text colors on dark bg */
[data-theme="dark"] [style*="color:#374151"],
[data-theme="dark"] [style*="color: #374151"],
[data-theme="dark"] [style*="color:#111827"],
[data-theme="dark"] [style*="color: #111827"],
[data-theme="dark"] [style*="color:#1f2937"],
[data-theme="dark"] [style*="color: #1f2937"] {
    color: var(--text) !important;
}

[data-theme="dark"] [style*="color:#4b5563"],
[data-theme="dark"] [style*="color: #4b5563"],
[data-theme="dark"] [style*="color:#6b7280"],
[data-theme="dark"] [style*="color: #6b7280"],
[data-theme="dark"] [style*="color:#9ca3af"],
[data-theme="dark"] [style*="color: #9ca3af"] {
    color: var(--text-secondary) !important;
}

/* Tables with hardcoded backgrounds */
[data-theme="dark"] .bc-table th {
    background: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
}

/* Cards with background:white in scoped styles */
[data-theme="dark"] .card,
[data-theme="dark"] .card-body,
[data-theme="dark"] .card-header {
    background-color: var(--bg-card);
    color: var(--text);
}

/* Page backgrounds */
[data-theme="dark"] .page-header {
    color: var(--text);
}

/* Modal overlays */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .modal-body,
[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer {
    background: var(--bg-card);
    color: var(--text);
    border-color: var(--border);
}

/* Changelog, Error log, and other views with hardcoded whites */
[data-theme="dark"] .changelog-card,
[data-theme="dark"] .log-entry,
[data-theme="dark"] .log-details {
    background: var(--bg-card) !important;
    color: var(--text) !important;
}

/* Article wizard inline style overrides */
[data-theme="dark"] [style*="background:#fffbeb"],
[data-theme="dark"] [style*="background: #fffbeb"] {
    background: var(--warning-light) !important;
}

[data-theme="dark"] [style*="background:#f9fafb"],
[data-theme="dark"] [style*="background: #f9fafb"] {
    background: var(--bg-secondary) !important;
}

[data-theme="dark"] [style*="background:#f3f4f6"],
[data-theme="dark"] [style*="background: #f3f4f6"] {
    background: var(--bg-tertiary) !important;
}

/* ═══════════ Specific Component Overrides ═══════════ */

/* Error modal */
[data-theme="dark"] .error-modal {
    background: var(--bg-card);
}

[data-theme="dark"] .error-modal-header {
    background: rgba(248, 113, 113, 0.1);
    border-bottom-color: rgba(248, 113, 113, 0.2);
}

[data-theme="dark"] .error-modal-header h3 {
    color: #fca5a5;
}

[data-theme="dark"] .error-modal-code {
    background: rgba(248, 113, 113, 0.15);
    color: #fca5a5;
}

[data-theme="dark"] .error-modal-body {
    color: var(--text);
}

[data-theme="dark"] .error-modal-message {
    color: var(--text-secondary);
}

[data-theme="dark"] .error-modal-details-header {
    background: var(--bg-secondary);
    color: var(--text-muted);
}

[data-theme="dark"] .error-modal-pre {
    background: var(--bg-secondary);
    color: var(--text-secondary);
    border-top-color: var(--border);
}

[data-theme="dark"] .error-modal-footer {
    background: var(--bg-secondary);
    border-top-color: var(--border);
}

[data-theme="dark"] .error-modal-close {
    color: #fca5a5;
}

/* Toggle slider knob should stay white in dark mode */
[data-theme="dark"] .toggle-slider::before {
    background: #fff !important;
}

/* Tooltips and popovers */
[data-theme="dark"] .tooltip,
[data-theme="dark"] .popover {
    background: var(--bg-tertiary);
    color: var(--text);
    border-color: var(--border);
}

/* Badges with light backgrounds */
[data-theme="dark"] .badge {
    border-color: var(--border);
}

/* Dropdown menus in scoped components */
[data-theme="dark"] .combo-dropdown,
[data-theme="dark"] .dropdown-menu {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
}

[data-theme="dark"] .combo-option:hover,
[data-theme="dark"] .dropdown-item:hover {
    background: var(--surface-hover) !important;
}

/* Links that use hardcoded #047857 */
[data-theme="dark"] a[style*="color:#047857"],
[data-theme="dark"] a[style*="color: #047857"] {
    color: var(--link-color) !important;
}