/* OpenDesign V8 — daily task workspace. Presentation only. */
body.bms-opendesign-v8 .task-panel.active { display:grid; gap:var(--bms-space-4); padding:var(--bms-space-4); border:1px solid var(--bms-border); border-radius:var(--bms-radius-3); background:var(--bms-surface); box-shadow:var(--bms-shadow-1); }
body.bms-opendesign-v8 .task-page-header { display:flex; align-items:end; justify-content:space-between; gap:var(--bms-space-4); padding:var(--bms-space-4); border:1px solid var(--bms-border); border-radius:var(--bms-radius-3); background:var(--bms-surface); box-shadow:var(--bms-shadow-1); }
body.bms-opendesign-v8 .task-page-header > div { min-width:0; }
body.bms-opendesign-v8 .task-page-header span { color:var(--bms-primary); font:750 10px/1 var(--bms-font-data); letter-spacing:.1em; }
body.bms-opendesign-v8 .task-page-header h2 { margin:var(--bms-space-2) 0 4px; color:var(--bms-text); font:750 28px/1.1 var(--bms-font-display); letter-spacing:-.03em; }
body.bms-opendesign-v8 .task-page-header p { margin:0; color:var(--bms-text-muted); font-size:12px; }
body.bms-opendesign-v8 .task-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--bms-space-3); }
body.bms-opendesign-v8 .task-metric { min-height:78px; padding:var(--bms-space-4); border:1px solid var(--bms-border); border-top:3px solid var(--bms-primary); border-radius:var(--bms-radius-2); background:var(--bms-surface); }
body.bms-opendesign-v8 .task-metric span, body.bms-opendesign-v8 .task-metric strong { display:block; }
body.bms-opendesign-v8 .task-metric span { color:var(--bms-text-muted); font-size:11px; }
body.bms-opendesign-v8 .task-metric strong { margin-top:var(--bms-space-2); color:var(--bms-text); font:750 24px/1 var(--bms-font-data); }
body.bms-opendesign-v8 .task-workspace-card { min-width:0; overflow:hidden; border:1px solid var(--bms-border); border-radius:var(--bms-radius-3); background:var(--bms-surface); box-shadow:var(--bms-shadow-1); }
body.bms-opendesign-v8 .task-toolbar { display:flex; align-items:center; justify-content:space-between; gap:var(--bms-space-4); padding:var(--bms-space-4); border-bottom:1px solid var(--bms-border); }
body.bms-opendesign-v8 .task-view-tabs, body.bms-opendesign-v8 .task-filters { display:flex; align-items:center; gap:4px; }
body.bms-opendesign-v8 .task-view-tabs button, body.bms-opendesign-v8 .task-filters button { min-height:34px; padding:0 var(--bms-space-3); border:0; border-radius:var(--bms-radius-1); color:var(--bms-text-muted); background:transparent; font-weight:700; cursor:pointer; }
body.bms-opendesign-v8 .task-view-tabs button.active { color:var(--bms-primary); background:var(--bms-primary-soft); }
body.bms-opendesign-v8 .task-filters { padding:var(--bms-space-3) var(--bms-space-4); border-bottom:1px solid var(--bms-border); }
body.bms-opendesign-v8 .task-filters button.active { color:var(--bms-text); background:var(--bms-surface-subtle); box-shadow:inset 0 0 0 1px var(--bms-border); }
body.bms-opendesign-v8 .task-search { display:flex; width:min(340px,42vw); align-items:center; gap:var(--bms-space-2); padding:0 var(--bms-space-3); border:1px solid var(--bms-border); border-radius:var(--bms-radius-round); }
body.bms-opendesign-v8 .task-search svg { width:17px; height:17px; fill:none; stroke:var(--bms-text-muted); stroke-width:1.8; }
body.bms-opendesign-v8 .task-panel .task-search > input[type="search"]:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="button"]):not([type="submit"]) { width:100%; min-height:38px; padding:0; border:0; border-radius:0; outline:0; background:transparent; box-shadow:none; }
body.bms-opendesign-v8 .task-list { display:grid; }
body.bms-opendesign-v8 .task-group + .task-group { border-top:1px solid var(--bms-border); }
body.bms-opendesign-v8 .task-group > header { display:flex; align-items:center; justify-content:space-between; padding:var(--bms-space-3) var(--bms-space-4); color:var(--bms-text-muted); background:var(--bms-surface-subtle); font-size:11px; }
body.bms-opendesign-v8 .task-row { display:grid; grid-template-columns:34px minmax(0,1fr) auto; align-items:center; gap:var(--bms-space-3); padding:var(--bms-space-3) var(--bms-space-4); border-top:1px solid var(--bms-border); }
body.bms-opendesign-v8 .task-complete { display:grid; width:25px; height:25px; place-items:center; padding:0; border:1.5px solid var(--bms-border-strong); border-radius:var(--bms-radius-round); color:var(--bms-surface); background:var(--bms-surface); cursor:pointer; }
body.bms-opendesign-v8 .task-row.is-done .task-complete { border-color:var(--bms-success); background:var(--bms-success); }
body.bms-opendesign-v8 .task-row.is-done .task-row-main strong { color:var(--bms-text-muted); text-decoration:line-through; }
body.bms-opendesign-v8 .task-row-main { min-width:0; padding:0; border:0; background:transparent; text-align:left; cursor:pointer; }
body.bms-opendesign-v8 .task-row-main strong { display:block; overflow:hidden; color:var(--bms-text); font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
body.bms-opendesign-v8 .task-row-main small { display:block; margin-top:4px; color:var(--bms-text-muted); font-size:10px; }
body.bms-opendesign-v8 .task-row-meta { display:flex; align-items:center; justify-content:flex-end; gap:var(--bms-space-2); }
body.bms-opendesign-v8 .task-priority, body.bms-opendesign-v8 .task-due { padding:5px 8px; border-radius:var(--bms-radius-round); font-size:9px; font-weight:750; white-space:nowrap; }
body.bms-opendesign-v8 .task-priority { color:var(--bms-primary); background:var(--bms-primary-soft); }
body.bms-opendesign-v8 .task-priority.urgent { color:var(--bms-danger); background:var(--bms-danger-soft); }
body.bms-opendesign-v8 .task-priority.high { color:var(--bms-warning); background:var(--bms-warning-soft); }
body.bms-opendesign-v8 .task-due { color:var(--bms-text-muted); background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-due.overdue { color:var(--bms-danger); background:var(--bms-danger-soft); }
body.bms-opendesign-v8 .task-empty { margin:0; padding:var(--bms-space-8); color:var(--bms-text-muted); text-align:center; }
body.bms-opendesign-v8 .task-dialog { width:min(620px,calc(100vw - 32px)); padding:0; border:0; border-radius:var(--bms-radius-3); color:var(--bms-text); background:var(--bms-surface); box-shadow:var(--bms-shadow-overlay); }
body.bms-opendesign-v8 .task-dialog::backdrop { background:var(--bms-backdrop); }
body.bms-opendesign-v8 .task-dialog form { display:grid; gap:var(--bms-space-4); padding:var(--bms-space-5); }
body.bms-opendesign-v8 .task-dialog header, body.bms-opendesign-v8 .task-dialog footer { display:flex; align-items:center; justify-content:space-between; gap:var(--bms-space-3); }
body.bms-opendesign-v8 .task-dialog header span { color:var(--bms-primary); font:750 9px/1 var(--bms-font-data); letter-spacing:.1em; }
body.bms-opendesign-v8 .task-dialog h3 { margin:5px 0 0; font:750 20px/1.2 var(--bms-font-display); }
body.bms-opendesign-v8 .task-dialog header > button { width:34px; height:34px; padding:0; border:0; border-radius:var(--bms-radius-round); color:var(--bms-text-muted); background:var(--bms-surface-subtle); font-size:22px; }
body.bms-opendesign-v8 .task-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--bms-space-3); }
body.bms-opendesign-v8 .task-dialog label { display:grid; gap:6px; color:var(--bms-text-muted); font-size:11px; font-weight:700; }
body.bms-opendesign-v8 .task-dialog :is(input,select,textarea) { width:100%; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); color:var(--bms-text); background:var(--bms-surface); }
body.bms-opendesign-v8 .task-dialog :is(input,select,textarea):disabled { color:var(--bms-text-muted); background:var(--bms-surface-subtle); cursor:not-allowed; opacity:1; }
body.bms-opendesign-v8 .task-report-section { display:grid; gap:var(--bms-space-3); padding-top:var(--bms-space-4); border-top:1px solid var(--bms-border); }
body.bms-opendesign-v8 .task-report-heading strong,body.bms-opendesign-v8 .task-report-heading small { display:block; }
body.bms-opendesign-v8 .task-report-heading strong { font-size:14px; }
body.bms-opendesign-v8 .task-report-heading small { margin-top:3px; color:var(--bms-text-muted); font-size:10px; }
body.bms-opendesign-v8 .task-report-list { display:grid; gap:8px; max-height:210px; overflow:auto; }
body.bms-opendesign-v8 .task-report-list article { padding:10px 12px; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-report-list article>div:first-child { display:flex; justify-content:space-between; gap:10px; font-size:10px; }
body.bms-opendesign-v8 .task-report-list time { color:var(--bms-text-muted); }
body.bms-opendesign-v8 .task-report-list p { margin:7px 0 0; white-space:pre-wrap; font-size:12px; }
body.bms-opendesign-v8 .task-report-attachments { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
body.bms-opendesign-v8 .task-report-attachments button { padding:5px 8px; border:1px solid var(--bms-border); border-radius:var(--bms-radius-round); color:var(--bms-primary); background:var(--bms-surface); font-size:10px; cursor:pointer; }
body.bms-opendesign-v8 .task-report-composer { display:grid; gap:10px; padding:12px; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); }
body.bms-opendesign-v8 .task-report-composer>.btn { justify-self:end; }
body.bms-opendesign-v8 .task-report-files small { color:var(--bms-text-muted); font-size:9px; font-weight:500; }
body.bms-opendesign-v8 .task-report-empty { margin:0; padding:16px; color:var(--bms-text-muted); text-align:center; }
body.bms-opendesign-v8 .task-dialog footer { justify-content:flex-end; padding-top:var(--bms-space-2); }
@media (max-width:760px) {
  body.bms-opendesign-v8 .task-panel.active { padding:var(--bms-space-3); }
  body.bms-opendesign-v8 .task-page-header, body.bms-opendesign-v8 .task-toolbar { align-items:stretch; flex-direction:column; }
  body.bms-opendesign-v8 .task-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.bms-opendesign-v8 .task-search { width:100%; min-height:var(--bms-control-touch); }
  body.bms-opendesign-v8 .task-panel .task-search > input[type="search"]:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="button"]):not([type="submit"]),
  body.bms-opendesign-v8 .task-page-header .btn,
  body.bms-opendesign-v8 .task-view-tabs button,
  body.bms-opendesign-v8 .task-filters button,
  body.bms-opendesign-v8 .task-report-heading > button,
  body.bms-opendesign-v8 .task-report-attachments button,
  body.bms-opendesign-v8 .task-report-actions button { min-height:var(--bms-control-touch); }
  body.bms-opendesign-v8 .task-row { grid-template-columns:var(--bms-control-touch) minmax(0,1fr); }
  body.bms-opendesign-v8 .task-complete,
  body.bms-opendesign-v8 .task-dialog header > button {
    width:var(--bms-control-touch);
    min-width:var(--bms-control-touch);
    height:var(--bms-control-touch);
    min-height:var(--bms-control-touch);
  }
  body.bms-opendesign-v8 .task-row-meta { grid-column:2; justify-content:flex-start; flex-wrap:wrap; }
  body.bms-opendesign-v8 .task-form-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { body.bms-opendesign-v8 .task-panel * { scroll-behavior:auto; transition:none; } }

/* Task reports reuse the approved Compact Field Note event language. */
body.bms-opendesign-v8 .task-row.is-unread { background:color-mix(in srgb,var(--bms-danger) 4%,var(--bms-surface)); }
body.bms-opendesign-v8 .task-row-main { position:relative; }
body.bms-opendesign-v8 .task-unread-dot { position:absolute; top:1px; right:0; width:8px; height:8px; border:2px solid var(--bms-surface); border-radius:var(--bms-radius-round); background:var(--bms-danger); box-shadow:0 0 0 1px color-mix(in srgb,var(--bms-danger) 35%,transparent); }
body.bms-opendesign-v8 .task-report-section { gap:var(--bms-space-3); }
body.bms-opendesign-v8 .task-report-heading { display:flex; align-items:center; justify-content:space-between; gap:var(--bms-space-3); }
body.bms-opendesign-v8 .task-report-heading>button { min-height:36px; padding:0 13px; border:1px solid color-mix(in srgb,var(--bms-primary) 35%,var(--bms-border)); border-radius:var(--bms-radius-2); color:var(--bms-primary); background:var(--bms-primary-soft); font:700 11px/1 var(--bms-font-ui); cursor:pointer; }
body.bms-opendesign-v8 .task-report-stream { position:relative; }
body.bms-opendesign-v8 .task-report-stream::before { content:""; position:absolute; top:8px; bottom:18px; left:6px; width:1px; background:var(--bms-border); }
body.bms-opendesign-v8 .task-report-list { display:block; max-height:none; overflow:visible; }
body.bms-opendesign-v8 .task-report-event { position:relative; padding:0 0 20px 25px; border:0; border-radius:0; background:transparent; }
body.bms-opendesign-v8 .task-report-event:last-child { padding-bottom:0; }
body.bms-opendesign-v8 .task-report-dot { position:absolute; z-index:2; top:4px; left:0; width:13px; height:13px; border:3px solid var(--bms-surface); border-radius:var(--bms-radius-round); background:var(--bms-border-strong); box-shadow:0 0 0 1px var(--bms-border-strong); }
body.bms-opendesign-v8 .task-report-dot.is-latest,body.bms-opendesign-v8 .task-report-composer .task-report-dot { background:var(--bms-primary); box-shadow:0 0 0 1px var(--bms-primary); }
body.bms-opendesign-v8 .task-report-event>time { display:block; margin:0 0 7px; color:var(--bms-text-muted); font:700 10px/1.4 var(--bms-font-ui); letter-spacing:.03em; }
body.bms-opendesign-v8 .task-report-card { overflow:hidden; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); background:var(--bms-surface); box-shadow:0 1px 4px color-mix(in srgb,var(--bms-text) 5%,transparent); }
body.bms-opendesign-v8 .task-report-copy { padding:12px; }
body.bms-opendesign-v8 .task-report-copy p { margin:0; color:var(--bms-text); white-space:pre-wrap; font-size:12px; line-height:1.55; }
body.bms-opendesign-v8 .task-report-meta { display:flex; justify-content:space-between; gap:10px; margin-top:9px; color:var(--bms-text-muted); font-size:10px; }
body.bms-opendesign-v8 .task-report-attachments { margin-top:9px; }
body.bms-opendesign-v8 .task-report-composer { display:block; margin:0; padding:0 0 20px 25px; border:0; border-radius:0; }
body.bms-opendesign-v8 .task-report-composer[hidden] { display:none; }
body.bms-opendesign-v8 .task-report-media { display:grid; width:100%; min-height:158px; place-items:center; padding:12px; border:0; border-bottom:1px solid var(--bms-border); border-radius:0; color:var(--bms-surface); background:var(--bms-text); text-align:center; cursor:pointer; }
body.bms-opendesign-v8 .task-report-media b,body.bms-opendesign-v8 .task-report-media strong,body.bms-opendesign-v8 .task-report-media small { display:block; }
body.bms-opendesign-v8 .task-report-media b { font-size:22px; line-height:1; }
body.bms-opendesign-v8 .task-report-media strong { margin-top:5px; font-size:12px; }
body.bms-opendesign-v8 .task-report-media small { margin-top:5px; color:var(--bms-border); font-size:9px; }
body.bms-opendesign-v8 .task-report-file-preview { display:flex; max-width:100%; flex-wrap:wrap; justify-content:center; gap:6px; margin-top:12px; }
body.bms-opendesign-v8 .task-report-file-preview[hidden] { display:none; }
body.bms-opendesign-v8 .task-report-file-preview span { max-width:100%; padding:4px 7px; overflow:hidden; border:1px solid var(--bms-border-strong); border-radius:var(--bms-radius-round); color:var(--bms-surface); text-overflow:ellipsis; white-space:nowrap; font-size:9px; }
body.bms-opendesign-v8 .task-report-native-file { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
body.bms-opendesign-v8 .task-report-card>textarea { display:block; width:100%; min-height:68px; max-height:180px; padding:11px 12px; border:0; border-bottom:1px solid var(--bms-border); border-radius:0; outline:0; color:var(--bms-text); background:var(--bms-surface); resize:none; font:12px/1.55 var(--bms-font-ui); }
body.bms-opendesign-v8 .task-report-card>textarea:focus { box-shadow:inset 3px 0 0 var(--bms-primary); }
body.bms-opendesign-v8 .task-report-actions { display:flex; justify-content:flex-end; gap:7px; padding:9px 10px; background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-report-actions button { min-height:32px; padding:0 11px; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); background:var(--bms-surface); font:700 11px/1 var(--bms-font-ui); cursor:pointer; }
body.bms-opendesign-v8 .task-report-actions #taskReportSubmit { border-color:var(--bms-primary); color:var(--bms-surface); background:var(--bms-primary); }
body.bms-opendesign-v8 .task-report-empty { margin-left:25px; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); background:var(--bms-surface-subtle); }

@media (max-width:900px), (max-width:960px) and (max-height:480px) {
  body.bms-opendesign-v8 .task-panel .task-search,
  body.bms-opendesign-v8 .task-panel .task-search > input[type="search"]:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="button"]):not([type="submit"]),
  body.bms-opendesign-v8 .task-page-header .btn,
  body.bms-opendesign-v8 .task-view-tabs button,
  body.bms-opendesign-v8 .task-filters button,
  body.bms-opendesign-v8 .task-report-heading > button,
  body.bms-opendesign-v8 .task-report-attachments button,
  body.bms-opendesign-v8 .task-report-actions button {
    min-height:var(--bms-control-touch);
  }

  body.bms-opendesign-v8 .task-complete,
  body.bms-opendesign-v8 .task-dialog header > button {
    width:var(--bms-control-touch);
    min-width:var(--bms-control-touch);
    height:var(--bms-control-touch);
    min-height:var(--bms-control-touch);
  }
}

body.bms-opendesign-v8 .tasks-hub-tabs { display:flex; gap:var(--bms-space-1); margin:0; padding:0; border:0; border-bottom:1px solid var(--bms-border); overflow-x:auto; scrollbar-width:thin; }
body.bms-opendesign-v8 .tasks-hub-tabs button { position:relative; flex:0 0 auto; min-height:var(--bms-control-standard); padding:var(--bms-space-2) var(--bms-space-4); border:0; border-radius:var(--bms-radius-2) var(--bms-radius-2) 0 0; color:var(--bms-text-muted); background:transparent; box-shadow:none; font:700 12px/1.2 var(--bms-font-ui); white-space:nowrap; cursor:pointer; }
body.bms-opendesign-v8 .tasks-hub-tabs button:hover { color:var(--bms-text); background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .tasks-hub-tabs button:focus-visible { outline:2px solid var(--bms-focus); outline-offset:-2px; }
body.bms-opendesign-v8 .tasks-hub-tabs button.active { color:var(--bms-primary); background:var(--bms-primary-soft); box-shadow:inset 0 -2px var(--bms-primary); }
body.bms-opendesign-v8 .tasks-hub-pane { display:grid; gap:var(--bms-space-4); min-width:0; }
body.bms-opendesign-v8 .tasks-hub-pane[hidden] { display:none; }
body.bms-opendesign-v8 .task-section-header { display:flex; align-items:end; justify-content:space-between; gap:var(--bms-space-4); }
body.bms-opendesign-v8 .task-section-header h3 { margin:0; color:var(--bms-text); font:750 18px/1.2 var(--bms-font-display); }
body.bms-opendesign-v8 .task-section-header p { margin:4px 0 0; color:var(--bms-text-muted); font-size:11px; }
body.bms-opendesign-v8 .task-approvals-content { --hrm:var(--bms-primary); --hrm-strong:var(--bms-primary); --hrm-soft:var(--bms-primary-soft); --hrm-line:var(--bms-border-strong); display:grid; gap:var(--bms-space-4); min-width:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-section-heading { align-items:end; margin:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-section-heading h3 { color:var(--bms-text); font:750 18px/1.2 var(--bms-font-display); }
body.bms-opendesign-v8 .task-approvals-content .hrm-grid { align-items:start; gap:var(--bms-space-4); margin:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-card { border-color:var(--bms-border); border-radius:var(--bms-radius-3); background:var(--bms-surface); box-shadow:var(--bms-shadow-1); }
body.bms-opendesign-v8 .task-approvals-content .hrm-card-heading { align-items:center; padding-bottom:var(--bms-space-3); border-bottom:1px solid var(--bms-border); }
body.bms-opendesign-v8 .task-approvals-content .hrm-request-card:first-of-type { margin-top:var(--bms-space-3); }
body.bms-opendesign-v8 .task-approvals-content .hrm-request-card:last-child { margin-bottom:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-empty { min-height:116px; display:grid; place-items:center; padding:var(--bms-space-5); }
/* #83 (Huashu hướng B): một hàng đợi tại một thời điểm, dạng bảng đủ cột; mỗi dòng một nút chính + menu "Khác". */
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch { display:inline-flex; justify-self:start; gap:2px; padding:3px; border-radius:var(--bms-radius-2); background:var(--bms-neutral-soft); max-width:100%; overflow-x:auto; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch button { display:inline-flex; align-items:center; gap:var(--bms-space-2); min-height:var(--bms-control-standard); padding:0 var(--bms-space-4); border:0; border-radius:var(--bms-radius-1); color:var(--bms-text-muted); background:transparent; box-shadow:none; font:700 13px/1.2 var(--bms-font-ui); white-space:nowrap; cursor:pointer; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch button:hover { color:var(--bms-text); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch button:focus-visible { outline:2px solid var(--bms-focus); outline-offset:-2px; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch button.active { color:var(--bms-text); background:var(--bms-surface); box-shadow:var(--bms-shadow-1); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch .hrm-count { min-width:22px; height:20px; padding:0 6px; background:var(--bms-surface-subtle); color:var(--bms-text-muted); font-size:11px; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch button.active .hrm-count { background:var(--bms-primary); color:var(--bms-surface); }
/* Phần đầu một dòng: trái là hàng đợi; phải (từ mép phải vào) Tạo yêu cầu, Luồng duyệt, ô tìm, bộ lọc. Tên khu đã có ở tab phía trên. */
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--bms-space-2) var(--bms-space-3); min-width:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-bar-title { display:inline-flex; align-items:center; gap:var(--bms-space-2); margin:0; color:var(--bms-text); font:700 15px/1.2 var(--bms-font-display); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch { flex:none; }
/* Mọi thứ trên hàng đầu cao bằng thanh tìm kiếm (48px) và bo tròn hai đầu. */
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-bar { --hrm-bar-h:48px; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-bar .hrm-approval-switch { box-sizing:border-box; height:var(--hrm-bar-h); border-radius:var(--bms-radius-round); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-bar .hrm-approval-switch button { min-height:0; height:100%; border-radius:var(--bms-radius-round); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-bar :is(.hrm-approval-head-actions .btn) { box-sizing:border-box; height:var(--hrm-bar-h); min-height:var(--hrm-bar-h); border-radius:var(--bms-radius-round); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-tools { display:flex; flex:1 1 0; flex-wrap:nowrap; align-items:center; justify-content:flex-start; gap:var(--bms-space-2); min-width:min(500px,100%); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-head-actions { display:flex; flex:none; align-items:center; gap:var(--bms-space-2); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-queue { display:grid; gap:var(--bms-space-3); min-width:0; }
/* Thanh tìm kiếm dùng chung (frontend/bms-search.css): trang chỉ đặt độ rộng, vị trí và các nút trạng thái trong bảng Lọc. */
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-search { --bms-search-width: 440px; margin-left:auto; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-filter-title { margin:0 0 var(--bms-space-1); color:var(--bms-text-muted); font:600 12px/1.35 var(--bms-font-ui); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-filter-options { display:grid; gap:2px; margin-top:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-filter-option { display:flex; align-items:center; justify-content:space-between; gap:var(--bms-space-3); width:100%; min-height:36px; padding:0 var(--bms-space-3); border:0; border-radius:10px; color:var(--bms-text); background:transparent; box-shadow:none; font:500 13px/1.2 var(--bms-font-ui); text-align:left; cursor:pointer; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-filter-option:hover { background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-filter-option:focus-visible { outline:2px solid var(--bms-focus); outline-offset:2px; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-filter-option[aria-pressed="true"] { color:var(--bms-primary); background:var(--bms-primary-soft); font-weight:700; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table-wrap { min-width:0; overflow-x:auto; border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); background:var(--bms-surface); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table { width:100%; min-width:1040px; border-collapse:separate; border-spacing:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table th { padding:var(--bms-space-2) var(--bms-space-3); border-bottom:1px solid var(--bms-border); color:var(--bms-text-muted); background:var(--bms-surface-subtle); font:700 12px/1.3 var(--bms-font-ui); text-align:left; white-space:nowrap; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table td { padding:var(--bms-space-2) var(--bms-space-3); border-bottom:1px solid var(--bms-border); color:var(--bms-text); font-size:13px; vertical-align:middle; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table tbody tr:last-child td { border-bottom:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table tbody tr:hover td { background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-title { min-width:300px; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-title strong { display:block; font-weight:650; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-title small { display:block; color:var(--bms-text-muted); font-size:12px; font-variant-numeric:tabular-nums; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-open { display:block; padding:0; border:0; color:inherit; background:none; box-shadow:none; font:inherit; text-align:left; cursor:pointer; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-open:hover strong { color:var(--bms-primary); text-decoration:underline; }
body.bms-opendesign-v8 .task-approvals-content :is(.hrm-approval-template, .hrm-approval-person) { white-space:nowrap; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-time { color:var(--bms-text-muted); font-size:12px; font-variant-numeric:tabular-nums; white-space:nowrap; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-status .hrm-status { white-space:nowrap; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions { width:212px; text-align:right; }
/* Màn hình hẹp: bảng giữ độ rộng và cuộn ngang bằng bộ cuộn chung (bms-table-scroll: mũi tên ‹ ›, thanh cuộn nổi, ghim cột Nội dung và Thao tác). */
body.bms-opendesign-v8 .task-approvals-content :is(.hrm-approval-title strong, .hrm-approval-status) { white-space:nowrap; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions .hrm-actions { display:grid; grid-template-columns:104px 84px; justify-content:end; gap:var(--bms-space-2); padding:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions .hrm-actions .btn { width:100%; min-height:var(--bms-control-compact); padding:0 var(--bms-space-3); font-size:12px; white-space:nowrap; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions .btn.hrm-approval-edit { border-color:var(--bms-warning); color:var(--bms-warning); background:var(--bms-warning-soft); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions .btn.hrm-approval-edit:hover:not(:disabled) { background:var(--bms-surface); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-more { position:relative; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-more summary { list-style:none; display:inline-flex; align-items:center; justify-content:center; gap:4px; width:100%; color:var(--bms-text-muted); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-more summary::-webkit-details-marker { display:none; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-more summary::after { content:""; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-more[open] summary { color:var(--bms-text); background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-menu { position:fixed; z-index:var(--bms-z-drawer); display:grid; min-width:200px; padding:var(--bms-space-1); border:1px solid var(--bms-border); border-radius:var(--bms-radius-1); background:var(--bms-surface); box-shadow:var(--bms-shadow-2); text-align:left; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-menu .btn { justify-content:flex-start; width:100%; min-height:var(--bms-control-standard); padding:0 var(--bms-space-3); border:0; border-radius:var(--bms-radius-1); color:var(--bms-text); background:transparent; box-shadow:none; font-weight:500; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-menu .btn:hover { background:var(--bms-surface-subtle); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-menu .btn.danger { margin-top:var(--bms-space-1); border-top:1px solid var(--bms-border); border-radius:0 0 var(--bms-radius-1) var(--bms-radius-1); color:var(--bms-danger); }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-menu .btn.danger + .btn.danger { margin-top:0; border-top:0; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-no-match { min-height:72px; }
body.bms-opendesign-v8 .task-approvals-content .hrm-approval-no-match[hidden] { display:none; }
/* Bảng cần màu trạng thái để quét nhanh; lớp v8 chung đang trung tính hóa mọi .hrm-status. */
body.bms-opendesign-v8 .task-approvals-content .hrm-status[data-status="IN_REVIEW"] { color:var(--bms-info); background:var(--bms-info-soft); }
body.bms-opendesign-v8 .task-approvals-content .hrm-status[data-status="APPROVED"] { color:var(--bms-success); background:var(--bms-success-soft); }
body.bms-opendesign-v8 .task-approvals-content .hrm-status[data-status="NEEDS_INFORMATION"] { color:var(--bms-warning); background:var(--bms-warning-soft); }
body.bms-opendesign-v8 .task-approvals-content .hrm-status[data-status="REJECTED"] { color:var(--bms-danger); background:var(--bms-danger-soft); }
body.bms-opendesign-v8 .task-approvals-content .hrm-precheck-row .hrm-status { color:var(--bms-review); background:var(--bms-review-soft); }
@media (max-width:760px) {
  body.bms-opendesign-v8 .task-section-header { align-items:stretch; flex-direction:column; }
  body.bms-opendesign-v8 .task-section-header .btn { min-height:var(--bms-control-touch); }
  body.bms-opendesign-v8 .tasks-hub-tabs button { flex:1 0 auto; min-height:var(--bms-control-touch); }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-tools { flex:1 1 100%; flex-wrap:wrap; justify-content:stretch; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-head-actions { order:-1; width:100%; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-search { --bms-search-width: 100%; margin-left:0; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-head-actions .btn { flex:1 1 0; min-height:var(--bms-control-touch); }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch { display:flex; justify-self:stretch; width:100%; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-switch button { flex:1 1 0; justify-content:center; min-height:var(--bms-control-touch); padding:0 var(--bms-space-2); font-size:12.5px; }
  /* Điện thoại: bảng thành sổ ghi (mỗi yêu cầu một thẻ gọn), không ẩn cột nghiệp vụ. */
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table-wrap { overflow:visible; border:0; background:transparent; }
  body.bms-opendesign-v8 .task-approvals-content :is(.hrm-approval-table, .hrm-approval-table tbody, .hrm-approval-table td) { display:block; min-width:0; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table thead { display:none; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table tbody tr { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px var(--bms-space-3); margin-bottom:var(--bms-space-2); padding:var(--bms-space-3); border:1px solid var(--bms-border); border-radius:var(--bms-radius-2); background:var(--bms-surface); }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table tbody tr[hidden] { display:none; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table td, body.bms-opendesign-v8 .task-approvals-content .hrm-approval-table tbody tr:hover td { padding:0; border:0; background:transparent; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-title { grid-column:1; min-width:0; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-status { grid-column:2; grid-row:1; }
  body.bms-opendesign-v8 .task-approvals-content :is(.hrm-approval-template, .hrm-approval-person, .hrm-approval-time) { grid-column:1 / -1; color:var(--bms-text-muted); font-size:12px; white-space:normal; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions { grid-column:1 / -1; width:auto; margin-top:var(--bms-space-2); }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-title strong { white-space:normal; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions .hrm-actions { grid-template-columns:minmax(0,1fr) 96px; }
  body.bms-opendesign-v8 .task-approvals-content .hrm-approval-actions .hrm-actions .btn { min-height:var(--bms-control-touch); font-size:13px; }
}
