/* ════════════════════════════════════════════════════════════════
   Sales OS v3 — 13 tab phẳng → 5 khu vực trên rail + theme Monday
   ------------------------------------------------------------------
   Cặp với js/sales-os-v3.js. Hoàn toàn ADDITIVE:
     • Không sửa markup, không sửa JS nghiệp vụ, không đụng schema.
     • Chỉ tạo tiêu đề nhóm trên rail #ws-tabrail sẵn có + đổi accent,
       nén header thành topbar, và đổi màu + nén layout Bàn làm việc.
     • KHÔNG ẩn/bỏ bất kỳ trường thông tin nào — chỉ đổi màu, khoảng
       cách và cách xếp khối (mục 3 giữ đủ 100% field của tab).
   TẮT: ?v3=0 (mọi rule đều scope trong body.sales-v3 → app về y như cũ).
   ════════════════════════════════════════════════════════════════ */

body.sales-v3 {
  --v3-surface:#FFFFFF; --v3-surface-2:#F5F6F8; --v3-surface-3:#EBECF0;
  --v3-text:#323338; --v3-muted:#676879; --v3-soft:#9699A6;
  --v3-primary:#0073EA; --v3-primary-hover:#0060B9; --v3-primary-soft:#CCE5FF; --v3-primary-ink:#0056B0;
  --v3-done:#00C875; --v3-done-bg:#E5F9F0; --v3-done-ink:#018F55;
  --v3-working:#FDAB3D; --v3-working-bg:#FFF4E5; --v3-working-ink:#B4730F;
  --v3-stuck:#E2445C; --v3-stuck-bg:#FCE8EB; --v3-stuck-ink:#C32E43;
  --v3-info:#579BFC; --v3-info-bg:#E9F2FF; --v3-info-ink:#1C5FB8;
  --v3-purple:#A25DDC; --v3-purple-bg:#F3EAFB; --v3-purple-ink:#7B3FB0;
  --v3-line:#E6E9EF; --v3-line-2:#D0D4E4;
  --v3-sh-sm:0 1px 2px rgba(0,0,0,.05);
}

/* ══ 1. Rail trái — trang trí nhóm + thống nhất chữ ═══════════════
   Rail đã tự gom nhóm (WTR_GROUPS_V1). Ở đây chỉ:
     • thêm chấm màu + số đếm vào tiêu đề nhóm (js: decorateRail)
     • ép CÙNG MỘT font cho tiêu đề nhóm và tên tab — trước đây tên tab
       viết hoa ở 13.5px/400 trông như khác phông so với tiêu đề nhóm
       10px/700, đọc lệch hẳn nhau.
   ─────────────────────────────────────────────────────────────── */
#ws-tabrail {
  font-family: 'Public Sans', 'Be Vietnam Pro', 'Figtree', system-ui, -apple-system, sans-serif;
}
#ws-tabrail .wtr-grouphd {
  display: flex; align-items: center; gap: 8px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .07em; color: #8A94A8;
}
#ws-tabrail .wtr-ghd:hover { color: #E2E6EF; }
#ws-tabrail .wtr-ghd-cv { order: 3; margin-left: auto; opacity: .55; font-size: 10px; }
.v3-gdot { width: 7px; height: 7px; border-radius: 99px; flex: none; }
.v3-gn {
  order: 2; font-size: 9.5px; font-weight: 700; letter-spacing: 0; color: #7A849A;
  background: rgba(255,255,255,.09); border-radius: 99px; padding: 1px 6px;
  font-variant-numeric: tabular-nums;
}
.v3-gn:empty { display: none; }

/* Tên tab: cùng phông, cùng cách giãn chữ với tiêu đề nhóm.
   .wtr-item là thẻ <button> — button KHÔNG kế thừa font-family, nó rơi về
   phông mặc định của trình duyệt (Arial) trong khi .wtr-grouphd là <div> nên
   dùng Public Sans. Đó chính là chỗ hai phần chữ trông khác phông nhau. */
#ws-tabrail .wtr-item { font-family: inherit; font-size: 12.5px; }
#ws-tabrail .wtr-lb { font-weight: 600; letter-spacing: .04em; }
#ws-tabrail .wtr-item.active .wtr-lb { font-weight: 700; }
body.sales-v3 #ws-tabrail .wtr-item { border-radius: 0 8px 8px 0; }
body.sales-v3 #ws-tabrail .wtr-item:hover { background: rgba(255,255,255,.07); }
body.sales-v3 #ws-tabrail .wtr-item.active { border-left-color: #0073EA; background: rgba(0,115,234,.17); }

body.ws-sidebar-collapsed:not(.ws-rail-hover) .v3-gn { display: none; }

/* ══ 2. Topbar ════════════════════════════════════════════════════ */
body.sales-v3 #workspace-sales .app-header {
  background: var(--v3-surface); border-bottom: 1px solid var(--v3-line);
  box-shadow: none; padding: 8px 18px; gap: 10px; align-items: center;
}
body.sales-v3 #workspace-sales .app-header .brand h1 { font-size: 14px; font-weight: 800; letter-spacing: -.02em; color: var(--v3-text); }
body.sales-v3 #workspace-sales .app-header .brand .sub { font-size: 11px; color: var(--v3-soft); }
body.sales-v3 #workspace-sales .app-header .logo img { max-height: 26px; }
body.sales-v3 #workspace-sales .app-header .controls { gap: 7px; align-items: center; }
body.sales-v3 #workspace-sales .app-header select,
body.sales-v3 #workspace-sales .app-header .ms-button {
  height: 30px; border-radius: 6px; border: 1px solid var(--v3-line-2);
  background: var(--v3-surface); color: var(--v3-text);
  font-size: 12.5px; font-weight: 600; padding: 0 9px; box-shadow: none;
}
body.sales-v3 #workspace-sales .app-header select:focus,
body.sales-v3 #workspace-sales .app-header .ms-button:focus-visible {
  outline: none; border-color: var(--v3-primary); box-shadow: 0 0 0 3px rgba(0,115,234,.3);
}
body.sales-v3 #workspace-sales .app-header #period-month,
body.sales-v3 #workspace-sales .app-header #period-year,
body.sales-v3 #workspace-sales .app-header #team-select {
  border-color: var(--v3-primary); color: var(--v3-primary); background: #F2F8FE; font-weight: 700;
}
body.sales-v3 #workspace-sales .app-header .btn-primary {
  height: 30px; border-radius: 8px; background: var(--v3-primary); border: 0;
  color: #fff; font-size: 12.5px; font-weight: 700; padding: 0 12px; box-shadow: none;
}
body.sales-v3 #workspace-sales .app-header .btn-primary:hover { background: var(--v3-primary-hover); }
body.sales-v3 #workspace-sales .app-header .btn-secondary {
  height: 30px; border-radius: 8px; background: var(--v3-surface);
  border: 1px solid var(--v3-line-2); color: var(--v3-text);
  font-size: 12.5px; font-weight: 700; padding: 0 12px; box-shadow: none;
}

/* ══ 3. BÀN LÀM VIỆC — đổi màu + nén layout, GIỮ ĐỦ MỌI TRƯỜNG ════
   Bảng màu cũ: indigo/tím #312e81 · #4c1d95 · #ede9fe + gradient hồng-cam
   → thay bằng DS v2: 1 primary xanh #0073EA, màu còn lại chỉ mang NGHĨA
     trạng thái (done/working/stuck/info/purple). Radius 14 → 8.
   Nén: card "Thống kê" tách 2 cột (KPI | Doanh thu) thay vì xếp dọc,
     ô "Việc cần làm" thấp hơn, padding/th tighter → tiết kiệm ~180px
     chiều cao mà không bỏ field nào.
   ─────────────────────────────────────────────────────────────── */
#v3-scope, body.sales-v3 { --v3-blv: 1; }   /* neo scope, không ảnh hưởng layout */

body.sales-v3 #tab-ban-lam-viec .blv-wrap { padding: 12px 16px; }
body.sales-v3 #tab-ban-lam-viec .blv-top { margin-bottom: 10px; }
body.sales-v3 #tab-ban-lam-viec .blv-top h2 {
  font-size: 20px; font-weight: 800; letter-spacing: -.025em; color: var(--v3-text);
}
body.sales-v3 #tab-ban-lam-viec .blv-sub { font-size: 12.5px; color: var(--v3-muted); }

/* ── 3.1 Card chung ── */
body.sales-v3 #tab-ban-lam-viec .blv-dash { gap: 12px; margin-bottom: 12px; }
body.sales-v3 #tab-ban-lam-viec .blv-dcard,
body.sales-v3 #tab-ban-lam-viec .blv-side {
  border-radius: 8px; padding: 13px 14px; box-shadow: var(--v3-sh-sm); border: 0;
}
body.sales-v3 #tab-ban-lam-viec .blv-dcard h4 {
  margin: 0 0 9px; font-size: 13px; font-weight: 800;
  letter-spacing: -.01em; color: var(--v3-text);
}
body.sales-v3 #tab-ban-lam-viec .blv-dcard h4 .badge {
  background: var(--v3-primary-soft); color: var(--v3-primary-ink);
  border-radius: 99px; padding: 1px 8px; font-size: 11.5px; font-weight: 700;
}
body.sales-v3 #tab-ban-lam-viec .blv-hint { font-size: 10.5px; color: var(--v3-soft); font-weight: 500; }

/* ── 3.2 "Việc cần làm": 4 ô đếm — thấp hơn, viền trái mang màu loại việc ── */
body.sales-v3 #tab-ban-lam-viec .blv-todo { gap: 8px; }
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell {
  background: var(--v3-surface-2); border-radius: 8px; padding: 8px 10px;
  min-width: 74px; border-left: 3px solid var(--v3-line-2);
}
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell:nth-child(1) { border-left-color: var(--v3-done); }
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell:nth-child(2) { border-left-color: var(--v3-purple); }
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell:nth-child(3) { border-left-color: var(--v3-working); }
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell:nth-child(4) { border-left-color: var(--v3-info); }
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell .n {
  font-size: 20px; font-weight: 800; color: var(--v3-text); font-variant-numeric: tabular-nums;
}
body.sales-v3 #tab-ban-lam-viec .blv-todo .cell .l { font-size: 11px; color: var(--v3-muted); margin-top: 3px; }

/* ── 3.3 Công nợ đến hạn: nâu-vàng → token "working" ── */
body.sales-v3 #tab-ban-lam-viec .blv-ds-h { color: var(--v3-working-ink); font-size: 12px; margin: 8px 0 6px; }
body.sales-v3 #tab-ban-lam-viec .blv-ds-h .badge {
  background: var(--v3-working-bg); border: 0; color: var(--v3-working-ink);
}
body.sales-v3 #tab-ban-lam-viec .blv-ds-row {
  border: 0; background: var(--v3-working-bg); border-left: 3px solid var(--v3-working);
  border-radius: 6px; padding: 6px 9px; margin-bottom: 5px;
}
body.sales-v3 #tab-ban-lam-viec .blv-ds-row.overdue {
  background: var(--v3-stuck-bg); border-left-color: var(--v3-stuck);
}
body.sales-v3 #tab-ban-lam-viec .blv-ds-amt { color: var(--v3-stuck-ink); font-variant-numeric: tabular-nums; }
body.sales-v3 #tab-ban-lam-viec .blv-ds-due { color: var(--v3-working-ink); }
body.sales-v3 #tab-ban-lam-viec .blv-ds-due.overdue { color: var(--v3-stuck-ink); }

/* ── 3.4 NÉN CHÍNH: card Thống kê tách 2 cột (KPI | Doanh thu) ──
   Trước: KPI xếp trên, khối Doanh thu Actual/Target xếp dưới → card rất cao.
   Sau: 2 cột cạnh nhau, ngăn bằng 1 nét đứt dọc. Đủ nguyên 4 KPI + 2 dòng
   doanh thu + thanh tiến độ + vạch thời gian + ghi chú nhanh/chậm. */
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.02fr);
  grid-template-areas: "hd hd" "stats fr"; gap: 0 16px; align-items: start;
}
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > h4 { grid-area: hd; }
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-stats { grid-area: stats; }
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-funnelrev {
  grid-area: fr; margin-top: 0; padding: 0 0 0 16px;
  border-top: 0; border-left: 1px dashed var(--v3-line);
}
/* Hàng 1: cột trái hẹp lại vì cột phải giờ chứa 2 khối */
body.sales-v3 #tab-ban-lam-viec .blv-dash:has(.blv-todo) { grid-template-columns: minmax(250px,.78fr) 1.7fr; }

/* ── 3.5 KPI tháng: bỏ gradient hồng-cam (màu trang trí) → nền phẳng ── */
body.sales-v3 #tab-ban-lam-viec .blv-stats {
  background: var(--v3-surface-2); border-radius: 8px; padding: 10px 12px; gap: 6px;
}
body.sales-v3 #tab-ban-lam-viec .blv-stat .v {
  font-size: 19px; font-weight: 800; color: var(--v3-text); font-variant-numeric: tabular-nums;
}
body.sales-v3 #tab-ban-lam-viec .blv-stat .v small { font-size: 11px; color: var(--v3-soft); }
body.sales-v3 #tab-ban-lam-viec .blv-stat .l { font-size: 11px; color: var(--v3-muted); margin-top: 2px; }
body.sales-v3 #tab-ban-lam-viec .blv-stat[data-blv-stat]:hover { background: rgba(0,115,234,.09); }
body.sales-v3 #tab-ban-lam-viec .blv-stats .divider { background: var(--v3-line-2); }
body.sales-v3 #tab-ban-lam-viec .blv-tgt-lbl { color: var(--v3-soft); font-variant-numeric: tabular-nums; }

/* ── 3.6 Doanh thu Actual/Target: thanh tiến độ theo status palette ── */
body.sales-v3 #tab-ban-lam-viec .blv-fr-h { color: var(--v3-text); font-size: 11.5px; margin-bottom: 7px; }
body.sales-v3 #tab-ban-lam-viec .blv-frtime {
  background: var(--v3-info-bg); border: 0; color: var(--v3-info-ink); font-size: 10.5px;
}
body.sales-v3 #tab-ban-lam-viec .blv-fr { margin-bottom: 7px; }
body.sales-v3 #tab-ban-lam-viec .blv-fr-click:hover { background: rgba(0,115,234,.08); }
body.sales-v3 #tab-ban-lam-viec .blv-fr-name { font-size: 12px; color: var(--v3-muted); }
body.sales-v3 #tab-ban-lam-viec .blv-fr-num { font-size: 12.5px; color: var(--v3-text); font-variant-numeric: tabular-nums; }
body.sales-v3 #tab-ban-lam-viec .blv-frbar { height: 7px; border-radius: 99px; background: var(--v3-surface-3); }
body.sales-v3 #tab-ban-lam-viec .blv-frbar-fill { border-radius: 99px; background: var(--v3-working); }
body.sales-v3 #tab-ban-lam-viec .blv-frbar-fill.ok { background: var(--v3-done); }
body.sales-v3 #tab-ban-lam-viec .blv-frbar-fill.mid { background: var(--v3-working); }
body.sales-v3 #tab-ban-lam-viec .blv-frbar-fill.low { background: var(--v3-stuck); }
body.sales-v3 #tab-ban-lam-viec .blv-frmark { background: var(--v3-primary); }
body.sales-v3 #tab-ban-lam-viec .blv-frmark::before { border-top-color: var(--v3-primary); }
body.sales-v3 #tab-ban-lam-viec .blv-frnote.ahead { color: var(--v3-done-ink); }
body.sales-v3 #tab-ban-lam-viec .blv-frnote.behind { color: var(--v3-stuck-ink); }
body.sales-v3 #tab-ban-lam-viec .blv-tgtbar { background: var(--v3-surface-3); border-radius: 99px; }
body.sales-v3 #tab-ban-lam-viec .blv-tgtbar-fill.ok { background: var(--v3-done); }
body.sales-v3 #tab-ban-lam-viec .blv-tgtbar-fill.mid { background: var(--v3-working); }
body.sales-v3 #tab-ban-lam-viec .blv-tgtbar-fill.low { background: var(--v3-stuck); }
body.sales-v3 #tab-ban-lam-viec .blv-tgtpct.ok { color: var(--v3-done-ink); }
body.sales-v3 #tab-ban-lam-viec .blv-tgtpct.mid { color: var(--v3-working-ink); }
body.sales-v3 #tab-ban-lam-viec .blv-tgtpct.low { color: var(--v3-stuck-ink); }

/* ── 3.7 Bộ chuyển (view / range / outlet mode): tím đặc → pill primary ── */
body.sales-v3 #tab-ban-lam-viec .blv-viewtoggle,
body.sales-v3 #tab-ban-lam-viec .blv-rangetoggle,
body.sales-v3 #tab-ban-lam-viec .blv-oltoggle { background: var(--v3-surface-3); border-radius: 99px; }
body.sales-v3 #tab-ban-lam-viec .blv-viewtoggle button,
body.sales-v3 #tab-ban-lam-viec .blv-rangetoggle button,
body.sales-v3 #tab-ban-lam-viec .blv-oltoggle button { color: var(--v3-muted); font-weight: 700; }
body.sales-v3 #tab-ban-lam-viec .blv-viewtoggle button.active,
body.sales-v3 #tab-ban-lam-viec .blv-rangetoggle button.active,
body.sales-v3 #tab-ban-lam-viec .blv-oltoggle button.active {
  background: var(--v3-primary); color: #fff;
}
body.sales-v3 #tab-ban-lam-viec .blv-viewtoggle button { padding: 5px 14px; font-size: 12.5px; }

/* ── 3.8 Nút ── */
body.sales-v3 #tab-ban-lam-viec .blv-btn {
  border: 1px solid var(--v3-line-2); background: var(--v3-surface); color: var(--v3-text);
  border-radius: 8px; padding: 6px 12px; font-size: 12.5px; font-weight: 700;
}
body.sales-v3 #tab-ban-lam-viec .blv-btn:hover { background: var(--v3-surface-2); }
body.sales-v3 #tab-ban-lam-viec .blv-btn-primary {
  background: var(--v3-primary); border-color: var(--v3-primary); color: #fff;
}
body.sales-v3 #tab-ban-lam-viec .blv-btn-primary:hover {
  background: var(--v3-primary-hover); border-color: var(--v3-primary-hover);
}

/* ── 3.9 Chip lọc loại việc ── */
body.sales-v3 #tab-ban-lam-viec .blv-filters { margin-bottom: 10px; }
body.sales-v3 #tab-ban-lam-viec .blv-chip {
  border: 1px solid var(--v3-line-2); border-radius: 99px;
  padding: 4px 11px; font-size: 12px; font-weight: 700; opacity: .5;
}
body.sales-v3 #tab-ban-lam-viec .blv-chip.on { opacity: 1; box-shadow: inset 0 0 0 1px currentColor; }

/* ── 3.10 Danh sách công việc theo ngày: nén dòng, header ngày trung tính ── */
body.sales-v3 #tab-ban-lam-viec .blv-daylist { gap: 10px; max-height: 360px; }
body.sales-v3 #tab-ban-lam-viec .blv-daysec-h {
  font-size: 12px; font-weight: 800; color: var(--v3-text);
  border-bottom: 1px solid var(--v3-line); padding: 5px 2px; margin-bottom: 6px;
}
body.sales-v3 #tab-ban-lam-viec .blv-daysec-n,
body.sales-v3 #tab-ban-lam-viec .blv-tgrp-n,
body.sales-v3 #tab-ban-lam-viec .blv-daycol-n {
  background: var(--v3-surface-3); color: var(--v3-muted); font-variant-numeric: tabular-nums;
}
body.sales-v3 #tab-ban-lam-viec .blv-upcard { border-radius: 8px; padding: 8px 10px; }
body.sales-v3 #tab-ban-lam-viec .blv-upcard-clean { border-color: var(--v3-line); }
body.sales-v3 #tab-ban-lam-viec .blv-upcard .blv-ti { font-size: 12.5px; }
body.sales-v3 #tab-ban-lam-viec .blv-trow { border-radius: 6px; }
body.sales-v3 #tab-ban-lam-viec .blv-trow:hover { background: var(--v3-surface-2); }
body.sales-v3 #tab-ban-lam-viec .blv-trow-tm { color: var(--v3-muted); font-variant-numeric: tabular-nums; }
body.sales-v3 #tab-ban-lam-viec .blv-up-empty { color: var(--v3-soft); font-size: 12.5px; padding: 12px 4px; }
body.sales-v3 #tab-ban-lam-viec .blv-up::-webkit-scrollbar-thumb,
body.sales-v3 #tab-ban-lam-viec .blv-daylist::-webkit-scrollbar-thumb { background: var(--v3-line-2); }
body.sales-v3 #tab-ban-lam-viec .blv-fccard { border-radius: 8px; }
body.sales-v3 #tab-ban-lam-viec .blv-fcval { font-variant-numeric: tabular-nums; }

/* ── 3.11 Bảng outlet: header sticky kiểu .board, số tabular ── */
body.sales-v3 #tab-ban-lam-viec .blv-ol-filterbar { margin: 6px 0 8px; gap: 7px; }
body.sales-v3 #tab-ban-lam-viec .blv-ol-q,
body.sales-v3 #tab-ban-lam-viec .blv-ol-region,
body.sales-v3 #tab-ban-lam-viec .blv-ol-province,
body.sales-v3 #tab-ban-lam-viec .blv-ol-seg,
body.sales-v3 #tab-ban-lam-viec .blv-olmonth {
  border: 1px solid var(--v3-line-2); border-radius: 6px; padding: 5px 9px;
  font-size: 12.5px; color: var(--v3-text); background: var(--v3-surface);
}
body.sales-v3 #tab-ban-lam-viec .blv-ol-q:focus,
body.sales-v3 #tab-ban-lam-viec .blv-ol-region:focus,
body.sales-v3 #tab-ban-lam-viec .blv-ol-province:focus,
body.sales-v3 #tab-ban-lam-viec .blv-ol-seg:focus {
  outline: none; border-color: var(--v3-primary); box-shadow: 0 0 0 3px rgba(0,115,234,.3);
}
body.sales-v3 #tab-ban-lam-viec .blv-ol-clear {
  border: 1px solid var(--v3-line-2); border-radius: 6px; color: var(--v3-muted); font-weight: 600;
}
body.sales-v3 #tab-ban-lam-viec .blv-ol-scroll {
  max-height: 300px; border: 1px solid var(--v3-line); border-radius: 8px;
}
body.sales-v3 #tab-ban-lam-viec .blv-detail-table { font-size: 12.5px; }
body.sales-v3 #tab-ban-lam-viec .blv-detail-table th {
  background: var(--v3-surface); color: var(--v3-muted);
  font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: 8px 10px; border-bottom: 1px solid var(--v3-line);
}
body.sales-v3 #tab-ban-lam-viec .blv-detail-table td { padding: 6px 10px; border-bottom: 1px solid var(--v3-line); }
body.sales-v3 #tab-ban-lam-viec .blv-detail-table td.num { font-variant-numeric: tabular-nums; }
body.sales-v3 #tab-ban-lam-viec .blv-detail-table tbody tr:hover { background: var(--v3-surface-2); }

/* ── 3.12 Lịch: cột trái hẹp lại, bỏ tông tím ── */
body.sales-v3 #tab-ban-lam-viec .blv-layout { grid-template-columns: 224px 1fr; gap: 14px; }
body.sales-v3 #tab-ban-lam-viec .blv-mini-head strong { color: var(--v3-text); }
body.sales-v3 #tab-ban-lam-viec .blv-mini-head button {
  background: var(--v3-surface-2); color: var(--v3-primary); border-radius: 6px;
}
body.sales-v3 #tab-ban-lam-viec .blv-main {
  background: var(--v3-surface); border-radius: 8px; box-shadow: var(--v3-sh-sm);
}
body.sales-v3 #tab-ban-lam-viec .blv-subtabs { margin-bottom: 8px; }

/* Màn hẹp: card Thống kê trả về xếp dọc để không bóp chữ */
@media (max-width: 1280px) {
  body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) {
    display: block;
  }
  body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-funnelrev {
    margin-top: 11px; padding: 11px 0 0; border-left: 0; border-top: 1px dashed var(--v3-line);
  }
  body.sales-v3 #tab-ban-lam-viec .blv-dash:has(.blv-todo) { grid-template-columns: 1.1fr 1.5fr; }
}

/* ══ 4. BÀN LÀM VIỆC v4 — một trục thời gian, ba lớp ══════════════
   Nguyên tắc: càng gấp càng lên trên.
     Lớp 1 "Bây giờ"  → #v3-next (Điểm kế tiếp + dải lộ trình)
     Lớp 3 "Cả kỳ"    → card Thống kê nén thành thanh nhịp ngang
     Lớp 2 "Hôm nay"  → LỊCH lên giữa màn hình (trước đây ở đáy trang)
   Kỹ thuật: .blv-wrap thành flex column + `order`, KHÔNG di chuyển DOM
   → mọi handler delegate trên document giữ nguyên. Hàng .blv-dash đầu
   dùng display:contents để 2 card trong đó tách ra xếp riêng.
   ─────────────────────────────────────────────────────────────── */
body.sales-v3 #tab-ban-lam-viec .blv-wrap { display: flex; flex-direction: column; gap: 11px; }
body.sales-v3 #tab-ban-lam-viec .blv-wrap > * { order: 9; margin-bottom: 0; }
body.sales-v3 #tab-ban-lam-viec .blv-dash { margin-bottom: 0; }

body.sales-v3 #tab-ban-lam-viec .blv-top { order: 1; }
body.sales-v3 #tab-ban-lam-viec .blv-subtabs { order: 2; }
body.sales-v3 #tab-ban-lam-viec #v3-next { order: 3; }
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) { order: 4; }
body.sales-v3 #tab-ban-lam-viec .blv-filters { order: 5; }
body.sales-v3 #tab-ban-lam-viec .blv-layout { order: 6; }
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-todo) { order: 7; }
body.sales-v3 #tab-ban-lam-viec .blv-dash:not(:has(.blv-todo)) { order: 8; }
body.sales-v3 #tab-ban-lam-viec .blv-cp-card { order: 9; }
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(.blv-ol-table) { order: 10; }

/* Thanh nhịp: 4 KPI | 2 dòng doanh thu cạnh nhau, cả khối 1 dải ngang */
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; align-items: start;
}
body.sales-v3 #tab-ban-lam-viec .blv-fr-h { grid-column: 1 / -1; }

/* ── Lớp 1: Điểm kế tiếp ── */
#v3-next { display: flex; flex-direction: column; gap: 9px; }
.v3-nextcard {
  background: var(--v3-surface); border-radius: 8px; box-shadow: var(--v3-sh-sm);
  border-left: 4px solid var(--v3-primary); padding: 12px 15px;
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
}
.v3-nextcard.empty { border-left-color: var(--v3-line-2); color: var(--v3-muted); }
.v3-when { text-align: center; flex: none; padding-right: 15px; border-right: 1px solid var(--v3-line); }
.v3-when .t { font-size: 24px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1; }
.v3-when .c { font-size: 11px; font-weight: 700; color: var(--v3-primary); margin-top: 3px; }
.v3-nx { flex: 1; min-width: 220px; }
.v3-nx-lab { font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--v3-soft); }
.v3-nx-name { font-size: 17px; font-weight: 800; letter-spacing: -.025em; margin: 2px 0 4px; }
.v3-nx-meta { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; font-size: 11.5px; color: var(--v3-muted); }
.v3-nx-act { display: flex; gap: 7px; flex: none; }
.v3-nx-act button {
  height: 31px; padding: 0 12px; border-radius: 8px; font-size: 12.5px; font-weight: 700;
  cursor: pointer; font-family: inherit; border: 1px solid var(--v3-line-2);
  background: var(--v3-surface); color: var(--v3-text);
}
.v3-nx-act button.pri { background: var(--v3-primary); border-color: var(--v3-primary); color: #fff; }
.v3-nx-act button:hover { filter: brightness(.97); }

/* Dải lộ trình trong ngày */
.v3-route {
  display: flex; background: var(--v3-surface); border-radius: 8px;
  box-shadow: var(--v3-sh-sm); padding: 8px 10px; overflow-x: auto;
}
.v3-stop {
  flex: 1 1 0; min-width: 132px; padding: 2px 10px; display: flex; flex-direction: column;
  justify-content: center; cursor: pointer; border-radius: 6px;
}
.v3-stop + .v3-stop { border-left: 1px solid var(--v3-line); }
.v3-stop:hover { background: var(--v3-surface-2); }
.v3-stop .tm { font-size: 10.5px; font-weight: 700; color: var(--v3-soft); font-variant-numeric: tabular-nums; display: flex; align-items: center; gap: 5px; }
.v3-stop .dot { width: 7px; height: 7px; border-radius: 99px; background: var(--v3-surface-3); flex: none; }
.v3-stop .nm { font-size: 12.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 1px 0 2px; }
.v3-stop .ac { font-size: 10.5px; color: var(--v3-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v3-stop.done .dot { background: var(--v3-done); }
.v3-stop.done .nm { color: var(--v3-muted); text-decoration: line-through; }
.v3-stop.now { background: #F2F8FE; }
.v3-stop.now .dot { background: var(--v3-primary); box-shadow: 0 0 0 3px var(--v3-primary-soft); }
.v3-stop.now .tm { color: var(--v3-primary); }

@media (max-width: 1280px) {
  body.sales-v3 #tab-ban-lam-viec .blv-funnelrev { grid-template-columns: 1fr; }
}

/* ══ 5. Header kiểu Monday.com: view tab + toolbar ════════════════
   Dòng 1: dải view tab (underline khi active, có badge đếm).
   Dòng 2: toolbar — Tạo · Tìm kiếm · Nhân viên · Lọc · Khoảng · Lịch.
   Toolbar KHÔNG có control giả: bấm nút → popover MƯỢN chính control gốc
   (.blv-subtabs / .blv-filters / .blv-rangetoggle / .blv-viewtoggle /
    .blv-oltoggle / .blv-ol-filterbar) vào trong, đóng thì trả về chỗ cũ.
   Vì vậy các control đó bị ẩn TẠI CHỖ, và hiện lại khi nằm trong .v3-pop.
   ─────────────────────────────────────────────────────────────── */
body.sales-v3 #tab-ban-lam-viec .v3-bar { order: 2; position: relative; }
/* Hàng sub-tab xuống DƯỚI khối ngữ cảnh chung (toolbar order 2 · Điểm kế tiếp 3 ·
   thanh nhịp 4): ba khối đó lặp y hệt ở mọi sub-tab nên đứng trên thì đọc là
   "ngữ cảnh của cả bàn", còn tab chỉ đổi phần nội dung nằm ngay dưới nó. */
body.sales-v3 #tab-ban-lam-viec .v3-viewbar { order: 5; }
.v3-bar { display: flex; flex-direction: column; }
.v3-i { width: 15px; height: 15px; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.v3-cv { width: 12px; height: 12px; opacity: .5; }

/* Dòng 1 — view tab */
.v3-views { display: flex; gap: 2px; border-bottom: 1px solid var(--v3-line); }
.v3-tab {
  padding: 9px 13px; border: 0; background: none; cursor: pointer; font-family: inherit;
  font-size: 13.5px; font-weight: 600; color: var(--v3-muted);
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
  transition: color .14s ease;
}
.v3-tab:hover { color: var(--v3-text); }
.v3-tab.on { color: var(--v3-text); font-weight: 700; border-bottom-color: var(--v3-primary); }
.v3-tab:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(0,115,234,.3); border-radius: 6px; }
.v3-tab .n {
  font-size: 11px; font-weight: 700; border-radius: 99px; padding: 1px 7px;
  background: var(--v3-surface-3); color: var(--v3-muted); font-variant-numeric: tabular-nums;
}
.v3-tab.on .n { background: var(--v3-primary-soft); color: var(--v3-primary-ink); }

/* Dòng 2 — toolbar */
.v3-tools { display: flex; align-items: center; gap: 4px; padding: 9px 0 2px; flex-wrap: wrap; }
.v3-new {
  height: 32px; padding: 0 14px 0 11px; border: 0; border-radius: 6px; cursor: pointer;
  background: var(--v3-primary); color: #fff; font-family: inherit;
  font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; gap: 6px;
  margin-right: 6px; transition: background .14s ease;
}
.v3-new:hover { background: var(--v3-primary-hover); }
.v3-tool {
  height: 32px; padding: 0 10px; border: 0; border-radius: 6px; cursor: pointer;
  background: transparent; color: var(--v3-muted); font-family: inherit;
  font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px;
  transition: background .14s ease, color .14s ease;
}
.v3-tool:hover { background: var(--v3-surface-2); color: var(--v3-text); }
.v3-tool.open { background: var(--v3-primary-soft); color: var(--v3-primary-ink); }
.v3-new:focus-visible, .v3-tool:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(0,115,234,.3); }
.v3-tool .bdg {
  background: var(--v3-primary); color: #fff; border-radius: 99px;
  font-size: 10.5px; font-weight: 800; padding: 0 6px; line-height: 16px; font-variant-numeric: tabular-nums;
}

/* Popover giữ control gốc */
.v3-pop {
  position: absolute; top: 100%; z-index: 40; min-width: 220px; max-width: 620px;
  background: var(--v3-surface); border: 1px solid var(--v3-line);
  border-radius: 8px; box-shadow: 0 8px 24px rgba(20,24,40,.16); padding: 11px 12px;
}
.v3-pop[hidden] { display: none; }

/* Control gốc: ẩn tại chỗ, hiện lại khi được mượn vào popover */
body.sales-v3 #tab-ban-lam-viec .blv-subtabs,
body.sales-v3 #tab-ban-lam-viec .blv-oltoggle,
body.sales-v3 #tab-ban-lam-viec .blv-ol-filterbar,
body.sales-v3 #tab-ban-lam-viec .blv-cal-toolbar [data-blv-new] { display: none !important; }

body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-subtabs,
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-filters,
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-ol-filterbar { display: flex !important; margin: 0 !important; }
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-rangetoggle,
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-viewtoggle,
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-oltoggle { display: inline-flex !important; margin: 0 !important; }
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-subtabs { flex-direction: column; gap: 3px; min-width: 200px; }
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-subtab { border-radius: 6px; justify-content: flex-start; }
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-filters { flex-direction: column; align-items: stretch; gap: 4px; min-width: 190px; }
body.sales-v3 #tab-ban-lam-viec .v3-pop .blv-ol-filterbar { flex-wrap: wrap; max-width: 580px; }

/* Ẩn/hiện khối theo view tab đang chọn.
   Bốn view: Hôm nay · CT Đề xuất · Đề xuất thiết kế · Outlet của tôi.
   Thanh nhịp (.v3-pulse) ghim ở MỌI view vì nó chỉ một dòng và là ngữ cảnh chung. */
body.sales-v3 #tab-ban-lam-viec .v3-v-today #blv-ctdx-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-today .blv-dcard:has(.blv-ol-table) { display: none !important; }

/* ── View "Biên bản bàn giao": chỉ 2 thẻ 📋 Biên bản + 📄 Hợp đồng ──────────
   Hàng #blv-ctbb-row chỉ hiện ở ĐÚNG view này; 5 view kia giấu nó đi (khai ở khối
   dưới cùng của mục này). Ngược lại view này giấu hết khối của các view kia — cùng
   khuôn với v3-v-kpi ngay bên dưới. */
body.sales-v3 #tab-ban-lam-viec .v3-v-bb #v3-next,
body.sales-v3 #tab-ban-lam-viec .v3-v-bb #v3-grid,
body.sales-v3 #tab-ban-lam-viec .v3-v-bb #blv-ctdx-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-bb #blv-tm-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-bb .blv-dcard:has(.blv-ol-table) { display: none !important; }
body.sales-v3 #tab-ban-lam-viec .v3-v-today #blv-ctbb-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx #blv-ctbb-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm #blv-ctbb-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-ol  #blv-ctbb-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-kpi #blv-ctbb-row { display: none !important; }
/* 2 thẻ nằm cạnh nhau; màn hẹp thì xuống hàng. #blv-ctbb-row không khai
   grid-template-columns inline nên phải đặt ở đây (mặc định .blv-dash là 1 cột). */
body.sales-v3 #tab-ban-lam-viec #blv-ctbb-row { grid-template-columns: 1fr 1fr; order: 6; }
@media (max-width: 1100px) {
  body.sales-v3 #tab-ban-lam-viec #blv-ctbb-row { grid-template-columns: 1fr; }
}

body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx #v3-next,
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx #v3-grid,
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx #blv-posm-card,
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx .blv-dcard:has(.blv-ol-table) { display: none !important; }

body.sales-v3 #tab-ban-lam-viec .v3-v-posm #v3-next,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm #v3-grid,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm #blv-ctdx-card,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm .blv-dcard:has(.blv-ol-table) { display: none !important; }

body.sales-v3 #tab-ban-lam-viec .v3-v-ol #v3-next,
body.sales-v3 #tab-ban-lam-viec .v3-v-ol #v3-grid,
body.sales-v3 #tab-ban-lam-viec .v3-v-ol #blv-ctdx-row { display: none !important; }

/* Chỉ còn một card trong hàng → cho nó chiếm trọn bề ngang */
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx #blv-ctdx-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm #blv-ctdx-row { grid-template-columns: 1fr !important; }

body.sales-v3 #tab-ban-lam-viec .v3-v-ol .blv-ol-scroll { max-height: calc(100vh - 360px); }

/* ══ 6. Thanh nhịp 6 ô + bố cục 3 cột (bám mockup S1) ═════════════
   Thanh nhịp: 4 KPI + 2 dòng doanh thu → 6 ô ngang, ngăn bằng nét dọc.
   Bố cục: trái mini-month + loại việc · giữa lịch · phải việc cần làm,
   công việc, dự báo. Không khối nào bị bỏ — chỉ đổi chỗ.
   ─────────────────────────────────────────────────────────────── */
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) {
  display: flex; align-items: stretch; flex-wrap: wrap; gap: 0; padding: 0; overflow: hidden;
}
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > h4 { display: none; }

/* Hai khối co giãn nhưng CÓ ĐÁY RỘNG: hết chỗ thì xuống hàng, không bóp cho
   chữ đè lên nhau. min-width:0 để nội dung dài được phép co/ngắt trong ô. */
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-stats {
  flex: 1 1 460px; min-width: 0; display: flex; background: none;
  border-radius: 0; padding: 0; margin: 0; gap: 0;
}
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-funnelrev {
  flex: 1 1 440px; min-width: 0; display: flex; flex-wrap: wrap; align-content: center;
  border: 0; margin: 0; padding: 0; position: relative;
}

/* VẠCH NGĂN MỀM: gạch mảnh cao 56%, canh giữa, bo tròn — phân tách được mà
   không tạo cảm giác đóng khung như kẻ ô bảng. */
body.sales-v3 #tab-ban-lam-viec .blv-stats .blv-stat,
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr { border-left: 0; position: relative; }
body.sales-v3 #tab-ban-lam-viec .blv-stats .blv-stat + .blv-stat::before,
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr + .blv-fr::before,
body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-funnelrev::before {
  content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 1px; height: 56%; background: var(--v3-line); border-radius: 99px;
}
/* Hàng 2 (khi xuống dòng) thì bỏ vạch dọc ở mép trái khối doanh thu */
@media (max-width: 1000px) {
  body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) > .blv-funnelrev::before { display: none; }
}

body.sales-v3 #tab-ban-lam-viec .blv-stats .blv-stat {
  flex: 1 1 0; min-width: 0; text-align: left; padding: 11px 14px;
  border-radius: 0; display: flex; flex-direction: column; overflow: hidden;
}
body.sales-v3 #tab-ban-lam-viec .blv-stats .divider { display: none; }
body.sales-v3 #tab-ban-lam-viec .blv-stat .l {
  font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  color: var(--v3-soft); margin: 0 0 3px; order: -1; line-height: 1.3;
  overflow-wrap: anywhere;                      /* nhãn dài tự ngắt, không tràn sang ô bên */
}
body.sales-v3 #tab-ban-lam-viec .blv-stat .v { font-size: 20px; line-height: 1.15; }
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr-h {
  flex: 0 0 100%; margin: 0; padding: 8px 14px 0; font-size: 10px;
  letter-spacing: .04em; text-transform: uppercase; color: var(--v3-soft);
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr {
  flex: 1 1 190px; min-width: 0; margin: 0; padding: 3px 14px 10px;
}
/* Số dài "91,69 / 108,77 tr · 84%" phải được ngắt dòng thay vì tràn đè ô kế */
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr-top { flex-wrap: wrap; gap: 2px 8px; }
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr-num { white-space: normal; }
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-fr-name { min-width: 0; }
body.sales-v3 #tab-ban-lam-viec .blv-funnelrev .blv-frnote { margin-left: 0; overflow-wrap: anywhere; }

/* Bố cục 3 cột */
#v3-grid { display: grid; grid-template-columns: 236px minmax(0,1fr) 330px; gap: 11px; align-items: start; }
body.sales-v3 #tab-ban-lam-viec #v3-grid { order: 6; }
.v3-col { display: flex; flex-direction: column; gap: 11px; min-width: 0; }
/* Chỉ ẩn khi #v3-grid ĐÃ dựng (selector anh em) — buildGrid lỗi thì lịch vẫn còn,
   thay vì biến mất khỏi trang. Vỏ .blv-dash rỗng cũng ẩn theo. */
body.sales-v3 #tab-ban-lam-viec #v3-grid ~ .blv-layout { display: none !important; }
body.sales-v3 #tab-ban-lam-viec .v3-b .blv-right { min-width: 0; }
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-dcard { margin: 0; }

/* Thẻ "Loại việc" ở cột trái */
.v3-chipcard h4 { display: flex; align-items: center; gap: 8px; }
.v3-chipcard .v3-hint { margin-left: auto; font-size: 10.5px; font-weight: 500; color: var(--v3-soft); }
.v3-chipnote { font-size: 10.5px; color: var(--v3-soft); margin-top: 7px; }
body.sales-v3 #tab-ban-lam-viec .v3-chipcard .blv-filters {
  flex-direction: column; align-items: stretch; gap: 5px; margin: 0;
}
body.sales-v3 #tab-ban-lam-viec .v3-chipcard .blv-chip { justify-content: flex-start; height: 32px; border-radius: 8px; }
.v3-n {
  margin-left: auto; font-size: 11px; font-weight: 700; color: var(--v3-muted);
  background: var(--v3-surface-2); border-radius: 99px; padding: 0 7px; font-variant-numeric: tabular-nums;
}

/* Sub-tab khác → ẩn cả lưới */
body.sales-v3 #tab-ban-lam-viec .v3-v-ol #v3-grid { display: none !important; }

@media (max-width: 1400px) {
  #v3-grid { grid-template-columns: 210px minmax(0,1fr) 290px; }
}
@media (max-width: 1180px) {
  #v3-grid { grid-template-columns: 1fr; }
  body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-a,
  body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-b,
  body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-c,
  body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-cp-full { grid-column: auto; grid-row: auto; }
  body.sales-v3 #tab-ban-lam-viec .blv-dcard:has(> .blv-funnelrev) { flex-wrap: wrap; }
}

/* Việc không giờ (visit đồng bộ từ Working Schedule) — nhãn "Cả ngày" hẹp hơn */
.v3-when .t.allday { font-size: 15px; letter-spacing: -.01em; }

/* ══ 7. Modal "Sửa visit" (#ws-modal) theo DS v2 ══════════════════
   Luật 14: header TRẮNG + viền top 3px primary — KHÔNG nền vàng/kem;
   body nền xám nhạt, mỗi khối là card trắng; 1 primary xanh.
   GIỮ NGUYÊN 100% trường — chỉ đổi màu, viền, khoảng cách.
   Nhiều style của modal viết thẳng vào thẻ (inline) nên phải !important.
   ─────────────────────────────────────────────────────────────── */
body.sales-v3 #ws-modal .modal-content { border-radius: 8px; box-shadow: 0 12px 34px rgba(20,24,40,.18); }
body.sales-v3 #ws-modal .modal-header {
  background: var(--v3-surface) !important; border-top: 3px solid var(--v3-primary);
  border-bottom: 1px solid var(--v3-line); padding: 13px 18px;
}
body.sales-v3 #ws-modal .modal-header h3 { font-size: 15.5px; font-weight: 800; letter-spacing: -.02em; color: var(--v3-text); }
body.sales-v3 #ws-modal .modal-close, body.sales-v3 #ws-modal .modal-close-btn {
  border-radius: 6px; color: var(--v3-muted); background: transparent; border: 0;
}
body.sales-v3 #ws-modal .modal-close:hover, body.sales-v3 #ws-modal .modal-close-btn:hover {
  background: var(--v3-surface-2) !important; color: var(--v3-text) !important;
}

/* Tab: gạch đỏ → gạch primary (inline style → cần !important) */
body.sales-v3 #ws-modal .ws-modal-tabs { background: var(--v3-surface) !important; border-bottom: 1px solid var(--v3-line) !important; }
body.sales-v3 #ws-modal .ws-modal-tab {
  border-bottom: 2px solid transparent !important; color: var(--v3-muted) !important;
  font-size: 13px !important; font-weight: 600 !important;
}
body.sales-v3 #ws-modal .ws-modal-tab.active {
  border-bottom-color: var(--v3-primary) !important; color: var(--v3-text) !important; font-weight: 700 !important;
}

/* Body: nền xám, khối con là card trắng */
body.sales-v3 #ws-modal .modal-body { background: var(--v3-app-bg, #F6F7FB); }
body.sales-v3 #ws-modal #ws-plan-info,
body.sales-v3 #ws-modal #ws-md-fields-section,
body.sales-v3 #ws-modal #ws-ps-approval {
  background: var(--v3-surface) !important; border: 1px solid var(--v3-line) !important;
  border-radius: 8px !important;
}
body.sales-v3 #ws-modal #ws-plan-info { border-left: 3px solid var(--v3-primary) !important; }
body.sales-v3 #ws-modal #ws-plan-info > div:first-child { color: var(--v3-muted) !important; }
body.sales-v3 #ws-modal #ws-plan-info input { border-color: var(--v3-line-2) !important; }

/* Tiêu đề nhóm master data: chữ nâu + gạch cam → uppercase muted + nét mảnh */
body.sales-v3 #ws-modal .ws-md-group > div:first-child {
  color: var(--v3-muted) !important; border-bottom: 1px solid var(--v3-line) !important;
  font-size: 10.5px !important; letter-spacing: .06em !important; padding: 5px 0 6px !important;
}

/* Field + nhãn */
body.sales-v3 #ws-modal .umm-label {
  font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: var(--v3-muted);
}
body.sales-v3 #ws-modal input[type="text"], body.sales-v3 #ws-modal input[type="date"],
body.sales-v3 #ws-modal input[type="email"], body.sales-v3 #ws-modal input[type="number"],
body.sales-v3 #ws-modal input[type="password"], body.sales-v3 #ws-modal select,
body.sales-v3 #ws-modal textarea {
  border-radius: 6px !important; border-color: var(--v3-line-2) !important;
  font-family: inherit; font-size: 12.5px; color: var(--v3-text);
}
body.sales-v3 #ws-modal input:focus, body.sales-v3 #ws-modal select:focus, body.sales-v3 #ws-modal textarea:focus {
  outline: none; border-color: var(--v3-primary) !important; box-shadow: 0 0 0 3px rgba(0,115,234,.28);
}

/* Khối phụ trong tab "Kết quả làm việc": vàng/tím/xanh rời → token trạng thái */
body.sales-v3 #ws-modal #ws-tab-results > div[style*="fffbeb"],
body.sales-v3 #ws-modal #ws-tab-results > div[style*="fef3c7"] {
  background: var(--v3-working-bg) !important; border-color: #F5DFBB !important; border-radius: 8px !important;
}
body.sales-v3 #ws-modal #ws-tab-results > div[style*="f5f3ff"] {
  background: var(--v3-purple-bg) !important; border-color: #E3D2F3 !important; border-radius: 8px !important;
}
body.sales-v3 #ws-modal #ws-tab-results > div[style*="f0f9ff"] {
  background: var(--v3-info-bg) !important; border-color: #C7DDFB !important; border-radius: 8px !important;
}

/* Footer + nút */
body.sales-v3 #ws-modal .modal-footer { background: var(--v3-surface); border-top: 1px solid var(--v3-line); }
body.sales-v3 #ws-modal .btn-primary {
  background: var(--v3-primary) !important; border: 0 !important; color: #fff !important;
  border-radius: 8px !important; font-weight: 700 !important;
}
body.sales-v3 #ws-modal .btn-primary:hover { background: var(--v3-primary-hover) !important; }
body.sales-v3 #ws-modal .btn-secondary, body.sales-v3 #ws-modal [data-ws-close] {
  background: var(--v3-surface) !important; border: 1px solid var(--v3-line-2) !important;
  color: var(--v3-text) !important; border-radius: 8px !important; font-weight: 700 !important;
}
body.sales-v3 #ws-modal .btn-danger {
  background: var(--v3-stuck) !important; border: 0 !important; color: #fff !important; border-radius: 8px !important;
}
body.sales-v3 #ws-modal #ws-sample-req-btn {
  background: var(--v3-purple-bg) !important; border-color: #DCC7F0 !important;
  color: var(--v3-purple-ink) !important; border-radius: 8px !important;
}

/* ══ 8. Khối "Cần chú ý" — gộp task + Action CP + công nợ ═════════ */
#v3-att h4 { display: flex; align-items: center; gap: 8px; }
#v3-att .badge.v3-red { background: var(--v3-stuck) !important; color: #fff !important; }
.v3-at { display: flex; align-items: flex-start; gap: 9px; padding: 9px 0; border-bottom: 1px solid var(--v3-line); cursor: pointer; }
.v3-at:last-child { border-bottom: 0; }
.v3-at:hover { background: var(--v3-surface-2); border-radius: 6px; }
.v3-at .bar { width: 3px; align-self: stretch; border-radius: 99px; flex: none; }
.v3-at .m { flex: 1; min-width: 0; }
.v3-at b { font-size: 12.5px; font-weight: 700; display: block; line-height: 1.35; }
.v3-at .meta { font-size: 11px; color: var(--v3-muted); margin-top: 3px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.v3-at .rt { margin-left: auto; flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.v3-at .nt { font-size: 10.5px; color: var(--v3-soft); white-space: nowrap; }
.v3-at-empty { font-size: 12px; color: var(--v3-soft); padding: 10px 2px; }
#v3-att .pill { display: inline-flex; align-items: center; height: 20px; padding: 0 9px; border-radius: 99px; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
#v3-att .p-stuck { background: var(--v3-stuck); color: #fff; }
#v3-att .ps-stuck { background: var(--v3-stuck-bg); color: var(--v3-stuck-ink); }
#v3-att .ps-work { background: var(--v3-working-bg); color: var(--v3-working-ink); }
#v3-att .ps-info { background: var(--v3-info-bg); color: var(--v3-info-ink); }
#v3-att .ps-purple { background: var(--v3-purple-bg); color: var(--v3-purple-ink); }

/* Công nợ đã gộp vào "Cần chú ý" → ẩn bản gốc, nhưng CHỈ khi khối gộp thật sự
   đã dựng (selector anh em) — buildAttention lỗi thì công nợ vẫn còn chỗ cũ. */
body.sales-v3 #tab-ban-lam-viec .v3-has-att #blv-duesoon { display: none !important; }

/* ══ 9. Hai khối cột phải bám đúng mockup ═════════════════════════ */
/* Bộ chuyển Hôm nay/Tuần/Tháng nằm trong header "Cần chú ý" */
#v3-att h4 .blv-rangetoggle { margin-left: auto; }

/* "Dự báo mua hàng": cột-theo-ngày cuộn ngang → danh sách dọc.
   Ngày chuyển thành nhãn nhỏ trong dòng, giữ nguyên tên · DS dự kiến ·
   nút gọi · link chi tiết outlet — không bỏ trường nào. */
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-up {
  flex-direction: column; overflow-x: visible; gap: 0; padding-bottom: 0;
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-daycol {
  width: 100%; min-width: 0; background: none; border: 0; padding: 0;
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-daycol-h {
  font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  color: var(--v3-soft); background: none; border: 0; padding: 8px 0 2px;
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-daycol-body { display: block; }
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-fccard {
  display: flex; align-items: center; gap: 9px; background: none;
  border: 0; border-bottom: 1px solid var(--v3-line); border-radius: 0;
  padding: 9px 0; box-shadow: none;
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-daycol:last-child .blv-fccard:last-child { border-bottom: 0; }
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-fccard .blv-ti {
  flex: 1; min-width: 0; font-size: 12.5px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0;
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-fcval {
  font-size: 12.5px; font-weight: 800; color: var(--v3-text);
  white-space: nowrap; font-variant-numeric: tabular-nums; margin: 0;
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-fcact { display: flex; gap: 4px; flex: none; margin: 0; }
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-iconbtn {
  width: 26px; height: 26px; border-radius: 6px; display: inline-flex;
  align-items: center; justify-content: center; color: var(--v3-muted);
}
body.sales-v3 #tab-ban-lam-viec .v3-c .blv-iconbtn:hover { background: var(--v3-surface-2); }

/* Dải lộ trình: canh đúng tỉ lệ ảnh — chấm + giờ, tên đậm, hành động mờ */
.v3-route { padding: 10px 12px; }
.v3-stop { padding: 3px 12px; }
.v3-stop .tm { font-size: 11px; }
.v3-stop .nm { font-size: 13px; margin: 2px 0 3px; }
.v3-stop .ac { font-size: 11px; }

/* ══ 10. "Cần chú ý": ô tóm tắt 5 việc + ngăn kéo phải xem hết ════
   Có ngày vài chục Action CP cùng quá hạn → đổ hết vào cột phải làm
   trang dài vô tận. Ô chỉ giữ 5 việc gấp nhất, phần còn lại vào ngăn kéo.
   ─────────────────────────────────────────────────────────────── */
.v3-more {
  width: 100%; margin-top: 9px; height: 30px; border-radius: 8px;
  border: 1px solid var(--v3-line-2); background: var(--v3-surface);
  color: var(--v3-primary); font-family: inherit; font-size: 12.5px;
  font-weight: 700; cursor: pointer; transition: background .14s ease;
}
.v3-more:hover { background: var(--v3-surface-2); }
.v3-more:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(0,115,234,.3); }

#v3-drawer { position: fixed; inset: 0; z-index: 9000; }
#v3-drawer[hidden] { display: none; }
.v3-dr-scrim { position: absolute; inset: 0; background: rgba(20,24,40,.34); }
.v3-dr-panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(92vw, 440px);
  background: var(--v3-surface); box-shadow: -12px 0 34px rgba(20,24,40,.18);
  display: flex; flex-direction: column;
  font-family: 'Public Sans','Be Vietnam Pro',system-ui,sans-serif; color: var(--v3-text);
}
.v3-dr-head {
  display: flex; align-items: center; gap: 9px; padding: 14px 16px;
  border-top: 3px solid var(--v3-primary); border-bottom: 1px solid var(--v3-line);
}
.v3-dr-head b { font-size: 15.5px; font-weight: 800; letter-spacing: -.02em; }
.v3-dr-n {
  background: var(--v3-stuck); color: #fff; border-radius: 99px;
  padding: 1px 8px; font-size: 11.5px; font-weight: 800; font-variant-numeric: tabular-nums;
}
.v3-dr-x {
  margin-left: auto; width: 28px; height: 28px; border-radius: 6px; border: 0;
  background: transparent; color: var(--v3-muted); cursor: pointer; font-size: 14px;
}
.v3-dr-x:hover { background: var(--v3-surface-2); color: var(--v3-text); }
.v3-dr-body { flex: 1; overflow-y: auto; padding: 0 16px 18px; }
.v3-dr-grp {
  display: flex; align-items: center; gap: 7px; position: sticky; top: 0;
  background: var(--v3-surface); padding: 12px 0 6px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--v3-muted); z-index: 1;
}
.v3-dr-grp span {
  background: var(--v3-surface-3); border-radius: 99px; padding: 1px 7px;
  font-size: 10px; font-variant-numeric: tabular-nums;
}
.v3-dr-row { display: flex; align-items: flex-start; gap: 9px; padding: 10px 0; border-bottom: 1px solid var(--v3-line); }
.v3-dr-row .bar { width: 3px; align-self: stretch; border-radius: 99px; flex: none; }
.v3-dr-row .m { flex: 1; min-width: 0; }
.v3-dr-row b { font-size: 13px; font-weight: 700; display: block; line-height: 1.35; }
.v3-dr-row .meta { font-size: 11px; color: var(--v3-muted); margin-top: 3px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.v3-dr-row .act { display: flex; gap: 6px; margin-top: 8px; }
.v3-dr-row .act button {
  height: 28px; padding: 0 10px; border-radius: 6px; cursor: pointer; font-family: inherit;
  font-size: 12px; font-weight: 700; border: 1px solid var(--v3-line-2);
  background: var(--v3-surface); color: var(--v3-text);
}
.v3-dr-row .act button.pri { background: var(--v3-primary); border-color: var(--v3-primary); color: #fff; }
.v3-dr-row .rt { flex: none; }
.v3-dr-row .pill { display: inline-flex; align-items: center; height: 20px; padding: 0 9px; border-radius: 99px; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.v3-dr-row .p-stuck { background: var(--v3-stuck); color: #fff; }
.v3-dr-row .ps-stuck { background: var(--v3-stuck-bg); color: var(--v3-stuck-ink); }
.v3-dr-row .ps-work { background: var(--v3-working-bg); color: var(--v3-working-ink); }
.v3-dr-row .ps-info { background: var(--v3-info-bg); color: var(--v3-info-ink); }
.v3-dr-row .ps-purple { background: var(--v3-purple-bg); color: var(--v3-purple-ink); }
body.v3-dr-open { overflow: hidden; }

/* ══ 11. Sửa chiều cao lịch + dọn trùng lặp cột trái ══════════════ */
/* Lưới giờ 7:00–20:00 kéo trang dài lê thê → cuộn trong khung của nó */
body.sales-v3 #tab-ban-lam-viec .v3-b .blv-main {
  max-height: calc(100vh - 300px); min-height: 380px; overflow-y: auto;
}
/* Nhãn "Lọc:" thừa trong thẻ Loại việc (chip đã tự có nhãn) */
body.sales-v3 #tab-ban-lam-viec .v3-chipcard .blv-filters > span:not(.blv-chip) { display: none; }
/* Legend trong mini-month trùng hệt thẻ "Loại việc" ngay dưới nó */
body.sales-v3 #tab-ban-lam-viec .v3-a .blv-legend { display: none; }
/* Thanh nhịp luôn full chiều ngang, không bao giờ bị bó vào cột */
body.sales-v3 #tab-ban-lam-viec .v3-col .blv-dcard:has(> .blv-funnelrev) { display: none !important; }

/* ══ 12. Vị trí thanh nhịp + chiều cao lịch (chốt bằng class, không :has) ══
   :has() đổi kết quả NGAY khi JS di chuyển node → không dùng nó để giữ chỗ.
   Thanh nhịp mang class .v3-pulse do JS gắn; vỏ .blv-dash rỗng mang .v3-empty. */
body.sales-v3 #tab-ban-lam-viec .v3-pulse { order: 4 !important; display: flex !important; }
body.sales-v3 #tab-ban-lam-viec .blv-dash.v3-empty { display: none !important; }

/* Lịch có chiều cao xác định → không để lại hố trống dưới đáy cột giữa */
body.sales-v3 #tab-ban-lam-viec .v3-b .blv-main {
  height: calc(100vh - 340px); min-height: 420px; max-height: none; overflow-y: auto;
}
body.sales-v3 #tab-ban-lam-viec .v3-b .blv-right { display: flex; flex-direction: column; }

/* ══ 13. Thứ tự khối trong cột phải ═══════════════════════════════
   Dự báo mua hàng → Việc cần làm → Công việc tuần này → Cần chú ý.
   Class do JS gắn (orderCol) chứ không dùng :has() — :has() đổi kết quả
   ngay khi node bị di chuyển, đã gây 2 lỗi bố cục trước đó. */
body.sales-v3 #tab-ban-lam-viec .v3-c > .v3-o1 { order: 1; }
body.sales-v3 #tab-ban-lam-viec .v3-c > .v3-o2 { order: 2; }
body.sales-v3 #tab-ban-lam-viec .v3-c > .v3-o3 { order: 3; }
body.sales-v3 #tab-ban-lam-viec .v3-c > .v3-o4 { order: 4; }

/* ══ 14. Bảng Action CP nằm dưới lịch (cột giữa) ══════════════════
   Lấp đúng khoảng trống dưới lịch, đồng thời bỏ được 1 sub-tab. */
/* Bảng CP trải ngang cột trái + cột giữa (hàng 2); cột phải chiếm cả 2 hàng */
body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-a { grid-column: 1; grid-row: 1; }
body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-b { grid-column: 2; grid-row: 1; }
body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-c { grid-column: 3; grid-row: 1; }
/* Bảng Action CP trải HẾT bề ngang (cả 3 cột) ở hàng 2 — cột trạng thái mới đủ
   rộng để thẻ không bị bóp, và cột cuối "Không làm được" không bị cắt. */
body.sales-v3 #tab-ban-lam-viec #v3-grid > .v3-cp-full { grid-column: 1 / -1; grid-row: 2; margin: 0; }
body.sales-v3 #tab-ban-lam-viec .v3-cp-full .blv-cp-col { min-width: 240px; }
body.sales-v3 #tab-ban-lam-viec .v3-cp-full .blv-cp-col-body { max-height: 460px; }

/* Lịch cao trở lại (bảng CP không còn nằm dưới nó trong cùng một cột) */
body.sales-v3 #tab-ban-lam-viec .v3-b .blv-main { height: calc(100vh - 350px); min-height: 380px; }

/* ══ 15. "Outlet của tôi" chỉ còn C.S ═════════════════════════════
   Danh sách đã lọc sẵn C.S ở tầng dữ liệu → cột "Funnel" luôn hiện đúng
   một giá trị, thành nhiễu. Ẩn cột đó (vẫn còn trong DOM, ?v3=0 là hiện lại). */
body.sales-v3 #tab-ban-lam-viec .blv-ol-table th:nth-child(3),
body.sales-v3 #tab-ban-lam-viec .blv-ol-table td:nth-child(3) { display: none; }


/* ══ 16. Action CP: thẻ chỉ-xem (không phải người được giao đích danh) ══
   Sales thấy việc của outlet mình phụ trách, nhưng quyền GHI vẫn bám
   cp_actions.misa_owner_name theo policy cp_actions_rw — nên thẻ không phải
   của mình hiện ở chế độ chỉ xem thay vì cho bấm rồi bị RLS chặn im lặng. */
.blv-cp-ro {
  display: inline-flex; align-items: center; gap: 5px; margin-top: 5px;
  font-size: 10.5px; font-weight: 700; color: var(--v3-muted);
  background: var(--v3-surface-2); border: 1px dashed var(--v3-line-2);
  border-radius: 99px; padding: 2px 9px;
}
.blv-cp-status-ro {
  display: inline-flex; align-items: center; justify-content: center;
  height: 30px; padding: 0 12px; border-radius: 8px;
  color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap;
}
.blv-cp-note-ro {
  font-size: 12px; color: var(--v3-muted); background: var(--v3-surface-2);
  border-radius: 6px; padding: 6px 9px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
}

/* ══ 17. Bung thẻ Action CP ngay trong ngăn kéo "Cần chú ý" ═══════
   Thẻ thật được MƯỢN vào đây nên đổi trạng thái / ghi kết quả / thêm ảnh
   chạy bằng đúng handler của module. */
.v3-dr-row[data-v3-exp] { cursor: pointer; }
.v3-dr-row.exp { background: var(--v3-surface-2); border-radius: 6px 6px 0 0; }
.v3-dr-exp {
  border: 1px solid var(--v3-line); border-top: 0; border-radius: 0 0 8px 8px;
  background: var(--v3-surface-2); padding: 10px; margin: 0 0 10px;
}
.v3-dr-exp .blv-cp-task { margin: 0; cursor: default; }
.v3-dr-exp .blv-cp-grip { display: none; }        /* kéo-thả đổi cột không dùng được ở đây */

/* ══ 18. Rail thu gọn: trả lại hành vi ẩn tiêu đề nhóm ════════════
   Mục 1 đặt `#ws-tabrail .wtr-grouphd { display:flex }`. Selector đó có ID nên
   THẮNG rule gốc `body.ws-sidebar-collapsed .wtr-grouphd { display:none }` →
   khi thu gọn, chữ "HÔM NAY / THEO DÕI / VẬN HÀNH" vẫn hiện, bị bó trong 56px
   nên xuống dòng và chèn lên icon. Trả lại đúng hành vi gốc, giữ layout flex
   cho lúc rail bung. */
body.ws-sidebar-collapsed #ws-tabrail .wtr-grouphd { display: none; }
body.ws-sidebar-collapsed.ws-rail-hover #ws-tabrail .wtr-grouphd { display: flex; }

/* ══ 19. Dòng đối chiếu dưới bảng "Outlet của tôi" ════════════════ */
.blv-ol-recon {
  margin-top: 9px; padding: 8px 11px; border-radius: 8px;
  background: var(--v3-surface-2); border-left: 3px solid var(--v3-line-2);
  font-size: 11.5px; color: var(--v3-muted); line-height: 1.55;
}
.blv-ol-recon b { color: var(--v3-text); font-variant-numeric: tabular-nums; }
.blv-ol-recon-why { display: block; margin-top: 2px; color: var(--v3-soft); }

/* ══ 20. Nút lọc: cùng một icon phễu ở mọi nơi ════════════════════ */
/* .ms-filter.open .ms-arrow xoay 180° — hợp với mũi tên caret, nhưng lộn ngược
   cái phễu. Bỏ xoay, thay bằng đổi màu để vẫn thấy trạng thái đang mở. */
body.sales-v3 .ms-arrow { display: inline-flex; align-items: center; opacity: .75; }
body.sales-v3 .ms-filter.open .ms-arrow { transform: none; opacity: 1; color: var(--v3-primary); }
body.sales-v3 .ms-arrow .ic { width: 14px; height: 14px; }
body.sales-v3 .plan-picker-btn .ic,
body.sales-v3 .ws-picker-btn .ic { width: 14px; height: 14px; }

/* ── "Outlet của tôi" = bảng C.S của trang Plan ──────────────────
   js/sales-os-v3.js MƯỢN node #plan-cs-list-current vào .v3-csmount trong card.
   Bảng cũ (danh mục MISA) và các control của riêng nó ẩn đi khi đang mượn —
   giữ trong DOM chứ không xoá, để trả về nguyên trạng lúc rời tab. */
body.sales-v3 #tab-ban-lam-viec .blv-dcard.v3-cs-on .blv-ol-filterbar,
body.sales-v3 #tab-ban-lam-viec .blv-dcard.v3-cs-on .blv-ol-scroll,
body.sales-v3 #tab-ban-lam-viec .blv-dcard.v3-cs-on .blv-ol-recon,
body.sales-v3 #tab-ban-lam-viec .blv-dcard.v3-cs-on .blv-olfchips,
body.sales-v3 #tab-ban-lam-viec .blv-dcard.v3-cs-on .blv-oltoggle,
body.sales-v3 #tab-ban-lam-viec .blv-dcard.v3-cs-on .blv-ol-count { display: none !important; }
body.sales-v3 #tab-ban-lam-viec .v3-csmount { margin-top: 4px; }
/* Bảng mượn sang mang theo lớp phủ plan-v3 (nhóm stage, đề mục chung, ô lọc).
   Bật cờ để những rule scope trong #tab-plan-ca cũng ăn ở đây. */
body.sales-v3 #tab-ban-lam-viec .v3-csmount .plan-stage-grid { column-count: 1 !important; }

/* ── Tab KPI trong Bàn làm việc ─────────────────────────────────
   js/sales-os-v3.js mượn #kpi-container vào .v3-kpimount và ẩn thẻ của người
   khác (data-kpi-owner). Ở view này giấu hết khối của các view kia. */
body.sales-v3 #tab-ban-lam-viec .v3-kpimount { order: 6; }
body.sales-v3 #tab-ban-lam-viec .v3-v-kpi #v3-next,
body.sales-v3 #tab-ban-lam-viec .v3-v-kpi #v3-grid,
body.sales-v3 #tab-ban-lam-viec .v3-v-kpi #blv-ctdx-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-kpi .blv-dcard:has(.blv-ol-table) { display: none !important; }
/* Các view khác thì không có khối KPI */
body.sales-v3 #tab-ban-lam-viec .v3-v-today .v3-kpimount,
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx .v3-kpimount,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm .v3-kpimount,
body.sales-v3 #tab-ban-lam-viec .v3-v-bb .v3-kpimount,
body.sales-v3 #tab-ban-lam-viec .v3-v-ol .v3-kpimount { display: none !important; }
/* Tiêu đề "KPI Tracking — T9/2026" của trang gốc thành thừa ở đây */
body.sales-v3 #tab-ban-lam-viec .v3-kpimount .kpi-header { display: none; }
body.sales-v3 #tab-ban-lam-viec .v3-kpimount .kpi-sales-grid { grid-template-columns: 1fr !important; }

/* ══ 20. View "Kế hoạch công tác" (dải view thứ 7) ════════════════
   KHÁC 6 view trên: đây không phải một khối trong cùng bản render mà là tab cấp 2
   `state.viewTab` của ban-lam-viec.js — module thay TRỌN innerHTML của
   #blv-container, nên ở view này DOM chỉ còn .blv-top + .blv-subtabs + #trip-root.
   js/sales-os-v3.js lo phần bấm hộ nút gốc; ở đây chỉ giấu hàng tab gốc (đã có chỗ
   khác thay) và chặn mọi khối của 6 view kia lỡ còn sót lại trong nhịp đổi tab.
   ─────────────────────────────────────────────────────────────── */
body.sales-v3 #tab-ban-lam-viec .blv-viewtabs { display: none !important; }

body.sales-v3 #tab-ban-lam-viec #trip-root { order: 6; }
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #v3-next,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #v3-grid,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #v3-att,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .v3-pulse,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .v3-kpimount,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .v3-csmount,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .blv-layout,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .blv-filters,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .blv-dash,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #blv-ctdx-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #blv-tm-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #blv-ctbb-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip #blv-outlet-row,
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .blv-dcard { display: none !important; }
/* Thanh công cụ (Tạo · Tìm kiếm · Lọc · Phạm vi) trỏ vào control của màn lịch —
   ở màn chuyến không có control nào để mượn, để lại là 4 nút bấm không ra gì. */
body.sales-v3 #tab-ban-lam-viec .v3-v-trip .v3-tools { display: none !important; }
/* 6 view kia không được để lọt #trip-root (nhịp giữa hai lần render của module) */
body.sales-v3 #tab-ban-lam-viec .v3-v-today #trip-root,
body.sales-v3 #tab-ban-lam-viec .v3-v-ctdx #trip-root,
body.sales-v3 #tab-ban-lam-viec .v3-v-posm #trip-root,
body.sales-v3 #tab-ban-lam-viec .v3-v-ol   #trip-root,
body.sales-v3 #tab-ban-lam-viec .v3-v-kpi  #trip-root,
body.sales-v3 #tab-ban-lam-viec .v3-v-bb   #trip-root { display: none !important; }