/* ============================================================
   暗色主题 — 当 <html> 具有 dark-theme 类时自动生效
   ============================================================ */
.dark-theme {
    --primary: #00a8a8;
    --primary-light: #14c9c9;
    --primary-hover: #33bbbb;
    --primary-dark: #008d8d;
    --primary-bg: rgba(0, 168, 168, 0.12);
    --primary-bg-strong: rgba(0, 168, 168, 0.2);
    --secondary: #64748b;
    --success: #10b981;
    --success-light: #34d399;
    --danger: #ef4444;
    --danger-light: #f87171;
    --warning: #f59e0b;
    --warning-light: #fbbf24;
    --bg-primary: #1e1e2e;
    --bg-secondary: #181825;
    --bg-tertiary: #313244;
    --bg-elevated: #26283a;
    --border: #45475a;
    --border-light: #393b4f;
    --border-color: #45475a;
    --text-primary: #cdd6f4;
    --text-secondary: #a6adc8;
    --text-tertiary: #7f849c;
    --text-muted: #6c7086;
    --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.3);
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.4), 0 1px 2px -1px rgb(0 0 0 / 0.4);
    --shadow: 0 2px 6px -1px rgb(0 0 0 / 0.4), 0 1px 4px -2px rgb(0 0 0 / 0.4);
    --shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.45), 0 2px 8px -4px rgb(0 0 0 / 0.4);
    --shadow-lg: 0 10px 25px -5px rgb(0 0 0 / 0.5), 0 4px 12px -6px rgb(0 0 0 / 0.45);
    --shadow-xl: 0 20px 50px -12px rgb(0 0 0 / 0.6);
    --shadow-primary: 0 4px 16px rgba(0, 168, 168, 0.35);
}

/* 暗色模式下的组件级覆盖（无法通过CSS变量自动切换的元素） */
.dark-theme body {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

.dark-theme .header {
    background: var(--bg-secondary);
    border-color: var(--border);
}

.dark-theme .tab.active {
    background: var(--primary);
    color: #fff;
}

.dark-theme input,
.dark-theme textarea,
.dark-theme select {
    background: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border);
}

.dark-theme .file-item {
    background: var(--bg-tertiary);
    border-color: var(--border);
}

.dark-theme .file-item:hover {
    background: var(--bg-primary);
}

.dark-theme .modal-content {
    background: var(--bg-primary);
}

.dark-theme .dropdown-menu {
    background: var(--bg-primary);
    border-color: var(--border);
}

.dark-theme pre,
.dark-theme code {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

/* D11.10.122: PLC 代码输出区去掉灰色背景, 与页面底色一致 */
.dark-theme .plc-code-output-body pre,
.dark-theme .plc-code-output-body code,
.dark-theme .plc-code-output-body,
.dark-theme .plc-code-output-header {
    background: transparent !important;
}