/* =========================================
   主题系统 - CSS 变量定义
   通过切换 .theme-xxx 类实现一键换肤
   ========================================= */

/* --- 默认经典 --- */
.theme-default {
    --bg-page: #eef1ff;
    --bg-card: #ffffff;
    --bg-header: rgba(255,255,255,0.85);
    --bg-footer: #111827;
    --bg-meta: #f3f4f6;

    --text-primary: #111827;
    --text-secondary: #4b5563;
    --text-muted: #9ca3af;
    --text-footer: #9ca3af;
    --text-on-primary: #ffffff;

    --border-light: #e5e7eb;
    --border-card: #f0f0f5;

    --accent-primary: #6366f1;
    --accent-secondary: #764ba2;
    --accent-hover: #4f46e5;

    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.06);
    --shadow-lg: 0 10px 40px rgba(0,0,0,0.08);

    --hero-start: #6366f1;
    --hero-end: #764ba2;

    --tag-bg: #eef2ff;
    --tag-text: #6366f1;

    --code-bg: #1e293b;
    --code-text: #e2e8f0;
}

/* --- 暗夜深邃 --- */
.theme-dark {
    --bg-page: #0f172a;
    --bg-card: #1e293b;
    --bg-header: rgba(15,23,42,0.92);
    --bg-footer: #020617;
    --bg-meta: #334155;

    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #64748b;
    --text-footer: #94a3b8;
    --text-on-primary: #ffffff;

    --border-light: #334155;
    --border-card: #1e293b;

    --accent-primary: #818cf8;
    --accent-secondary: #a78bfa;
    --accent-hover: #6366f1;

    --shadow-sm: 0 1px 2px rgba(0,0,0,0.2);
    --shadow-md: 0 4px 12px rgba(0,0,0,0.3);
    --shadow-lg: 0 10px 40px rgba(0,0,0,0.4);

    --hero-start: #1e1b4b;
    --hero-end: #312e81;

    --tag-bg: rgba(129,140,248,0.15);
    --tag-text: #a5b4fc;

    --code-bg: #0f172a;
    --code-text: #e2e8f0;
}

/* --- 简约纯净 --- */
.theme-minimal {
    --bg-page: #ffffff;
    --bg-card: #ffffff;
    --bg-header: rgba(255,255,255,0.97);
    --bg-footer: #1a1a2e;
    --bg-meta: #fafafa;

    --text-primary: #1a1a2e;
    --text-secondary: #555;
    --text-muted: #aaa;
    --text-footer: #8899aa;
    --text-on-primary: #ffffff;

    --border-light: #eaeaea;
    --border-card: #eaeaea;

    --accent-primary: #333;
    --accent-secondary: #555;
    --accent-hover: #000;

    --shadow-sm: 0 1px 1px rgba(0,0,0,0.03);
    --shadow-md: 0 2px 4px rgba(0,0,0,0.04);
    --shadow-lg: 0 4px 12px rgba(0,0,0,0.06);

    --hero-start: #1a1a2e;
    --hero-end: #333;

    --tag-bg: #f5f5f5;
    --tag-text: #555;

    --code-bg: #1a1a2e;
    --code-text: #e2e8f0;
}

/* --- 自然绿意 --- */
.theme-nature {
    --bg-page: #f0fdf4;
    --bg-card: #ffffff;
    --bg-header: rgba(255,255,255,0.88);
    --bg-footer: #064e3b;
    --bg-meta: #ecfdf5;

    --text-primary: #064e3b;
    --text-secondary: #374151;
    --text-muted: #9ca3af;
    --text-footer: #a7f3d0;
    --text-on-primary: #ffffff;

    --border-light: #d1fae5;
    --border-card: #e8f5e9;

    --accent-primary: #059669;
    --accent-secondary: #10b981;
    --accent-hover: #047857;

    --shadow-sm: 0 1px 2px rgba(5,150,105,0.08);
    --shadow-md: 0 4px 12px rgba(5,150,105,0.1);
    --shadow-lg: 0 10px 40px rgba(5,150,105,0.12);

    --hero-start: #059669;
    --hero-end: #047857;

    --tag-bg: #d1fae5;
    --tag-text: #059669;

    --code-bg: #064e3b;
    --code-text: #a7f3d0;
}

/* --- 海洋蓝调 --- */
.theme-ocean {
    --bg-page: #f0f9ff;
    --bg-card: #ffffff;
    --bg-header: rgba(255,255,255,0.88);
    --bg-footer: #0c4a6e;
    --bg-meta: #f0f9ff;

    --text-primary: #0c4a6e;
    --text-secondary: #374151;
    --text-muted: #94a3b8;
    --text-footer: #bae6fd;
    --text-on-primary: #ffffff;

    --border-light: #e0f2fe;
    --border-card: #e8f4fd;

    --accent-primary: #0284c7;
    --accent-secondary: #0ea5e9;
    --accent-hover: #0369a1;

    --shadow-sm: 0 1px 2px rgba(2,132,199,0.08);
    --shadow-md: 0 4px 12px rgba(2,132,199,0.1);
    --shadow-lg: 0 10px 40px rgba(2,132,199,0.12);

    --hero-start: #0284c7;
    --hero-end: #0369a1;

    --tag-bg: #e0f2fe;
    --tag-text: #0284c7;

    --code-bg: #0c4a6e;
    --code-text: #bae6fd;
}

/* --- 霓虹炫彩 --- */
.theme-neon {
    --bg-page: #0f0a1a;
    --bg-card: #1a1030;
    --bg-header: rgba(15,10,26,0.92);
    --bg-footer: #0a0515;
    --bg-meta: #1f1440;

    --text-primary: #f0e6ff;
    --text-secondary: #c4b5e3;
    --text-muted: #7c6aa8;
    --text-footer: #a78bfa;
    --text-on-primary: #0f0a1a;

    --border-light: #2d1f50;
    --border-card: #2a1a48;

    --accent-primary: #a855f7;
    --accent-secondary: #ec4899;
    --accent-hover: #9333ea;

    --shadow-sm: 0 1px 2px rgba(168,85,247,0.15);
    --shadow-md: 0 4px 16px rgba(168,85,247,0.2);
    --shadow-lg: 0 10px 50px rgba(168,85,247,0.25);

    --hero-start: #7c3aed;
    --hero-end: #db2777;

    --tag-bg: rgba(168,85,247,0.15);
    --tag-text: #c084fc;

    --code-bg: #0f0a1a;
    --code-text: #e2e8f0;
}

/* =========================================
   应用 CSS 变量
   ========================================= */
body.theme-default,
body.theme-dark,
body.theme-minimal,
body.theme-nature,
body.theme-ocean,
body.theme-neon {
    background-color: var(--bg-page);
    color: var(--text-primary);
}

/* 卡片 */
.theme-card {
    background: var(--bg-card);
    border-color: var(--border-card);
    box-shadow: var(--shadow-sm);
}
.theme-card:hover {
    box-shadow: var(--shadow-md);
}

/* header */
.theme-header {
    background: var(--bg-header) !important;
    border-bottom-color: var(--border-light) !important;
}
.theme-header a,
.theme-header button {
    color: var(--text-secondary);
}
.theme-header a:hover {
    color: var(--accent-primary);
}

/* footer */
.theme-footer {
    background: var(--bg-footer) !important;
    color: var(--text-footer);
}

/* hero gradient */
.theme-hero {
    background: linear-gradient(135deg, var(--hero-start), var(--hero-end));
}

/* links */
a.theme-link {
    color: var(--accent-primary);
}
a.theme-link:hover {
    color: var(--accent-hover);
}

/* tags / badges */
.theme-tag {
    background: var(--tag-bg);
    color: var(--tag-text);
}

/* buttons */
.theme-btn {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    color: var(--text-on-primary);
}
.theme-btn:hover {
    background: linear-gradient(135deg, var(--accent-hover), var(--accent-secondary));
}

/* text colors */
.text-theme-primary { color: var(--text-primary); }
.text-theme-secondary { color: var(--text-secondary); }
.text-theme-muted { color: var(--text-muted); }

/* 过渡动画 */
body, .theme-card, .theme-header, .theme-footer,
a, button, span, .theme-tag, .theme-btn {
    transition: background-color 0.3s ease, color 0.3s ease,
                border-color 0.3s ease, box-shadow 0.3s ease;
}

/* article detail typography overrides */
.theme-article-content {
    color: var(--text-primary);
}
.theme-article-content blockquote {
    border-left-color: var(--accent-primary);
    background: var(--bg-meta);
}
.theme-article-content pre {
    background: var(--code-bg);
    color: var(--code-text);
}