/* 老黄历网 · 月相查询页专属样式
   表单 / 面板 / 表格 / 提示复用公用 .cx-*（chaxun.css）与 .panel（site.css），本文件只管月历格与月相图形
   （工具条用公用的 .cx-toolbar，与 /jieqi/ /wuhou/ /sanfushujiu/ 同一套） */

/* ---- 月相图形：亮面用鎏金白、暗面用浓墨，一圈细边勾出月轮 ---- */
.yx_moon .yx_dark {
  fill: #2b3844;
}

.yx_moon .yx_lit {
  fill: #f3e6c2;
}

.yx_moon .yx_rim {
  fill: none;
  stroke: var(--ink);
  stroke-width: 0.9;
}

/* ---- 月历网格：满宽七列，不参与 .tbl-scroll 横向滚动（规范） ---- */
.yx-cal {
  padding: 0;
  overflow: hidden;
}

.yx-cal table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.yx-cal thead th {
  padding: 9px 0;
  background: var(--ink);
  color: var(--field);
  font: 700 13px/1 var(--font-body);
  letter-spacing: 0.14em;
}

.yx-cal thead th.we {
  color: #e8c98a; /* 周末列与全站月历一致 */
}

.yx-cal td {
  border: 1px solid var(--rule);
  vertical-align: top;
  text-align: center; /* 整格居中：日期、农历、月相图、读数一条竖线下来 */
  padding: 7px 4px 9px;
  height: 122px;
}

.yx-cal td.out {
  background: #efe9d8;
  color: #a49b85;
}

.yx-cal td.today {
  box-shadow: inset 0 0 0 2px var(--cinnabar);
}

.yx-cal .yx_d {
  display: block;
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 700;
}

.yx-cal td.out .yx_d,
.yx-cal td.out .yx_l {
  color: #b3aa92;
}

.yx-cal .yx_l {
  display: block;
  font-size: 11px;
  color: var(--ink-soft);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 月相图在上、读数在下：七列定宽表格里并排会被挤到裁字，竖排才稳 */
.yx_moonbox {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
}

.yx_moon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: block;
}

.yx_read {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  min-width: 0;
}

.yx_read b {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.yx_read i {
  font-style: normal;
  font-size: 11px;
  color: var(--ink-soft);
  white-space: nowrap;
}

/* 主相日（朔/上弦/望/下弦）在格底标出准确时刻 */
.yx_mark {
  margin-top: 5px;
  font-size: 11px;
  font-weight: 700;
  color: var(--cinnabar);
  letter-spacing: 0.03em;
}

.yx_cal a.yx_celllink {
  display: block;
  color: inherit;
  text-decoration: none;
}

.yx_cal a.yx_celllink:hover .yx_d {
  color: var(--cinnabar);
}

/* ---- 图例 ---- */
.yx_legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 16px;
  padding: 10px var(--pad);
  margin: 0;
  border-top: 1px dashed var(--rule);
  font-size: 12.5px;
  color: var(--ink-soft);
}

.yx_legend a {
  color: var(--jade);
  font-weight: 700;
  margin-left: 4px;
}

/* 朔望弦表首列：月相小图与名称同一行、在整行高度里垂直居中
   （td 默认 vertical-align:baseline，遇右侧长文案把行撑高时图与字会一上一下） */
.yx_ev-name {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

/* ---- 八相图例：固定四列两行，正好让「朔→望」与「望→朔」各占一行 ---- */
.yx_phases {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px 10px;
  padding: 4px 0 0;
}

.yx_phases figure {
  margin: 0;
  text-align: center;
}

.yx_phases .yx_moon {
  width: 46px;
  height: 46px;
  margin: 0 auto;
}

.yx_phases figcaption {
  margin-top: 4px;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--ink-soft);
}

.yx_phases figcaption b {
  display: block;
  font-family: var(--font-display);
  font-size: 14.5px;
  color: var(--ink);
  letter-spacing: 0.06em;
}

/* 表格里的月相小图：与 .cx-table 行高对齐 */
.cx-table .yx_moon {
  width: 26px;
  height: 26px;
  vertical-align: middle;
}

/* ---- 窄屏：七列每格只剩 ~48px，格内只留「日期 · 农历 · 月相图 · 照明度」，月龄让位 ---- */
@media (max-width: 768px) {
  .yx-cal td {
    height: auto;
    min-height: 96px;
    padding: 4px 2px 6px;
  }

  .yx_moon {
    width: 26px;
    height: 26px;
  }

  .yx_read i {
    display: none; /* 月龄只在 PC 展示，窄屏靠 title 提示 */
  }

  .yx_read b {
    font-size: 11.5px;
  }

  .yx_mark {
    margin-top: 3px;
    font-size: 10.5px;
    letter-spacing: 0;
  }

  /* 窄屏格内只留相名，准确时刻交给下方的「本月朔望弦时刻」表 */
  .yx_mark_t {
    display: none;
  }

  .yx_phases {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .yx-cal thead th {
    letter-spacing: 0;
  }
}

/* ---- 打印：只留月历格，工具条与文章不进纸 ---- */
@media print {
  /* 工具条本身带 .no-print（site.css 公用），这里只处理本页专属区块 */
  .yx_article,
  .site-header,
  .site-footer {
    display: none !important;
  }

  .yx-cal td {
    height: 96px;
    border-color: #bbb;
  }

  .yx_moon {
    width: 26px;
    height: 26px;
  }

  .yx_mark {
    color: #000 !important;
  }
}
