/* ===== 移工申辦流程管理系統 ===== */
* { box-sizing: border-box; }
body { margin: 0; font-family: "Microsoft JhengHei", "PingFang TC", "Noto Sans TC", sans-serif; background: #f0f2f5; color: #1f2937; font-size: 14px; }
a { color: #2563eb; text-decoration: none; }

/* 頂列 */
.topbar { display: flex; justify-content: space-between; align-items: center; background: #1e293b; color: #fff; padding: 10px 20px; }
.topbar .brand { font-size: 18px; font-weight: 700; letter-spacing: 1px; }
.userbox { display: flex; gap: 16px; align-items: center; font-size: 13px; }
.userbox .logout { color: #fca5a5; }
.userbox .toplink { color: #bfdbfe; }
.userbox .toplink:hover, .userbox .logout:hover { text-decoration: underline; }

/* 導覽列 */
.mainnav { display: flex; flex-wrap: wrap; background: #334155; padding: 0 12px; }
.mainnav a { color: #e2e8f0; padding: 11px 16px; font-size: 14px; border-bottom: 3px solid transparent; }
.mainnav a:hover { background: #475569; }
.mainnav a.active { background: #f0f2f5; color: #1e293b; font-weight: 700; border-radius: 6px 6px 0 0; }
.mainnav a.newcase { margin-left: auto; background: #16a34a; color: #fff; border-radius: 6px; margin-top: 5px; margin-bottom: 5px; padding: 6px 14px; align-self: center; }
.mainnav a.newcase:hover { background: #15803d; }

/* 查詢列 */
.searchbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: #fff; margin: 12px 16px 0; padding: 10px 14px; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.searchbar label { font-weight: 600; color: #475569; }
.searchbar input, .searchbar select { padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 14px; }

/* 內容區 */
.content { padding: 12px 16px 40px; }
.page-title { display: flex; align-items: center; gap: 10px; margin: 10px 0; }
.page-title h2 { margin: 0; font-size: 17px; border-left: 4px solid #2563eb; padding-left: 10px; }
.page-title .count { color: #64748b; }
.page-title .spacer { flex: 1; }

/* 按鈕 */
.btn { display: inline-block; padding: 7px 14px; border-radius: 6px; border: 1px solid transparent; cursor: pointer; font-size: 14px; }
.btn-primary { background: #2563eb; color: #fff; }
.btn-primary:hover { background: #1d4ed8; }
.btn-green { background: #16a34a; color: #fff; }
.btn-green:hover { background: #15803d; }
.btn-ghost { background: #fff; border-color: #cbd5e1; color: #475569; }
.btn-danger { background: #fff; border-color: #fca5a5; color: #dc2626; }
.btn-sm { padding: 3px 8px; font-size: 12px; }

/* 大型進度表格 */
.table-wrap { overflow: auto; max-height: calc(100vh - 140px); background: #fff; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
table.grid { border-collapse: collapse; width: 100%; min-width: 1200px; }
table.grid th, table.grid td { border: 1px solid #e2e8f0; padding: 6px 8px; text-align: center; white-space: nowrap; }
table.grid thead { position: sticky; top: 0; z-index: 3; }
table.grid thead th { background: #f1f5f9; color: #334155; font-weight: 600; box-shadow: inset 0 -1px 0 #e2e8f0; }
table.grid thead tr.grp th { background: #e2e8f0; }
table.grid tbody tr:nth-child(even) { background: #f8fafc; }
table.grid tbody tr:hover { background: #eff6ff; }
table.grid td.left { text-align: left; }
.sub { color: #64748b; font-size: 12px; }

/* 表頭日期排序切換連結 */
table.grid thead th a.sortlink { color: #1d4ed8; text-decoration: none; font-weight: 600; white-space: nowrap; }
table.grid thead th a.sortlink:hover { text-decoration: underline; }
table.grid thead th a.sortlink .arr { font-size: 10px; margin-left: 2px; }

/* 狀態標籤 */
.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 12px; color: #fff; }
.b-blue { background: #2563eb; } .b-teal { background: #0d9488; } .b-red { background: #dc2626; }
.b-gray { background: #64748b; } .b-dark { background: #334155; } .b-orange { background: #ea580c; }

/* 卡片 / 區塊 */
.card { background: #fff; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.08); padding: 16px; margin-bottom: 14px; }
.card h3 { margin: 0 0 10px; font-size: 15px; border-left: 4px solid #2563eb; padding-left: 8px; display: flex; align-items: center; }
.card h3 .spacer { flex: 1; }
.kv { display: flex; flex-wrap: wrap; gap: 6px 26px; }
.kv .item { min-width: 150px; }
.kv .item b { color: #475569; font-weight: 600; margin-right: 6px; }

/* 表單 */
.formgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px 16px; }
.fld label { display: block; font-weight: 600; color: #475569; margin-bottom: 4px; }
.fld input, .fld select, .fld textarea { width: 100%; padding: 7px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 14px; font-family: inherit; }
.fld textarea { resize: vertical; }
.form-actions { margin-top: 16px; display: flex; gap: 10px; }
fieldset.group { border: 1px solid #e2e8f0; border-radius: 8px; margin: 0 0 14px; padding: 12px; }
fieldset.group legend { font-weight: 700; color: #1e40af; padding: 0 6px; }
.checks { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.checks label { font-weight: normal; }

/* 登入頁 */
.login-wrap { max-width: 380px; margin: 8vh auto; background: #fff; padding: 32px; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,.1); }
.login-wrap h1 { font-size: 20px; text-align: center; margin: 0 0 24px; }
.login-wrap .fld { margin-bottom: 14px; }
.err { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; padding: 8px 12px; border-radius: 6px; margin-bottom: 12px; }
.msg { background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; padding: 8px 12px; border-radius: 6px; margin-bottom: 12px; }

/* 入帳月曆 */
.cal-head { display: flex; align-items: center; gap: 12px; margin: 10px 0; }
.cal-head h2 { margin: 0; font-size: 17px; }
table.calendar { border-collapse: collapse; width: 100%; background: #fff; border-radius: 8px; }
table.calendar th { border: 1px solid #e2e8f0; background: #f1f5f9; padding: 6px; color: #475569; }
table.calendar td { border: 1px solid #e2e8f0; vertical-align: top; width: 14.28%; height: 96px; padding: 4px; }
table.calendar td .day { font-weight: 700; color: #64748b; text-align: right; }
table.calendar td.other { background: #f8fafc; }
.pay-chip { display: block; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 6px; padding: 3px 6px; margin: 3px 0; font-size: 12px; white-space: normal; color: #312e81; }
.pay-chip .amt { font-weight: 700; }

/* 到期提醒 */
.alertbar { background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 8px 12px; margin: 0 0 12px; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.alertbar b { color: #b91c1c; }
.alert-item { color: #b91c1c; background: #fff; border: 1px solid #fecaca; border-radius: 6px; padding: 2px 8px; font-size: 13px; }
.alert-item:hover { background: #fee2e2; }
.expiring { color: #dc2626; font-weight: 700; }

/* 月份小標籤 */
.mchip { display: inline-block; background: #fce7f3; color: #9d174d; border-radius: 5px; padding: 0 6px; font-size: 11px; margin: 1px 2px 1px 0; }

/* 入帳週曆 (RWD 格線) */
.weekgrid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; }
.wday { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px; min-height: 110px; }
.wday-head { font-weight: 700; color: #475569; border-bottom: 1px solid #f1f5f9; padding-bottom: 4px; margin-bottom: 4px; display: flex; justify-content: space-between; align-items: baseline; }
.wday-head .dnum { color: #94a3b8; font-weight: 400; font-size: 12px; }
.wday.today { background: #eff6ff; border-color: #bfdbfe; }
.wday.today .wday-head { color: #1d4ed8; }
.wday-empty { color: #cbd5e1; text-align: center; padding: 8px 0; }
.due-card { position: relative; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 5px 7px; margin: 3px 0; font-size: 12px; box-shadow: 0 1px 1px rgba(0,0,0,.05); }
.due-card.paid { background: #f0fdf4; border-color: #bbf7d0; }
.due-card.manual { border-style: dashed; }
.due-card .due-check label { font-weight: 600; cursor: pointer; }
.due-card .due-months { margin-top: 2px; }
.due-card .due-edit { position: absolute; top: 4px; right: 6px; color: #94a3b8; font-size: 12px; }
.paid-card { display: block; background: #eef2ff; border: 1px solid #c7d2fe; border-radius: 8px; padding: 5px 7px; margin: 3px 0; font-size: 12px; white-space: normal; color: #312e81; }
.paid-card .pc-name { display: block; font-weight: 600; }
.paid-card .pc-amt { display: block; font-weight: 700; }
.paid-card .pc-remit { display: block; color: #64748b; font-size: 11px; }

/* 月份下拉複選 */
.msel { position: relative; }
.msel-btn { width: 100%; text-align: left; padding: 7px 8px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; font-size: 14px; font-family: inherit; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.msel-btn.empty { color: #94a3b8; }
.msel-btn .caret { color: #64748b; }
.msel-panel { display: none; position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; width: max-content; min-width: 100%; max-width: min(90vw, 420px); background: #fff; border: 1px solid #cbd5e1; border-radius: 8px; box-shadow: 0 6px 18px rgba(0,0,0,.12); padding: 8px 10px; grid-template-columns: repeat(3, 1fr); gap: 2px 10px; }
.msel.open .msel-panel { display: grid; }
.msel-panel label, .fld .msel-panel label { display: flex; align-items: center; gap: 6px; font-weight: normal; color: #1f2937; white-space: nowrap; margin: 0; padding: 5px 4px; cursor: pointer; border-radius: 6px; }
.msel-panel label:hover { background: #f1f5f9; }
.msel-panel input[type=checkbox] { width: auto; }

/* 雇主自動完成 */
.case-ac.ac-bad { border-color: #f87171; background: #fef2f2; }

/* 管理費 / 支出表 */
.monthpick { display: flex; gap: 8px; align-items: center; background: #fff; padding: 6px 10px; border-radius: 8px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.monthpick label { font-weight: 600; color: #475569; }
.monthpick input[type=month] { padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 14px; }
.sales-link { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
table.grid tr.sel { background: #fefce8 !important; }
table.grid tfoot td { background: #f1f5f9; font-weight: 700; }
.statecell .rowform { display: flex; justify-content: center; align-items: center; margin: 0; }
.statecell input[type=date] { padding: 3px 4px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 12px; width: 130px; }
.statecell input[type=checkbox] { width: 17px; height: 17px; cursor: pointer; }
.subsearch { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: #fff; border: 2px solid #fca5a5; border-radius: 8px; padding: 10px 14px; margin-bottom: 12px; }
.subsearch label { font-weight: 700; color: #475569; }
.subsearch input { padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 14px; }
.hint { color: #64748b; background: #fff; border: 1px dashed #cbd5e1; border-radius: 8px; padding: 14px; }

/* 文件檔案上傳 */
.file-upload-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.file-upload-row label { font-weight: 600; color: #475569; }
.file-upload-row select, .file-upload-row input[type=file] { padding: 6px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 13px; background: #fff; }

/* 前台區塊分隔線 */
hr.sep { border: none; border-top: 1px solid #e2e8f0; margin: 12px 0; }

/* 前台/後台切換頁首 */
.case-head { display: flex; align-items: center; gap: 12px; background: #f1f5f9; border-radius: 8px; padding: 10px 14px; margin-bottom: 14px; flex-wrap: wrap; }
.case-head .no { font-size: 17px; font-weight: 700; }
.foot { text-align: center; color: #94a3b8; padding: 18px; font-size: 12px; }

/* ===== RWD 手機版 ===== */
.cal-head { flex-wrap: wrap; }
.cal-nav, .cal-actions { display: flex; gap: 8px; }

@media (max-width: 1024px) {
  .weekgrid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 768px) {
  body { font-size: 15px; }
  /* 導覽列: 橫向捲動 */
  .topbar { flex-wrap: wrap; gap: 6px; padding: 8px 12px; }
  .topbar .brand { font-size: 16px; }
  .userbox { font-size: 12px; gap: 10px; flex-wrap: wrap; }
  .mainnav { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 0 6px; }
  .mainnav a { white-space: nowrap; padding: 10px 12px; font-size: 13px; }
  .mainnav a.newcase { margin-left: 8px; }
  /* 查詢列: 直式排列 */
  .searchbar { margin: 10px 8px 0; padding: 10px; }
  .searchbar input[type=text] { flex: 1 1 140px; min-width: 0; }
  .searchbar select { flex: 1 1 100px; }
  .searchbar .btn { flex: 1 1 auto; text-align: center; }
  .content { padding: 10px 8px 40px; }
  .alertbar { font-size: 13px; }
  /* 週曆: 直式一天一列 */
  .weekgrid { grid-template-columns: 1fr; gap: 6px; }
  .wday { min-height: 0; }
  .wday-head { border-bottom: none; margin-bottom: 2px; padding-bottom: 0; }
  .wday-empty { padding: 0; text-align: left; font-size: 12px; display: inline; }
  .due-card, .paid-card { font-size: 14px; }
  /* 頁首工具列: 換行、按鈕好點 */
  .cal-head { gap: 8px; }
  .cal-head h2 { font-size: 15px; width: 100%; }
  .cal-nav { width: 100%; }
  .cal-nav .btn { flex: 1; text-align: center; }
  .cal-actions { width: 100%; }
  .cal-actions .btn { flex: 1; text-align: center; }
  .cal-head .count { width: 100%; }
  .page-title { flex-wrap: wrap; }
  .page-title h2 { font-size: 15px; }
  .btn { padding: 9px 14px; }  /* 觸控友善 */
  .btn-sm { padding: 6px 10px; }
  /* 明細表: 轉為卡片 */
  table.grid.resp { min-width: 0; }
  table.grid.resp thead { display: none; }
  table.grid.resp, table.grid.resp tbody, table.grid.resp tr, table.grid.resp td { display: block; width: 100%; }
  table.grid.resp tr { border: 1px solid #e2e8f0; border-radius: 8px; margin-bottom: 8px; background: #fff; padding: 4px 0; }
  table.grid.resp tbody tr:nth-child(even) { background: #fff; }
  table.grid.resp td { border: none; border-bottom: 1px solid #f1f5f9; text-align: right; white-space: normal; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 6px 10px; }
  table.grid.resp td:last-child { border-bottom: none; }
  table.grid.resp td::before { content: attr(data-label); font-weight: 600; color: #64748b; text-align: left; }
  table.grid.resp td[data-label=""]::before { content: none; }
  table.grid.resp td.nomobile { display: none; }
  table.grid.resp tfoot tr { background: #f1f5f9; }
  /* 表單 */
  .formgrid { grid-template-columns: 1fr; }
  .fld input, .fld select, .fld textarea { font-size: 16px; } /* 避免 iOS 自動縮放 */
}
/* 未填承接日提醒（2026-09-13） */
.warnbar { background:#fffbeb; border:1px solid #fcd34d; border-radius:8px; padding:10px 12px; margin:12px 0; color:#92400e; display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:14px; }
.flag-nt { display:inline-block; margin-left:6px; background:#fffbeb; border:1px solid #fcd34d; color:#92400e; border-radius:6px; padding:1px 6px; font-size:12px; white-space:nowrap; }
/* 雇主名稱連結（2026-09-16：點雇主名稱進案件詳細頁） */
a.emp-link { color:#1d4ed8; font-weight:600; text-decoration:none; }
a.emp-link:hover { text-decoration:underline; }

/* 求才招募 通過日下方發文文號 (2026-09-23) */
.grid .doc-no{font-size:12px;color:#666;white-space:nowrap}