[data-theme="dark"] {
    /* ========== 基础颜色变量覆盖 ========== */
    --bg-primary: #121212;
    --bg-surface: #1e1e1e;
    --bg-preview: #1a1a2e;
    --bg-editor: #1e1e1e;
    --bg-symbols: #1e1e1e;
    --bg-template-btn: #2d2f33;
    --bg-template-btn-hover: #3a3f47;
    --bg-symbol-btn: #2d2f33;
    --bg-symbol-btn-hover: #3a3f47;
    --bg-tab-active: #4f6ef7;
    --bg-tab: #2d2f33;
    --text-primary: #e8e8f0;
    --text-secondary: #a0a0b0;
    --text-editor: #d4d4d4;
    --text-editor-cursor: #ffffff;
    --text-placeholder: #666;
    --accent: #6282ff;
    --accent-light: #2b2d42;
    --accent-hover: #7c98ff;
    --danger: #e0556a;
    --danger-hover: #c94055;
    --success: #2ea87a;
    --border: #3a3f47;
    --border-light: #2a2e35;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
}

/* ========== 特定组件深色模式调整 ========== */
[data-theme="dark"] .btn-outline {
    background: #2d2f33;
    border-color: #3a3f47;
    color: #e0e0e8;
}

[data-theme="dark"] .btn-outline:hover {
    background: #3a3f47;
    border-color: #4a4f57;
    color: #ffffff;
}

[data-theme="dark"] .preview-wrapper {
    border-color: #3a3f47;
    background: var(--bg-preview);
}

[data-theme="dark"] .preview-error {
    background: #2a1a1a;
    border-color: #5a2a2a;
    color: #ff8a8a;
}

[data-theme="dark"] .editor-textarea {
    background: #1a1a1a;
    border-color: #3a3f47;
    color: #e0e0e0;
    caret-color: var(--text-editor-cursor);
}

[data-theme="dark"] .editor-textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(98, 130, 255, 0.2);
}

[data-theme="dark"] .editor-textarea::placeholder {
    color: #666;
}

[data-theme="dark"] .template-btn {
    background: var(--bg-template-btn);
    border-color: var(--border-light);
    color: var(--text-secondary);
}

[data-theme="dark"] .template-btn:hover {
    background: var(--bg-template-btn-hover);
    color: var(--text-primary);
}

[data-theme="dark"] .symbol-tab {
    background: var(--bg-tab);
    color: var(--text-secondary);
}

[data-theme="dark"] .symbol-tab:hover {
    background: #3a3f47;
    color: var(--text-primary);
}

[data-theme="dark"] .symbol-tab.active {
    background: var(--accent);
    color: #fff;
}

[data-theme="dark"] .symbol-btn {
    background: var(--bg-symbol-btn);
    border-color: var(--border-light);
    color: var(--text-primary);
}

[data-theme="dark"] .symbol-btn:hover {
    background: var(--bg-symbol-btn-hover);
    border-color: var(--border);
    color: #ffffff;
}

[data-theme="dark"] .toast-message {
    background: #2d2f33;
    color: #e8e8f0;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .quick-tab {
    background: var(--bg-tab);
    color: var(--text-secondary);
}

[data-theme="dark"] .quick-tab:hover {
    background: #3a3f47;
    color: var(--text-primary);
}

[data-theme="dark"] .quick-tab.active {
    background: var(--accent);
    color: #fff;
}

[data-theme="dark"] .quick-formula-btn {
    background: var(--bg-symbol-btn);
    border-color: var(--border-light);
    color: var(--text-primary);
}

[data-theme="dark"] .quick-formula-btn:hover {
    background: var(--bg-symbol-btn-hover);
}

[data-theme="dark"] .toolbar-select {
    background: #2d2f33;
    border-color: var(--border);
    color: var(--text-primary);
}

[data-theme="dark"] .toolbar-select option {
    background: #2d2f33;
}

[data-theme="dark"] .color-hex-fusion {
    background: #2d2f33;
    border-color: var(--border);
}

[data-theme="dark"] .hex-action-text {
    border-left-color: var(--border-light);
    color: var(--text-secondary);
}

[data-theme="dark"] .hex-action-text:hover {
    background: #3a3f47;
    color: var(--accent);
}

[data-theme="dark"] .preview-placeholder {
    color: #666;
}

[data-theme="dark"] .formula-error {
    color: #ff8a8a;
}

[data-theme="dark"] .color-btn {
    border: 1px solid rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] .color-btn[style*="background-color: white;"] {
    border: 1px solid #888;
}

[data-theme="dark"] .color-btn[style*="background-color: black;"] {
    border: 1px solid #888;
}

[data-theme="dark"] .section-label {
    color: #888;
}

[data-theme="dark"] .section-hint {
    color: #777;
}

[data-theme="dark"] .app-header,
[data-theme="dark"] .preview-section,
[data-theme="dark"] .editor-section,
[data-theme="dark"] .templates-section,
[data-theme="dark"] .symbols-section,
[data-theme="dark"] .quick-formulas-section {
    border-color: var(--border);
}

[data-theme="dark"] .editor-toolbar {
    border-bottom-color: var(--border-light);
}

[data-theme="dark"] .symbols-tabs {
    border-bottom-color: var(--border-light);
}

[data-theme="dark"] .quick-tabs {
    border-bottom-color: var(--border-light);
}

/* KaTeX 深色模式下的公式颜色调整 */
[data-theme="dark"] .katex {
    color: #e8e8f0;
}

[data-theme="dark"] .katex .base {
    color: #e8e8f0;
}

[data-theme="dark"] .katex .mord,
[data-theme="dark"] .katex .mbin,
[data-theme="dark"] .katex .mrel,
[data-theme="dark"] .katex .mop,
[data-theme="dark"] .katex .mopen,
[data-theme="dark"] .katex .mclose,
[data-theme="dark"] .katex .mpunct,
[data-theme="dark"] .katex .minner {
    color: inherit;
}

[data-theme="dark"] .info-section {
    border-color: var(--border);
}

[data-theme="dark"] .info-content {
    color: var(--text-secondary);
}