/* ============================================================================
   012.tw · 農民曆「月曆」（.cal*）共用樣式（單一真實來源）
   ----------------------------------------------------------------------------
   ① /tool-datetime/almanac 的月曆卡片（datetime.php）
   ② 首頁「今天日期」浮窗（index.php ＋ javascripts/almanac.js）—— 浮窗裡的月曆 HTML
      由**同一個 AJAX 端點**產生（POST /tool-datetime/almanac，帶 ajax=1）→ 兩邊的
      月曆格、宜忌、近期節日資料與外觀完全一致。
   ⚠️ 2026-09-18 從 datetime.php 的 inline <style> 抽出來（原本只有工具頁在用）。
   ⚠️ 改這個檔要同步升**兩邊**的 ?v=：index.php 與 datetime.php 的 <link>。
   ⚠️ 這裡用到的 CSS 變數（--panel／--muted／--link／--text／--input-bg）定義在 css/nav.css，
      兩個頁面都有載入（首頁／工具頁都先載 nav.css）。
   ⚠️ 這裡**只放月曆**；黃曆撕頁日曆的 .hl* 樣式仍留在 datetime.php（只有工具頁要用）。
   ============================================================================ */

/* ---------- 農民曆：月曆（＋底部宜忌／近期節日） ---------- */
.cal-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:2px 0 10px}
.cal-bar button{border:0;border-radius:8px;padding:6px 12px;font-weight:700;cursor:pointer;font-size:13px;background:var(--panel);color:var(--muted);border:1px solid rgba(56,189,248,.3)}
.cal-bar button:hover{background:rgba(56,189,248,.25);color:#fff}
.cal-sel{font-size:13.5px;color:var(--muted);display:flex;align-items:center;gap:5px}
.cal-sel select{background:var(--input-bg);border:1px solid rgba(56,189,248,.3);border-radius:8px;color:var(--text);padding:5px 8px;font-size:14px;outline:none}
.cal-now{margin-left:auto;font-size:13.5px;color:var(--muted);display:flex;align-items:center;gap:6px}
.cal-now b{color:var(--link);font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.5px}
.cal-now em{font-style:normal;color:var(--link);font-weight:700}
.cal{background:#f8f4e9;border:1px solid #d8c7a4;border-radius:10px;overflow:hidden;box-shadow:0 10px 26px rgba(0,0,0,.35);color:#3a2a18}
.cal-head{background:#b3261e;color:#fff;padding:9px 14px;font-size:15px;font-weight:700;display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
.cal-head b{font-size:19px;font-family:Georgia,"Times New Roman",serif}
.cal-head .r{font-weight:600;opacity:.95;font-size:13.5px}
.cal-wk{display:grid;grid-template-columns:repeat(7,1fr);background:#f2ead8;border-bottom:1px solid #e2d5ba}
.cal-wk span{text-align:center;font-size:13.5px;color:#7c6a4e;padding:7px 0;font-weight:700}
.cal-wk span.we{color:#b3261e}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:#e2d5ba}
.cal-d{background:#faf7ef;border:0;padding:6px 3px;min-height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;font-family:inherit;width:100%}
.cal-d.out{background:#f3ecdb;cursor:default}
.cal-d b{font-size:19px;font-weight:800;color:#2f2416;line-height:1.15;font-family:Georgia,"Times New Roman",serif}
.cal-d i{font-style:normal;font-size:12px;color:#8a7a5c;line-height:1.15}
.cal-d.we b{color:#b3261e}
.cal-d.fest i,.cal-d.mon i{color:#b3261e;font-weight:700}
.cal-d.jq i{color:#2e7d4f;font-weight:700}
.cal-d:hover{background:#fff8e6}
.cal-d.on{background:#fff3d6;box-shadow:inset 0 0 0 2px #b3261e}
.cal-d.today b{background:#b3261e;color:#fff;border-radius:999px;width:32px;height:32px;line-height:32px;text-align:center}
.cal-d.today i{color:#b3261e;font-weight:800}
/* 月曆底部：近期節日＋倒數（每個節日一顆膠囊，字比原本大一點、比較顯眼） */
.cal-fest{padding:11px 14px 13px;background:#f2ead8;border-top:1px solid #e2d5ba;font-size:14px;color:#4b3a22;display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;line-height:1.6}
.cal-fest>b{color:#b3261e;font-size:14px;font-weight:800;flex:none;margin-right:2px}
.cal-fest span{background:#fdfbf5;border:1px solid #e0d2b4;border-radius:999px;padding:3px 12px 4px;color:#4b3a22;font-weight:600}
.cal-fest span em{font-style:normal;color:#8a7a5c;font-size:13px}
.cal-fest span b{color:#2f2416;font-weight:800;font-size:15.5px}
.cal-fest span.now{color:#b3261e;font-weight:800;background:#fdeceb;border-color:#e8b7b3}
@media(max-width:560px){.cal-d{min-height:58px;padding:5px 1px}.cal-d b{font-size:16.5px}.cal-d i{font-size:11px}.cal-d.today b{width:28px;height:28px;line-height:28px}.cal-wk span{font-size:12.5px}.cal-fest{padding:9px 10px;font-size:12.5px;gap:6px 8px}.cal-yj{padding:8px 10px;font-size:11.5px}}
/* 月曆底部：選取日期的宜忌（在「近期節日」上方）
   ⚠️ 工具頁本身**不開浮窗**（站方指定，別再把工具頁的浮窗樣式加回來）；
      首頁的浮窗用的是下面這批 .cal* 樣式＋index.php 自己的 .calm-* 外框。 */
.cal-yj{padding:9px 14px 11px;background:#faf7ef;border-top:1px solid #e2d5ba;display:grid;gap:5px;font-size:12.5px;line-height:1.7;color:#5b4426}
.cal-yj .hd{font-weight:800;color:#b3261e}
.cal-yj .row{display:flex;gap:8px;align-items:flex-start}
.cal-yj .t{flex:none;width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:#fff;margin-top:2px}
.cal-yj .yi{color:#1f5130}
.cal-yj .yi .t{background:#2e7d4f}
.cal-yj .ji{color:#8a1f18}
.cal-yj .ji .t{background:#b3261e}