/**
 * 节日页专属样式
 * 用于：/jieri/（节日大全）与 /jieri/{key}（129 个节日介绍页）
 * 正文分栏复用公用 .panel + .cx-article，本文件只写节日页特有的
 * 要素表、小标题、月份跳转、表格月份行、相邻与同月节日导航。
 */

/* 大全页的月份跳转条 */
.jr-months {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 14px;
  margin-bottom: 14px;
  font-size: 13px;
}

.jr-months a {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  color: var(--ink-soft);
  text-decoration: none;
}

.jr-months a:hover { color: var(--cinnabar); }
.jr-months b { font-family: var(--font-display); font-size: 12px; color: var(--gilt); }

/* 月份分组行：跨三列的浅鎏金小标题 */
.jr-month th {
  background: var(--field);
  color: var(--gilt);
  font-family: var(--font-display);
  font-size: 14px;
  letter-spacing: 0.14em;
  text-align: left;
}

/* 「时间」一栏是自由文案（农历正月初一 / 公历1月1日 / 每年5月的第二个星期日），别被压成逐字换行 */
.jr-when { white-space: nowrap; letter-spacing: 0.04em; }

/* 简介要素表：时间 / 繁体 / 别称 / 节日意义 / 节日饮食 … */
.jr-facts {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2px 18px;
  margin: 16px 0;
  padding: 14px 16px;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--card);
  font-size: 14px;
}

.jr-facts > div {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 4px 0;
}

.jr-facts dt {
  flex: 0 0 5.5em;
  color: var(--gilt);
  letter-spacing: 0.08em;
}

/* dd 是 flex 项，不给 min-width:0 时长文案会把整列顶宽（flex 项默认不缩到内容以下） */
.jr-facts dd { margin: 0; min-width: 0; color: var(--ink); }

/* 段落小标题（「传统民俗」「活动时间」这类），比 .cx-article h2 低一级 */
.jr-sub {
  margin: 14px 0 4px;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--jade);
  letter-spacing: 0.08em;
}

/* 相邻节日导航：上一节日 / 节日大全 / 下一节日 */
/* 同月节日内链：让 129 页横向也连起来 */
.jr-same {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 14px;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--field);
  font-size: 13px;
  line-height: 1.9;
}

.jr-same_label { color: var(--gilt); letter-spacing: 0.14em; }
.jr-same a { color: var(--ink-soft); text-decoration: none; }
.jr-same a:hover { color: var(--cinnabar); }

@media (min-width: 769px) {
  /* 宽屏两列：时间与繁体并排，长文案（别称、饮食）各占一列宽 */
  .jr-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px) {

  /* 大全表在 .tbl-scroll--fix 里靠 min-width:max-content 展开，整表列宽取各列的 max-content：
     181（「南京大屠杀死难者国家公祭日」13 字）+ 365（「公历7月中旬至8月中旬，初伏、中伏、末伏共三十或四十天」
     被 .jr-when 的 nowrap 拉成整行）+ 415（最长简介 31 字）= 961px，375 屏要横向拖近三屏。
     把简介限到 220px、时间列放开折行并限到 200px 后整表 601px（一屏半），实测只有 三伏 一行折到 3 行，
     没有任何单元格横向溢出。 */
  #jr_table th:last-child,
  #jr_table td:last-child { max-width: 220px; }
  #jr_table .jr-when { white-space: normal; max-width: 200px; }
}