/*
Theme Name:   染卷不卷
Theme URI:    https://ranjuan.cn/
Description:  「染卷不卷'blog」独立主题。由 SpicePress（含本站历年定制）与原 spicepress-child 子主题合并而成，已无父子依赖。含深色模式切换（data-theme="dark"）、3D 标签云、文章目录 TOC、阅读增强等。
Author:       染卷
Author URI:   https://ranjuan.cn/
Version:      2.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         blog, two-columns, right-sidebar, custom-colors, custom-logo, featured-images, sticky-post, translation-ready, dark-mode
Text Domain:  ranjuan
*/

/* ===========================================================
   全局 CSS 变量：调色板 / 字号 / 间距 / 圆角
   在这里修改一处，全站生效
   =========================================================== */
:root{
	/* 品牌色 */
	--rj-brand:        #1a73e8;   /* 主色：科技蓝 */
	--rj-brand-deep:   #0d47a1;   /* 主色加深 */
	--rj-accent:       #ff6a00;   /* 强调色：AI 系列/标签 */
	--rj-accent-soft:  #fff3e6;

	/* 背景 / 文字 */
	--rj-bg:           #f7f8fa;
	--rj-bg-card:      #ffffff;
	--rj-bg-soft:      #eef2f7;
	--rj-text:         #1f2329;
	--rj-text-sub:     #6b7280;
	--rj-text-muted:   #9ca3af;
	--rj-border:       #e5e7eb;

	/* 字号 / 行高 */
	--rj-fs-base:      16px;
	--rj-fs-sm:        14px;
	--rj-fs-xs:        12px;
	--rj-fs-h1:        28px;
	--rj-fs-h2:        24px;
	--rj-fs-h3:        20px;
	--rj-lh:           1.75;

	/* 间距 / 圆角 / 阴影（按钮无阴影，符合偏好） */
	--rj-radius:       10px;
	--rj-radius-sm:    6px;
	--rj-shadow-card:  0 2px 8px rgba(17,24,39,.06);
	--rj-shadow-hover: 0 6px 18px rgba(17,24,39,.10);
	--rj-btn-h:        36px;       /* 全站按钮统一高度 */

	/* 阅读区宽度（长文最佳行宽；容器加宽以更好利用宽屏） */
	--rj-content-w:    780px;
	--rj-container-w:  1320px;

	/* 卡片占位渐变（文章无封面图时按文章 ID 轮换） */
	--rj-grad-1:       linear-gradient(135deg, #1a73e8 0%, #4a90e2 100%);
	--rj-grad-2:       linear-gradient(135deg, #0d47a1 0%, #1565c0 100%);
	--rj-grad-3:       linear-gradient(135deg, #ff6a00 0%, #ff9a4d 100%);
	--rj-grad-4:       linear-gradient(135deg, #2e7d32 0%, #4caf50 100%);
	--rj-grad-5:       linear-gradient(135deg, #6a1b9a 0%, #9c27b0 100%);
}

/* ============================================================
   深色模式变量覆盖
   选择器挂在 <html data-theme="dark">（根节点），配合防闪烁脚本。
   child.css 中所有 `var(--rj-*)` 自动随变量变化替换。
   ============================================================ */
:root[data-theme="dark"] {
	/* 品牌色：略微提亮，深色背景下对比更舒适 */
	--rj-brand:        #4c9aff;
	--rj-brand-deep:   #1976d2;
	--rj-accent:       #ff8a33;
	--rj-accent-soft:  rgba(255, 138, 51, .14);

	/* 背景 / 文字：WCAG AA 对比 */
	--rj-bg:           #0b0f17;     /* 页面底（≈slate-950） */
	--rj-bg-card:      #141b27;     /* 卡片底 */
	--rj-bg-soft:      #1a2233;     /* 软化块、按钮 hover */
	--rj-text:         #e5e7eb;     /* 主文字（与 #0b0f17 对比 ≈15.8:1） */
	--rj-text-sub:     #9ca3af;     /* 次文字 */
	--rj-text-muted:   #6b7280;     /* 辅助文字 */
	--rj-border:       #2a3344;     /* 描边 */

	/* 阴影：深色下用深色雾感（比纯黑略暖的蓝灰阴影） */
	--rj-shadow-card:  0 2px 10px rgba(0, 0, 0, .45);
	--rj-shadow-hover: 0 8px 24px rgba(0, 0, 0, .55);

	/* 卡片占位渐变：深色版本 */
	--rj-grad-1:       linear-gradient(135deg, #174ea6 0%, #2159b8 100%);
	--rj-grad-2:       linear-gradient(135deg, #0d3779 0%, #123d8a 100%);
	--rj-grad-3:       linear-gradient(135deg, #b94700 0%, #d4641f 100%);
	--rj-grad-4:       linear-gradient(135deg, #1f5e24 0%, #2e7d32 100%);
	--rj-grad-5:       linear-gradient(135deg, #4a148c 0%, #6a1b9a 100%);
}

/* 实际样式集中在 assets/css/child.css，便于维护 */