/**
 * 日历组件样式（多 size 自适应：1x1 / 2x2 / 4x2）
 * 文件位置：script/widgets/calendar/index.css
 *
 * 布局策略（按外层 .halotab-card[data-size] 切换）：
 *   - 4x2（默认/最大）：左 today（年月 + 大日 + 第N天/农历） + 右 7×6 月网格
 *   - 2x2：仅显示 today，垂直排列【年月 → 大日 → 第N天 第N周 → 农历】，无右侧月网格
 *   - 1x1：仅显示星期（红色加大）+ 日期；其余信息全部隐藏
 *
 * 关键约束：
 *   - 整体 min-height:0 + overflow:hidden，确保不溢出 .halotab-card-widget-icon。
 *   - 右侧网格用 grid-template-rows: auto repeat(6, 1fr) 把日期行平均铺满，
 *     而不是用 aspect-ratio:1/1 锁死单元格高度（那会把 7 行撑出卡片底部）。
 *
 * 数据槽位（来自 calendar/icon.html）：
 *   .calendar-date  → "YYYY年M月"
 *   .calendar-day   → 日（数字）
 *   .calendar-week1 → "第N天 第N周"
 *   .calendar-week2 → "腊月初八 周一"（含农历 + 中文星期）
 *   .calendar-grid  → 表头 7 + 日期 42
 */
.halotab-widget-calendar{
  width: 100%; height: 100%;
  min-height: 0;
}
/* 让 widget icon 槽位的白底让位给本组件的彩色渐变（外层圆角/裁剪保留） */
.halotab-card-widget-icon:has(> .halotab-widget-calendar){
  background: transparent;
  box-shadow: none;
}
.halotab-widget-calendar .calendar-card{
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.6fr);
  gap: 12px;
  width: 100%; height: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  cursor: default;          /* 没有 main.html，不可点击 */
  align-items: stretch;
  min-height: 0;
  overflow: hidden;
  /* 固定柔和默认渐变；装饰层（.halotab-widget-deco-bg）由 icon.html 提供 */
  position: relative;
  border-radius: 14px;
  color: #2b3138;
  background: linear-gradient(to right top, #f5f3ff, #ede9fe, #ddd6fe);
}

/* ============================================================
 * 装饰性 SVG 背景：纯 SVG 光晕 + 星点 + 小日历，结构同其它 widget。
 * 用 currentColor 着色，跟随卡片文字色。
 * ============================================================ */
.halotab-widget-calendar .halotab-widget-deco-bg{
  position: absolute;
  inset: 0;
  pointer-events: none;
  color: var(--ht-deco-color, currentColor);
  z-index: 0;
}
.halotab-widget-calendar .halotab-widget-deco-bg svg{
  width: 100%;
  height: 100%;
  display: block;
}
/* 内容层在装饰层之上 */
.halotab-widget-calendar .calendar-today,
.halotab-widget-calendar .calendar-grid{ position: relative; z-index: 1; }

/* ============================================================
 * 2×2：隐藏右侧月网格，左侧 today 撑满整张卡，垂直排列
 *   年月 → 日（大）→ 第N天 第N周 → 农历
 * ============================================================ */
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-card{
  grid-template-columns: minmax(0, 1fr);
  padding: 10px 12px;
  gap: 0;
}
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-grid{ display: none; }
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-today{
  border-right: 0;
  padding-right: 0;
  gap: 4px;
  justify-content: center;
}
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-date{
  font-size: clamp(12px, 5.5cqi, 15px);
  font-weight: 600;
  opacity: .85;
}
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-day{
  /* 居中大字号；2×2 宽 ~176px，60~80px 比较合适 */
  font-size: clamp(48px, 36cqi, 84px);
  margin: 2px 0;
}
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-week1{
  font-size: clamp(11px, 4.6cqi, 13px);
  opacity: .9;
  font-weight: 500;
}
/* 2×2 农历单独成行；隐藏 week2（避免重复） */
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-week2{ display: none; }
.halotab-card[data-size="2x2"] .halotab-widget-calendar .calendar-lunar{
  display: block;
  font-size: clamp(10px, 4.2cqi, 12px);
  opacity: .75;
  color: #2b3138;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 100%;
}

/* ============================================================
 * 1×1：极简——星期（红色加大）+ 日期，垂直排列，其它隐藏
 * ============================================================ */
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-card{
  grid-template-columns: minmax(0, 1fr);
  padding: 6px 4px;
  gap: 0;
}
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-grid{ display: none; }
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-today{
  border-right: 0;
  padding-right: 0;
  gap: 2px;
  justify-content: center;
}
/* 1×1 隐藏：年月 + 第N天/第N周 + week2（含农历）+ lunar */
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-date,
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-week1,
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-week2,
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-lunar{
  display: none;
}
/* 1×1 星期（仅星期，不含农历）：红色加大；位于日期之上 */
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-week3{
  display: block;
  order: -1;            /* 在 flex 列里排到 .calendar-day 之前 */
  color: #fe5668;
  font-weight: 700;
  font-size: clamp(13px, 17cqi, 22px);
  line-height: 1.05;
  letter-spacing: 0;
}
.halotab-card[data-size="1x1"] .halotab-widget-calendar .calendar-day{
  font-size: clamp(28px, 42cqi, 56px);
  margin: 0;
  letter-spacing: -2px;
}

/* ---------- 左侧：今天 ---------- */
.halotab-widget-calendar .calendar-today{
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  gap: 4px;
  min-width: 0; min-height: 0;
  padding-right: 10px;
  border-right: 1px solid rgba(0,0,0,.06);
  overflow: hidden;
}
.halotab-widget-calendar .calendar-date{
  font-size: 13px;
  opacity: .85;
  letter-spacing: .5px;
  color: #2b3138;
}
.halotab-widget-calendar .calendar-day{
  flex: 1;
  display: flex; align-items: center; justify-content: center;
  width: 100%;
  font-size: clamp(36px, 12cqi, 64px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -1px;
  font-variant-numeric: tabular-nums;
  margin: 2px 0 4px;
  color: #1a1f25;
}
.halotab-widget-calendar .calendar-week1,
.halotab-widget-calendar .calendar-week2{
  font-size: 12px;
  opacity: .9;
  color: #2b3138;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 100%;
}
.halotab-widget-calendar .calendar-week2{ opacity: .75; }
/* 默认隐藏：仅在 1×1 / 2×2 size 下启用（见下方 size 适配段） */
.halotab-widget-calendar .calendar-week3,
.halotab-widget-calendar .calendar-lunar{
  display: none;
}

/* ---------- 右侧：日期网格 ---------- */
.halotab-widget-calendar .calendar-grid{
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  /* 1 行表头 + 6 行日期；表头自适应内容高度，日期 6 行均分剩余空间 */
  grid-template-rows: auto repeat(6, minmax(0, 1fr));
  gap: 2px 4px;
  font-size: clamp(10px, 4.6cqi, 13px);
  text-align: center;
  min-width: 0; min-height: 0;
  font-variant-numeric: tabular-nums;
  overflow: hidden;
}
.halotab-widget-calendar .calendar-grid > div{
  display: flex; align-items: center; justify-content: center;
  min-width: 0; min-height: 0;
  line-height: 1;
}
/* 周表头（前 7 个 div）字号略小、字重高一点 */
.halotab-widget-calendar .calendar-grid > div:nth-child(-n+7){
  font-size: clamp(10px, 4cqi, 12px);
  opacity: .7;
  font-weight: 600;
  padding: 0 0 2px;
}

/* 日期单元（被 div > div 包裹，方便加圆形高亮）。
   不再用 aspect-ratio 锁死，避免单元格高度跟列宽走导致整体超出卡片。
   只在视觉上约束一个最大圆斑尺寸。 */
.halotab-widget-calendar .calendar-grid > div > div{
  display: flex; align-items: center; justify-content: center;
  min-width: 0; min-height: 0;
  width: auto;
  height: 100%;
  max-height: 100%;
  padding: 0 4px;
  border-radius: 999px;
}
/* 给"圆形高亮"一个尽量正圆的视觉尺寸（按高度收宽度） */
.halotab-widget-calendar .currentDay{
  background: #fe5668;
  color: #fff !important;
  font-weight: 700;
  aspect-ratio: 1 / 1;
  width: auto;
  padding: 0;
}

.halotab-widget-calendar .lastMonth,
.halotab-widget-calendar .nextMonth{
  color: rgba(0,0,0,.28);
}
.halotab-widget-calendar .currentMonth{
  color: #2b3138;
}
.halotab-widget-calendar .weekend{
  color: #fe5668;
}
.halotab-widget-calendar .lastMonth.weekend,
.halotab-widget-calendar .nextMonth.weekend{
  color: rgba(254, 86, 104, .45);
}

/* ---------- 暗色主题 ----------
 * 卡片底色：用与详情面板一致的暗紫渐变（#1a1530 → #1f1a3a → #2a1f4a），
 * 与浅色版的紫色调延续，整组 widget 在 dark 主题下统一收敛到同色系夜调。
 * 同时叠加微弱的紫色径向光晕，避免一坨纯暗。 */
html[data-theme="dark"] .halotab-widget-calendar .calendar-card,
html[data-theme="auto"] .halotab-widget-calendar .calendar-card{
  color: #e6e9ee;
  background:
    radial-gradient(70% 60% at 8% 0%,  rgba(167,139,250,.18) 0%, rgba(167,139,250,0) 60%),
    radial-gradient(80% 70% at 100% 100%, rgba(139,92,246,.20) 0%, rgba(139,92,246,0) 65%),
    linear-gradient(to right top, #1a1530, #1f1a3a, #2a1f4a);
}
html[data-theme="dark"] .halotab-widget-calendar .calendar-today,
html[data-theme="auto"] .halotab-widget-calendar .calendar-today{
  border-right-color: rgba(255,255,255,.08);
}
html[data-theme="dark"] .halotab-widget-calendar .currentMonth,
html[data-theme="auto"] .halotab-widget-calendar .currentMonth,
html[data-theme="dark"] .halotab-widget-calendar .calendar-day,
html[data-theme="auto"] .halotab-widget-calendar .calendar-day,
html[data-theme="dark"] .halotab-widget-calendar .calendar-date,
html[data-theme="auto"] .halotab-widget-calendar .calendar-date,
html[data-theme="dark"] .halotab-widget-calendar .calendar-week1,
html[data-theme="auto"] .halotab-widget-calendar .calendar-week1,
html[data-theme="dark"] .halotab-widget-calendar .calendar-week2,
html[data-theme="auto"] .halotab-widget-calendar .calendar-week2,
html[data-theme="dark"] .halotab-widget-calendar .calendar-week3,
html[data-theme="auto"] .halotab-widget-calendar .calendar-week3,
html[data-theme="dark"] .halotab-widget-calendar .calendar-lunar,
html[data-theme="auto"] .halotab-widget-calendar .calendar-lunar{
  color: #e6e9ee;
}
html[data-theme="dark"] .halotab-widget-calendar .lastMonth,
html[data-theme="dark"] .halotab-widget-calendar .nextMonth,
html[data-theme="auto"] .halotab-widget-calendar .lastMonth,
html[data-theme="auto"] .halotab-widget-calendar .nextMonth{
  color: rgba(255,255,255,.28);
}
html[data-theme="dark"] .halotab-widget-calendar .lastMonth.weekend,
html[data-theme="dark"] .halotab-widget-calendar .nextMonth.weekend,
html[data-theme="auto"] .halotab-widget-calendar .lastMonth.weekend,
html[data-theme="auto"] .halotab-widget-calendar .nextMonth.weekend{
  color: rgba(254, 86, 104, .55);
}

/* =================================================================
 * 日历组件 · 详情面板（appBox key="calendar"）
 * 作用域：.ht-appbox-body[data-key="calendar"]
 * 布局：左 .calendar-box（年月切换 + 大网格） + 右 .calendar-lunar（选中日详情）
 * 设计参考：mTab 风格日历详情
 * ================================================================= */
.ht-appbox-body[data-key="calendar"]{
  --cal-border: rgba(0,0,0,.08);
  --cal-text: #2b3138;
  --cal-text-soft: rgba(0,0,0,.55);
  --cal-text-mute: rgba(0,0,0,.32);
  --cal-red: #f32d39;
  --cal-bg-soft: rgba(255,255,255,.6);
  --cal-blue: #2486f6;
  --cal-orange: #fc9001;
  padding: 16px;
  box-sizing: border-box;
  /* 复用 icon 卡片的紫色渐变（#f5f3ff → #ede9fe → #ddd6fe），
   * 叠两层径向光晕（与 icon SVG 中的左上 / 右下 currentColor 圆呼应），
   * 让详情面板和卡片形成视觉延续，不再是一片纯白。 */
  background:
    radial-gradient(60% 50% at 8% 6%,  rgba(167,139,250,.22) 0%, rgba(167,139,250,0) 60%),
    radial-gradient(70% 60% at 96% 100%, rgba(196,181,253,.28) 0%, rgba(196,181,253,0) 65%),
    linear-gradient(to right top, #f5f3ff, #ede9fe, #ddd6fe);
}
.ht-appbox-body[data-key="calendar"] .calendar-card{
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  width: 100%; height: 100%;
  min-width: 0; min-height: 0;
}
.ht-appbox-body[data-key="calendar"] .calendar-box,
.ht-appbox-body[data-key="calendar"] .calendar-lunar{
  display: flex; flex-direction: column;
  min-width: 0; min-height: 0;
}

/* ---------- 顶部头：年/月/箭头/今 ---------- */
.ht-appbox-body[data-key="calendar"] .box-head{
  display: flex; align-items: center;
  gap: 10px;
  padding: 0 4px 12px;
  flex-wrap: wrap;
}
.ht-appbox-body[data-key="calendar"] .ht-cal-yearbox{
  position: relative;
  display: inline-flex; align-items: center;
  width: 110px;
  height: 32px;
  border: 1px solid var(--cal-border);
  border-radius: 6px;
  /* 半透明玻璃，让下方紫色渐变透出来 */
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: 0 8px;
  box-sizing: border-box;
}
.ht-appbox-body[data-key="calendar"] .ht-cal-yearicon{
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--cal-text-mute);
  margin-right: 4px;
}
.ht-appbox-body[data-key="calendar"] .ht-cal-yearbtn{
  flex: 1;
  border: 0; outline: none; background: transparent;
  font-size: 13px;
  color: var(--cal-text);
  width: 100%; min-width: 0;
}
.ht-appbox-body[data-key="calendar"] .ht-cal-monthsel{
  height: 32px;
  border: 1px solid var(--cal-border);
  border-radius: 6px;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  padding: 0 8px;
  font-size: 13px;
  color: var(--cal-text);
  cursor: pointer;
  outline: none;
}
.ht-appbox-body[data-key="calendar"] .arrow-button{
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--cal-border);
  border-radius: 6px;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: var(--cal-text);
  cursor: pointer;
  padding: 0;
  font-size: 13px;
}
.ht-appbox-body[data-key="calendar"] .arrow-button:hover{
  background: rgba(255,255,255,.95);
}
.ht-appbox-body[data-key="calendar"] .arrow-button.todayBtn{
  font-size: 14px;
  font-weight: 600;
  color: var(--cal-blue);
  border-color: rgba(36,134,246,.4);
}
.ht-appbox-body[data-key="calendar"] .arrow-button .el-icon{
  width: 14px; height: 14px;
  display: inline-flex; align-items: center; justify-content: center;
}

/* ---------- 日期网格 ---------- */
.ht-appbox-body[data-key="calendar"] .calendar-grid{
  flex: 1;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  /* 表头 + 6 行日期 */
  grid-template-rows: 28px repeat(6, minmax(0, 1fr));
  gap: 4px;
  position: relative;
  min-height: 0;
}
/* 周表头（除"月份大数字"之外的前 7 个直接子 div） */
.ht-appbox-body[data-key="calendar"] .calendar-grid > div{
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  font-size: 13px;
  color: var(--cal-text-soft);
  min-width: 0; min-height: 0;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid > .month-Number{
  position: absolute;
  inset: 0;
  display: flex; align-items: center; justify-content: center;
  /* 背景大月份数字：进一步加大尺寸，让日历网格背后的"X月"更醒目 */
  font-size: clamp(220px, 32vw, 360px);
  font-weight: 800;
  color: rgba(0,0,0,.04);
  pointer-events: none;
  z-index: 0;
  line-height: 1;
  user-select: none;
}
/* 日期格 */
.ht-appbox-body[data-key="calendar"] .calendar-grid > .items{
  position: relative;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  border-radius: 8px;
  cursor: pointer;
  padding: 4px 2px;
  font-size: 16px;
  font-weight: 600;
  color: var(--cal-text);
  background: transparent;
  z-index: 1;
  transition: background .15s;
  min-width: 0; min-height: 0;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid > .items:hover{
  background: rgba(36,134,246,.08);
}
.ht-appbox-body[data-key="calendar"] .calendar-grid > .items > div:first-of-type:not(.holiday):not(.work){
  font-size: 17px;
  font-weight: 600;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items-lunar{
  font-size: 11px;
  font-weight: 400;
  color: var(--cal-text-mute);
  margin-top: 2px;
  max-width: 100%;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.weekend{
  color: var(--cal-red);
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.lastMonth,
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.nextMonth{
  color: var(--cal-text-mute);
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.lastMonth .items-lunar,
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.nextMonth .items-lunar{
  color: rgba(0,0,0,.22);
}
/* 节日 / 节气标红，保留禁用月时降饱和 */
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.currentMonth .festivals{
  color: var(--cal-red);
  opacity: .85;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.lastMonth .festivals,
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.nextMonth .festivals{
  color: rgba(243,45,57,.4);
}
/* 今天 */
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.currentDay{
  background: var(--cal-red);
  color: #fff;
  font-weight: 700;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.currentDay .items-lunar,
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.currentDay .festivals{
  color: rgba(255,255,255,.92);
  opacity: 1;
}
/* 选中（非今日） */
.ht-appbox-body[data-key="calendar"] .calendar-grid .items.selDay:not(.currentDay){
  outline: 2px solid var(--cal-red);
  outline-offset: -2px;
}
/* 班 / 休 角标 */
.ht-appbox-body[data-key="calendar"] .calendar-grid .items .holiday,
.ht-appbox-body[data-key="calendar"] .calendar-grid .items .work{
  position: absolute;
  top: 4px; right: 4px;
  font-size: 10px;
  line-height: 1;
  padding: 2px 4px;
  border-radius: 4px;
  font-weight: 600;
  color: #fff;
}
.ht-appbox-body[data-key="calendar"] .calendar-grid .items .holiday{ background: #f32d39; }
.ht-appbox-body[data-key="calendar"] .calendar-grid .items .work{ background: var(--cal-blue); }

/* ---------- 右栏：选中日详情 ---------- */
.ht-appbox-body[data-key="calendar"] .calendar-lunar{
  border-left: 0;
  /* 半透明玻璃面板，让外层紫色渐变隐约透出来，避免一块死灰 */
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.6);
  border-radius: 10px;
  padding: 16px;
  gap: 14px;
}
.ht-appbox-body[data-key="calendar"] .calendar-lunar-head{
  display: flex; flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
  padding-bottom: 12px;
  border-bottom: 1px dashed var(--cal-border);
}
.ht-appbox-body[data-key="calendar"] .calendar-lunar-head .calendar-date{
  font-size: 14px;
  color: var(--cal-text-soft);
}
.ht-appbox-body[data-key="calendar"] .calendar-lunar-head .calendar-day{
  font-size: 64px;
  font-weight: 800;
  line-height: 1;
  color: var(--cal-red);
  letter-spacing: -2px;
  font-variant-numeric: tabular-nums;
  margin: 4px 0 6px;
}
.ht-appbox-body[data-key="calendar"] .calendar-lunar-head .calendar-week2,
.ht-appbox-body[data-key="calendar"] .calendar-lunar-head .calendar-week1{
  font-size: 13px;
  color: var(--cal-text);
}
.ht-appbox-body[data-key="calendar"] .calendar-lunar-head .calendar-week1{
  color: var(--cal-text-soft);
}
.ht-appbox-body[data-key="calendar"] .lunar-other{
  /* 让所有信息行（生肖 / 星座 / 节日 / 宜 / 忌 / 月相·物候 / 五神位）
   * 在右栏剩余空间里等比展开，整体撑满容器，避免下方留白。
   * 7 行：前 6 行内容相对短，最后一行（五神位 .sw）天然两列、内容多，
   * 给它更大的权重 (1.4fr)，其它 1fr，整体保持视觉均衡。 */
  display: grid;
  grid-template-rows: repeat(6, minmax(0, 1fr)) minmax(0, 1.4fr);
  row-gap: 8px;
  flex: 1;
  min-height: 0;
  /* 内容超长时仍可滚动兜底；正常情况下不出现滚动条 */
  overflow: auto;
  padding-right: 4px;
}
.ht-appbox-body[data-key="calendar"] .lunar-other .LR{
  display: flex; align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--cal-text);
  line-height: 1.5;
  /* 每行垂直居中并占满分配到的网格高度 */
  min-height: 0;
  padding: 4px 0;
  border-bottom: 1px dashed var(--cal-border);
}
.ht-appbox-body[data-key="calendar"] .lunar-other .LR:last-child{
  border-bottom: 0;
  align-items: stretch;
  padding-bottom: 0;
}
.ht-appbox-body[data-key="calendar"] .lunar-other .LR > div:not(.tag):not(.sw){
  flex: 1;
  min-width: 0;
}
.ht-appbox-body[data-key="calendar"] .calendar-lunar-title.tag{
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
  padding: 2px 8px;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  line-height: 1.6;
  font-weight: 500;
  white-space: nowrap;
}
.ht-appbox-body[data-key="calendar"] .lunar-other .sw{
  /* 五神位：3 行 × 2 列布局（喜/阳贵 ｜ 阴贵/福神 ｜ 财神/空），
   * 在分配到的更高行里垂直平均铺开，撑满最后一格。 */
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: minmax(0, 1fr);
  gap: 4px 12px;
  font-size: 13px;
  color: var(--cal-text);
  width: 100%;
  height: 100%;
}
.ht-appbox-body[data-key="calendar"] .lunar-other .sw > div{
  display: flex; align-items: center;
  white-space: nowrap;
}
.ht-appbox-body[data-key="calendar"] .lunar-other .sw span{
  color: var(--cal-red);
  font-weight: 600;
  margin-left: 2px;
}

/* ---------- 暗色主题 · 详情面板 ---------- */
html[data-theme="dark"] .ht-appbox-body[data-key="calendar"],
html[data-theme="auto"] .ht-appbox-body[data-key="calendar"]{
  --cal-border: rgba(255,255,255,.1);
  --cal-text: #e6e9ee;
  --cal-text-soft: rgba(230,233,238,.7);
  --cal-text-mute: rgba(230,233,238,.4);
  --cal-bg-soft: rgba(255,255,255,.04);
  /* 暗色：保留同一套"紫色基调"语言，但整体大幅压暗。
   * 三层叠加：左上紫光 + 右下紫光 + 暗紫渐变底，与浅色版结构一一对应。 */
  background:
    radial-gradient(60% 50% at 8% 6%,  rgba(167,139,250,.18) 0%, rgba(167,139,250,0) 60%),
    radial-gradient(70% 60% at 96% 100%, rgba(139,92,246,.22) 0%, rgba(139,92,246,0) 65%),
    linear-gradient(to right top, #1a1530, #1f1a3a, #2a1f4a);
}
html[data-theme="dark"] .ht-appbox-body[data-key="calendar"] .ht-cal-yearbox,
html[data-theme="dark"] .ht-appbox-body[data-key="calendar"] .ht-cal-monthsel,
html[data-theme="dark"] .ht-appbox-body[data-key="calendar"] .arrow-button,
html[data-theme="auto"] .ht-appbox-body[data-key="calendar"] .ht-cal-yearbox,
html[data-theme="auto"] .ht-appbox-body[data-key="calendar"] .ht-cal-monthsel,
html[data-theme="auto"] .ht-appbox-body[data-key="calendar"] .arrow-button{
  background: rgba(255,255,255,.06);
  color: var(--cal-text);
}
html[data-theme="dark"] .ht-appbox-body[data-key="calendar"] .calendar-grid > .month-Number,
html[data-theme="auto"] .ht-appbox-body[data-key="calendar"] .calendar-grid > .month-Number{
  color: rgba(255,255,255,.04);
}
html[data-theme="dark"] .ht-appbox-body[data-key="calendar"] .calendar-lunar,
html[data-theme="auto"] .ht-appbox-body[data-key="calendar"] .calendar-lunar{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.08);
}