/* page-schedule.css —— 班表頁專屬樣式

   ⚠⚠ **本檔必須排在 index.html 的 main.css 之後。** CSS 的載入順序就是優先序：
     排到 main.css 前面，同權重的規則勝負會反轉，而且只會在少數幾個元素上出現，
     那是最難查的一種跑版。

   ══ UI-11.2（2026-09-01）本檔內容整批置換 ═══════════════════════════
   原本這裡裝的是「營業時間」區塊（.biz-wrap，UI-9.1，約 130 行），
   那一整段連同 public/js/schedule.js 的 biz* 程式碼**已搬到營業時間單頁**
   （public/css/page-hours.css + public/js/hours.js，入口在「⋯」選單）。
   ⚠ 舊的 .biz-wrap 規則**沒有任何元素再引用**（新頁用的是 .hrs-wrap 那一套，
     版面也不同：起訖時間改成下拉、快捷鈕改為套用星期一），
     留著只會讓下一個人以為班表頁還有那個區塊，故整段刪除不留死碼。

   現在本檔只裝一件事：**月曆格子上的店家公休 / 特殊營業時間**。
   .cal / .cel / .dot / .lgd 的底盤全部在 main.css，本檔只追加狀態層。 */

/* ══ 月曆：店家公休與特殊營業時間（UI-11.2）═════════════════════════
   定稿：design/mockups/salon_hours_closures_v2.html 的「員工看到的班表」分頁。

   符號分工（與 12-1 的色點系統是**兩個不同的層次**，不要混為一談）：
     色點（圓 / 方）＝ 這天**誰**休假 —— 人的事
     整格框底       ＝ 這天**店**開不開、開到幾點 —— 店的事
   所以公休格照樣畫色點（全店的人那天都休），兩者疊在同一格不是冗餘。

   ⚠ .cel.closed / .cel.spc 必須排在 main.css 的 .cel.me 之後才贏得了它的
     box-shadow（本檔載入順序已保證）。公休日一定同時是「我的休假」，
     若讓金框勝出，畫面上就看不出這天是店休還是自己排的 —— 那正是要區分的重點。 */
.cel.closed {
  background: var(--lhrm-closed-bg);
  box-shadow: inset 0 0 0 1.5px var(--lhrm-closed);
}
.cel.closed .n { color: var(--lhrm-closed); }
.cel .cn {
  display: block; margin-top: 1px; font-size: 9.5px; letter-spacing: .5px;
  color: var(--lhrm-closed);
}
/* 特殊營業時間：只加藍框，**不加底色** —— 那天店照常開，不該和公休一樣搶眼。 */
.cel.spc { box-shadow: inset 0 0 0 1.5px var(--lhrm-special); }
.cel .sn {
  display: block; margin-top: 1px; font-size: 9px;
  font-family: var(--lhrm-font-mono); color: var(--lhrm-special);
}
/* 公休格是 .cel.lock（點不動），但 main.css 的 .cel.lock 會把整格壓到 opacity .5，
   紅框紅字跟著糊掉。這裡把公休格的透明度收回來 ——
   「不可點」用游標與 disabled 表達就夠了，資訊本身要看得清楚。 */
.cel.closed.lock { opacity: 1; cursor: default; }

/* 圖例：與上面兩種格子同一套視覺（框，不是點）*/
.lgd i.cls-i { border-radius: 2px; background: var(--lhrm-closed); }
.lgd i.spc-i {
  border-radius: 2px; background: var(--lhrm-special-bg);
  box-shadow: inset 0 0 0 1.5px var(--lhrm-special);
}
