/* ════════════════════════════════════════════════════════════════════════════
 * theme-presets.css — 客户可选风格预设（控制台外观切换器）
 * 把收集到的抖音 UI 设计审美沉淀为 7 套可命名、可选、可持久化的风格：
 *   zitong(紫瞳品牌紫) / mint(薄荷清新) / navy(海军蓝调) / chestnut(栗棕暖调)
 *   graphite(石墨雅紫) / light-clean(极简留白·浅色) / vibrant(活力微交互)
 * 切换器写入 documentElement 的 data-theme / data-skin / data-preset / data-density。
 * 本文件必须在 theme-obsidian.css / theme-variants.css 之后加载，保证覆盖生效。
 * ════════════════════════════════════════════════════════════════════════════ */

/* ── 1. 极简留白（叨叨AI 3 个 UI Skill · 留白极简 · 浅色）── */
[data-theme="light"][data-preset="light-clean"] {
  --bg-primary: #f4f5f7;
  --bg-secondary: #ffffff;
  --bg-tertiary: #f7f8fa;
  --bg-hover: #eef1f6;
  --bg-card: #ffffff;
  --text-primary: #1f2329;
  --text-secondary: #5a6472;
  --text-muted: #98a0ad;
  --accent: #4F46E5;
  --accent-dim: #3730A3;
  --accent-glow: rgba(79,70,229,0.14);
  --accent-text: #4338CA;
  --accent-rgb: 79,70,229;
  --purple: #4F46E5;
  --purple-bg: rgba(79,70,229,0.08);
  --border: #e6e8ec;
  --border-light: #eef0f3;
  --shadow-sm: 0 1px 2px rgba(17,22,29,0.05);
  --shadow-md: 0 6px 16px rgba(17,22,29,0.07);
}

/* ── 2. 活力微交互（小龙 / 西瓜同学 · 高饱和活力 · 暗色）── */
[data-preset="vibrant"] {
  --accent: #7C5CFF;
  --accent-dim: #5A3FD6;
  --accent-glow: rgba(124,92,255,0.30);
  --accent-text: #A48BFF;
  --accent-rgb: 124,92,255;
  --purple: #7C5CFF;
  --purple-bg: rgba(124,92,255,0.12);
}

/* ── 0. 紫瞳品牌紫（默认 · 暗色 · 无 skin/preset 时）──
 * 覆盖 theme-obsidian.css 的暗色默认靛蓝，还原紫瞳品牌色，与切换器色板一致。
 * :not([data-skin]):not([data-preset]) 确保只命中「紫瞳紫」默认态，不影响其他预设。 */
[data-theme="dark"]:not([data-skin]):not([data-preset]) {
  --accent: #E6397C;
  --accent-dim: #C22A64;
  --accent-glow: rgba(230,57,124,0.12);
  --accent-text: #C22A64;
  --accent-rgb: 230,57,124;
  --purple: #E6397C;
  --purple-bg: rgba(230,57,124,0.08);
}

/* ── 3. 栗棕暖调（菜心设计灵感库 · 温暖木调 · 暗色）由 theme-variants 的 chestnut 提供 accent，这里补充暖色微调 ── */
[data-theme="dark"][data-skin="chestnut"][data-preset="chestnut-warm"] {
  --accent-glow: rgba(201,138,78,0.34);
}

/* ═══ 密度：控制台信息密度的可选档位 ═══ */
[data-density="cozy"] {
  --card-pad: 22px;
  --table-cell-pad: 14px 18px;
  --row-gap: 16px;
}
[data-density="compact"] {
  --card-pad: 12px;
  --table-cell-pad: 8px 12px;
  --row-gap: 8px;
}

/* 让卡片 / 表格 / 列表尊重密度令牌（默认档位使用已有值） */
[data-density="cozy"] .card,
[data-density="cozy"] .panel,
[data-density="cozy"] .module-card { padding: var(--card-pad); }
[data-density="cozy"] .table-container tbody td,
[data-density="cozy"] #tc-content table:not([class]) td { padding: var(--table-cell-pad); }
[data-density="compact"] .card,
[data-density="compact"] .panel,
[data-density="compact"] .module-card { padding: var(--card-pad); }
[data-density="compact"] .table-container tbody td,
[data-density="compact"] #tc-content table:not([class]) td { padding: var(--table-cell-pad); }

/* ═══ 切换过程的视觉平滑（避免换肤闪跳）═══ */
html { transition: background-color .25s ease; }
[data-theme] #tc-sidebar,
[data-theme] #tc-topbar,
[data-theme] .tc-card,
[data-theme] .card,
[data-theme] .panel { transition: background-color .25s ease, border-color .25s ease, color .25s ease; }