/* ========================================================================
   TIẾN ĐỘ SHOP — style riêng (prefix .tds-)
   Chrome tông đỏ của dashboard (biến --dd-red…); bảng tiến độ tông xanh như Excel.
   Bố cục: bảng trái (chiều rộng cố định) + Gantt SVG bên phải (chỉ Gantt cuộn ngang),
   hai bên cùng nằm trong 1 khối nên cuộn dọc chung; mỗi hàng cao đúng 30px, tiêu đề 44px.
   ======================================================================== */
.tds-root{display:flex;flex-direction:column;gap:12px;position:relative}
.tds-narrow{display:none;background:#FEF3C7;border:1px solid #F59E0B;color:#92400E;border-radius:6px;padding:8px 12px;font-size:12px;font-weight:700}
@media (max-width:1023px){.tds-narrow{display:block}}

.tds-lbl{font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px}
.tds-select{border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-size:12px;background:#fff;max-width:340px}

/* ========== Màn 1 — bảng cây Shop/Dự án/Hạng mục (đồng bộ với tab Kế hoạch) ========== */
.tds-tree-panel{background:var(--card-bg);border-radius:8px;box-shadow:var(--shadow);border-left:4px solid var(--dd-red);padding:0;overflow:visible}
.tds-tree-panel-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border)}
.tds-tree-panel-title{font-size:13px;font-weight:800;color:var(--dd-red)}
.tds-tree-panel-meta{font-size:11px;color:var(--text-muted);font-style:italic}

.tds-tree-wrap{max-height:min(620px,calc(100dvh - 250px));overflow:auto;border:1px solid rgba(229,231,235,.9);border-radius:6px;margin:0 12px 12px}
table.tds-tree{border-collapse:collapse;width:100%;font-size:11px;table-layout:fixed;min-width:1280px}
table.tds-tree th{position:sticky;top:0;z-index:20;background:var(--dd-red);color:#fff;padding:6px 8px;font-weight:700;font-size:12px;text-align:left;border-right:1px solid rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}
table.tds-tree td{padding:5px 8px;border-bottom:1px solid var(--border);border-right:1px solid rgba(229,231,235,.85);background:var(--card-bg);color:var(--text);vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
table.tds-tree th:first-child,table.tds-tree td:first-child{width:28%}
table.tds-tree th:nth-child(2),table.tds-tree td:nth-child(2),table.tds-tree th:nth-child(3),table.tds-tree td:nth-child(3),table.tds-tree th:nth-child(4),table.tds-tree td:nth-child(4){width:9%}
table.tds-tree th:nth-child(5),table.tds-tree td:nth-child(5),table.tds-tree th:nth-child(6),table.tds-tree td:nth-child(6){width:7%}
table.tds-tree th:nth-child(7),table.tds-tree td:nth-child(7),table.tds-tree th:nth-child(8),table.tds-tree td:nth-child(8){width:8%}
table.tds-tree th:nth-child(9),table.tds-tree td:nth-child(9){width:6%}
table.tds-tree th:nth-child(10),table.tds-tree td:nth-child(10){width:9%}
table.tds-tree tr:nth-child(even)>td{background:#FFF9F5}
table.tds-tree tr:hover>td{background:var(--dd-red-light)}
table.tds-tree th.num,table.tds-tree td.num{text-align:right;font-variant-numeric:tabular-nums}
table.tds-tree th.center,table.tds-tree td.center{text-align:center}
.tds-col-tree{min-width:300px;max-width:420px}
.tds-col-num{width:88px}
.tds-col-date{width:90px}
.tds-col-status{width:120px}
table.tds-tree .tds-sticky-col{position:sticky;left:0;z-index:10;background:var(--card-bg)}
table.tds-tree th.tds-sticky-col{z-index:30;background:var(--dd-red)}
.tds-th-ctrl{display:flex;align-items:center;justify-content:space-between;gap:6px}
.tds-th-ctrl .kh-tree-controls .kh-btn{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.4)}
.tds-th-ctrl .kh-tree-controls .kh-btn:hover{background:rgba(255,255,255,.28);border-color:#fff}
.tds-th-ctrl .kh-tree-controls .kh-btn.active{background:#fff;color:#374151;border-color:#fff}
.tds-tg-btn{display:inline-block;width:16px;text-align:center;cursor:pointer;user-select:none;color:var(--dd-red);font-weight:800;font-size:11px;vertical-align:middle}
.tds-tg-btn.leaf{visibility:hidden}
.tds-indent-1{display:inline-block;width:18px}
.tds-indent-2{display:inline-block;width:38px}
.tds-row-l1>td{font-weight:800;background:var(--dd-cream) !important}
.tds-row-l1>td.tds-sticky-col{background:var(--dd-cream) !important}
.tds-row-l2>td{font-weight:600}
.tds-row-l2{cursor:pointer}
.tds-row-l2:hover>td{background:var(--dd-red-light) !important}
.tds-row-l2:hover>td.tds-sticky-col{background:var(--dd-red-light) !important}
.tds-row-l3{cursor:pointer}
.tds-row-l3:hover>td{background:var(--dd-red-light) !important}
.tds-row-l3:hover>td.tds-sticky-col{background:var(--dd-red-light) !important}
.tds-name-l1{color:#7F1D1D}
.tds-name-l2{color:var(--text)}
.tds-name-l3{color:var(--text-muted)}
.tds-ma{color:var(--text-muted);font-weight:600}
.tds-late-p{color:var(--sev-critical);font-weight:700}
.tds-late-z{color:var(--text-muted)}
.tds-late-n{color:var(--sev-ok);font-weight:700}
.tds-status-txt{font-size:10px;color:var(--text-muted)}
.tds-status-none{color:var(--text-muted);font-style:italic}
.tds-open-btn{display:none;border:1px solid var(--border);border-radius:4px;background:#fff;color:var(--dd-red);padding:2px 8px;font-size:10px;font-weight:700;cursor:pointer;white-space:nowrap;margin-left:6px}
.tds-open-btn:hover{background:var(--dd-red-light);border-color:var(--dd-red)}
.tds-row-l2:hover .tds-open-btn{display:inline-block}
.tds-tree-tip{color:var(--text-muted);font-style:italic}

/* ========== Màn 2 Gantt (mặc định, giữ từ P1.2) ========== */
.tds-board{display:flex;align-items:flex-start;background:#fff;border:1px solid #BAD0E6;border-radius:0 0 6px 6px;box-shadow:var(--shadow);overflow:hidden}
.tds-left{flex:none;width:810px;border-right:2px solid var(--dd-red);font-size:11px}
.tds-lrow{display:grid;grid-template-columns:46px 230px 78px 78px 78px 104px 48px 56px 92px;height:30px;border-bottom:1px solid #DDE3EA;align-items:stretch;cursor:pointer}
.tds-lrow:hover{background:#F1F6FB}
.tds-lrow .c{display:flex;align-items:center;padding:0 5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #EDF0F4;min-width:0}
.tds-lrow .c:last-child{border-right:0}
.tds-lhead{height:44px;background:var(--dd-red);color:#fff;font-weight:700;cursor:default;border-bottom:0}
.tds-lhead:hover{background:var(--dd-red)}
.tds-lhead .c{white-space:normal;text-align:center;justify-content:center;line-height:1.15;border-right:1px solid rgba(255,255,255,.35);font-size:10.5px}
.tds-lgroup{background:#DCE6F1;font-weight:800;color:#1F2937}
.tds-lgroup:hover{background:#CFDDEC}
.tds-lrow .c-ma{justify-content:center;color:var(--text-muted);font-weight:700}
.tds-lrow .c-kl{justify-content:flex-end;font-variant-numeric:tabular-nums}
.tds-lrow .c-date{justify-content:center;flex-direction:column;align-items:center;line-height:1.05;font-variant-numeric:tabular-nums}
.tds-lrow .c-date small{font-size:8.5px;font-weight:600}
.tds-lrow .c-date small.ok{color:#047857}
.tds-lrow .c-date small.fore{color:#6B7280;font-style:italic}
.tds-lrow .tds-nomark{color:#9CA3AF;font-style:italic}
.tds-lrow .c-delay{justify-content:center}
.tds-lrow .c-duration{justify-content:center;font-weight:400;font-variant-numeric:tabular-nums}
.tds-lrow .c-status{justify-content:center}
.tds-lrow .c-name{gap:6px}
.tds-group-actions{display:inline-flex;gap:4px;margin-left:auto;padding-right:6px;flex:none}
.tds-group-actions .kh-btn{min-height:24px;padding:2px 7px;font-size:11px}
.tds-ltask .c-name{padding-left:14px}
.tds-pri{display:inline-block;width:10px;height:10px;border-radius:2px;flex:none;margin-right:2px}
.tds-pri.lg{width:14px;height:14px;margin-right:6px}
.tds-arrow{border:0;background:transparent;cursor:pointer;font-size:12px;color:var(--dd-red);padding:0 4px 0 0;line-height:1}
.tds-delay{font-weight:800;font-variant-numeric:tabular-nums}
.tds-delay.late{color:var(--sev-critical)}
.tds-delay.early{color:#047857}
.tds-delay.zero{color:var(--text-muted)}
.tds-st{font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;border:1px solid}
.tds-st-done{background:#D1FAE5;color:#047857;border-color:#6EE7B7}
.tds-st-doing{background:#DBEAFE;color:#1D4ED8;border-color:#93C5FD}
.tds-st-todo{background:#F3F4F6;color:#4B5563;border-color:#D1D5DB}
.tds-right{flex:1;min-width:0;overflow-x:auto}
.tds-svg{display:block}
.tds-hit{cursor:pointer}
.tds-hit-group{cursor:default}
.tds-empty{background:var(--card-bg);border:1px dashed var(--border);border-radius:8px;padding:28px;text-align:center;color:var(--text-muted)}
.tds-empty-sm{color:var(--text-muted);font-size:11px}
.tds-shop-label{margin-left:6px;padding:1px 6px;border-radius:8px;background:#fff;border:1px solid var(--dd-red-light);color:var(--dd-red);font-size:10px;font-weight:700;letter-spacing:.3px}
.tds-task-name{display:inline-block;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tds-lgroup.tds-level-0{background:#E5E7EB;color:#111827;font-weight:800}
.tds-lgroup.tds-level-1{background:#DCE6F1}
.tds-lgroup.tds-level-2{background:#EAF1F8}
.tds-lrow .c-name.tds-lgroup-name{padding-left:6px}
.tds-lrow.tds-ltask .c-name{padding-left:20px}
.tds-shared-late{border-left-color:var(--sev-critical) !important}
.tds-shared-late .kpi-value{color:var(--sev-critical)}
.tds-shared-idle{border-left-color:#9CA3AF !important}
.tds-shared-idle .kpi-value{color:#6B7280}
.tds-loading,.tds-load-error{padding:8px 12px;border-radius:6px;font-size:12px;background:#EFF6FF;color:#1E40AF;border:1px solid #BFDBFE}
.tds-load-error{background:#FEF2F2;color:#991B1B;border-color:#FECACA}
.tds-breadcrumb{display:flex;align-items:center;gap:8px;background:#fff;border-left:4px solid var(--dd-red);padding:9px 12px;border-radius:6px;box-shadow:var(--shadow);font-size:12px;color:#374151}
.tds-breadcrumb strong{color:var(--dd-red)}
.tds-bc-back{border:0;background:transparent;color:#1D4ED8;font-weight:800;cursor:pointer;padding:3px 6px}
.tds-bc-shop,.tds-bc-prj{cursor:pointer}
.tds-bc-shop:hover,.tds-bc-prj:hover{text-decoration:underline}
.tds-add-project{margin-left:auto}

/* ========== Thanh trên: dự án + nút ========== */
.tds-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--card-bg);border-radius:8px;box-shadow:var(--shadow);border-left:4px solid var(--dd-red);padding:10px 14px}

/* ---------- KPI ---------- */
.tds-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.tds-kpi{background:var(--card-bg);border-radius:8px;box-shadow:var(--shadow);border-left:4px solid var(--dd-red);padding:10px 14px}
.tds-kpi.ok{border-left-color:var(--sev-ok)}
.tds-kpi.bad{border-left-color:var(--sev-critical)}
.tds-kpi.idle{border-left-color:#9CA3AF}
.tds-kpi-v{font-size:24px;font-weight:800;line-height:1.1}
.tds-kpi.bad .tds-kpi-v{color:var(--sev-critical)}
.tds-kpi.ok .tds-kpi-v{color:#047857}
.tds-kpi-l{font-size:11px;color:var(--text-muted);font-weight:700;margin-top:2px}

/* ---------- Bộ lọc + baseline ---------- */
.tds-filters,.tds-baseline{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--card-bg);border-radius:8px;box-shadow:var(--shadow);padding:8px 14px}
.tds-btn-group{display:inline-flex;gap:6px}
.tds-hint{font-size:11px;color:var(--text-muted);flex:1;min-width:220px}
.tds-legend{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--text);margin-left:auto;flex-wrap:wrap}
.tds-legend .lg{display:inline-block;width:22px;height:9px;border-radius:2px;margin-left:8px}
.tds-legend .lg-plan{height:3px;background:#8B95A5}
.tds-legend .lg-done{background:#16A34A}
.tds-legend .lg-fore{background:repeating-linear-gradient(45deg,#16A34A 0 3px,#BBF7D0 3px 6px)}
.tds-legend .lg-over{background:#DC2626}
.tds-legend .lg-today{width:2px;height:12px;background:#DC2626;border-radius:0}

/* ---------- Tiêu đề bảng ---------- */
.tds-title{background:var(--dd-red);color:#fff;font-weight:800;font-size:14px;text-align:center;padding:9px 12px;border-radius:6px 6px 0 0;letter-spacing:.3px;margin-bottom:-12px}
.tds-subtitle{background:#DCE6F1;color:#1F2937;font-size:11px;text-align:center;padding:5px 12px;margin-bottom:-12px;border:1px solid #BAD0E6;border-top:0}

/* ---------- Bảng trái + Gantt ---------- */
.tds-board{display:flex;align-items:flex-start;background:#fff;border:1px solid #BAD0E6;border-radius:0 0 6px 6px;box-shadow:var(--shadow);overflow:hidden}
.tds-left{flex:none;width:810px;border-right:2px solid var(--dd-red);font-size:11px}
.tds-lrow{display:grid;grid-template-columns:46px 230px 78px 78px 78px 104px 48px 56px 92px;height:30px;border-bottom:1px solid #DDE3EA;align-items:stretch;cursor:pointer}
.tds-lrow:hover{background:#F1F6FB}
.tds-lrow .c{display:flex;align-items:center;padding:0 5px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-right:1px solid #EDF0F4;min-width:0}
.tds-lrow .c:last-child{border-right:0}
.tds-lhead{height:44px;background:var(--dd-red);color:#fff;font-weight:700;cursor:default;border-bottom:0}
.tds-lhead:hover{background:var(--dd-red)}
.tds-lhead .c{white-space:normal;text-align:center;justify-content:center;line-height:1.15;border-right:1px solid rgba(255,255,255,.35);font-size:10.5px}
.tds-lgroup{background:#DCE6F1;font-weight:800;color:#1F2937}
.tds-lgroup:hover{background:#CFDDEC}
.tds-lrow .c-ma{justify-content:center;color:var(--text-muted);font-weight:700}
.tds-lrow .c-kl{justify-content:flex-end;font-variant-numeric:tabular-nums}
.tds-lrow .c-date{justify-content:center;flex-direction:column;align-items:center;line-height:1.05;font-variant-numeric:tabular-nums}
.tds-lrow .c-date small{font-size:8.5px;font-weight:600}
.tds-lrow .c-date small.ok{color:#047857}
.tds-lrow .c-date small.fore{color:#6B7280;font-style:italic}
.tds-lrow .tds-nomark{color:#9CA3AF;font-style:italic}
.tds-lrow .c-delay{justify-content:center}
.tds-lrow .c-duration{justify-content:center;font-weight:400;font-variant-numeric:tabular-nums}
.tds-lrow .c-status{justify-content:center}
.tds-lrow .c-name{gap:6px}
.tds-ltask .c-name{padding-left:14px}
.tds-pri{display:inline-block;width:10px;height:10px;border-radius:2px;flex:none;margin-right:2px}
.tds-pri.lg{width:14px;height:14px;margin-right:6px}
.tds-arrow{border:0;background:transparent;cursor:pointer;font-size:12px;color:var(--dd-red);padding:0 4px 0 0;line-height:1}

.tds-delay{font-weight:800;font-variant-numeric:tabular-nums}
.tds-delay.late{color:var(--sev-critical)}
.tds-delay.early{color:#047857}
.tds-delay.zero{color:var(--text-muted)}

.tds-st{font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;border:1px solid}
.tds-st-done{background:#D1FAE5;color:#047857;border-color:#6EE7B7}
.tds-st-doing{background:#DBEAFE;color:#1D4ED8;border-color:#93C5FD}
.tds-st-todo{background:#F3F4F6;color:#4B5563;border-color:#D1D5DB}

.tds-right{flex:1;min-width:0;overflow-x:auto}
.tds-svg{display:block}
.tds-hit{cursor:pointer}
.tds-hit-group{cursor:default}

.tds-empty{background:var(--card-bg);border:1px dashed var(--border);border-radius:8px;padding:28px;text-align:center;color:var(--text-muted)}
.tds-empty-sm{color:var(--text-muted);font-size:11px}

.tds-shop-label{margin-left:6px;padding:1px 6px;border-radius:8px;background:#fff;border:1px solid var(--dd-red-light);color:var(--dd-red);font-size:10px;font-weight:700;letter-spacing:.3px}
.tds-task-name{display:inline-block;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tds-lgroup.tds-level-0{background:#E5E7EB;color:#111827;font-weight:800}
.tds-lgroup.tds-level-1{background:#DCE6F1}
.tds-lgroup.tds-level-2{background:#EAF1F8}
.tds-lrow .c-name.tds-lgroup-name{padding-left:6px}
.tds-lrow.tds-ltask .c-name{padding-left:20px}
.tds-shared-late{border-left-color:var(--sev-critical) !important}
.tds-shared-late .kpi-value{color:var(--sev-critical)}
.tds-shared-idle{border-left-color:#9CA3AF !important}
.tds-shared-idle .kpi-value{color:#6B7280}
.tds-add-project{margin-left:auto}
.tds-loading,.tds-load-error{padding:8px 12px;border-radius:6px;font-size:12px;background:#EFF6FF;color:#1E40AF;border:1px solid #BFDBFE}
.tds-load-error{background:#FEF2F2;color:#991B1B;border-color:#FECACA}
.tds-tree-legend{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#fff;border-radius:6px;border:1px solid #DCE6F1;font-size:11px;color:#374151}
.tds-tree-legend .tds-hint{margin-left:auto}
.tds-tree-sp{width:16px;height:12px;border-radius:3px;background:#1F2937;display:inline-block}
.tds-tree-sp-mid{background:#DCE6F1;border:1px solid #9CB7D1}
.tds-tree-sp-leaf{background:#F8FBFF;border:1px solid #BAD0E6}
.tds-tree-board{background:#fff;border:1px solid #BAD0E6;border-radius:6px;box-shadow:var(--shadow);overflow:hidden}
.tds-tree-head,.tds-tree-row{display:grid;grid-template-columns:42px minmax(300px,1.4fr) minmax(360px,2fr) 70px;align-items:center}
.tds-tree-head{height:38px;background:var(--dd-red);color:#fff;font-size:11px;font-weight:800}
.tds-tree-head>div{padding:0 10px}
.tds-tree-body{max-height:min(560px,calc(100dvh - 310px));overflow:auto}
.tds-tree-row{min-height:38px;border-bottom:1px solid #E5E7EB;font-size:12px;cursor:default}
.tds-tree-row:hover{background:#F1F6FB}
.tds-tree-shop{background:#E5E7EB;font-weight:800;color:#111827}
.tds-tree-project{background:#DCE6F1;font-weight:800;color:#1F2937}
.tds-tree-item{background:#F8FBFF;color:#1F2937;cursor:pointer}
.tds-tree-item:hover{background:#E5F0FA}
.tds-tree-code{padding-left:10px;color:var(--dd-red);font-weight:800}
.tds-tree-name{padding:8px 10px;line-height:1.3}
.tds-tree-project .tds-tree-name{padding-left:24px}
.tds-tree-item .tds-tree-name{padding-left:42px}
.tds-tree-meta{padding:0 10px;color:#4B5563;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tds-tree-act{text-align:center}
.tds-tree-open{font-size:10px;padding:3px 8px}
.tds-tree-dot{display:inline-block;width:16px;text-align:center;color:#9CA3AF}
.tds-breadcrumb{display:flex;align-items:center;gap:8px;background:#fff;border-left:4px solid var(--dd-red);padding:9px 12px;border-radius:6px;box-shadow:var(--shadow);font-size:12px;color:#374151}
.tds-breadcrumb strong{color:var(--dd-red)}
.tds-bc-back{border:0;background:transparent;color:#1D4ED8;font-weight:800;cursor:pointer;padding:3px 6px}
.tds-bc-shop,.tds-bc-prj{cursor:pointer}
.tds-bc-shop:hover,.tds-bc-prj:hover{text-decoration:underline}

/* ---------- 3 khối dưới bảng ---------- */
.tds-bottom{display:grid;grid-template-columns:220px 1fr 1fr;gap:12px;align-items:start}
.tds-card{background:var(--card-bg);border-radius:8px;box-shadow:var(--shadow);border-top:3px solid var(--dd-red);padding:10px 12px;font-size:11px}
.tds-card-h{font-weight:800;font-size:11px;color:var(--dd-red);margin-bottom:8px}
.tds-lg-row{display:flex;align-items:center;margin:4px 0}
.tds-notes{padding-left:16px;display:flex;flex-direction:column;gap:5px;line-height:1.4}
.tds-sumtbl{width:100%;border-collapse:collapse;font-size:11px}
.tds-sumtbl th{background:var(--dd-red);color:#fff;padding:5px 6px;text-align:center;font-size:10.5px}
.tds-sumtbl td{padding:5px 6px;border-bottom:1px solid #EDF0F4}
.tds-sumtbl td.num{text-align:right;font-variant-numeric:tabular-nums}
.tds-sumtbl tr.tot td{font-weight:800;background:#DCE6F1}
.tds-kl-source{display:block;margin-top:2px;color:#7B7474;font-size:.8em;font-weight:400;line-height:1.25;white-space:normal}
.tds-kl-alert{margin-top:6px;color:#B45309;font-size:10px;font-weight:600}
.tds-kl-edit-hint{margin:4px 0 10px;padding:7px 9px;border-radius:5px;background:#FFF7ED;color:#9A4B00;font-size:11px;line-height:1.4}
@media (max-width:1400px){.tds-bottom{grid-template-columns:1fr}}

/* ---------- Báo cáo KL dự án: 4 thẻ + lưới biểu đồ (wireframe 28-03) ---------- */
.tds-kl-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tds-kl-kpis .kpi{cursor:default}
.tds-charts{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px;align-items:start}
.tds-charts>.tds-card{min-width:0}
.tds-c4{grid-column:span 4}.tds-c5{grid-column:span 5}.tds-c7{grid-column:span 7}.tds-c8{grid-column:span 8}.tds-c12{grid-column:span 12}
@media (max-width:1100px){.tds-c4,.tds-c5,.tds-c7,.tds-c8{grid-column:span 12}}
.tds-cv{position:relative;height:250px}
.tds-card-hint{color:var(--text-muted);font-size:10px;font-weight:400}
.tds-dn-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.tds-dn-side{display:grid;gap:8px;min-width:150px}
.tds-dn-side>div{display:grid;gap:0}
.tds-dn-side .k{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.tds-dn-side .n{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}
.tds-mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tds-mini .tds-cv{height:140px}
.tds-mini p{margin:0;text-align:center;font-size:11px;font-weight:700}
.tds-mini p.tds-card-hint{font-weight:400}

/* ---------- Bảng KL ban hành theo tháng: N tháng theo thanh Hiển thị, cột không kéo giãn, cuộn ngang ---------- */
.tds-kl-month-card{grid-column:1/-1;min-width:0}
.tds-kl-month-h{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tds-kl-month-h .kh-slider{font-weight:400}
.tds-kl-month-wrap{max-width:100%;overflow-x:auto}
.tds-kl-month{width:auto;border-collapse:separate;border-spacing:0;font-size:11px;table-layout:fixed}
.tds-kl-month th,.tds-kl-month td{width:92px;min-width:92px;max-width:92px;padding:4px 6px;border-bottom:1px solid #EDF0F4;background:#fff}
.tds-kl-month th{background:var(--dd-red);color:#fff;text-align:center;font-weight:400;line-height:1.25}
.tds-kl-month th b{display:block;font-weight:700}.tds-kl-month th small{display:block;font-size:10px;opacity:.85}
.tds-kl-month th.tds-km-cur{background:#A30000;box-shadow:inset 0 -3px 0 #FACC15}
.tds-kl-month .tds-km-pri{position:sticky;left:0;z-index:2;width:140px;min-width:140px;max-width:140px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tds-kl-month .tds-km-tot{position:sticky;right:0;z-index:2;width:110px;min-width:110px;max-width:110px;border-left:2px solid #C9D3E0}
.tds-kl-month th.tds-km-pri,.tds-kl-month th.tds-km-tot{z-index:6;background:var(--dd-red);font-weight:700}
.tds-kl-month td.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:400;font-size:11px}
.tds-kl-month td.num small{display:block;margin-top:1px;color:#1565C0;font-size:.8em;font-weight:400}
.tds-kl-month td.tds-km-future{background:#FAFAFA}
.tds-kl-month tr.tot td{font-weight:800;background:#DCE6F1}
.tds-kl-month tr.tot td.num small{font-weight:400}
.tds-kl-month-wrap h4,.tds-kl-moc-list h4{margin:4px 0 8px;color:var(--dd-red);font-size:11px}.tds-kl-month-wrap>p{margin:6px 0;color:var(--text-muted)}.tds-kl-moc-list{margin-top:14px;max-height:230px;overflow:auto}.tds-kl-moc-list table{width:100%;border-collapse:collapse;font-size:11px}.tds-kl-moc-list th{position:sticky;top:0;background:var(--dd-red);color:#fff;padding:5px 6px}.tds-kl-moc-list td{padding:5px 6px;border-bottom:1px solid #EDF0F4}.tds-kl-moc-list .num{text-align:right}.tds-kl-date{display:flex;align-items:center;gap:8px;margin:8px 0 12px;font-size:11px;font-weight:700}.tds-kl-date .tds-date-field{max-width:210px}.tds-kl-warning{display:block;margin-top:3px;color:#C76B00;font-size:10px;font-weight:600}.tds-kl-warning[hidden]{display:none}.tds-kl-confirm{display:flex;align-items:center;gap:8px;margin:8px 0;padding:8px;background:#FFF7ED;border:1px solid #FDBA74;border-radius:6px}.tds-kl-confirm[hidden]{display:none}.tds-kl-confirm span{flex:1}.tds-kl-pri{display:block;margin:8px 0}.tds-kl-pri>span{display:block;margin-bottom:4px}.tds-modal.tds-kl-modal{max-width:980px}
/* ---------- Thông báo, tooltip ---------- */
.tds-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);background:#1F2937;color:#fff;padding:9px 18px;border-radius:8px;font-size:12px;font-weight:700;opacity:0;pointer-events:none;transition:all .2s;z-index:700}
.tds-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.tds-tip{position:fixed;z-index:650;background:#111827;color:#fff;border-radius:6px;padding:8px 10px;font-size:11px;line-height:1.5;max-width:320px;pointer-events:none;box-shadow:var(--shadow-lg)}
.tds-tip b{display:block;margin-bottom:2px}
.tds-tip .tds-delay.late{color:#FCA5A5}
.tds-tip .tds-delay.early{color:#6EE7B7}
.tds-tip[hidden]{display:none}

/* ---------- Popup sửa dòng (khung .modal có sẵn) ---------- */
.tds-modal{max-width:760px}
.tds-form{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 14px;margin-bottom:12px}
.tds-form3{grid-template-columns:repeat(3,1fr)}
.tds-form label,.tds-flbl{display:flex;flex-direction:column;gap:4px;font-size:11px;font-weight:700;color:var(--text-muted)}
.tds-form .w2{grid-column:1 / -1}
.tds-in{border:1px solid var(--border);border-radius:6px;padding:6px 8px;font-size:12px;font-family:inherit;color:var(--text);background:#fff;width:100%}
.tds-in:disabled{background:#F3F4F6;color:#6B7280}
.tds-date-field{display:flex;align-items:center;gap:4px;width:100%}.tds-date-field>.tds-in{min-width:0;flex:1}.tds-date-picker{flex:0 0 auto;min-height:30px;padding:3px 7px}.tds-date-native{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.tds-fs{border:1px solid #BAD0E6;border-radius:8px;padding:10px 12px 6px;margin-bottom:12px}
.tds-fs legend{font-size:11px;font-weight:800;color:var(--dd-red);padding:0 6px}
.tds-locknote{font-size:11px;color:var(--text-muted);margin:-4px 0 6px}
.tds-pribtns{display:flex;gap:8px;margin-top:4px}
.tds-pribtn{border:2px solid var(--c);color:var(--c);background:#fff;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:800;cursor:pointer}
.tds-pribtn.on{background:var(--c);color:#fff}
.tds-pribtn.tds-pri-add{border:2px dashed #94A3B8;color:#64748B;background:#fff}
.tds-histlink{font-size:11px;color:#1D4ED8;font-weight:700;display:inline-block;margin-bottom:6px}
.tds-histbox{font-size:11px;color:var(--text-muted);background:#F9FAFB;border-radius:6px;padding:8px;margin-bottom:6px}
.tds-modal-desc{font-size:12px;color:var(--text-muted);line-height:1.5;margin:0 0 12px}
.tds-log-modal{max-width:980px}
.tds-log-wrap{max-height:480px;overflow:auto;border:1px solid var(--border);border-radius:6px}
.tds-log-table{width:100%;border-collapse:collapse;font-size:11px;table-layout:fixed}
.tds-log-table th{position:sticky;top:0;background:var(--dd-red);color:#fff;padding:7px 8px;text-align:left}
.tds-log-table td{padding:7px 8px;border-bottom:1px solid var(--border);vertical-align:top}
.tds-log-table th:nth-child(1),.tds-log-table td:nth-child(1){width:145px}
.tds-log-table th:nth-child(2),.tds-log-table td:nth-child(2){width:190px}
.tds-log-table th:nth-child(3),.tds-log-table td:nth-child(3){width:145px}
.tds-log-change{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tds-log-empty{text-align:center;color:var(--text-muted);padding:20px !important}
.tds-reason-reminder{grid-column:1 / -1;margin-top:-4px;padding:7px 9px;border:1px solid #FBBF24;border-radius:6px;background:#FFFBEB;color:#92400E;font-size:11px;font-weight:700}
.tds-reason-reminder[hidden]{display:none}
.tds-ordr{display:flex;flex-direction:row;align-items:center;gap:8px}
.tds-meta{font-size:11px;color:var(--text-muted);display:flex;align-items:flex-end}
.tds-mfoot{display:flex;align-items:center;gap:8px;padding:12px 20px;border-top:1px solid var(--border);background:#F9FAFB}
.tds-sp{flex:1}
.tds-danger{color:var(--sev-critical);border-color:var(--sev-critical)}

.tds-zone-edit,.tds-zone-add{display:flex;gap:8px;align-items:center;margin:6px 0}.tds-zone-edit .tds-in,.tds-zone-add .tds-in{flex:1;min-width:0}.tds-modal textarea.tds-in{min-height:72px;resize:vertical}.tds-baseline [data-act=edit-board]{margin-left:6px}.tds-uutien-edit span{display:flex;align-items:center;min-width:110px}
.tds-kl-cell{cursor:pointer}.tds-kl-cell:hover{text-decoration:underline dotted;text-underline-offset:3px}
.tds-kl-menu{position:fixed;z-index:1200;min-width:180px;background:#fff;border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow);padding:4px 0;display:flex;flex-direction:column}.tds-kl-menu[hidden]{display:none}
.tds-kl-menu-item{background:none;border:0;text-align:left;padding:7px 14px;font-size:12px;font-family:inherit;color:var(--text);cursor:pointer}.tds-kl-menu-item:hover{background:var(--dd-red-light)}
.tds-kl-modal{max-width:420px}.tds-kl-project{font-size:12px;color:var(--text-muted);margin-bottom:8px}
.tds-kl-pri{display:flex;flex-direction:column;gap:4px;margin:6px 0}.tds-kl-pri>span{display:flex;align-items:center;gap:4px}
.tds-kl-total{margin-top:8px;font-size:12px;text-align:right}

/* Vướng mắc: card cuối báo cáo; chỉ tác động bảng và popup mới. */
.tds-vm-card{margin-top:16px}
.tds-vm-head,.tds-vm-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tds-vm-head{justify-content:space-between}
.tds-vm-head label{display:flex;align-items:center;gap:6px}
.tds-vm-head .tds-in{width:auto;margin:0}
.tds-vm-wrap{overflow-x:auto}
.tds-vm-table,.tds-vm-history{width:100%;border-collapse:collapse;font-size:12px;text-align:left}
.tds-vm-table{min-width:1420px}
.tds-vm-table th,.tds-vm-history th{background:#DC0000;color:#fff;padding:9px 8px;vertical-align:middle}
.tds-vm-table td,.tds-vm-history td{padding:9px 8px;border-bottom:1px solid var(--border);vertical-align:top;font-weight:400}
.tds-vm-table .tds-vm-text{min-width:180px;max-width:320px;white-space:pre-wrap;overflow-wrap:anywhere}
.tds-vm-table .tds-vm-late{color:#DC0000}
.tds-vm-table .tds-vm-actions{min-width:150px}
.tds-vm-modal{max-width:680px}
.tds-vm-form,.tds-vm-resolved{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tds-vm-form>label:first-child,.tds-vm-resolved{grid-column:1 / -1}
.tds-vm-form label{display:flex;flex-direction:column;gap:5px}
.tds-vm-resolved[hidden]{display:none}
.tds-vm-history td{white-space:pre-wrap;overflow-wrap:anywhere}
.tds-vmtep-section{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.tds-vmtep-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.tds-vmtep-menu{display:flex;gap:8px;margin-bottom:8px}
.tds-vmtep-menu[hidden],.tds-vmtep-linkform[hidden]{display:none}
.tds-vmtep-linkform{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:end;margin-bottom:10px}
.tds-vmtep-linkform label{display:flex;flex-direction:column;gap:5px}
.tds-vmtep-linkform .tds-write-message{grid-column:1/-1}
.tds-vmtep-list{display:flex;flex-direction:column;gap:8px}
.tds-vmtep-row{display:flex;align-items:center;gap:10px;min-width:0;padding:7px;border:1px solid #D8DDE5;border-radius:6px;background:#fff}
.tds-vmtep-info{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px;overflow-wrap:anywhere}
.tds-vmtep-info strong{font-weight:600}
.tds-vmtep-info small{font-size:11px;color:var(--text-muted)}
.tds-vmtep-thumb{flex:0 0 96px;width:96px;height:72px;padding:0;border:0;border-radius:4px;overflow:hidden;background:#F3F4F6;cursor:pointer}
.tds-vmtep-thumb img{display:block;width:96px;height:72px;object-fit:cover}
.tds-vmtep-icon{display:flex;flex:0 0 48px;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid #D8DDE5;border-radius:5px;background:#F9FAFB;color:#374151;font-weight:800;text-decoration:none}
.tds-vmtep-drive{font-size:11px;color:#64748B}
.tds-vmtep-empty{margin:8px 0;color:var(--text-muted);font-size:12px}
.tds-vmtep-count{padding:0;border:0;background:none;color:#DC0000;font:inherit;font-weight:700;cursor:pointer}
.tds-vmtep-inline{margin-top:8px;min-width:300px}
.tds-vmtep-inline .tds-vmtep-row{background:#fff}
.tds-vmtep-inline .tds-vmtep-row .kh-btn{white-space:nowrap}
.tds-anh-card{margin-top:16px}
.tds-anh-body{padding:14px}
.tds-anh-empty{margin:0}
.tds-anh-list{display:flex;flex-direction:column;gap:14px}
.tds-anh-item{min-width:0;padding:10px;border:1px solid #D8DDE5;border-radius:6px;background:#fff;font-size:14px;overflow-wrap:anywhere}
.tds-anh-details{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px}
.tds-anh-item .kh-btn{margin-top:0}
.tds-anh-preview{display:flex;justify-content:center;width:100%;padding:0;border:0;background:#fff;cursor:pointer}
.tds-anh-preview img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100vh - 120px);object-fit:contain;border-radius:4px}
.tds-anh-note{white-space:pre-wrap;font-size:16px;font-weight:600}
.tds-anh-lightbox{box-sizing:border-box;position:relative;max-width:96vw;max-height:100vh;max-height:100dvh;padding:12px;display:flex;flex-direction:column;align-items:center;gap:8px;color:#fff}
.tds-anh-lightbox img{max-width:96vw;max-height:calc(100vh - 96px);max-height:calc(100dvh - 96px);min-height:0;flex:0 1 auto;object-fit:contain}
.tds-anh-lightbox p{flex:0 0 auto;max-width:100%;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.tds-anh-close{align-self:flex-end;color:#fff;background:transparent;border:0;font-size:28px;cursor:pointer}