/* works.css — 部门工作管理（自适应：PC 横表 / 移动端卡片自动换行） */

.wk-wrap { padding: 12px 14px 34px; }
.wk-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }

.wk-seg { display: inline-flex; background: var(--glass-bg, rgba(127,127,127,.08)); border: 1px solid var(--line); border-radius: 10px; padding: 3px; }
.wk-seg button { border: 0; background: transparent; color: var(--ink-2); font: inherit; font-size: 13px; padding: 6px 14px; border-radius: 8px; cursor: pointer; }
.wk-seg button.on { background: var(--brand); color: var(--brand-ink, #fff); font-weight: bold; }

.wk-nav { display: inline-flex; align-items: center; gap: 6px; }
.wk-arrow, .wk-today { border: 1px solid var(--line); background: transparent; color: var(--ink-2); border-radius: 8px; cursor: pointer; font: inherit; font-size: 13px; padding: 5px 10px; }
.wk-arrow:hover, .wk-today:hover { border-color: var(--brand); color: var(--brand); }
.wk-range { font-size: 12.5px; color: var(--ink-2); min-width: 156px; text-align: center; }

.wk-search { flex: 1 1 170px; min-width: 140px; padding: 7px 11px; border: 1px solid var(--line); border-radius: 9px; background: transparent; color: var(--ink); font: inherit; font-size: 13px; }
.wk-search::placeholder { color: var(--ink-3); }

.wk-sum { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 10px; font-size: 12.5px; color: var(--ink-3); }
.wk-k b { font-size: 15px; color: var(--ink); }
.wk-k.doing b { color: var(--info); }
.wk-k.done b { color: var(--ok); }
.wk-k.near b { color: #d97706; }
.wk-k.over b { color: var(--danger); }
.wk-k.dim { opacity: .75; }

.wk-tablewrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.wk-table { width: 100%; border-collapse: collapse; font-size: 12.5px; table-layout: fixed; min-width: 1020px; }
.wk-table th, .wk-table td { border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); padding: 7px 9px; vertical-align: top; text-align: left; word-break: break-word; overflow-wrap: anywhere; }
.wk-table th { background: var(--glass-bg, rgba(127,127,127,.06)); font-size: 11.5px; color: var(--ink-3); font-weight: bold; white-space: nowrap; }
.wk-table tr:last-child td { border-bottom: 0; }
.wk-table td:last-child, .wk-table th:last-child { border-right: 0; }

.wk-c-seq { width: 44px; text-align: center; }
.wk-c-content { width: 176px; }
.wk-c-startDate { width: 78px; }
.wk-c-dueDate { width: 88px; }
.wk-c-owner { width: 74px; }
.wk-c-progress { width: 138px; }
.wk-c-overall { width: 156px; }
.wk-c-attachments { width: 112px; }
.wk-c-deliverables { width: 112px; }
.wk-c-assigner { width: 74px; }

.wk-seq { display: inline-block; min-width: 20px; color: var(--ink-3); }
.wk-td[data-f] { cursor: pointer; }
.wk-td[data-f]:hover { background: var(--brand-soft, rgba(22,103,214,.07)); }
.wk-tr.is-done .wk-td { opacity: .62; }
.wk-text { white-space: pre-wrap; line-height: 1.45; }
.wk-ph { color: var(--ink-3); font-style: normal; }
.wk-date { font-family: var(--font-mono); font-size: 12px; }
.wk-due { display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 5px; font-size: 10.5px; font-weight: bold; }
.wk-due.over { background: var(--danger-soft); color: var(--danger); }
.wk-due.near { background: rgba(217,119,6,.16); color: #d97706; }
.wk-due.done { background: var(--ok-soft); color: var(--ok); }

.wk-prog { display: flex; align-items: center; gap: 5px; font-size: 12px; }
.wk-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong); flex: 0 0 7px; }
.wk-dot.on { background: var(--ok); }
.wk-pc { margin-left: auto; font-size: 10.5px; color: var(--ink-3); white-space: nowrap; }

.wk-files { display: flex; flex-direction: column; gap: 3px; }
.wk-file { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; font-size: 11.5px; max-width: 100%; }
.wk-file:hover i { color: var(--brand); text-decoration: underline; }
.wk-file i { font-style: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.wk-td.wk-editing { background: var(--panel); padding: 4px; }
.wk-input { width: 100%; box-sizing: border-box; padding: 5px 7px; border: 1px solid var(--brand); border-radius: 6px; background: var(--bg); color: var(--ink); font: inherit; font-size: 12.5px; }
.wk-ta { resize: vertical; }

.wk-tip { position: fixed; z-index: 9999; max-width: 320px; padding: 7px 11px; background: var(--ink); color: var(--bg); font-size: 12px; line-height: 1.5; border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.24); white-space: pre-wrap; word-break: break-word; pointer-events: none; }

.pv-text { white-space: pre-wrap; line-height: 1.6; font-size: 13.5px; }
.pv-empty { color: var(--ink-3); font-size: 13px; }
.pv-list { max-height: 300px; overflow: auto; }
.pv-li { display: flex; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.pv-li b { flex: 0 0 66px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.pv-imgwrap img { max-width: 100%; border-radius: 10px; }
.pg-head b { font-size: 14px; }
.pg-sub { font-size: 11.5px; color: var(--ink-3); margin: 4px 0 8px; }
.pg-list { max-height: 320px; overflow: auto; }
.pg-item { display: flex; gap: 10px; align-items: center; padding: 7px 4px; border-bottom: 1px solid var(--line); font-size: 13px; }
.pg-item.empty .pg-txt i { color: var(--ink-3); }
.pg-day { flex: 0 0 52px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.pg-txt { flex: 1; word-break: break-word; }
.pg-edit { flex: 0 0 auto; font-size: 11.5px; color: var(--brand); }

/* ---------- 移动端：表格转卡片，自动换行 ---------- */
@media (max-width: 1023px) {
  .wk-wrap { padding: 10px 10px 84px; }
  .wk-range { min-width: 0; }
  .wk-tablewrap { overflow: visible; border: 0; background: transparent; }
  .wk-table { min-width: 0; display: block; }
  .wk-table thead { display: none; }
  .wk-table tbody { display: block; }
  .wk-tr { display: block; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); margin-bottom: 10px; padding: 8px 10px; }
  .wk-tr.is-done { opacity: .78; }
  .wk-td { display: flex; gap: 8px; border: 0 !important; padding: 5px 0; width: auto !important; }
  .wk-td::before { flex: 0 0 76px; color: var(--ink-3); font-size: 11.5px; line-height: 1.7; }
  /* 标签按列名绑定（不用 nth-child，避免加列后错位） */
  .wk-c-chk::before { content: "选择"; }
  .wk-c-content::before { content: "工作内容"; }
  .wk-c-startDate::before { content: "开始日期"; }
  .wk-c-dueDate::before { content: "截止日期"; }
  .wk-c-owner::before { content: "责任人"; }
  .wk-c-progress::before { content: "今日进度"; }
  .wk-c-overall::before { content: "推进情况"; }
  .wk-c-attachments::before { content: "通知/附件"; }
  .wk-c-deliverables::before { content: "交付/成果"; }
  .wk-c-assigner::before { content: "安排人"; }
  .wk-td > * { flex: 1; min-width: 0; }
  .wk-c-seq { display: none; }
  .wk-td[data-f]:hover { background: transparent; }
  .wk-td.wk-editing { display: block; }
  .wk-due { margin-left: 6px; }
}

/* ---------- 行选择（批量归档 / 删除） ---------- */
.wk-c-chk { width: 38px; text-align: center !important; vertical-align: middle !important; }
.wk-c-chk input { width: 15px; height: 15px; cursor: pointer; accent-color: var(--brand); }
.wk-bulk {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 7px 11px; margin: 8px 9px 0;
  background: var(--glass-bg, rgba(127,127,127,.07));
  border: 1px solid var(--brand); border-radius: 10px;
  font-size: 12.5px; color: var(--ink-2);
  position: sticky; top: 0; z-index: 3;
}
.wk-bulk[hidden] { display: none; }
.wk-bulk b { color: var(--brand); font-size: 14px; }
.wk-bulk .btn { padding: 4px 11px; }

/* ---------- 每日进度面板 ---------- */
.pg-add { padding: 4px 14px 10px; }
.pg-empty { padding: 18px 4px; text-align: center; color: var(--ink-3); font-size: 12.5px; }

/* ---------- 上传按钮（触屏友好） ---------- */
.wk-upadd {
  display: inline-flex; align-items: center; gap: 4px;
  margin-top: 4px; padding: 3px 10px;
  border: 1px dashed var(--brand); border-radius: 8px;
  background: transparent; color: var(--brand);
  font: inherit; font-size: 11.5px; cursor: pointer;
}
.wk-upadd:active { background: color-mix(in srgb, var(--brand) 12%, transparent); }
.wk-files + .wk-upadd { margin-left: 6px; }

/* ---------- 信息密度收紧（列表页去空白） ---------- */
.wk-wrap { padding: 8px 10px 26px !important; }
.wk-bar { margin-bottom: 6px !important; gap: 6px !important; }
.wk-sum { gap: 12px !important; margin-bottom: 6px !important; }
.wk-table th, .wk-table td { padding: 4px 8px !important; }
.wk-table { font-size: 12px !important; }
@media (min-width: 1024px) {
  .wk-table { min-width: 960px !important; }
  .wk-c-content { width: 200px !important; }
}
@media (max-width: 1023px) {
  .wk-tr { padding: 5px 9px !important; margin-bottom: 7px !important; border-radius: 10px !important; }
  .wk-td { padding: 2.5px 0 !important; gap: 6px !important; }
  .wk-td::before { flex: 0 0 64px !important; font-size: 11px !important; line-height: 1.6 !important; }
  .wk-prog { min-height: 0 !important; }
  .wk-file i { max-width: 150px !important; }
  .wk-bulk { margin: 6px 6px 0 !important; padding: 5px 9px !important; }
}

/* ---------- v3 再宽再密（一屏多显示） ---------- */
@media (max-width: 1023px) {
  .wk-wrap { padding: 6px 6px 22px !important; }
  .wk-tr { padding: 4px 7px !important; margin-bottom: 6px !important; line-height: 1.35 !important; }
  .wk-td { padding: 2px 0 !important; }
  .wk-text, .wk-prog { line-height: 1.35 !important; }
  .wk-files { gap: 4px !important; }
}
.wk-text { line-height: 1.45 !important; }
.wk-bar .btn-sm { padding: 5px 10px !important; }

/* ========== v4 密集排布：内容填满、不留无效区间 ========== */
@media (max-width: 1023px) {
  /* 卡片贴边、极小间距 */
  .wk-wrap { padding: 5px 5px 20px !important; }
  .wk-tr { padding: 4px 8px !important; margin-bottom: 5px !important; line-height: 1.3 !important; }
  .wk-td { padding: 1.5px 0 !important; gap: 5px !important; font-size: 13.5px !important; }
  .wk-td::before { flex: 0 0 58px !important; font-size: 12px !important; line-height: 1.3 !important; }
  /* 日期并排、责任人/安排人并排 —— 一行顶两行 */
  .wk-c-startDate, .wk-c-dueDate, .wk-c-owner, .wk-c-assigner { display: inline-flex !important; width: 50% !important; vertical-align: top; }
  .wk-c-startDate::before { content: "开始" !important; }
  .wk-c-dueDate::before { content: "截止" !important; }
  /* 文字填满宽度 */
  .wk-text, .wk-prog { line-height: 1.35 !important; font-size: 14px !important; }
  .wk-files { gap: 4px !important; }
  .wk-file i { max-width: 120px !important; }
  .wk-bar { gap: 5px !important; margin-bottom: 5px !important; }
  .wk-sum { gap: 10px !important; margin-bottom: 5px !important; }
}
/* 新增/编辑弹窗：去空白、更紧凑 */
.modal { padding: 12px !important; }
.modal-title { font-size: 16.5px !important; margin-bottom: 6px !important; }
.modal .field { margin-bottom: 8px !important; }
.modal .field label { font-size: 12.5px !important; margin-bottom: 2px !important; }
.input, .textarea, .select { font-size: 14.5px !important; }
.input, .textarea { padding: 7px 10px !important; }
.modal-acts { margin: 10px -12px -12px !important; padding: 8px 12px calc(10px + env(safe-area-inset-bottom)) !important; }

/* ========== v5：移动端表格式管理（应用户要求，还原真表格+横向滚动+美化） ========== */
@media (max-width: 1023px) {
  .wk-wrap { padding: 6px 6px 22px !important; }
  /* 恢复真表格 + 容器横向滚动 */
  .wk-tablewrap { overflow: auto !important; border: 1px solid var(--line) !important; border-radius: 10px !important; background: var(--panel) !important; -webkit-overflow-scrolling: touch; }
  .wk-table { display: table !important; min-width: 860px !important; width: max-content !important; font-size: 13px !important; line-height: 1.35 !important; }
  .wk-table thead { display: table-header-group !important; }
  .wk-table thead th { display: table-cell !important; position: sticky !important; top: 0 !important; z-index: 3 !important; background: #f2f6fb !important; padding: 7px 8px !important; font-size: 11.5px !important; box-shadow: 0 1px 0 var(--line); }
  .wk-table tbody { display: table-row-group !important; }
  .wk-tr { display: table-row !important; border: 0 !important; margin: 0 !important; padding: 0 !important; }
  .wk-tr:nth-child(even) td { background: color-mix(in srgb, var(--brand) 3%, var(--panel)); }
  .wk-td { display: table-cell !important; width: auto !important; padding: 5px 8px !important; gap: 0 !important; vertical-align: middle !important; border-bottom: 1px solid var(--line) !important; }
  .wk-td::before { content: none !important; }
  .wk-c-startDate, .wk-c-dueDate, .wk-c-owner, .wk-c-assigner { display: table-cell !important; width: auto !important; }
  .wk-c-startDate::before, .wk-c-dueDate::before { content: none !important; }
  /* 冻结前两列（选择+序号），横向滚动时保持可见 */
  .wk-c-chk { position: sticky !important; left: 0 !important; z-index: 2 !important; background: var(--panel) !important; width: 30px !important; padding: 5px 4px !important; }
  .wk-c-seq { display: table-cell !important; position: sticky !important; left: 30px !important; z-index: 2 !important; background: var(--panel) !important; width: 30px !important; }
  .wk-tr:nth-child(even) .wk-c-chk, .wk-tr:nth-child(even) .wk-c-seq { background: color-mix(in srgb, var(--brand) 3%, var(--panel)) !important; }
  /* 关键列宽度 */
  .wk-c-content { min-width: 170px !important; max-width: 230px !important; }
  .wk-c-overall { min-width: 150px !important; max-width: 200px !important; }
  .wk-c-progress { min-width: 110px !important; }
  .wk-c-attachments, .wk-c-deliverables { min-width: 120px !important; }
  /* 单元格内元素适配表格 */
  .wk-text { white-space: normal !important; font-size: 13.5px !important; line-height: 1.35 !important; }
  .wk-td > * { min-width: 0 !important; }
  .wk-file { margin: 1px 2px 1px 0 !important; }
  .wk-upadd { margin: 1px 0 1px 2px !important; padding: 2px 8px !important; font-size: 11.5px !important; }
  .wk-due { margin-left: 4px !important; }
  .wk-bulk { margin: 6px 2px 0 !important; }
}
/* 上传进度条（固定底部居中） */
.upprog {
  position: fixed; left: 50%; bottom: calc(76px + env(safe-area-inset-bottom)); transform: translateX(-50%);
  width: min(86vw, 340px); z-index: 999;
  background: var(--glass-bg-strong); border: 1px solid var(--glass-line); border-radius: 12px;
  padding: 10px 14px; box-shadow: var(--shadow-2);
}
.upprog-t { font-size: 12.5px; color: var(--ink-2); margin-bottom: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.upprog-b { height: 7px; border-radius: 4px; background: var(--panel-3); overflow: hidden; }
.upprog-b i { display: block; height: 100%; border-radius: 4px; background: var(--brand-grad); transition: width .15s ease; }
