/**
 * TingPro 设计变量：亮 / 暗双套 token。
 * data-theme 由 head 内联脚本在渲染前设置（防 FOUC）。
 */

:root,
:root[data-theme='light'] {
	--bg: #f4f2ee;
	--bg-soft: #ece9e3;
	--card-bg: #fffdfa;
	--topbar-bg: rgba(255, 253, 249, 0.82);
	--text: #3d3a36;
	--text-sub: #8f8a83;
	--text-faint: #b8b2aa;
	--accent: #c4552d;
	--accent-strong: #a8431f;
	--accent-soft: rgba(196, 85, 45, 0.1);
	--accent-gradient: linear-gradient(135deg, #d97a4a 0%, #b34a26 100%);
	--border: #e7e2da;
	--shadow: 0 8px 28px rgba(160, 130, 100, 0.14);
	--shadow-sm: 0 2px 10px rgba(160, 130, 100, 0.1);
	--radius-lg: 22px;
	--radius-md: 16px;
	--radius-sm: 10px;
	--topbar-h: 56px;
}

:root[data-theme='dark'] {
	--bg: #1d1c1a;
	--bg-soft: #232220;
	--card-bg: #292724;
	--topbar-bg: rgba(41, 39, 36, 0.85);
	--text: #e8e4dd;
	--text-sub: #a09a91;
	--text-faint: #6f6a62;
	--accent: #d97a4a;
	--accent-strong: #e8926a;
	--accent-soft: rgba(217, 122, 74, 0.14);
	--accent-gradient: linear-gradient(135deg, #d97a4a 0%, #b0542e 100%);
	--border: #3a3731;
	--shadow: 0 8px 28px rgba(0, 0, 0, 0.4);
	--shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* 主题切换按钮：按当前模式显示对应图标 */
[data-tingpro-theme-toggle] .icon {
	display: none;
}

[data-tingpro-theme-toggle][data-mode='auto'] .icon--auto {
	display: inline-block;
}

[data-tingpro-theme-toggle][data-mode='dark'] .icon--sun {
	display: inline-block;
}

[data-tingpro-theme-toggle][data-mode='light'] .icon--moon {
	display: inline-block;
}