/* ============================================================
   小鑫EL编辑器 - 全新多颜色主题设计 v6.0
   6大主题: 晨曦 / 暗夜 / 翡翠 / 紫晶 / 琥珀 / 珊瑚
   ============================================================ */

/* ============ 主题1: 晨曦 light (默认) ============ */
:root,
[data-theme="light"] {
    --bg-window: #f0f2f5;
    --bg-panel: #ffffff;
    --bg-card: #f7f8fa;
    --bg-input: #ffffff;
    --bg-hover: #e8edf5;
    --bg-sel: #dbeafe;
    --border: #d4dae6;
    --border-light: #e4e8f0;
    --text: #1a1a2e;
    --text-dim: #4a5060;
    --text-muted: #889099;
    --accent: #3b82f6;
    --accent-hover: #2563eb;
    --accent-light: #60a5fa;
    --accent-bg: rgba(59, 130, 246, 0.08);
    --accent-2: #8b5cf6;
    --accent-3: #ec4899;
    --success: #10b981;
    --warning: #f59e0b;
    --danger: #ef4444;
    --table-head-bg: linear-gradient(135deg, #3b82f6, #8b5cf6);
    --table-row-alt: #f8f9fb;
    --table-row-hover: #e8edf5;
    --table-sel: #dbeafe;
    --header-bg: #ffffff;
    --titlebar-bg: linear-gradient(135deg, #0f172a 0%, #1e3a8a 25%, #533483 50%, #831843 75%, #0f172a 100%);
    --titlebar-border: #8b5cf6;
    --info-bg: linear-gradient(90deg, #eff6ff, #f0f9ff);
    --shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-lg: 0 10px 30px rgba(0,0,0,0.08), 0 3px 10px rgba(0,0,0,0.04);
    --shadow-glow: 0 0 20px rgba(59, 130, 246, 0.15);
    --brand-gradient: linear-gradient(90deg, #3b82f6, #8b5cf6, #ec4899, #f59e0b, #10b981, #3b82f6);
    --splitter-bg: #c7c9d1;
    --splitter-hover: #8b5cf6;
    --field-row-bg: #fafbff;
    --field-row-hover: #f0f4ff;
    --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

/* ============ 主题2: 暗夜 dark ============ */
[data-theme="dark"] {
    --bg-window: #0d1117;
    --bg-panel: #161b22;
    --bg-card: #1c2230;
    --bg-input: #0d1117;
    --bg-hover: #262d3d;
    --bg-sel: #1e3a5f;
    --border: #30363d;
    --border-light: #21262d;
    --text: #e6edf3;
    --text-dim: #8b949e;
    --text-muted: #6e7681;
    --accent: #58a6ff;
    --accent-hover: #388bfd;
    --accent-light: #79c0ff;
    --accent-bg: rgba(88, 166, 255, 0.08);
    --accent-2: #bc8cff;
    --accent-3: #ff7b72;
    --success: #3fb950;
    --warning: #d29922;
    --danger: #f85149;
    --table-head-bg: linear-gradient(135deg, #1a2235, #2d1b4e);
    --table-row-alt: #161b22;
    --table-row-hover: #262d3d;
    --table-sel: #1e3a5f;
    --header-bg: #161b22;
    --titlebar-bg: linear-gradient(135deg, #000000 0%, #0d1117 25%, #1a0b2e 50%, #0d1117 75%, #000000 100%);
    --titlebar-border: #58a6ff;
    --info-bg: linear-gradient(90deg, #161b22, #1c2230);
    --shadow: 0 4px 6px rgba(0,0,0,0.4);
    --shadow-lg: 0 10px 25px rgba(0,0,0,0.5);
    --shadow-glow: 0 0 20px rgba(88, 166, 255, 0.1);
    --brand-gradient: linear-gradient(90deg, #58a6ff, #bc8cff, #ff7b72, #d29922, #3fb950, #58a6ff);
    --splitter-bg: #30363d;
    --splitter-hover: #58a6ff;
    --field-row-bg: #161b22;
    --field-row-hover: #1c2230;
    --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

/* ============ 主题3: 翡翠 green ============ */
[data-theme="green"] {
    --bg-window: #ecfdf5;
    --bg-panel: #ffffff;
    --bg-card: #f0fdf4;
    --bg-input: #ffffff;
    --bg-hover: #d1fae5;
    --bg-sel: #a7f3d0;
    --border: #a7c4b4;
    --border-light: #c4e0d0;
    --text: #0f1f1a;
    --text-dim: #3a5048;
    --text-muted: #6b8a7a;
    --accent: #059669;
    --accent-hover: #047857;
    --accent-light: #10b981;
    --accent-bg: rgba(5, 150, 105, 0.08);
    --accent-2: #14b8a6;
    --accent-3: #84cc16;
    --success: #16a34a;
    --warning: #ca8a04;
    --danger: #dc2626;
    --table-head-bg: linear-gradient(135deg, #059669, #14b8a6);
    --table-row-alt: #f0fdf4;
    --table-row-hover: #d1fae5;
    --table-sel: #a7f3d0;
    --header-bg: #ffffff;
    --titlebar-bg: linear-gradient(135deg, #022c22 0%, #064e3b 25%, #065f46 50%, #047857 75%, #022c22 100%);
    --titlebar-border: #10b981;
    --info-bg: linear-gradient(90deg, #ecfdf5, #f0fdf4);
    --shadow: 0 1px 3px rgba(5, 150, 105, 0.08);
    --shadow-lg: 0 4px 12px rgba(5, 150, 105, 0.12);
    --shadow-glow: 0 0 20px rgba(5, 150, 105, 0.12);
    --brand-gradient: linear-gradient(90deg, #059669, #14b8a6, #84cc16, #f59e0b, #059669);
    --splitter-bg: #a7c4b4;
    --splitter-hover: #059669;
    --field-row-bg: #f6fdfa;
    --field-row-hover: #ecfdf5;
    --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

/* ============ 主题4: 紫晶 purple ============ */
[data-theme="purple"] {
    --bg-window: #faf5ff;
    --bg-panel: #ffffff;
    --bg-card: #fdf4ff;
    --bg-input: #ffffff;
    --bg-hover: #f3e8ff;
    --bg-sel: #e9d5ff;
    --border: #c4a8d8;
    --border-light: #dbc8eb;
    --text: #2a0e3e;
    --text-dim: #5a3870;
    --text-muted: #9888b0;
    --accent: #9333ea;
    --accent-hover: #7e22ce;
    --accent-light: #a855f7;
    --accent-bg: rgba(147, 51, 234, 0.08);
    --accent-2: #c026d3;
    --accent-3: #e11d48;
    --success: #16a34a;
    --warning: #d97706;
    --danger: #dc2626;
    --table-head-bg: linear-gradient(135deg, #9333ea, #c026d3);
    --table-row-alt: #fdf4ff;
    --table-row-hover: #f3e8ff;
    --table-sel: #e9d5ff;
    --header-bg: #ffffff;
    --titlebar-bg: linear-gradient(135deg, #1a0033 0%, #4a044e 25%, #6b21a8 50%, #9333ea 75%, #1a0033 100%);
    --titlebar-border: #a855f7;
    --info-bg: linear-gradient(90deg, #faf5ff, #fdf4ff);
    --shadow: 0 1px 3px rgba(147, 51, 234, 0.08);
    --shadow-lg: 0 4px 12px rgba(147, 51, 234, 0.12);
    --shadow-glow: 0 0 20px rgba(147, 51, 234, 0.15);
    --brand-gradient: linear-gradient(90deg, #9333ea, #c026d3, #e11d48, #f59e0b, #9333ea);
    --splitter-bg: #c4a8d8;
    --splitter-hover: #9333ea;
    --field-row-bg: #fdfbff;
    --field-row-hover: #faf5ff;
    --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

/* ============ 主题5: 琥珀 amber ============ */
[data-theme="amber"] {
    --bg-window: #fffbeb;
    --bg-panel: #ffffff;
    --bg-card: #fefce8;
    --bg-input: #ffffff;
    --bg-hover: #fef3c7;
    --bg-sel: #fde68a;
    --border: #d4c8a0;
    --border-light: #e8dfc0;
    --text: #1c1207;
    --text-dim: #4a3a1e;
    --text-muted: #8a7a4e;
    --accent: #d97706;
    --accent-hover: #b45309;
    --accent-light: #f59e0b;
    --accent-bg: rgba(217, 119, 6, 0.08);
    --accent-2: #ea580c;
    --accent-3: #dc2626;
    --success: #16a34a;
    --warning: #ca8a04;
    --danger: #dc2626;
    --table-head-bg: linear-gradient(135deg, #d97706, #ea580c);
    --table-row-alt: #fefce8;
    --table-row-hover: #fef3c7;
    --table-sel: #fde68a;
    --header-bg: #ffffff;
    --titlebar-bg: linear-gradient(135deg, #1c0e00 0%, #451a03 25%, #78350f 50%, #b45309 75%, #1c0e00 100%);
    --titlebar-border: #f59e0b;
    --info-bg: linear-gradient(90deg, #fffbeb, #fefce8);
    --shadow: 0 1px 3px rgba(217, 119, 6, 0.08);
    --shadow-lg: 0 4px 12px rgba(217, 119, 6, 0.12);
    --shadow-glow: 0 0 20px rgba(217, 119, 6, 0.12);
    --brand-gradient: linear-gradient(90deg, #d97706, #ea580c, #dc2626, #f59e0b, #d97706);
    --splitter-bg: #d4c8a0;
    --splitter-hover: #d97706;
    --field-row-bg: #fffdf5;
    --field-row-hover: #fffbeb;
    --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

/* ============ 主题6: 珊瑚 coral ============ */
[data-theme="coral"] {
    --bg-window: #fff5f5;
    --bg-panel: #ffffff;
    --bg-card: #fff0f0;
    --bg-input: #ffffff;
    --bg-hover: #ffe4e6;
    --bg-sel: #fecdd3;
    --border: #d4a0a0;
    --border-light: #e8c0c0;
    --text: #2e0a0a;
    --text-dim: #6a3030;
    --text-muted: #a07070;
    --accent: #e11d48;
    --accent-hover: #be123c;
    --accent-light: #f43f5e;
    --accent-bg: rgba(225, 29, 72, 0.08);
    --accent-2: #f97316;
    --accent-3: #8b5cf6;
    --success: #16a34a;
    --warning: #d97706;
    --danger: #dc2626;
    --table-head-bg: linear-gradient(135deg, #e11d48, #f97316);
    --table-row-alt: #fff0f0;
    --table-row-hover: #ffe4e6;
    --table-sel: #fecdd3;
    --header-bg: #ffffff;
    --titlebar-bg: linear-gradient(135deg, #1a0000 0%, #4c0519 25%, #881337 50%, #be123c 75%, #1a0000 100%);
    --titlebar-border: #f43f5e;
    --info-bg: linear-gradient(90deg, #fff5f5, #fff0f0);
    --shadow: 0 1px 3px rgba(225, 29, 72, 0.08);
    --shadow-lg: 0 4px 12px rgba(225, 29, 72, 0.12);
    --shadow-glow: 0 0 20px rgba(225, 29, 72, 0.12);
    --brand-gradient: linear-gradient(90deg, #e11d48, #f97316, #8b5cf6, #06b6d4, #e11d48);
    --splitter-bg: #d4a0a0;
    --splitter-hover: #e11d48;
    --field-row-bg: #fffcfc;
    --field-row-hover: #fff5f5;
    --font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', Consolas, monospace;
}

/* ============ 全局重置 ============ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;
    overflow: hidden;
}

body {
    font-family: 'PingFang SC', 'Microsoft YaHei', 'Noto Sans CJK SC', 'Segoe UI', sans-serif;
    background: var(--bg-window);
    color: var(--text);
    font-size: 15px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: background 0.3s ease, color 0.3s ease;
}

/* ============ 滚动条 ============ */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 4px;
    transition: background 0.2s;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--accent);
}

/* ============ 隐藏兼容元素 ============ */
.compat-hidden { display: none !important; }

/* ============ 加载遮罩 ============ */
.loading-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    transition: opacity 0.3s;
}
.loading-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(255,255,255,0.15);
    border-top-color: var(--accent-light);
    border-right-color: var(--accent-2);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
.loading-text {
    color: #fff;
    font-size: 14px;
    margin-top: 16px;
    font-weight: 500;
    text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ============ Toast ============ */
.toast-container {
    position: fixed;
    top: 56px;
    right: 20px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: none;
}
.toast {
    padding: 10px 18px;
    border-radius: 8px;
    font-size: 13px;
    color: #fff;
    font-weight: 500;
    animation: toastIn 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
    max-width: 420px;
    pointer-events: auto;
    backdrop-filter: blur(8px);
}
.toast.success { background: linear-gradient(135deg, #10b981, #059669); }
.toast.error { background: linear-gradient(135deg, #ef4444, #dc2626); }
.toast.warning { background: linear-gradient(135deg, #f59e0b, #d97706); }
.toast.default { background: linear-gradient(135deg, #1e293b, #334155); }
@keyframes toastIn {
    from { transform: translateX(120%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}