/* ============================================================
   themes.css —— 主题色板（每套 17 个变量，新增主题只需加一组）
   设计取向：低饱和中性底 + 沉稳主色 + 小面积强调色
   ============================================================ */

/* ---------- 1. 暖阳橙 Amber（默认） ---------- */
[data-theme="amber"] {
  --bg: #FBF6F1;
  --bg-glass: rgba(251, 246, 241, 0.82);
  --surface: #FFFFFF;
  --surface-2: #F4EDE5;
  --surface-3: #EDE3D8;
  --primary: #B45431;
  --primary-soft: #F8E8DF;
  --accent: #D9803F;
  --on-primary: #FFFFFF;
  --text-1: #2A211C;
  --text-2: #6B584D;
  --text-3: #A48F82;
  --border: #E9DFD4;
  --border-strong: #D6C6B7;
  --shadow: 0 1px 2px rgba(70, 45, 30, 0.05), 0 10px 26px rgba(70, 45, 30, 0.06);
  --shadow-lift: 0 2px 6px rgba(70, 45, 30, 0.08), 0 18px 40px rgba(70, 45, 30, 0.10);
  color-scheme: light;
}

/* ---------- 2. 森林薄荷 Mint ---------- */
[data-theme="mint"] {
  --bg: #F1F6F3;
  --bg-glass: rgba(241, 246, 243, 0.82);
  --surface: #FFFFFF;
  --surface-2: #E9F1ED;
  --surface-3: #DCE7E1;
  --primary: #2C6A56;
  --primary-soft: #E2EFE9;
  --accent: #4E9A80;
  --on-primary: #FFFFFF;
  --text-1: #1E2E27;
  --text-2: #556A61;
  --text-3: #93A69D;
  --border: #DFEBE4;
  --border-strong: #C4D7CE;
  --shadow: 0 1px 2px rgba(24, 60, 48, 0.05), 0 10px 26px rgba(24, 60, 48, 0.06);
  --shadow-lift: 0 2px 6px rgba(24, 60, 48, 0.08), 0 18px 40px rgba(24, 60, 48, 0.10);
  color-scheme: light;
}

/* ---------- 3. 海洋蓝 Ocean ---------- */
[data-theme="ocean"] {
  --bg: #F2F5FA;
  --bg-glass: rgba(242, 245, 250, 0.82);
  --surface: #FFFFFF;
  --surface-2: #E8EEF7;
  --surface-3: #D9E2F0;
  --primary: #2B4B8B;
  --primary-soft: #E3EBF8;
  --accent: #4A7DC9;
  --on-primary: #FFFFFF;
  --text-1: #1A2233;
  --text-2: #53607A;
  --text-3: #8C97AC;
  --border: #DEE6F1;
  --border-strong: #C2CFE2;
  --shadow: 0 1px 2px rgba(20, 34, 60, 0.05), 0 10px 26px rgba(20, 34, 60, 0.06);
  --shadow-lift: 0 2px 6px rgba(20, 34, 60, 0.08), 0 18px 40px rgba(20, 34, 60, 0.10);
  color-scheme: light;
}

/* ---------- 4. 樱花粉 Sakura ---------- */
[data-theme="sakura"] {
  --bg: #FBF3F5;
  --bg-glass: rgba(251, 243, 245, 0.82);
  --surface: #FFFFFF;
  --surface-2: #F5E8ED;
  --surface-3: #ECD9E1;
  --primary: #A94E74;
  --primary-soft: #F7E5EE;
  --accent: #D283A6;
  --on-primary: #FFFFFF;
  --text-1: #2E2029;
  --text-2: #6A5462;
  --text-3: #A48E97;
  --border: #EFDDE5;
  --border-strong: #DBC3CD;
  --shadow: 0 1px 2px rgba(60, 30, 45, 0.05), 0 10px 26px rgba(60, 30, 45, 0.06);
  --shadow-lift: 0 2px 6px rgba(60, 30, 45, 0.08), 0 18px 40px rgba(60, 30, 45, 0.10);
  color-scheme: light;
}

/* ---------- 5. 夜间墨绿 Midnight（深色） ---------- */
[data-theme="midnight"] {
  --bg: #0E1512;
  --bg-glass: rgba(14, 21, 18, 0.82);
  --surface: #161F1B;
  --surface-2: #1D2823;
  --surface-3: #263430;
  --primary: #5FCFA0;
  --primary-soft: #14302A;
  --accent: #86E3BE;
  --on-primary: #06221A;
  --text-1: #E7EFEA;
  --text-2: #9CB0A8;
  --text-3: #6D807A;
  --border: #233029;
  --border-strong: #35453D;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 10px 26px rgba(0, 0, 0, 0.30);
  --shadow-lift: 0 2px 6px rgba(0, 0, 0, 0.40), 0 18px 40px rgba(0, 0, 0, 0.36);
  color-scheme: dark;
}

/* ---------- 6. 纸质米黄 Paper ---------- */
[data-theme="paper"] {
  --bg: #F7F1E6;
  --bg-glass: rgba(247, 241, 230, 0.82);
  --surface: #FFFDF9;
  --surface-2: #EFE7D8;
  --surface-3: #E4DAC7;
  --primary: #77562F;
  --primary-soft: #F0E4D2;
  --accent: #A9814F;
  --on-primary: #FFFFFF;
  --text-1: #33291F;
  --text-2: #655544;
  --text-3: #97866E;
  --border: #E7DCC8;
  --border-strong: #D2C2A6;
  --shadow: 0 1px 2px rgba(60, 45, 25, 0.05), 0 10px 26px rgba(60, 45, 25, 0.06);
  --shadow-lift: 0 2px 6px rgba(60, 45, 25, 0.08), 0 18px 40px rgba(60, 45, 25, 0.10);
  color-scheme: light;
}

/* 兜底：仅在 <html> 上没有 data-theme 时生效
   注意：这里必须写成 :root:not([data-theme])，否则与 [data-theme="x"] 同优先级
   且位于文件末尾时会覆盖掉所有主题变量（曾导致切换主题无效）。 */
:root:not([data-theme]) {
  --bg: #FBF6F1;
  --bg-glass: rgba(251, 246, 241, 0.82);
  --surface: #FFFFFF;
  --surface-2: #F4EDE5;
  --surface-3: #EDE3D8;
  --primary: #B45431;
  --primary-soft: #F8E8DF;
  --accent: #D9803F;
  --on-primary: #FFFFFF;
  --text-1: #2A211C;
  --text-2: #6B584D;
  --text-3: #A48F82;
  --border: #E9DFD4;
  --border-strong: #D6C6B7;
  --shadow: 0 1px 2px rgba(70, 45, 30, 0.05), 0 10px 26px rgba(70, 45, 30, 0.06);
  --shadow-lift: 0 2px 6px rgba(70, 45, 30, 0.08), 0 18px 40px rgba(70, 45, 30, 0.10);
}