/* ========== 公共日历组件样式 ========== */
.calendar-module {
    background: #fff;
    border-radius: 8px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.calendar-header { display:flex; align-items:center; justify-content:center; gap:4px; flex-wrap:wrap; }
.calendar-header input { width:34px; padding:4px 2px; text-align:center; border:1px solid var(--color-border); border-radius:4px; font-size:12px; }
.calendar-header .btn-turn { padding:4px 8px; background:var(--color-gold); color:#fff; border:none; border-radius:4px; cursor:pointer; font-size:12px; transition:all 0.2s ease; }
.calendar-header .btn-turn:hover { background-color:#c59b2e; }
.calendar-nav { display:flex; justify-content:center; align-items:center; gap:3px; margin-bottom:4px; }
.calendar-nav button { padding:2px 6px; font-size:11px; border:1px solid var(--color-border); border-radius:3px; background:#fff; cursor:pointer; color:var(--color-text-sec); font-family:"MiSans",sans-serif; transition:all .15s; }
.calendar-nav button:hover { background:#e8e0d0; border-color:var(--color-gold); }
.calendar-nav .btn-today { width:20px; height:20px; border:1.5px solid var(--color-fire); border-radius:50%; background:transparent; color:var(--color-fire); font-size:10px; padding:0; line-height:1; text-indent:-1px; }
.calendar-nav .btn-today:hover { background:var(--color-fire); color:#fff; }
.calendar-week { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; font-weight:600; color:var(--color-text); font-size:11px; padding-bottom:6px; border-bottom:1px solid var(--color-border-light); }
.calendar-week span.today { color:var(--color-gold); }
.calendar-days { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; text-align:center; }
.calendar-days .day-item { padding:4px 2px; border-radius:4px; font-size:11px; cursor:pointer; transition:all 0.2s ease; }
.calendar-days .day-item .lunar { font-size:8px; color:var(--color-text-muted); display:block; margin-top:1px; }
.calendar-days .day-item .cal-ganzhi { font-size:7px; color:#0074E5; display:block; margin-top:0; }
.calendar-days .day-item.active { background:var(--color-gold); color:#fff; }
.calendar-days .day-item.active .lunar,
.calendar-days .day-item.active .cal-ganzhi { color:#fff; }
.calendar-days .day-item .lunar.jieqi { color:var(--color-fire); font-weight:600; }
.calendar-days .day-item.active .lunar.jieqi { color:rgba(255,200,200,0.95); }
.calendar-date-info { text-align:center; padding:6px 0; border-top:1px solid var(--color-border-light); border-bottom:1px solid var(--color-border-light); }
.calendar-date-info .solar-date { font-size:13px; font-weight:400; color:var(--color-text); margin-bottom:2px; }
.calendar-date-info .lunar-date { font-size:11px; font-weight:300; color:var(--color-text-sec); }
.calendar-bazi-info { font-size:11px; font-weight:300; color:var(--color-text); text-align:center; }
.calendar-jieqi-info { font-size:11px; color:var(--color-fire); text-align:center; margin-top:4px; line-height:1.7; }
.calendar-reverse { display:flex; align-items:center; gap:4px; margin-top:6px; flex-wrap:wrap; }
.calendar-reverse input { flex:1; min-width:22px; padding:5px 4px; border:1px solid var(--color-border); border-radius:4px; font-size:11px; }
.calendar-reverse .btn-reverse { padding:5px 8px; background:#0074E5; color:#fff; border:none; border-radius:4px; cursor:pointer; font-size:11px; white-space:nowrap; transition:all 0.2s ease; }
.calendar-reverse .btn-reverse:hover { background-color:#005bb5; }

/* ── 手机端覆盖 ── */
body.mode-mobile .calendar-module   { max-width:none; width:100%; }
body.mode-mobile .calendar-header   { gap:2px; }
body.mode-mobile .calendar-header input { width:28px; font-size:11px; }
body.mode-mobile .calendar-header .btn-turn { padding:3px 6px; font-size:11px; }
body.mode-mobile .calendar-reverse  { flex-wrap:wrap; }
body.mode-mobile .calendar-reverse input { min-width:18px; font-size:10px; padding:4px 2px; }
body.mode-mobile .calendar-reverse span { font-size:10px; }
body.mode-mobile .calendar-reverse .btn-reverse { font-size:10px; padding:4px 6px; }
body.mode-mobile .calendar-nav button { font-size:11px; padding:3px 6px; }

/* ── Dark 模式 ── */
html[data-theme="dark"] .calendar-module { background: var(--color-panel); }
html[data-theme="dark"] .calendar-header input,
html[data-theme="dark"] .calendar-reverse input { background: var(--color-input-bg); color: var(--color-text); border-color: var(--color-input-border); }
html[data-theme="dark"] .calendar-nav button { background: var(--color-subtle); color: var(--color-text-sec); border-color: var(--color-border); }
html[data-theme="dark"] .calendar-nav button:hover { background: var(--color-border-light); }
html[data-theme="dark"] .calendar-days .day-item .cal-ganzhi { color: var(--color-star-aux); }
html[data-theme="dark"] .calendar-reverse .btn-reverse { background: #6e6290; }
html[data-theme="dark"] .calendar-reverse .btn-reverse:hover { background: #8478ad; }
