/*
 * 05 sds 排班管理 — 單位排班作業
 *
 * 搬進專案時對應 wwwroot/css/areas/Scheduling/sds/Index.css
 * 色彩一律引用 cw_tokens.css 的變數。
 */

/* ===== 人力配置分段表 ===== */
.cov-tbl td .inp { width: 64px; }

/* ===== 同仁資料表 ===== */
.staff-tbl td .inp { height: 28px; font-size: var(--cw-fs-table); }
.staff-tbl td .inp.name { width: 96px; }
.staff-tbl td .inp.code { width: 84px; }

/* ===== 班表矩陣 ===== */
.roster-wrap {
    overflow: auto;
    max-height: 560px;
    border: 1px solid var(--dash-border);
    border-radius: var(--cw-radius-sm);
}

table.roster {
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--cw-fs-table);
}

table.roster th,
table.roster td {
    padding: 5px 3px;
    border-bottom: 1px solid var(--dash-grid);
    text-align: center;
    white-space: nowrap;
}

/* 表頭：日期 + 星期，往下捲仍看得到 */
table.roster thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--dash-grid);
    color: var(--dash-muted);
    font-size: var(--cw-fs-label);
    font-weight: var(--cw-fw-semibold);
    border-bottom: 1px solid var(--dash-border);
    min-width: 62px;
}

table.roster thead th .dow {
    display: block;
    font-size: var(--cw-fs-tiny);
    font-weight: var(--cw-fw-normal);
}

/* 姓名欄凍結：橫捲時仍看得到是誰 */
table.roster .name-col {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 104px;
    padding-left: var(--cw-sp-3);
    text-align: left;
    background-color: var(--dash-card-bg);
    border-right: 1px solid var(--dash-border);
    font-weight: var(--cw-fw-semibold);
}

table.roster thead .name-col {
    z-index: 3;
    background-color: var(--dash-grid);
}

table.roster .name-col .meta {
    display: block;
    font-size: var(--cw-fs-tiny);
    font-weight: var(--cw-fw-normal);
    color: var(--dash-muted);
}

table.roster tbody tr:hover td,
table.roster tbody tr:hover .name-col { background-color: var(--dash-grid); }

.roster .weekend { background-color: rgba(201, 64, 58, .07); }
.roster th.weekend { background-color: rgba(201, 64, 58, .12); color: var(--dash-red); }

/* 班別色塊：淺底深字，作法沿用 Dashboard 的 .stat-icon */
.sh {
    display: inline-block;
    min-width: 56px;
    padding: 2px 4px;
    border-radius: var(--cw-radius-sm);
    /* 班別名稱為部桃實際代碼（彈8-16'、8-12/13-17 等），字級略縮以容納 */
    font-size: var(--cw-fs-tiny);
    font-weight: var(--cw-fw-semibold);
    line-height: 1.35;
    letter-spacing: -.01em;
    cursor: pointer;
    border: 1px solid transparent;
    transition: border-color var(--cw-transition);
}

.sh:hover { border-color: var(--dash-muted); }

/* 行政班（8-12/13-17）：護理長等非三班人員 */
.sh-a  { color: var(--dash-green);  background-color: var(--cw-green-bg); }
.sh-d  { color: var(--dash-blue);   background-color: var(--cw-blue-bg); }
.sh-e  { color: var(--dash-yellow); background-color: var(--cw-yellow-bg); }
.sh-n  { color: var(--dash-priority, #7B3491); background-color: rgba(123, 52, 145, .12); }
.sh-off{ color: var(--dash-muted);  background-color: var(--dash-grid); }
.sh-bk { color: var(--dash-muted);  background-color: var(--dash-grid); }
.sh-v  { color: var(--dash-green);  background-color: var(--cw-green-bg); }
.sh-x  { color: var(--dash-text);   background-color: var(--cw-text-bg); }

/* 鎖定（要班需求）：加粗外框，與班別色並存 */
.sh-lock { box-shadow: inset 0 0 0 1.5px var(--dash-blue); }

/* 違規：紅框 */
.sh-bad { box-shadow: inset 0 0 0 1.5px var(--dash-red); }

/* 合計欄 */
.roster .tot {
    background-color: var(--dash-grid);
    font-weight: var(--cw-fw-semibold);
    font-variant-numeric: tabular-nums;
    border-left: 1px solid var(--dash-border);
    min-width: 34px;
}

/* 每日人力統計列 */
.roster tfoot td {
    background-color: var(--dash-grid);
    font-size: var(--cw-fs-label);
    font-weight: var(--cw-fw-semibold);
    font-variant-numeric: tabular-nums;
    color: var(--dash-muted);
    border-top: 1px solid var(--dash-border);
}

.roster tfoot .name-col {
    background-color: var(--dash-grid);
    font-size: var(--cw-fs-label);
}

.roster tfoot .short { color: var(--dash-red); }
.roster tfoot .ok { color: var(--dash-green); }

/* ===== 圖例 ===== */
.legend {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cw-sp-2) var(--cw-sp-5);
    padding: var(--cw-sp-3) 0 0;
    font-size: var(--cw-fs-label);
    color: var(--dash-text);
}

.legend span { display: inline-flex; align-items: center; gap: var(--cw-sp-2); }

/* ===== 人力預測警示列 ===== */
.forecast {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cw-sp-2);
    padding: var(--cw-sp-3) var(--cw-sp-4);
    background-color: var(--cw-yellow-bg);
    border-left: 3px solid var(--dash-yellow);
    border-radius: var(--cw-radius-sm);
    margin-bottom: var(--cw-sp-3);
    font-size: var(--cw-fs-table);
    color: #8a6518;
}

.forecast .ttl { font-weight: var(--cw-fw-semibold); }

.forecast .day {
    padding: 1px var(--cw-sp-2);
    border-radius: var(--cw-radius-sm);
    background-color: rgba(255, 255, 255, .6);
    cursor: pointer;
    transition: background-color var(--cw-transition);
}

.forecast .day:hover { background-color: #fff; }

.forecast .src {
    margin-left: auto;
    font-size: var(--cw-fs-tiny);
    color: var(--dash-muted);
}

/* ===== 檢核清單 ===== */
.issues { margin: 0; padding: 0; list-style: none; font-size: var(--cw-fs-table); }

.issues li {
    display: flex;
    align-items: flex-start;
    gap: var(--cw-sp-2);
    padding: var(--cw-sp-2) 0;
    border-bottom: 1px solid var(--dash-grid);
}

.issues li:last-child { border-bottom: 0; }

.issues .lvl {
    flex: 0 0 auto;
    padding: 1px var(--cw-sp-2);
    border-radius: var(--cw-radius-sm);
    font-size: var(--cw-fs-tiny);
    font-weight: var(--cw-fw-semibold);
}

.issues .lvl-err { color: var(--dash-red); background-color: var(--cw-red-bg); }
.issues .lvl-wrn { color: var(--dash-yellow); background-color: var(--cw-yellow-bg); }

.issues .who { font-weight: var(--cw-fw-semibold); }
.issues .jump { margin-left: auto; color: var(--dash-blue); cursor: pointer; font-size: var(--cw-fs-label); }
.issues .jump:hover { text-decoration: underline; }

/* ===== 要班需求格 ===== */
.req-cell {
    min-width: 34px;
    cursor: pointer;
}

.req-cell .mk {
    display: inline-block;
    min-width: 28px;
    padding: 2px 3px;
    border-radius: var(--cw-radius-sm);
    font-size: var(--cw-fs-label);
    font-weight: var(--cw-fw-semibold);
}

.req-r { color: var(--dash-blue); background-color: var(--cw-blue-bg); }
.req-v { color: var(--dash-green); background-color: var(--cw-green-bg); }
.req-o { color: var(--dash-muted); background-color: var(--dash-grid); }

/* ===== 供需試算 ===== */
.feas {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cw-sp-5);
    padding: var(--cw-sp-4);
    background-color: var(--dash-grid);
    border-radius: var(--cw-radius-sm);
    font-size: var(--cw-fs-table);
}

.feas .item .k { font-size: var(--cw-fs-label); color: var(--dash-muted); }

.feas .item .v {
    font-size: 18px;
    font-weight: var(--cw-fw-bold);
    font-variant-numeric: tabular-nums;
}

.feas .item .v.short { color: var(--dash-red); }
.feas .item .v.ok { color: var(--dash-green); }

/* ===== 列印 ===== */
@media print {
    .sidebar, .topbar, .steps, .step-foot, .demo-badge, .no-print { display: none !important; }
    .roster-wrap { max-height: none; overflow: visible; }
    .card { border: 0; }
}

/* ===== 出勤狀態色塊（08 ras 出勤報表共用本檔）===== */
.sh-ok        { color: var(--dash-green);  background-color: var(--cw-green-bg); }
.sh-bad-mark  { color: var(--dash-yellow); background-color: var(--cw-yellow-bg); }
.sh-absent    { color: var(--dash-red);    background-color: var(--cw-red-bg); }

/* ===== 取代 inline style（架構護欄：HTML 字串不可帶 style 屬性）===== */
.note-sm { font-size: var(--cw-fs-label); color: var(--dash-muted); }
.mt-3 { margin-top: var(--cw-sp-3); }

/* 要班需求圖例的色塊：與表格內的 .mk 同色，但加大內距便於辨識 */
.mk-chip {
    display: inline-block;
    padding: 2px 6px;
    border-radius: var(--cw-radius-sm);
    font-size: var(--cw-fs-label);
    font-weight: var(--cw-fw-semibold);
}