/* ============================================
   Zendaily 薛涛笺二十四节气花笺主题
   用法：在 <head> 引入本CSS，<body>末尾引入 floral-theme.js
   JS会自动根据日期给body加 season-xxx 和 term-xxx
   ============================================ */

/* ---------- 季节配色变量 ---------- */
:root {
  --bg-paper: #f0ede4;
  --text-primary: #2d3748;
  --text-secondary: #6a7585;
  --text-muted: #8a9aaa;
  --accent: #3c6b55;
  --accent-light: rgba(180,220,210,0.5);
  --border: rgba(140,155,170,0.25);
  --card-bg: rgba(255,255,255,0.3);
  --term-color: #3c4b5f;
}

/* 春 · 竹青 */
body.season-spring {
  --bg-paper: #e8efe6;
  --text-primary: #2a3a2e;
  --text-secondary: #5a6e5e;
  --text-muted: #7a8e7e;
  --accent: #3a6b4a;
  --accent-light: rgba(170,210,180,0.5);
  --border: rgba(120,160,130,0.25);
  --card-bg: rgba(255,255,255,0.35);
  --term-color: #2e4a38;
  background-image: url('/static/floral/spring_bg_floral.jpg');
}

/* 夏 · 菡萏 */
body.season-summer {
  --bg-paper: #f5ebeb;
  --text-primary: #3a2a30;
  --text-secondary: #6e5a60;
  --text-muted: #8e7a80;
  --accent: #8b4a5a;
  --accent-light: rgba(220,170,180,0.45);
  --border: rgba(170,120,130,0.25);
  --card-bg: rgba(255,255,255,0.35);
  --term-color: #5a3540;
  background-image: url('/static/floral/summer_bg_floral.jpg');
}

/* 秋 · 月白（白露） */
body.season-autumn {
  --bg-paper: #f0ede4;
  --text-primary: #2d3748;
  --text-secondary: #6a7585;
  --text-muted: #8a9aaa;
  --accent: #3c6b55;
  --accent-light: rgba(180,220,210,0.5);
  --border: rgba(140,155,170,0.25);
  --card-bg: rgba(255,255,255,0.3);
  --term-color: #3c4b5f;
  background-image: url('/static/floral/bailu_bg_floral.jpg');
}

/* 冬 · 冰蓝 */
body.season-winter {
  --bg-paper: #e8edf2;
  --text-primary: #2a3545;
  --text-secondary: #5a6a7e;
  --text-muted: #7a8a9e;
  --accent: #3a5a7a;
  --accent-light: rgba(170,195,220,0.5);
  --border: rgba(130,155,180,0.25);
  --card-bg: rgba(255,255,255,0.35);
  --term-color: #2e4058;
  background-image: url('/static/floral/winter_bg_floral.jpg');
}

/* ---------- 页面基础 ---------- */
body {
  font-family: 'Noto Serif SC', 'Songti SC', serif;
  background-color: var(--bg-paper);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  color: var(--text-primary);
  line-height: 1.8;
}

/* 半透明白色遮罩，保证文字清晰 */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(240,237,228,0.3);
  pointer-events: none;
  z-index: -1;
}

/* ---------- 节气标题区（如果页面有这个元素） ---------- */
.solar-term-header {
  text-align: center;
  padding: 30px 0 20px;
}
.solar-term-title {
  font-size: 56px;
  font-weight: 700;
  color: var(--term-color);
  letter-spacing: 8px;
}
.solar-term-keyword {
  font-size: 20px;
  color: var(--text-secondary);
  margin-top: 4px;
}
.solar-term-keyword-en {
  font-family: 'Noto Serif', Georgia, serif;
  font-size: 14px;
  color: var(--text-muted);
  font-style: italic;
  margin-top: 2px;
}

/* ---------- 短文区 ---------- */
.passage-title {
  font-size: 22px;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 6px;
}
.passage-meta {
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 20px;
}
.passage-meta .tag {
  display: inline-block;
  padding: 2px 10px;
  border: 1px solid var(--border);
  border-radius: 3px;
  margin-right: 8px;
  font-size: 12px;
}
.passage-en {
  font-family: 'Noto Serif', Georgia, serif;
  font-size: 17px;
  line-height: 2;
  color: var(--text-primary);
  text-align: justify;
  margin-bottom: 16px;
}
.passage-en .highlight,
.passage-en mark {
  background: var(--accent-light);
  padding: 1px 3px;
  border-radius: 2px;
  color: var(--accent);
  font-weight: 600;
}
.passage-cn {
  font-size: 15px;
  line-height: 1.9;
  color: var(--text-secondary);
  text-align: justify;
}

/* ---------- 朗读按钮 ---------- */
.audio-btn,
.play-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  background: var(--accent-light);
  border: 1px solid var(--border);
  border-radius: 20px;
  color: var(--accent);
  font-size: 14px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.2s;
  margin-top: 12px;
}
.audio-btn:hover, .play-btn:hover {
  filter: brightness(0.95);
}

/* ---------- 单词卡片 ---------- */
.word-item,
.vocab-item {
  padding: 12px 16px;
  background: var(--card-bg);
  border-left: 3px solid var(--accent);
  border-radius: 0 4px 4px 0;
  margin-bottom: 10px;
}
.word-en {
  font-family: 'Noto Serif', Georgia, serif;
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
}
.word-phonetic {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: 8px;
}
.word-pos {
  font-size: 12px;
  color: var(--text-muted);
  font-style: italic;
}
.word-cn {
  font-size: 13px;
  color: var(--text-secondary);
  margin-top: 2px;
}

/* ---------- 分区标题 ---------- */
.section-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--term-color);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
  margin: 25px 0 15px;
}

/* ---------- 页尾诗词 ---------- */
.season-poem {
  text-align: center;
  padding: 20px 0;
  border-top: 1px solid var(--border);
  margin-top: 30px;
}
.poem-cn {
  font-size: 15px;
  color: var(--text-secondary);
  letter-spacing: 1px;
}
.poem-en {
  font-family: 'Noto Serif', Georgia, serif;
  font-size: 12px;
  color: var(--text-muted);
  font-style: italic;
  margin-top: 4px;
}
.poem-src {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 4px;
}

/* ---------- 底部 ---------- */
.site-footer {
  display: flex;
  justify-content: space-between;
  padding-top: 15px;
  border-top: 1px solid var(--border);
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 20px;
}

/* ---------- 响应式 ---------- */
@media (max-width: 600px) {
  .solar-term-title { font-size: 40px; }
  .passage-en { font-size: 15px; }
  .passage-cn { font-size: 14px; }
}

/* ============================================
   二十四节气独立皮肤（覆盖季节默认）
   每个节气：独立背景图 + 微调accent色
   已生成背景图的节气：liqiu / bailu / qiufen
   其余节气背景图待补充，暂用季节默认
   ============================================ */

/* 秋季节气 */
body.term-liqiu {
  background-image: url('/static/floral/liqiu_bg_floral.jpg');
  --accent: #8b6b3a;
  --accent-light: rgba(210,180,130,0.45);
  --term-color: #6b5030;
}
body.term-bailu {
  background-image: url('/static/floral/bailu_bg_floral.jpg');
  --accent: #3c6b55;
  --accent-light: rgba(180,220,210,0.5);
  --term-color: #3c4b5f;
}
body.term-qiufen {
  background-image: url('/static/floral/qiufen_bg_floral.jpg');
  --accent: #9a7b3a;
  --accent-light: rgba(220,200,140,0.45);
  --term-color: #6b5530;
}
/* 秋季节气 */
body.term-chushu {
  background-image: url('/static/floral/chushu_bg_floral.jpg');
  --accent: #7a6b4a;
  --term-color: #5a4d35;
}
body.term-hanlu {
  background-image: url('/static/floral/hanlu_bg_floral.jpg');
  --accent: #5a7a6a;
  --term-color: #3a5a4a;
}
body.term-shuangjiang {
  background-image: url('/static/floral/shuangjiang_bg_floral.jpg');
  --accent: #8b5a4a;
  --term-color: #6b3a30;
}

/* 春季节气 */
body.term-lichun {
  background-image: url('/static/floral/lichun_bg_floral.jpg');
  --accent: #8b4a5a;
  --term-color: #6b3040;
}
body.term-yushui {
  background-image: url('/static/floral/yushui_bg_floral.jpg');
  --accent: #7a6b8a;
  --term-color: #504565;
}
body.term-jingzhe {
  background-image: url('/static/floral/jingzhe_bg_floral.jpg');
  --accent: #c47a8a;
  --term-color: #8b4a5a;
}
body.term-chunfen {
  background-image: url('/static/floral/chunfen_bg_floral.jpg');
  --accent: #6b8a7a;
  --term-color: #406050;
}
body.term-qingming {
  background-image: url('/static/floral/qingming_bg_floral.jpg');
  --accent: #5a7a6a;
  --term-color: #355545;
}
body.term-guyu {
  background-image: url('/static/floral/guyu_bg_floral.jpg');
  --accent: #8b6a8a;
  --term-color: #604560;
}

/* 夏季节气 */
body.term-lixia {
  background-image: url('/static/floral/lixia_bg_floral.jpg');
  --accent: #c46a4a;
  --term-color: #8b4025;
}
body.term-xiaoman {
  background-image: url('/static/floral/xiaoman_bg_floral.jpg');
  --accent: #9a8a4a;
  --term-color: #6b5a25;
}
body.term-mangzhong {
  background-image: url('/static/floral/mangzhong_bg_floral.jpg');
  --accent: #8a9a5a;
  --term-color: #556530;
}
body.term-xiazhi {
  background-image: url('/static/floral/xiazhi_bg_floral.jpg');
  --accent: #8b4a6a;
  --term-color: #602a45;
}
body.term-xiaoshu {
  background-image: url('/static/floral/xiaoshu_bg_floral.jpg');
  --accent: #c47a5a;
  --term-color: #8b4530;
}
body.term-dashu {
  background-image: url('/static/floral/dashu_bg_floral.jpg');
  --accent: #6a8a9a;
  --term-color: #355565;
}

/* 冬季节气 */
body.term-lidong {
  background-image: url('/static/floral/lidong_bg_floral.jpg');
  --accent: #7a7a6a;
  --term-color: #505040;
}
body.term-xiaoxue {
  background-image: url('/static/floral/xiaoxue_bg_floral.jpg');
  --accent: #6a7a8a;
  --term-color: #405060;
}
body.term-daxue {
  background-image: url('/static/floral/daxue_bg_floral.jpg');
  --accent: #5a6a8a;
  --term-color: #354060;
}
body.term-dongzhi {
  background-image: url('/static/floral/dongzhi_bg_floral.jpg');
  --accent: #8a7a5a;
  --term-color: #605030;
}
body.term-xiaohan {
  background-image: url('/static/floral/xiaohan_bg_floral.jpg');
  --accent: #7a5a6a;
  --term-color: #503545;
}
body.term-dahan {
  background-image: url('/static/floral/dahan_bg_floral.jpg');
  --accent: #6a5a7a;
  --term-color: #403550;
}