/* UI-128：行政・社勞服務的三階段進度（項目詳情、擔當作業待辦明細與待審查清單共用）。
 * 色票一律取自靜態稿 artifacts/ui/ui-128-department-three-stage-progress-v1.html 的 --done／--wait／--back／--todo（＋-bg），
 * 以及 customer-theme.css 既有 token（--c-brand、--c-border、--c-muted、--c-surface，追加服務 chip 的 #e7eef9／#2b4f86）。
 * 深色模式：本系統各頁的主題 CSS（styles.css、customer-theme.css、monthly-theme.css 等）都沒有 prefers-color-scheme／data-theme，
 * 頁面固定淺色；這裡若單獨加深色值，會在白底卡片上出現深色 chip，所以只定義淺色值（與全站一致），待全站導入深色模式時再一併補。 */
:root{--stage-done:#2f6b3a;--stage-done-bg:#e3f1e6;--stage-wait:#8a5a00;--stage-wait-bg:#fdf3dc;--stage-back:#a23b2a;--stage-back-bg:#fbe6e2;--stage-todo:#71807d;--stage-todo-bg:#eef0ef}
.service-stages{margin-top:10px;min-width:0;border-radius:10px}
.service-stages:focus{outline:2px solid var(--c-brand,#3f6e67);outline-offset:3px}
.service-stages-title{display:block;margin:0 0 6px;font-size:.95rem;overflow-wrap:anywhere}
.service-stage-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.service-stage{min-width:0;border:1px solid var(--c-border,#e9e3de);border-radius:10px;padding:8px 10px;background:var(--c-surface,#fff);font-size:.85rem;line-height:1.55;overflow-wrap:anywhere}
.service-stage[data-status="pending_review"]{border-color:var(--stage-wait)}
.service-stage[data-status="returned"]{border-color:var(--stage-back)}
.service-stage-name{display:block;font-size:.88rem;font-weight:700}
.service-stage-chip{display:inline-block;margin:2px 4px 2px 0;padding:0 8px;border-radius:999px;font-size:.75rem;font-weight:700;white-space:nowrap}
.service-stage-chip.is-done{background:var(--stage-done-bg);color:var(--stage-done)}
.service-stage-chip.is-pending{background:var(--stage-wait-bg);color:var(--stage-wait)}
.service-stage-chip.is-returned{background:var(--stage-back-bg);color:var(--stage-back)}
.service-stage-chip.is-idle{background:var(--stage-todo-bg);color:var(--stage-todo)}
.service-stage-chip.service-stage-migrated{background:#e7eef9;color:#2b4f86;white-space:normal}
.service-stage-meta,.service-stage-note{margin:2px 0 0;color:var(--c-muted,var(--stage-todo))}
.service-stage-note{color:inherit;white-space:pre-wrap}
.service-stage-reason{color:var(--stage-back)}
.service-stage-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px;min-width:0}
.service-stage-actions button{width:auto;min-height:36px;margin:0;padding:4px 12px;font-size:.82rem;white-space:normal}
.service-stage-self{margin:0;color:var(--c-muted,var(--stage-todo));font-size:.8rem}
.service-stages-error:empty{display:none}
.service-stages-error{margin:6px 0 0;color:var(--stage-back);font-size:.85rem}
.service-stage-history{margin-top:8px;font-size:.85rem}
.service-stage-history summary{cursor:pointer;color:var(--c-brand,#3f6e67);font-weight:700}
.service-stage-history-list{margin:6px 0 0;padding-left:20px;overflow-wrap:anywhere}
.service-stage-history-list li{margin:2px 0}
.service-stage-history-list li.is-previous-cycle{color:var(--c-muted,var(--stage-todo))}
.service-stage-replaces{margin:4px 0 8px}
.service-stage-summary{overflow-wrap:anywhere}
.service-stage-dialog{width:min(560px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:auto;padding:0;border:1px solid var(--c-border,#e9e3de);border-radius:16px;box-sizing:border-box}
.service-stage-dialog form{display:grid;gap:8px;padding:22px;min-width:0}
.service-stage-dialog h2{margin:0;font-size:1.15rem;overflow-wrap:anywhere}
.service-stage-dialog .eyebrow{margin:0;overflow-wrap:anywhere}
.service-stage-dialog .field{display:grid;gap:4px;min-width:0}
.service-stage-dialog textarea,.service-stage-dialog input{width:100%;max-width:100%;box-sizing:border-box}
.service-stage-dialog [aria-invalid="true"]{border-color:var(--stage-back)}
.service-stage-dialog .dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:8px}
.service-stage-dialog .dialog-actions button{width:auto}
.monthly-stage-reviews-table td{vertical-align:top}
.monthly-stage-reviews .service-stage-review-actions{margin-top:0}
.monthly-stage-reviews-page{margin:0 auto 0 0}
@media(max-width:720px){.service-stage-list{grid-template-columns:1fr}}
@media(max-width:520px){.service-stage-dialog form{padding:16px}.service-stage-dialog .dialog-actions button{flex:1 1 auto}}
/* Critic UI-128 第 2 輪 P2-3：唯讀進度 chip（serviceStageProgressNode，項目詳情、唯讀明細抽屜、行政審批頁共用）的色調自帶，
 * 不依賴各頁 .approval-chip 的既有色調是否載入（行政審批頁的 monthly-line-reviews.html 亦載入本檔）。 */
.approval-chip.service-stage-progress{display:inline-block;border-radius:999px;padding:1px 10px;font-size:.8rem;font-weight:700;white-space:nowrap}
.approval-chip.service-stage-progress.is-done{background:var(--stage-done-bg);color:var(--stage-done)}
.approval-chip.service-stage-progress.is-pending{background:var(--stage-wait-bg);color:var(--stage-wait)}
.approval-chip.service-stage-progress.is-revoked{background:var(--stage-back-bg);color:var(--stage-back)}
.approval-chip.service-stage-progress.is-idle{background:var(--stage-todo-bg);color:var(--stage-todo)}