*{box-sizing:border-box}
html,body{height:100%;margin:0;overflow:hidden}
body{font-family:Arial,Helvetica,sans-serif;background:#dfe5eb;color:#111;font-size:12px}
button,input{font:inherit}
.topbar{height:55px;background:#17324d;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:6px 12px;box-shadow:0 1px 4px #0004}
.brand h1{margin:0;font-size:18px;line-height:21px}.brand span{font-size:11px;opacity:.85}
.actions{display:flex;align-items:center;gap:6px}.actions button{border:1px solid #d6dee6;background:#fff;color:#17324d;border-radius:4px;padding:6px 12px;font-weight:700;cursor:pointer}.actions button:hover{background:#eef4f8}.actions button:disabled{opacity:.4;cursor:default;background:#fff}.actions button:disabled:hover{background:#fff}
.save-state{font-size:11px!important;color:#d9f5df;margin-right:4px}.status-saving{color:#ffe0a3}.status-ok{color:#d9f5df}
.projectbar{height:44px;background:#fff;border-bottom:1px solid #b7c1cc;display:flex;align-items:center;gap:14px;padding:5px 9px;white-space:nowrap}
.projectbar label{font-weight:700}.projectbar input{height:29px;margin-left:5px;padding:4px 7px;border:1px solid #b8c4cf;border-radius:2px;background:#fff;width:150px}.projectbar input[type=number]{width:92px}.autosave{margin-left:auto;color:#087443;font-weight:700}
.tabs{height:36px;display:flex;background:#d7e0e8;border-bottom:1px solid #9eabb8;padding-left:4px;overflow:hidden}.tabs button{height:36px;border:1px solid #b5c0cb;border-bottom:0;background:#dce5ed;padding:0 16px;cursor:pointer;color:#111;white-space:nowrap}.tabs button+button{border-left:0}.tabs button.active{background:#fff;font-weight:700;border-top:3px solid #17324d;padding-top:1px}
.sheet-area{height:calc(100vh - 135px);padding:0 7px 24px;background:#e6ebf0}.tab{display:none;height:100%;min-height:0}.tab.active{display:flex;flex-direction:column}
.sheet-toolbar{height:35px;display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid #aeb9c4;border-top:0;padding:4px 7px;color:#4e5b67}.sheet-toolbar button{border:1px solid #aeb9c4;background:#f7f9fb;border-radius:2px;padding:4px 9px;font-weight:700;cursor:pointer}
.excel-sheet{height:100%;min-height:0;overflow:auto;background:#fff;border:1px solid #aeb9c4;position:relative}
.excel-table{border-collapse:collapse;table-layout:auto;background:#fff;width:max-content;min-width:0;font-size:11px;max-width:none}.excel-table td,.excel-table th{border:1px solid #9faab5;padding:3px 5px;height:23px;vertical-align:middle;overflow:hidden}.excel-table th{font-weight:700;text-align:center;white-space:normal;background:#d9e2f3}.excel-table .title{font-size:15px;font-weight:700;text-align:center;background:#17324d;color:#fff;height:28px}.excel-table .subtitle{font-size:10px;text-align:center;height:22px;background:#fff}.excel-table .project{font-weight:700;text-align:left;height:22px;background:#fff}.excel-table .right-head{font-weight:700;text-align:right;height:22px;background:#fff}.excel-table .section{font-weight:700;background:#fff}.excel-table .grouphead{background:#d9e2f3;font-weight:700;text-align:center}.excel-table .subhead{background:#eaf0f7;font-weight:700;text-align:center}.excel-table .num{text-align:right;font-variant-numeric:tabular-nums}.excel-table .center{text-align:center}.excel-table .wrap{white-space:normal;line-height:15px}.excel-table .total{font-weight:700;background:#e2f0d9}.excel-table .soft-total{font-weight:700;background:#f2f2f2}.excel-table .note{font-size:11px}.excel-table input{border:0;background:transparent;width:100%;height:21px;padding:2px 3px;outline:none}.excel-table input:focus{outline:2px solid #5b9bd5;background:#fff}.excel-table input.num-input{text-align:right}.excel-table .code-cell{position:relative;overflow:visible}.excel-table .suggest{position:absolute;left:0;top:24px;bottom:auto;background:#fff;border:1px solid #71879a;z-index:1000;width:440px;max-height:220px;overflow:auto;box-shadow:0 4px 12px #0003}.suggest-item{padding:6px 8px;border-bottom:1px solid #e4e8ec;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.suggest-item.active,.suggest-item:hover{background:#dbeaf8}
.sheet-empty{padding:30px;text-align:center;color:#66727e}
.price-input{border:1px solid #aeb9c4!important;background:#fff!important;border-radius:2px;text-align:right}.price-missing{background:#fff0f0!important;border-color:#df9b9b!important}
.warn{margin:7px;background:#fff0f0;border:1px solid #df9b9b;color:#8d1e1e;padding:7px}.missing-tag{color:#a11;font-weight:700}
footer{position:fixed;left:0;right:0;bottom:0;height:22px;background:#e2e7ec;border-top:1px solid #adb8c3;color:#5d6975;padding:4px 8px;font-size:10px}

/* Công trình - giống bố cục cột A:L của Excel mẫu */
.work-table col:nth-child(1){width:36px}.work-table col:nth-child(2){width:100px}.work-table col:nth-child(3){width:240px}.work-table col:nth-child(4){width:50px}.work-table col:nth-child(5){width:60px}.work-table col:nth-child(6){width:55px}.work-table col:nth-child(7){width:55px}.work-table col:nth-child(8){width:55px}.work-table col:nth-child(9){width:60px}.work-table col:nth-child(10){width:85px}.work-table col:nth-child(11){width:85px}.work-table col:nth-child(12){width:65px}
.work-table .detail-row td{background:#fff}.work-table .detail-row .detail-text{padding-left:10px;color:#333}.work-table .work-row td{height:26px}.work-table .work-row td:nth-child(2),.work-table .work-row td:nth-child(4){text-align:center}.work-table .work-row td:nth-child(3){white-space:normal;line-height:15px}
.row-handle{cursor:pointer;user-select:none}
.work-table tr.row-selected td{background:#cfe3f7!important}
/* Khung viền riêng cho các ô CÓ THỂ NHẬP LIỆU ở sheet Công trình (mã hiệu,
   danh mục công tác khi đang chờ chốt dòng, số bộ phận/dài/rộng/cao/hệ số,
   khối lượng toàn bộ khi nhập tay, ký hiệu bản vẽ) — để phân biệt trực quan
   với các ô chỉ hiển thị (STT, đơn vị, tên công tác đã tra định mức, khối
   lượng tính toán...) vốn không có <input> nên không bị khung này ảnh
   hưởng. Ghi đè lại "border:0" dùng chung cho input ở các sheet khác (xem
   ".excel-table input" phía trên) — CHỈ áp dụng cho sheet Công trình theo
   đúng yêu cầu, các sheet còn lại giữ nguyên như cũ. */
.work-table input{border:1px solid #8fb2d6;background:#f4f9ff;border-radius:2px}
.work-table input:focus{border-color:#2f6fb0;background:#fff}
.work-table input::placeholder{color:#93a3b3;font-style:italic}

/* Các sheet tổng hợp */
/* Độ rộng cột thật của sheet Vật liệu/Nhân công/Máy thi công và Hao phí VT
   nằm ở khối "Resource sheets now have 7 columns..." bên dưới — không khai
   báo trùng ở đây để tránh 2 nguồn định nghĩa mâu thuẫn nhau. */
.summary-table col:nth-child(1){width:45px}.summary-table col:nth-child(2){width:250px}.summary-table col:nth-child(3){width:240px}.summary-table col:nth-child(4){width:110px}.summary-table col:nth-child(5){width:60px}.summary-table td{height:25px}.summary-table .big-total td{font-weight:700;background:#e2f0d9}.summary-table .section-row td{font-weight:700;background:#f2f2f2}

@media(max-width:1100px){.projectbar{gap:7px}.projectbar label:nth-of-type(3),.projectbar label:nth-of-type(4){display:none}.tabs button{padding:0 10px}.sheet-area{padding-left:3px;padding-right:3px}.excel-table{font-size:10px}}

/* Cột tự co giãn theo nội dung nhưng luôn có giới hạn để không làm bảng quá rộng. */
.excel-table td,.excel-table th{max-width:300px}
/* Số liệu/số tiền: không ép xuống hàng trong cùng 1 ô, và không áp trần
   300px như các cột mô tả — độ rộng cột cho các ô này do app.js
   (autosizeColumns/liveFitColumn) tự tính và nới theo đúng độ dài số liệu. */
.excel-table td.num,.excel-table th.num{white-space:nowrap;max-width:none}
.work-table td:nth-child(3),.hp-table td:nth-child(3),.resource-table td:nth-child(3),.summary-table td:nth-child(2),.summary-table td:nth-child(3){max-width:260px}
.resource-detail td{background:#fafafa;color:#4f5b66;font-size:10.5px}
.resource-group td{background:#fff}

/* Bố cục màn hình MVP: 6 sheet nằm sát cạnh dưới màn hình. */
.tabs{position:fixed;left:0;right:0;bottom:0;height:38px;z-index:2000;box-shadow:0 -1px 4px #0002;padding-left:4px;overflow-x:auto;overflow-y:hidden}
.tabs button{height:38px}
.sheet-area{height:calc(100vh - 55px);padding-bottom:4px}
.summary-settings{min-height:42px;background:#fff;border:1px solid #aeb9c4;border-bottom:0;display:flex;align-items:center;gap:10px;padding:5px 8px;overflow-x:auto;white-space:nowrap}
.summary-settings label{font-weight:700;display:flex;align-items:center;gap:4px}
.summary-settings input{height:28px;padding:3px 6px;border:1px solid #b8c4cf;border-radius:2px;width:82px}
.summary-settings label:first-child input{width:180px}
#thdt .excel-sheet{height:calc(100% - 42px)}
/* Resource sheets now have 7 columns after removing TT vật tư. */
.resource-table col:nth-child(1){width:36px}.resource-table col:nth-child(2){width:80px}.resource-table col:nth-child(3){width:230px}.resource-table col:nth-child(4){width:50px}.resource-table col:nth-child(5){width:70px}.resource-table col:nth-child(6){width:90px}.resource-table col:nth-child(7){width:100px}
.hp-table col:nth-child(1){width:36px}.hp-table col:nth-child(2){width:80px}.hp-table col:nth-child(3){width:220px}.hp-table col:nth-child(4){width:50px}.hp-table col:nth-child(5){width:65px}.hp-table col:nth-child(6){width:62px}.hp-table col:nth-child(7){width:62px}.hp-table col:nth-child(8){width:62px}.hp-table col:nth-child(9){width:55px}.hp-table col:nth-child(10){width:70px}.hp-table col:nth-child(11){width:70px}.hp-table col:nth-child(12){width:70px}

.work-table td:nth-child(12),.work-table th:nth-child(12),.summary-table td:nth-child(5),.summary-table th:nth-child(5){text-align:center}

/* Đơn giá chi tiết / Dự thầu — cùng ngôn ngữ trực quan với các sheet còn lại:
   dòng đầu công tác đậm màu xanh lá như "Hao phí VT", dòng nhóm vật tư nền
   xanh nhạt như .subhead, dòng T/G/Gxd và Tổng cộng dùng lại .soft-total/.total. */
.dgct-table col:nth-child(1){width:36px}.dgct-table col:nth-child(2){width:80px}.dgct-table col:nth-child(3){width:50px}.dgct-table col:nth-child(4){width:85px}.dgct-table col:nth-child(5){width:220px}.dgct-table col:nth-child(6){width:50px}.dgct-table col:nth-child(7){width:65px}.dgct-table col:nth-child(8){width:80px}.dgct-table col:nth-child(9){width:45px}.dgct-table col:nth-child(10){width:95px}
.dgct-table td:nth-child(5){white-space:normal;line-height:15px}
.dgct-item td{font-weight:700;color:#0a6b1d}
.dgct-group td{background:#eaf0f7;font-weight:700}
.dutau-table col:nth-child(1){width:36px}.dutau-table col:nth-child(2){width:80px}.dutau-table col:nth-child(3){width:230px}.dutau-table col:nth-child(4){width:50px}.dutau-table col:nth-child(5){width:70px}.dutau-table col:nth-child(6){width:90px}.dutau-table col:nth-child(7){width:100px}
.dutau-table td:nth-child(3){white-space:normal;line-height:15px}
.dgct-diff td{font-style:italic;color:#5d6975}
body[data-theme="dark"] .dgct-diff td{color:#8a97a3}

/* Sheet nội bộ "Báo cáo" (CTRL+1) — chỉ hiển thị trên web app, không xuất Excel. */
.baocao-summary{margin:0 0 8px;padding:9px 11px;border-radius:3px;font-size:11.5px;line-height:1.6}
.baocao-summary p{margin:0 0 6px}.baocao-summary p:last-child{margin-bottom:0}
.baocao-warn{background:#fff6e9;border:1px solid #e0b877;color:#6b4a12}
.baocao-ok{background:#eef7ec;border:1px solid #9dc9a0;color:#1e5c22}
.baocao-table col:nth-child(1){width:36px}.baocao-table col:nth-child(2){width:80px}.baocao-table col:nth-child(3){width:230px}.baocao-table col:nth-child(4){width:90px}.baocao-table col:nth-child(5){width:70px}.baocao-table col:nth-child(6){width:90px}.baocao-table col:nth-child(7){width:90px}
.baocao-table td:nth-child(3){white-space:normal;line-height:15px}
.baocao-table td:nth-child(4){font-family:'Consolas',monospace;font-size:10.5px}
body[data-theme="dark"] .baocao-warn{background:#3a2f14;border-color:#8a6a2c;color:#f0d9a8}
body[data-theme="dark"] .baocao-ok{background:#16301a;border-color:#3f7a45;color:#bfe8c3}

/* Storage usage panel trong sheet Báo cáo */
.baocao-storage-panel{margin-top:12px;padding:0}
.storage-loading{display:block;padding:8px 0;color:#888;font-style:italic;font-size:11.5px}
.storage-header{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:7px 10px;background:#f0f4fb;border:1px solid #c5d3e8;border-radius:3px 3px 0 0;font-size:11.5px}
.storage-total{margin-left:4px;color:#2456a0}
.storage-ts{margin-left:auto;color:#888;font-size:10.5px;white-space:nowrap}
.storage-refresh-btn{padding:2px 8px;font-size:11px;border:1px solid #aac;border-radius:3px;background:#fff;cursor:pointer;color:#2456a0;transition:background .15s}
.storage-refresh-btn:hover{background:#e8eef8}
.storage-table{margin-top:0!important;border-top:none!important}
.storage-table thead th{background:#e8eef8;color:#1a3a6b;font-size:11px}
.storage-table td{font-size:11px}
.storage-table td.num{font-family:'Consolas',monospace;font-size:10.5px}
.storage-meters{padding:10px 12px 8px;background:#f7f9fc;border:1px solid #d0dcea;border-top:none;border-bottom:none}
.storage-meter-row{display:flex;align-items:baseline;gap:6px;font-size:12px}
.storage-label{min-width:70px;color:#555;font-weight:bold}
.storage-value{font-family:'Consolas',monospace;font-size:13px;font-weight:bold}
.storage-value.used{color:#c03000}
.storage-value.remaining{color:#1a6e2e}
.storage-pct{color:#888;font-size:11px}
.storage-bar-wrap{height:10px;background:#e0e6ef;border-radius:5px;margin:5px 0 2px;overflow:hidden}
.storage-bar-fill{height:100%;border-radius:5px;transition:width .4s}
.storage-details-toggle{border:1px solid #d0dcea;border-top:none;padding:4px 10px 0;font-size:11px;color:#2456a0;cursor:pointer;background:#f7f9fc}
.storage-details-toggle summary{padding:4px 0;user-select:none}
body[data-theme="dark"] .storage-header{background:#1e2a3a;border-color:#3a5070;color:#c8d8ee}
body[data-theme="dark"] .storage-total{color:#7eb8f7}
body[data-theme="dark"] .storage-refresh-btn{background:#243040;border-color:#4a6080;color:#7eb8f7}
body[data-theme="dark"] .storage-refresh-btn:hover{background:#2e4060}
body[data-theme="dark"] .storage-table thead th{background:#1a2a3a;color:#a0c0e8}
body[data-theme="dark"] .storage-meters{background:#1a2230;border-color:#2a3a50}
body[data-theme="dark"] .storage-label{color:#a0b0c8}
body[data-theme="dark"] .storage-value.used{color:#ff7050}
body[data-theme="dark"] .storage-value.remaining{color:#60d080}
body[data-theme="dark"] .storage-bar-wrap{background:#2a3a4a}
body[data-theme="dark"] .storage-details-toggle{background:#1a2230;border-color:#2a3a50;color:#7eb8f7}

/* Spreadsheet usability: visible headers, unobstructed scrolling, compact sheet tabs. */
.excel-sheet{overflow:auto;overscroll-behavior:contain;padding-bottom:8px;}
.excel-table thead th{border:1px solid #7f8b96 !important;position:sticky;z-index:8;background:#e8edf2;}
.excel-table thead tr:first-child th{z-index:10;}
.excel-table thead tr:nth-child(2) th{z-index:9;}
.excel-table thead tr:nth-child(3) th{z-index:9;}
.excel-table thead tr:nth-child(4) th{z-index:9;}
.excel-table thead tr:nth-child(5) th{z-index:9;}
.excel-table thead tr:nth-child(6) th{z-index:9;}
.tabs{height:30px !important;align-items:stretch !important;}
.tabs button{height:30px !important;min-height:30px !important;padding:0 13px !important;line-height:28px !important;}
.sheet-area{padding-bottom:34px !important;}
.context-menu{position:fixed;z-index:5000;min-width:210px;background:#fff;border:1px solid #9da8b2;box-shadow:0 4px 16px #0003;border-radius:3px;padding:4px 0;font-size:13px;}
.context-menu button{display:flex;width:100%;justify-content:space-between;gap:18px;border:0;background:#fff;padding:8px 12px;text-align:left;cursor:pointer;color:#18222c;}
.context-menu button:hover{background:#e9eef3;}
.context-menu kbd{font-size:11px;color:#64717d;background:#f2f4f6;border:1px solid #ccd2d8;border-radius:2px;padding:1px 4px;}
.norm-popover{position:fixed;z-index:4999;max-width:min(680px,calc(100vw - 24px));max-height:min(520px,calc(100vh - 24px));overflow:auto;background:#fff;border:1px solid #8997a5;box-shadow:0 6px 22px #0004;border-radius:4px;padding:12px;font-size:12px;}
.norm-popover h4{margin:0 0 8px;font-size:14px;}.norm-popover table{border-collapse:collapse;width:100%;}.norm-popover th,.norm-popover td{border:1px solid #c5ccd3;padding:4px 6px;}.norm-popover th{background:#edf1f5;}

/* Yêu cầu dự án: mọi ô trong mọi sheet luôn bật Wrap Text. */
.excel-table td,.excel-table th,.excel-table td *, .excel-table th *{white-space:normal !important;overflow-wrap:anywhere;word-break:normal;}

/* Hao phí VT: cột co vừa nội dung (không ép tràn hết khung nhìn) — chữ dài
   tự xuống dòng nhờ wrap text đã bật toàn cục, không làm bảng phình rộng. */
.hp-table td,.hp-table th{
  overflow-wrap:anywhere;
  word-break:break-word;
}
@media(max-width:900px){
  .hp-table{font-size:10px}
  .hp-table td,.hp-table th{padding:2px 3px}
}

/* Search suggestions always align left, regardless of the parent cell's own
   text-align (the Mã hiệu công tác cell is centered, and text-align is an
   inherited property, so the dropdown was inheriting that centering). */
.suggest,.suggest-item{text-align:left}

/* Mobile viewport: 100vh is unreliable across phone browsers (address bar
   show/hide changes the visible height, and iOS/Android differ on when).
   100dvh ("dynamic viewport height") tracks the actual visible area on
   every modern mobile browser; vh stays as the fallback for older ones.
   Safe-area insets keep content clear of notches/home-indicator bars. */
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.sheet-area{height:calc(100vh - 55px);height:calc(100dvh - 55px)}
@supports (height:100dvh){
  .sheet-area{height:calc(100dvh - 55px)}
}
.tabs{padding-bottom:env(safe-area-inset-bottom)}
@media(max-width:480px){
  .topbar{padding:6px 8px}
  .brand h1{font-size:15px}
  .actions button{padding:6px 9px;font-size:11px}
  .tabs button{padding:0 9px;font-size:11px}
}

/* Export progress overlay */
.export-overlay{position:fixed;inset:0;z-index:6000;background:#0006;display:flex;align-items:center;justify-content:center}
/* The native [hidden] attribute only sets display:none via the browser's
   default (lowest-priority) stylesheet — the class rule above has equal
   specificity and comes from an author stylesheet, so it was winning the
   cascade and keeping the overlay visible (and blocking every click on the
   page) from the moment the page loaded, export or not. This rule must
   explicitly override it. */
.export-overlay[hidden]{display:none}
.export-modal{background:#fff;border-radius:6px;box-shadow:0 8px 30px #0005;padding:22px 26px;width:min(360px,86vw);text-align:center}
.export-title{font-weight:700;font-size:14px;margin-bottom:14px;color:#17324d}
.export-bar{height:10px;border-radius:6px;background:#e3e8ed;overflow:hidden}
.export-bar-fill{height:100%;width:0%;background:linear-gradient(90deg,#2f6fb0,#17324d);border-radius:6px;transition:width .25s ease}
.export-status{margin-top:10px;font-size:12px;color:#54606c}

/* ---------- Dark mode ---------- */
body[data-theme="dark"]{background:#12181f;color:#e7ecf1}
body[data-theme="dark"] .topbar{background:#0d141b;box-shadow:0 1px 4px #0008}
body[data-theme="dark"] .actions button{background:#1c2530;color:#dbe6f0;border-color:#33404c}
body[data-theme="dark"] .actions button:hover{background:#26313d}
body[data-theme="dark"] .actions button:disabled{opacity:.4;cursor:default;background:#1c2530}
body[data-theme="dark"] .actions button:disabled:hover{background:#1c2530}
body[data-theme="dark"] .tabs{background:#1a222b;border-color:#2c3742}
body[data-theme="dark"] .tabs button{background:#1c252f;border-color:#2c3742;color:#c9d4de}
body[data-theme="dark"] .tabs button.active{background:#12181f;border-top-color:#5b9bd5;color:#fff}
body[data-theme="dark"] .sheet-area{background:#141b23}
body[data-theme="dark"] .sheet-toolbar{background:#1a222b;border-color:#2c3742;color:#c9d4de}
body[data-theme="dark"] .sheet-toolbar button{background:#1f2932;border-color:#33404c;color:#dbe6f0}
body[data-theme="dark"] .excel-sheet{background:#161e26;border-color:#2c3742}
body[data-theme="dark"] .excel-table{background:#161e26;color:#dbe6f0}
body[data-theme="dark"] .excel-table td,body[data-theme="dark"] .excel-table th{border-color:#2c3742}
body[data-theme="dark"] .excel-table th{background:#212c38;color:#e7ecf1}
body[data-theme="dark"] .excel-table thead th{background:#212c38}
body[data-theme="dark"] .excel-table .title{background:#0d141b;color:#fff}
body[data-theme="dark"] .excel-table .subtitle,body[data-theme="dark"] .excel-table .project,body[data-theme="dark"] .excel-table .right-head{background:#161e26;color:#c9d4de}
body[data-theme="dark"] .excel-table .grouphead,body[data-theme="dark"] .excel-table .subhead{background:#212c38}
body[data-theme="dark"] .excel-table .total{background:#213524}
body[data-theme="dark"] .excel-table .soft-total{background:#242c33}
body[data-theme="dark"] .excel-table .section{background:#161e26}
body[data-theme="dark"] .summary-table .big-total td{background:#213524}
body[data-theme="dark"] .summary-table .section-row td{background:#242c33}
body[data-theme="dark"] .work-table .detail-row td{background:#1a222b}
body[data-theme="dark"] .work-table .detail-row .detail-text{color:#c9d4de}
body[data-theme="dark"] .work-table tr.row-selected td{background:#2c445c!important}
body[data-theme="dark"] .excel-table input{color:#e7ecf1}
body[data-theme="dark"] .excel-table input:focus{background:#1f2932;outline-color:#5b9bd5}
body[data-theme="dark"] .work-table input{border-color:#3d6fa8;background:#1a2734}
body[data-theme="dark"] .work-table input:focus{border-color:#5b9bd5;background:#1f2932}
body[data-theme="dark"] .work-table input::placeholder{color:#7c8a99}
body[data-theme="dark"] .price-input{background:#1f2932!important;border-color:#33404c!important;color:#e7ecf1}
body[data-theme="dark"] .price-missing{background:#3a2020!important;border-color:#a75959!important}
body[data-theme="dark"] .resource-detail td{background:#1a222b;color:#aab6c1}
body[data-theme="dark"] .resource-group td{background:#161e26}
body[data-theme="dark"] .excel-table .suggest{background:#1c2530;border-color:#3c4a58}
body[data-theme="dark"] .suggest-item{border-color:#2c3742}
body[data-theme="dark"] .suggest-item.active,body[data-theme="dark"] .suggest-item:hover{background:#26374a}
body[data-theme="dark"] .sheet-empty{color:#8a97a3}
body[data-theme="dark"] .warn{background:#3a2020;border-color:#a75959;color:#f0b7b7}
body[data-theme="dark"] footer{background:#0d141b;border-color:#2c3742;color:#9aa7b2}
body[data-theme="dark"] .summary-settings{background:#1a222b;border-color:#2c3742}
body[data-theme="dark"] .summary-settings input,body[data-theme="dark"] .projectbar input{background:#1f2932;border-color:#33404c;color:#e7ecf1}
body[data-theme="dark"] .context-menu{background:#1c2530;border-color:#3c4a58;color:#e7ecf1}
body[data-theme="dark"] .context-menu button{background:#1c2530;color:#e7ecf1}
body[data-theme="dark"] .context-menu button:hover{background:#26313d}
body[data-theme="dark"] .context-menu kbd{background:#2a343e;border-color:#3c4a58;color:#c9d4de}
body[data-theme="dark"] .norm-popover{background:#1c2530;border-color:#3c4a58;color:#e7ecf1}
body[data-theme="dark"] .norm-popover th{background:#212c38}
body[data-theme="dark"] .norm-popover th,body[data-theme="dark"] .norm-popover td{border-color:#33404c}
body[data-theme="dark"] .export-modal{background:#1c2530;color:#e7ecf1}
body[data-theme="dark"] .export-title{color:#dbe6f0}
body[data-theme="dark"] .export-bar{background:#2c3742}
body[data-theme="dark"] .export-status{color:#aab6c1}
body[data-theme="dark"] #themeToggle{background:#1c2530!important;color:#dbe6f0!important}
body[data-theme="dark"] .dgct-item td{color:#4fd67a}
body[data-theme="dark"] .dgct-group td{background:#212c38}

/* ---- Hộp thông báo lỗi dạng POPUP NỔI (không phải banner chiếm hết
   chiều ngang, không có lớp phủ nền che bảng tính) — chỉ hiện khi thật sự
   phát hiện lỗi, tự "nhảy lên" ở góc trên bên phải màn hình bằng hiệu ứng
   errorPopIn, và người dùng vẫn thao tác/gõ được bình thường vào ô vừa
   được tự động nhảy tới/focus phía dưới nó. Xem showErrorPopup()/
   showMissingCodePopup()/liveValidateMissingCode() trong app.js. ---- */
.error-popup{position:fixed;top:64px;right:16px;z-index:1500;display:flex;gap:10px;align-items:flex-start;
  width:380px;max-width:calc(100% - 32px);background:#fdecea;border:1px solid #e53935;border-left:5px solid #e53935;
  color:#611a15;padding:12px 14px;border-radius:8px;box-shadow:0 10px 28px rgba(0,0,0,.28);
  animation:errorPopIn .18s ease-out}
/* QUAN TRỌNG: quy tắc display:flex ở trên sẽ đè luôn cả khi phần tử có
   thuộc tính "hidden" (CSS do người viết luôn thắng CSS mặc định của trình
   duyệt dù cùng độ ưu tiên) — nếu thiếu dòng dưới đây, popup lỗi sẽ HIỆN
   THƯỜNG TRỰC ngay cả khi chưa có lỗi nào cả. */
.error-popup[hidden]{display:none}
@keyframes errorPopIn{0%{opacity:0;transform:translateY(-10px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}
.error-popup-icon{font-size:18px;line-height:1.3}
.error-popup-content{flex:1;min-width:0}
.error-popup-title{font-weight:700;margin-bottom:2px}
.error-popup-body{font-size:13px;line-height:1.5;max-height:280px;overflow:auto}
.error-popup-body p{margin:4px 0}
.error-popup-body ul.error-list{margin:6px 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.error-popup-body .jump-link{background:#fff;border:1px solid #e53935;color:#611a15;
  border-radius:4px;padding:4px 8px;font-size:12.5px;cursor:pointer;text-align:left}
.error-popup-body .jump-link:hover{background:#e53935;color:#fff}
.error-popup-body .error-more{font-style:italic;color:#8a4a44}
.error-popup-close{border:none;background:transparent;color:#611a15;font-size:16px;
  cursor:pointer;line-height:1;padding:2px 4px}
.error-popup-close:hover{color:#e53935}
body[data-theme="dark"] .error-popup{background:#3a1a18;border-color:#e57373;color:#f6c9c5}
body[data-theme="dark"] .error-popup-close{color:#f6c9c5}
body[data-theme="dark"] .error-popup-body .jump-link{background:#2a1615;border-color:#e57373;color:#f6c9c5}
body[data-theme="dark"] .error-popup-body .jump-link:hover{background:#e57373;color:#2a1615}
body[data-theme="dark"] .error-popup-body .error-more{color:#e3a19c}
@media(max-width:640px){.error-popup{left:12px;right:12px;top:56px;width:auto}}

/* Ô cần sửa được nhảy/cuộn tới và focus tự động sẽ nhấp nháy viền đỏ vài
   giây để người dùng nhận ra ngay, không cần dò tìm thủ công. */
@keyframes jumpFlash{0%{box-shadow:0 0 0 4px rgba(229,57,53,.6)}100%{box-shadow:0 0 0 0 rgba(229,57,53,0)}}
.jump-highlight{outline:2px solid #e53935 !important;animation:jumpFlash 1.1s ease-out 2}

