/**
 * 法定节假日页专用样式（/jiejiari/）
 * 公用盒体、表格、说明文字来自 style/chaxun.css；顶部年份下拉走公用 .cx-toolbar，
 * 本文件只放页面底部「历年放假安排」链接表的排版。
 *
 * 结构：
 *   <nav class="panel jj-years"> > .jj-years__title + .jj-years__list > a.jj-year
 */

/* .panel 只管底色描边，内边距须自己给，否则方片会贴着框边 */
.jj-years {
  padding: 18px 16px; /* 与 .cx-panel / .cx-article 同一套内边距 */
}

/* 框内小标题：完全沿用文章框 .cx-article h2 的规格（站内 h2 已重置为常规字重） */
.jj-years__title {
  margin: 0 0 10px;
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 400;
  letter-spacing: 0.1em;
  color: var(--ink);
}

/* 方片容器：flex 换行靠左顺排，末尾换行不居中 */
.jj-years__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 10px;
}

/* 单个年份方片（撕历卡风格：直角小圆角 + 细描边，不用胶囊圆）；25 枚一排，字号收紧免得占太高 */
.jj-year {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  padding: 7px 8px;
  background: var(--field);
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  font-family: var(--font-display);
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--ink);
  text-decoration: none;
  transition: border-color 0.2s var(--ease), color 0.2s var(--ease), background 0.2s var(--ease);
}

.jj-year:hover {
  border-color: var(--cinnabar);
  color: var(--cinnabar);
}

/* 当前年份：墨底反白，与站内的印章/选中态一致 */
.jj-year.on {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--field);
}

.jj-year.on:hover {
  color: var(--field);
}

@media (max-width: 768px) {
  .jj-years__list {
    gap: 8px;
  }

  .jj-year {
    min-width: 56px;
    padding: 6px 6px;
    font-size: 13.5px;
  }
}