/*
 * 多主题：通过覆写 CSS 变量实现全站配色切换
 * 使用方式：在 html 上设置 data-theme="xxx"
 */

/* 默认主题（与现有 style.css 的 accent 对齐） */
/* 海蓝：ocean 名称保留，配色为海蓝/天蓝（避免与青绿 teal 混淆） */
html[data-theme="ocean"] {
    --accent: #38bdf8;
    --accent-strong: #0ea5e9;
    --accent-muted: rgba(56, 189, 248, 0.15);
    --accent-glow: rgba(56, 189, 248, 0.35);
    --gradient-accent: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 55%, #0284c7 100%);
    --gradient-warm: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    --gradient-hero: linear-gradient(125deg, #0b1020 0%, #164e87 42%, #0a2540 100%);
    /* 玻璃态（默认） */
    --radius: 12px;
    --radius-lg: 18px;
    --radius-xl: 24px;
    --blur: 20px;
    --blur-navbar: 18px;
    --blur-modal: 20px;
    --surface: rgba(17, 26, 34, 0.72);
    --surface-elevated: rgba(22, 33, 44, 0.88);
    --border: rgba(148, 163, 184, 0.12);
    --shadow: 0 8px 32px rgba(0, 0, 0, 0.35);
    --shadow-soft: 0 4px 24px rgba(0, 0, 0, 0.22);
    --grid-size: 48px;
    --grid-line: rgba(148, 163, 184, 0.04);
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-shine-height: 1px;
    --card-hover-outline-width: 1px;
}

html[data-theme="purple"] {
    --accent: #a78bfa;
    --accent-strong: #7c3aed;
    --accent-muted: rgba(167, 139, 250, 0.15);
    --accent-glow: rgba(167, 139, 250, 0.35);
    --gradient-accent: linear-gradient(135deg, #a78bfa 0%, #7c3aed 55%, #6d28d9 100%);
    --gradient-warm: linear-gradient(135deg, #c084fc 0%, #7c3aed 100%);
    --gradient-hero: linear-gradient(125deg, #0b1020 0%, #3b0764 45%, #1e3a8a 100%);
    /* 更“霓雾”的大玻璃 */
    --radius: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --blur: 26px;
    --blur-navbar: 22px;
    --blur-modal: 24px;
    --surface: rgba(17, 26, 34, 0.64);
    --surface-elevated: rgba(22, 33, 44, 0.82);
    --border: var(--accent-muted);
    --shadow: 0 10px 40px rgba(0, 0, 0, 0.38);
    --shadow-soft: 0 6px 28px rgba(0, 0, 0, 0.25);
    --grid-size: 56px;
    --grid-line: rgba(167, 139, 250, 0.055);
    --card-border-width: 1px;
    --card-border-style: dashed;
    --card-shine-height: 2px;
    --card-hover-outline-width: 2px;
}

html[data-theme="rose"] {
    --accent: #fb7185;
    --accent-strong: #e11d48;
    --accent-muted: rgba(251, 113, 133, 0.15);
    --accent-glow: rgba(251, 113, 133, 0.35);
    --gradient-accent: linear-gradient(135deg, #fb7185 0%, #e11d48 55%, #be123c 100%);
    --gradient-warm: linear-gradient(135deg, #f472b6 0%, #e11d48 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #7f1d1d 40%, #2e1065 100%);
    /* 暖色厚玻璃：更大圆角与更强的阴影体感 */
    --radius: 16px;
    --radius-lg: 22px;
    --radius-xl: 32px;
    --blur: 22px;
    --blur-navbar: 20px;
    --blur-modal: 22px;
    --surface: rgba(17, 26, 34, 0.66);
    --surface-elevated: rgba(22, 33, 44, 0.90);
    --border: var(--accent-muted);
    --shadow: 0 12px 44px rgba(0, 0, 0, 0.42);
    --shadow-soft: 0 7px 30px rgba(0, 0, 0, 0.28);
    --grid-size: 44px;
    --grid-line: rgba(251, 113, 133, 0.05);
    --card-border-width: 2px;
    --card-border-style: solid;
    --card-shine-height: 3px;
    --card-hover-outline-width: 2px;
}

html[data-theme="amber"] {
    --accent: #fbbf24;
    --accent-strong: #f59e0b;
    --accent-muted: rgba(251, 191, 36, 0.15);
    --accent-glow: rgba(251, 191, 36, 0.35);
    --gradient-accent: linear-gradient(135deg, #fbbf24 0%, #f59e0b 55%, #b45309 100%);
    --gradient-warm: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #7c2d12 45%, #78350f 100%);
    /* 更偏“块面”的圆角与更清爽的玻璃 */
    --radius: 14px;
    --radius-lg: 20px;
    --radius-xl: 30px;
    --blur: 18px;
    --blur-navbar: 16px;
    --blur-modal: 18px;
    --surface: rgba(17, 26, 34, 0.78);
    --surface-elevated: rgba(22, 33, 44, 0.92);
    --border: rgba(148, 163, 184, 0.14);
    --shadow: 0 10px 36px rgba(0, 0, 0, 0.35);
    --shadow-soft: 0 5px 24px rgba(0, 0, 0, 0.22);
    --grid-size: 60px;
    --grid-line: rgba(251, 191, 36, 0.05);
    --card-border-width: 1px;
    --card-border-style: dotted;
    --card-shine-height: 2px;
    --card-hover-outline-width: 1px;
}

html[data-theme="sky"] {
    --accent: #38bdf8;
    --accent-strong: #0ea5e9;
    --accent-muted: rgba(56, 189, 248, 0.15);
    --accent-glow: rgba(56, 189, 248, 0.35);
    --gradient-accent: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 55%, #0284c7 100%);
    --gradient-warm: linear-gradient(135deg, #38bdf8 0%, #0ea5e9 100%);
    --gradient-hero: linear-gradient(125deg, #0b1020 0%, #1d4ed8 45%, #0f766e 100%);
    /* 更“硬朗”的边缘：小圆角、低模糊 */
    --radius: 10px;
    --radius-lg: 16px;
    --radius-xl: 22px;
    --blur: 14px;
    --blur-navbar: 12px;
    --blur-modal: 14px;
    --surface: rgba(17, 26, 34, 0.76);
    --surface-elevated: rgba(22, 33, 44, 0.90);
    --border: rgba(148, 163, 184, 0.16);
    --shadow: 0 8px 30px rgba(0, 0, 0, 0.33);
    --shadow-soft: 0 4px 18px rgba(0, 0, 0, 0.18);
    --grid-size: 48px;
    --grid-line: rgba(56, 189, 248, 0.06);
    --card-border-width: 2px;
    --card-border-style: solid;
    --card-shine-height: 1px;
    --card-hover-outline-width: 1px;
}

html[data-theme="emerald"] {
    --accent: #34d399;
    --accent-strong: #059669;
    --accent-muted: rgba(52, 211, 153, 0.15);
    --accent-glow: rgba(52, 211, 153, 0.35);
    --gradient-accent: linear-gradient(135deg, #34d399 0%, #059669 55%, #047857 100%);
    --gradient-warm: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #064e3b 45%, #053f2f 100%);
    /* 适中的圆角 + 更强玻璃层次 */
    --radius: 12px;
    --radius-lg: 18px;
    --radius-xl: 24px;
    --blur: 24px;
    --blur-navbar: 20px;
    --blur-modal: 22px;
    --surface: rgba(17, 26, 34, 0.62);
    --surface-elevated: rgba(22, 33, 44, 0.84);
    --border: var(--accent-muted);
    --shadow: 0 10px 40px rgba(0, 0, 0, 0.36);
    --shadow-soft: 0 6px 26px rgba(0, 0, 0, 0.24);
    --grid-size: 52px;
    --grid-line: rgba(52, 211, 153, 0.045);
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-shine-height: 2px;
    --card-hover-outline-width: 1px;
}

html[data-theme="lime"] {
    --accent: #a3e635;
    --accent-strong: #65a30d;
    --accent-muted: rgba(163, 230, 53, 0.15);
    --accent-glow: rgba(163, 230, 53, 0.35);
    --gradient-accent: linear-gradient(135deg, #a3e635 0%, #65a30d 55%, #4d7c0f 100%);
    --gradient-warm: linear-gradient(135deg, #a3e635 0%, #65a30d 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #365314 45%, #14532d 100%);
    /* 霓虹脉冲感：大圆角 + 更硬阴影 */
    --radius: 16px;
    --radius-lg: 24px;
    --radius-xl: 34px;
    --blur: 28px;
    --blur-navbar: 24px;
    --blur-modal: 26px;
    --surface: rgba(17, 26, 34, 0.60);
    --surface-elevated: rgba(22, 33, 44, 0.82);
    --border: var(--accent-muted);
    --shadow: 0 14px 54px rgba(0, 0, 0, 0.50);
    --shadow-soft: 0 8px 34px rgba(0, 0, 0, 0.34);
    --grid-size: 50px;
    --grid-line: rgba(163, 230, 53, 0.06);
    --card-border-width: 2px;
    --card-border-style: double;
    --card-shine-height: 3px;
    --card-hover-outline-width: 2px;
}

html[data-theme="forest"] {
    --accent: #22c55e;
    --accent-strong: #16a34a;
    --accent-muted: rgba(34, 197, 94, 0.15);
    --accent-glow: rgba(34, 197, 94, 0.35);
    --gradient-accent: linear-gradient(135deg, #22c55e 0%, #16a34a 55%, #15803d 100%);
    --gradient-warm: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #14532d 45%, #052e16 100%);
    /* 哑光/低玻璃：更少的 blur、更“实”的面板 */
    --radius: 10px;
    --radius-lg: 16px;
    --radius-xl: 22px;
    --blur: 0px;
    --blur-navbar: 0px;
    --blur-modal: 0px;
    --surface: rgba(17, 26, 34, 0.88);
    --surface-elevated: rgba(22, 33, 44, 0.96);
    --border: rgba(148, 163, 184, 0.20);
    --shadow: 0 10px 34px rgba(0, 0, 0, 0.40);
    --shadow-soft: 0 5px 22px rgba(0, 0, 0, 0.22);
    --grid-size: 48px;
    --grid-line: rgba(34, 197, 94, 0.04);
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-shine-height: 0px;
    --card-hover-outline-width: 1px;
}

html[data-theme="sunset"] {
    --accent: #fb923c;
    --accent-strong: #f97316;
    --accent-muted: rgba(251, 146, 60, 0.15);
    --accent-glow: rgba(251, 146, 60, 0.35);
    --gradient-accent: linear-gradient(135deg, #fb923c 0%, #f97316 55%, #ea580c 100%);
    --gradient-warm: linear-gradient(135deg, #fb923c 0%, #f97316 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #7c2d12 42%, #3f0a1f 100%);
    /* 暖光层：中高 blur + 圆润但不过分夸张 */
    --radius: 15px;
    --radius-lg: 22px;
    --radius-xl: 30px;
    --blur: 22px;
    --blur-navbar: 20px;
    --blur-modal: 22px;
    --surface: rgba(17, 26, 34, 0.70);
    --surface-elevated: rgba(22, 33, 44, 0.90);
    --border: rgba(148, 163, 184, 0.14);
    --shadow: 0 12px 44px rgba(0, 0, 0, 0.40);
    --shadow-soft: 0 7px 30px rgba(0, 0, 0, 0.26);
    --grid-size: 54px;
    --grid-line: rgba(251, 146, 60, 0.055);
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-shine-height: 2px;
    --card-hover-outline-width: 2px;
}

html[data-theme="mono"] {
    --accent: #94a3b8;
    --accent-strong: #64748b;
    --accent-muted: rgba(148, 163, 184, 0.15);
    --accent-glow: rgba(148, 163, 184, 0.35);
    --gradient-accent: linear-gradient(135deg, #94a3b8 0%, #64748b 55%, #475569 100%);
    --gradient-warm: linear-gradient(135deg, #94a3b8 0%, #64748b 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #1f2937 45%, #111827 100%);
    /* 单色平面：完全关闭玻璃 blur，强调排版与对比 */
    --radius: 10px;
    --radius-lg: 14px;
    --radius-xl: 18px;
    --blur: 0px;
    --blur-navbar: 0px;
    --blur-modal: 0px;
    --surface: rgba(17, 26, 34, 0.90);
    --surface-elevated: rgba(22, 33, 44, 0.98);
    --border: rgba(148, 163, 184, 0.22);
    --shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
    --shadow-soft: 0 4px 18px rgba(0, 0, 0, 0.20);
    --grid-size: 60px;
    --grid-line: rgba(148, 163, 184, 0.03);
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-shine-height: 0px;
    --card-hover-outline-width: 1px;
}

html[data-theme="azure"] {
    --accent: #60a5fa;
    --accent-strong: #3b82f6;
    --accent-muted: rgba(96, 165, 250, 0.15);
    --accent-glow: rgba(96, 165, 250, 0.35);
    --gradient-accent: linear-gradient(135deg, #60a5fa 0%, #3b82f6 55%, #2563eb 100%);
    --gradient-warm: linear-gradient(135deg, #60a5fa 0%, #3b82f6 100%);
    --gradient-hero: linear-gradient(125deg, #0b1020 0%, #1e3a8a 45%, #0f766e 100%);
    /* 冰霜薄雾：更高的 blur + 中等圆角 */
    --radius: 13px;
    --radius-lg: 20px;
    --radius-xl: 26px;
    --blur: 24px;
    --blur-navbar: 20px;
    --blur-modal: 22px;
    --surface: rgba(17, 26, 34, 0.64);
    --surface-elevated: rgba(22, 33, 44, 0.84);
    --border: var(--accent-muted);
    --shadow: 0 10px 40px rgba(0, 0, 0, 0.36);
    --shadow-soft: 0 6px 26px rgba(0, 0, 0, 0.24);
    --grid-size: 64px;
    --grid-line: rgba(96, 165, 250, 0.05);
    --card-border-width: 1px;
    --card-border-style: dashed;
    --card-shine-height: 2px;
    --card-hover-outline-width: 2px;
}

html[data-theme="violet"] {
    --accent: #8b5cf6;
    --accent-strong: #6d28d9;
    --accent-muted: rgba(139, 92, 246, 0.15);
    --accent-glow: rgba(139, 92, 246, 0.35);
    --gradient-accent: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 55%, #4c1d95 100%);
    --gradient-warm: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
    --gradient-hero: linear-gradient(125deg, #0f172a 0%, #4c1d95 42%, #1e3a8a 100%);
    /* 科技紫：大圆角 + 高对比阴影 */
    --radius: 14px;
    --radius-lg: 22px;
    --radius-xl: 30px;
    --blur: 24px;
    --blur-navbar: 20px;
    --blur-modal: 22px;
    --surface: rgba(17, 26, 34, 0.60);
    --surface-elevated: rgba(22, 33, 44, 0.84);
    --border: var(--accent-muted);
    --shadow: 0 14px 52px rgba(0, 0, 0, 0.44);
    --shadow-soft: 0 8px 32px rgba(0, 0, 0, 0.30);
    --grid-size: 48px;
    --grid-line: rgba(139, 92, 246, 0.055);
    --card-border-width: 2px;
    --card-border-style: solid;
    --card-shine-height: 2px;
    --card-hover-outline-width: 2px;
}

html[data-theme="neon"] {
    --accent: #22d3ee;
    --accent-strong: #06b6d4;
    --accent-muted: rgba(34, 211, 238, 0.15);
    --accent-glow: rgba(34, 211, 238, 0.35);
    --gradient-accent: linear-gradient(135deg, #22d3ee 0%, #06b6d4 55%, #0891b2 100%);
    --gradient-warm: linear-gradient(135deg, #60a5fa 0%, #22d3ee 100%);
    --gradient-hero: linear-gradient(125deg, #050713 0%, #0b2a4a 45%, #0a1f2e 100%);
    /* 纯霓虹：更强 blur + 更大的阴影实体 */
    --radius: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --blur: 30px;
    --blur-navbar: 26px;
    --blur-modal: 28px;
    --surface: rgba(17, 26, 34, 0.58);
    --surface-elevated: rgba(22, 33, 44, 0.82);
    --border: var(--accent-muted);
    --shadow: 0 16px 62px rgba(0, 0, 0, 0.55);
    --shadow-soft: 0 10px 40px rgba(0, 0, 0, 0.38);
    --grid-size: 50px;
    --grid-line: rgba(34, 211, 238, 0.08);
    --card-border-width: 2px;
    --card-border-style: double;
    --card-shine-height: 4px;
    --card-hover-outline-width: 2px;
}

html[data-theme="royal"] {
    --accent: #2563eb;
    --accent-strong: #1d4ed8;
    --accent-muted: rgba(37, 99, 235, 0.15);
    --accent-glow: rgba(37, 99, 235, 0.35);
    --gradient-accent: linear-gradient(135deg, #2563eb 0%, #1d4ed8 55%, #1e40af 100%);
    --gradient-warm: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%);
    --gradient-hero: linear-gradient(125deg, #0b1020 0%, #0f2a66 45%, #0b1b3a 100%);
    /* 皇家深海：更沉稳的玻璃与圆角比例 */
    --radius: 13px;
    --radius-lg: 20px;
    --radius-xl: 27px;
    --blur: 20px;
    --blur-navbar: 18px;
    --blur-modal: 20px;
    --surface: rgba(17, 26, 34, 0.68);
    --surface-elevated: rgba(22, 33, 44, 0.88);
    --border: rgba(148, 163, 184, 0.14);
    --shadow: 0 10px 40px rgba(0, 0, 0, 0.40);
    --shadow-soft: 0 6px 26px rgba(0, 0, 0, 0.24);
    --grid-size: 52px;
    --grid-line: rgba(37, 99, 235, 0.05);
    --card-border-width: 1px;
    --card-border-style: solid;
    --card-shine-height: 2px;
    --card-hover-outline-width: 1px;
}