/* page-attendance.css —— 店長出勤表 #attendance（打卡批次 5c；定稿 design/mockups/salon_attendance_v1.html V4）
   ⚠ 必須排在 index.html 的 main.css 之後（8-1）。全部限定在 .atd-wrap 之下、class 一律 atd- 前綴（高亮用 atd-on，不用全站的 .on）。
   色彩一律 token：遲到 / 早退 --c-money · 補登 --c-overlay · 位置異常 --c-warning · 0 與無資料 --lhrm-text-faint。 */
.atd-wrap { max-width: 980px; }
.atd-wrap .atd-hd { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 6px; }
.atd-wrap .atd-sub { margin: 0; font-size: 12px; color: var(--lhrm-text-dim); line-height: 1.6; }
.atd-wrap .atd-rt { display: flex; gap: 8px; align-items: center; }
/* 16px：iOS 對 < 16px 的輸入框聚焦會放大整頁（同 page-attset.css） */
.atd-wrap .atd-sel { padding: 6px 8px; font-size: 16px; color: var(--lhrm-text); background: var(--lhrm-input-bg); border: 1px solid var(--lhrm-border-2); border-radius: 3px; }
.atd-wrap .atd-sel option { color: var(--lhrm-text); background-color: var(--lhrm-surface); }
.atd-wrap .atd-lab { margin: 22px 0 8px; font-family: var(--lhrm-font-mono); font-size: 10px; letter-spacing: 2px; color: var(--lhrm-text-faint); }
.atd-wrap .atd-scroll { overflow-x: auto; border: 1px solid var(--lhrm-border-2); border-radius: 3px; }   /* 表格只在外層橫捲，頁面本身不撐寬 */
.atd-wrap .atd-tbl { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 12px; }
.atd-wrap .atd-tbl th { padding: 9px 10px; text-align: right; font-weight: 400; font-size: 11px; color: var(--lhrm-text-faint); border-bottom: 1px solid var(--lhrm-border-2); white-space: nowrap; }
.atd-wrap .atd-tbl td { padding: 9px 10px; text-align: right; border-bottom: 1px solid var(--lhrm-border); color: var(--lhrm-text); white-space: nowrap; }
.atd-wrap .atd-tbl tr:last-child td { border-bottom: 0; }
.atd-wrap .atd-tbl th:first-child, .atd-wrap .atd-tbl td:first-child { text-align: left; }
.atd-wrap .atd-sum tbody tr { cursor: pointer; }
.atd-wrap .atd-sum tbody tr:hover td, .atd-wrap .atd-sum tbody tr.atd-on td { background: var(--lhrm-surface-2); }
.atd-wrap .atd-sum tbody tr.atd-on td:first-child { box-shadow: inset 2px 0 0 var(--lhrm-gold); }
.atd-wrap .atd-nm i { font-style: normal; margin-left: 8px; font-size: 11px; color: var(--lhrm-text-dim); }
.atd-wrap .atd-det th:nth-child(5), .atd-wrap .atd-det .atd-st { text-align: left; white-space: normal; min-width: 150px; }
.atd-wrap .atd-det .atd-st small { display: block; margin-top: 2px; font-size: 10px; color: var(--lhrm-text-faint); }
.atd-wrap .atd-tbl td.atd-z { color: var(--lhrm-text-faint); }
.atd-wrap .atd-tbl td.atd-warn { color: var(--c-money); }
.atd-wrap .atd-tbl td.atd-ovr { color: var(--c-overlay); }
.atd-wrap .atd-tbl td.atd-geo { color: var(--c-warning); }
.atd-wrap .atd-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; font-size: 11px; color: var(--lhrm-text-dim); }
.atd-wrap .atd-legend i { display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; vertical-align: 0; }
.atd-wrap .atd-legend .atd-k-warn { background: var(--c-money); }
.atd-wrap .atd-legend .atd-k-ovr { background: var(--c-overlay); }
.atd-wrap .atd-legend .atd-k-geo { background: var(--c-warning); }
.atd-wrap .atd-note { margin-top: 22px; padding: 12px 14px; font-size: 12px; line-height: 1.75; color: var(--lhrm-text-dim); background: var(--lhrm-surface-2); border: 1px solid var(--lhrm-border-2); border-left: 2px solid var(--lhrm-gold); border-radius: 3px; }
.atd-wrap .atd-note b { color: var(--lhrm-text); font-weight: 500; }
/* 「⋯」選單的出勤入口只給手機（桌機走 rail）；權限由 data-perm 的 hidden 另外控制 */
@media (min-width: 761px) { #gmAttendance { display: none; } }