*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Arial,sans-serif;font-size:12px;color:#1a1a1a;background:#f0f2f5;padding:14px}
.hdr{background:#fff;border-radius:8px;padding:14px;margin-bottom:10px;border:1px solid #ddd;text-align:center}
.co-name{font-size:15px;font-weight:bold;color:#1F4E79;text-transform:uppercase;letter-spacing:.5px}
.co-addr{font-size:10.5px;color:#666;margin:4px 0}
.doc-title{font-size:18px;font-weight:bold;color:#C55A11;margin-top:8px;text-transform:uppercase;letter-spacing:1px}
.doc-sub{font-size:10px;color:#999;margin-top:2px}
.toolbar{display:flex;justify-content:flex-end;gap:8px;margin-bottom:10px}
button{padding:7px 15px;border-radius:4px;cursor:pointer;font-size:11.5px;font-family:Arial;border:none}
.bc{background:#1F4E79;color:#fff}.bc:hover{background:#164073}
.bp{background:#fff;color:#1F4E79;border:1px solid #1F4E79}.bp:hover{background:#f0f4f8}
.bg{background:#217346;color:#fff}.bg:hover{background:#185a37}
.tab-bar{display:flex;gap:0;border-bottom:3px solid #1F4E79;margin-bottom:12px;flex-wrap:wrap}
.tab-btn{padding:6px 10px;cursor:pointer;border:1px solid #ccc;border-bottom:none;background:#f0f2f5;font-size:10px;font-weight:bold;color:#777;border-radius:6px 6px 0 0;transition:all .15s;outline:none}
.tab-btn:hover{background:#e2eaf3;color:#1F4E79}
.tab-btn.active{background:#fff;color:#1F4E79;border-color:#1F4E79;border-bottom:3px solid #fff;margin-bottom:-3px}
.tab-pane{display:none}.tab-pane.active{display:block}
.section{background:#fff;border-radius:8px;padding:12px;margin-bottom:10px;border:1px solid #ddd}
.sec-title{font-size:12px;font-weight:bold;color:#1F4E79;padding-bottom:5px;border-bottom:2px solid #1F4E79;margin-bottom:10px}
.dv-note{font-size:9.5px;color:#999;font-style:italic;font-weight:normal;margin-left:6px}
.pg{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pi{display:flex;align-items:center;gap:6px;background:#f9f9f9;border:1px solid #e5e5e5;border-radius:4px;padding:3px 7px}
.pi label{font-size:10px;color:#555;flex:1}
input.pv{text-align:right;font-weight:bold;color:#0c3460;background:#FFF9E6;border:1px solid #e5c900;border-radius:3px;padding:2px 5px;width:115px;font-size:11px;font-family:Arial}
input.pv:focus{outline:none;border-color:#bfa000;background:#fffde0}
span.pv-d{display:inline-block;text-align:right;font-weight:bold;color:#375623;background:#EEF7E8;border:1px solid #7db054;border-radius:3px;padding:2px 7px;min-width:130px;font-size:11px}
.pu{font-size:10px;color:#999;white-space:nowrap}
.pi2{grid-column:span 2}.pi3{grid-column:span 3}.pi4{grid-column:span 4}
.pi-at{grid-column:span 4;align-items:flex-start;flex-direction:column;gap:4px;padding:5px 8px}
.pi-at>.lbl{font-size:10.5px;color:#444;font-weight:bold}
.rsel{display:flex;gap:8px;align-items:center;flex-wrap:nowrap}
.rl{display:flex;align-items:center;gap:5px;cursor:pointer;font-size:10.5px;padding:4px 10px;border-radius:3px;border:1px solid #ddd;background:#fff;white-space:nowrap;transition:all .15s}
.rl input[type=radio]{accent-color:#1F4E79;cursor:pointer}
.rl:has(input:checked){border-color:#1F4E79;background:#EBF2FA}
.rl.ok:has(input:checked){border-color:#27ae60;background:#EEF7E8}
.at-note{font-size:9px;color:#888;margin-left:2px}
.cb-wrap{overflow-x:auto;margin-top:6px}
table.cbt{border-collapse:collapse;font-size:11px}
table.cbt th{background:#1F4E79;color:#fff;padding:5px 10px;border:1px solid #164073;text-align:center;font-size:10px}
table.cbt td{border:1px solid #d0d0d0;padding:2px 4px}
table.cbt td.cblbl{background:#144075;color:#fff;font-weight:bold;text-align:center;padding:5px 12px;font-size:12px}
table.cbt input.cbi{width:85px;border:1px solid #e5c900;background:#FFF9E6;text-align:right;font-size:11px;font-family:Arial;padding:2px 5px;font-weight:bold;color:#0c3460;border-radius:2px;outline:none}
table.cbt input.cbi:focus{border-color:#bfa000;background:#fffde0}
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.dt{border-collapse:collapse;font-size:10.5px;white-space:nowrap}
th{background:#1F4E79;color:#fff;padding:4px 6px;border:1px solid #164073;text-align:center;font-size:9.5px;font-weight:normal}
th.grp{background:#144075;font-weight:bold;font-size:10px}
td{border:1px solid #d0d0d0;padding:3px 5px}
tr:nth-child(even) td{background:#f7f9fc}
tr:hover td{background:#eaf3ff!important}
td.fx{background:#f0f1f3!important;color:#333;text-align:center}
td.fx.nm{text-align:left;min-width:155px}
td.inp{background:#FFF9E6!important;padding:1px 2px}
input.ci{width:80px;border:none;background:transparent;text-align:right;font-size:10.5px;font-family:Arial;padding:2px 3px;outline:none;color:#1a1a1a}
input.ci:focus{background:#fffde8;border-bottom:1px solid #e5c900}
input.ci.w45{width:42px}input.ci.w55{width:55px}input.ci.w88{width:88px}
select.cbsel{width:60px;border:1px solid #bbb;background:#fff8e8;font-size:10.5px;font-family:Arial;padding:2px 3px;outline:none;border-radius:2px;cursor:pointer;color:#1a1a1a;font-weight:bold}
td.ca{background:#EEF7E8!important;text-align:right;color:#2d5a1a}
td.ttn{background:#1F4E79!important;color:#fff!important;font-weight:bold;text-align:right}
td.tgm{background:#9e3c0c!important;color:#fff!important;font-weight:bold;text-align:right}
td.tl{background:#2d5a1a!important;color:#fff!important;font-weight:bold;text-align:right;font-size:11.5px}
tr.sr td{background:#bdd7ee!important;font-weight:bold;text-align:right;border-top:2px solid #1F4E79}
td.bN{background:#EEF7E8!important;text-align:right;color:#2d5a1a}
td.bNt{background:#2d5a1a!important;color:#fff!important;font-weight:bold;text-align:right}
td.bS{background:#FFF0EC!important;text-align:right;color:#7a2e08}
td.bSt{background:#7a2e08!important;color:#fff!important;font-weight:bold;text-align:right}
td.bTot{background:#1a3a5c!important;color:#fff!important;font-weight:bold;text-align:right}
td.txTT{background:#1F4E79!important;color:#fff!important;font-weight:bold;text-align:right}
td.txB{text-align:right;color:#1a6010}
td.txTax{background:#7a2e08!important;color:#fff!important;font-weight:bold;text-align:right}
.scards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sc{background:#f9f9f9;border:1px solid #ddd;border-radius:6px;padding:12px;text-align:center}
.sc .slb{font-size:10px;color:#777;margin-bottom:4px}
.sc .vl{font-size:14px;font-weight:bold;color:#1F4E79}
.sc.hi .vl{color:#2d5a1a;font-size:16px}
.sc .vl.og{color:#9e3c0c}
.lgd{display:flex;gap:14px;font-size:10px;color:#777;margin-bottom:8px;align-items:center;flex-wrap:wrap}
.li{display:flex;align-items:center;gap:4px}
.lbsq{width:11px;height:11px;border-radius:2px;border:1px solid #bbb;display:inline-block}
.info-box{font-size:10px;color:#444;background:#f0f5fb;border-left:3px solid #1F4E79;padding:8px 12px;border-radius:0 4px 4px 0;margin-bottom:10px;line-height:1.8}
td.cr-sug{background:#e8f0ff!important;text-align:center;font-weight:bold;color:#1a3a5c}
.cr-ok{display:inline-block;padding:2px 8px;border-radius:20px;font-size:9px;background:#e8f5e1;color:#2d5a1a;font-weight:bold}
.cr-warn{display:inline-block;padding:2px 8px;border-radius:20px;font-size:9px;background:#fff3cd;color:#7a5c00;font-weight:bold}
.cr-err{display:inline-block;padding:2px 8px;border-radius:20px;font-size:9px;background:#fdecea;color:#a32d2d;font-weight:bold}
.cb-ref-inp{width:100%;border:none;background:transparent;font-size:11px;text-align:right;outline:none;color:#1a3a5c;font-weight:bold}
.num{text-align:right}
td.ccP {background:#f0faf0!important;text-align:center;cursor:pointer;font-size:9px;color:#2d5a1a}
td.ccW {background:#dce8f7!important;text-align:center;cursor:pointer;font-size:9px;font-weight:bold;color:#1F4E79}
td.ccHW{background:#b8d4f0!important;text-align:center;cursor:pointer;font-size:8px;font-weight:bold;color:#1a3d6b}
td.ccA {background:#f0f0f0!important;text-align:center;cursor:pointer;font-size:9px;color:#aaa}
td.ccHA{background:#e2e2e2!important;text-align:center;cursor:pointer;font-size:8px;color:#999}
td.ccX {background:#f7ede0!important;text-align:center;cursor:default;font-size:8px;color:#ccc}
th.dow{width:26px;min-width:26px;padding:2px 1px;font-size:9px}
th.dow-sat{width:26px;min-width:26px;padding:2px 1px;font-size:9px;background:#7a5c00!important}
th.dow-sun{width:26px;min-width:26px;padding:2px 1px;font-size:9px;background:#7a1a1a!important}
.att-ctrl{display:flex;align-items:center;gap:8px;margin-bottom:10px;padding:8px 12px;background:#f9f9f9;border:1px solid #e5e5e5;border-radius:4px;flex-wrap:wrap}
.att-ctrl label{font-size:10px;font-weight:bold;color:#444}
.att-ctrl select,.att-ctrl input[type=number]{font-size:11px;border:1px solid #ccc;border-radius:3px;padding:3px 6px;background:#fff;font-family:Arial}
/* ===== NB (Nội bộ) — Red solid bg ===== */
.tab-btn.ltg-tab{background:#0277BD;color:#fff;border-color:#01579B;border-bottom-color:#01579B}
.tab-btn.ltg-tab.active{background:#01579B;color:#fff;border-color:#01579B;border-bottom:3px solid #fff}
.tab-btn.ltg-tab:hover{background:#0288D1;color:#fff}
.tab-btn.nb-tab{background:#BF360C;color:#fff;border-color:#7F1800;border-bottom-color:#7F1800}
.tab-btn.nb-tab.active{background:#7F1800;color:#fff;border-color:#7F1800;border-bottom:3px solid #fff}
.tab-btn.nb-tab:hover{background:#C62828;color:#fff}
table.cbt.nb{width:100%}
table.cbt.nb th{background:#BF360C;border:1px solid #7F1800}
table.cbt.nb td.cblbl{background:#7F1800}
table.cbt.nb input.cbi{border-color:#E65100;background:#FFF3E0;color:#4E2700}
table.cbt.nb input.cbi:focus{border-color:#BF360C;background:#FFECB3}
th.nb-grp{background:#BF360C!important;font-weight:bold}
td.nb-inp{background:#FFF3E0!important;padding:1px 2px}
input.nb-ci{width:80px;border:none;background:transparent;text-align:right;font-size:10.5px;font-family:Arial;padding:2px 3px;outline:none;color:#4E2700}
.gnb-ci{border:1px solid #FFAB76 !important;border-radius:3px;background:#FFFDE7 !important;color:#BF360C !important;font-weight:500;}
input.nb-ci:focus{background:#FFF3E0;border-bottom:1px solid #E65100}
input.nb-ci.w45{width:42px}input.nb-ci.w55{width:55px}input.nb-ci.w88{width:88px}
td.nb-ca{background:#FFF3E0!important;text-align:right;color:#4E2700}
td.nb-tl{background:#BF360C!important;color:#fff!important;font-weight:bold;text-align:right;font-size:11.5px}
td.nb-ttn{background:#7F1800!important;color:#fff!important;font-weight:bold;text-align:right}
td.nb-tgm{background:#5D1100!important;color:#fff!important;font-weight:bold;text-align:right}
tr.nb-sr td{background:#FFCCBC!important;font-weight:bold;text-align:right;border-top:2px solid #E65100}
/* ===== DC (Đối chiếu) — Teal solid bg ===== */
.tab-btn.dc-tab{background:#00695C;color:#fff;border-color:#004D40;border-bottom-color:#004D40}
.tab-btn.dc-tab.active{background:#004D40;color:#fff;border-color:#004D40;border-bottom:3px solid #fff}
.tab-btn.dc-tab:hover{background:#00796B;color:#fff}
/* ===== KT (Kiểm tra) — Purple theme (solid bg always) ===== */
.tab-btn.kt-tab{background:#6A1B9A;color:#fff;border-color:#4A148C;border-bottom-color:#4A148C}
.tab-btn.kt-tab.active{background:#4A148C;color:#fff;border-color:#4A148C;border-bottom:3px solid #fff}
.tab-btn.kt-tab:hover{background:#7B1FA2;color:#fff}
/* ===== DG (Đánh giá KPI) — Orange solid bg ===== */
.tab-btn.dg-tab{background:#E65100;color:#fff;border-color:#BF360C;border-bottom-color:#BF360C}
.tab-btn.dg-tab.active{background:#BF360C;color:#fff;border-color:#BF360C;border-bottom:3px solid #fff}
.tab-btn.dg-tab:hover{background:#F4511E;color:#fff}
/* ===== BN (Bảng thưởng) — Gold/yellow solid bg ===== */
.tab-btn.bn-tab{background:#B8860B;color:#fff;border-color:#8a6500;border-bottom-color:#8a6500}
.tab-btn.bn-tab.active{background:#7a5900;color:#fff;border-color:#7a5900;border-bottom:3px solid #fff}
.tab-btn.bn-tab:hover{background:#C8980D;color:#fff}
/* ===== BL (Bảng lương) — Blue solid bg ===== */
.tab-btn.bl-tab{background:#1565C0;color:#fff;border-color:#0D47A1;border-bottom-color:#0D47A1}
.tab-btn.bl-tab.active{background:#0D47A1;color:#fff;border-color:#0D47A1;border-bottom:3px solid #fff}
.tab-btn.bl-tab:hover{background:#1976D2;color:#fff}
/* KPI eval table */
.kpi-group-hdr td{background:#E3F2FD!important;font-weight:bold;font-size:10px;color:#0D47A1;padding:3px 6px}
td.kpi-score-cell{background:#FFF9E6!important;text-align:center}
td.kpi-total{background:#1F4E79!important;color:#fff!important;font-weight:bold;text-align:right}
.xep-loai-A{display:inline-block;padding:2px 8px;border-radius:12px;background:#E8F5E9;color:#1B5E20;font-weight:bold;font-size:10px}
.xep-loai-B{display:inline-block;padding:2px 8px;border-radius:12px;background:#E3F2FD;color:#0D47A1;font-weight:bold;font-size:10px}
.xep-loai-C{display:inline-block;padding:2px 8px;border-radius:12px;background:#FFF9C4;color:#F57F17;font-weight:bold;font-size:10px}
.xep-loai-D{display:inline-block;padding:2px 8px;border-radius:12px;background:#FDECEA;color:#B71C1C;font-weight:bold;font-size:10px}
/* KPI warning badge */
.kpi-warn{display:inline-block;padding:2px 7px;border-radius:10px;background:#FFF3E0;color:#E65100;font-size:9px;font-weight:bold}
/* KPI CD criteria table */
.kcd-tbl{border-collapse:collapse;font-size:10.5px;width:100%;table-layout:fixed}
.kcd-tbl th{background:#6A1B9A;color:#fff;padding:4px 7px;border:1px solid #4A148C;font-size:10px;font-weight:normal;word-break:break-word}
.kcd-tbl td{border:1px solid #ddd;padding:2px 3px;white-space:normal;overflow-wrap:break-word;word-break:break-word}
.kcd-tbl tr:nth-child(even) td{background:#f9f4ff}
input.kcd-inp{border:1px solid #ccc;border-radius:2px;padding:2px 4px;font-size:10.5px;font-family:Arial;outline:none;background:#fdf5ff;width:100%}
input.kcd-inp:focus{border-color:#6A1B9A;background:#f3e8ff}
select.kcd-grpsel{border:1px solid #9b59b6;background:#fdf5ff;font-size:10px;font-family:Arial;padding:2px 3px;outline:none;border-radius:2px;cursor:pointer;color:#4A235A;width:100%}
/* WFH cycling checkbox button */
.wfh-cycle{display:inline-flex;align-items:center;justify-content:center;width:34px;height:22px;border-radius:4px;border:1.5px solid #c0c8d8;cursor:pointer;font-size:10px;font-weight:bold;font-family:Arial;transition:all .12s;outline:none;background:#eef0f4;color:#999;user-select:none}
.wfh-cycle:hover{border-color:#888;background:#e0e4ec}
.wfh-cycle[data-state="1"]{background:#1565C0;color:#fff;border-color:#0D47A1}
.wfh-cycle[data-state="1"]:hover{background:#1976D2}
.wfh-cycle[data-state="2"]{background:#0D47A1;color:#fff;border-color:#1A237E}
.wfh-cycle[data-state="2"]:hover{background:#1565C0}
/* Tab I two-column layout */
.i1-wrap{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.i1-left{flex:1 1 0;min-width:240px}
.i1-right{flex:1 1 0;min-width:240px}
.i1-panel-hdr{font-size:10px;font-weight:bold;color:#1F4E79;border-bottom:2px solid #1F4E79;padding-bottom:2px;margin-bottom:5px}
.i1-row{display:grid;gap:5px;margin-bottom:4px}
.i1-row.c2{grid-template-columns:1fr 1fr}
.i1-row.c1{grid-template-columns:1fr}
/* Chức danh CRUD table */
.cd-tbl{border-collapse:collapse;font-size:10.5px;width:100%}
.cd-tbl th{background:#1F4E79;color:#fff;padding:4px 7px;border:1px solid #164073;font-size:10px;font-weight:normal}
.cd-tbl td{border:1px solid #ddd;padding:2px 3px;vertical-align:top}
.cd-tbl tr:nth-child(even) td{background:#f7f9fc}
input.cd-inp{border:1px solid #ccc;border-radius:2px;padding:2px 4px;font-size:10.5px;font-family:Arial;outline:none;background:#fff8f0}
input.cd-inp:focus{border-color:#1F4E79;background:#fffde0}
textarea.cd-inp{border:1px solid #ccc;border-radius:2px;padding:2px 4px;font-size:10.5px;font-family:Arial;outline:none;background:#fff8f0;width:100%;min-height:30px;resize:vertical;line-height:1.4;white-space:pre-wrap;word-break:break-word}
textarea.cd-mota{min-height:unset;height:1.8em;resize:none;overflow:hidden;line-height:1.4;white-space:pre-wrap;word-break:break-word}
textarea.cd-inp:focus{border-color:#1F4E79;background:#fffde0}
select.cdsel{width:88px;border:1px solid #bbb;background:#fff8e8;font-size:10px;font-family:Arial;padding:2px 2px;outline:none;border-radius:2px;cursor:pointer;color:#1a1a1a}
/* Leave table */
td.lv-ca{background:#E8F5E9!important;text-align:right;color:#1B5E20}
td.lv-warn{background:#FFF9C4!important;text-align:center;color:#F57F17;font-weight:bold}
td.lv-tot{background:#1B5E20!important;color:#fff!important;font-weight:bold;text-align:right}
td.lv-end{background:#C8E6C9!important;text-align:right;color:#1B5E20;font-weight:bold}
tr.lv-sr td{background:#A5D6A7!important;font-weight:bold;text-align:right;border-top:2px solid #2E7D32}
.nb-pane-hdr{background:linear-gradient(135deg,#BF360C,#E65100);color:#fff;padding:8px 14px;border-radius:6px 6px 0 0;font-weight:bold;font-size:12px;margin:-12px -12px 10px}
/* Nav buttons */
.nav-btns{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:10px;border-top:1px solid #e0e6ef}
.nav-back{background:#f0f2f5;color:#555;border:1px solid #bbb;padding:7px 20px;border-radius:4px;cursor:pointer;font-size:11.5px;font-family:Arial}
.nav-back:hover{background:#e0e4ea;color:#1F4E79}
.nav-next{background:#1F4E79;color:#fff;border:none;padding:7px 20px;border-radius:4px;cursor:pointer;font-size:11.5px;font-family:Arial}
.nav-next:hover{background:#164073}
/* Tab IV suggestion columns */
td.sug{background:#dce8f7!important;text-align:center;font-size:10.5px;color:#1a3a5c;font-weight:bold}
td.sug-empty{background:#f5f5f5!important;text-align:center;font-size:10px;color:#bbb}
/* Tab X checklist */
.chk-list{display:flex;flex-direction:column;gap:8px;max-width:860px}
.chk-item{display:flex;align-items:flex-start;gap:12px;padding:9px 14px;border-radius:6px;border:1px solid #e0e0e0;background:#fff}
.chk-item.pass{border-color:#7db054;background:#eef7e8}
.chk-item.fail{border-color:#e07070;background:#fdecea}
.chk-item.warn{border-color:#e5c900;background:#fffde0}
.chk-badge{font-size:16px;min-width:22px;text-align:center;margin-top:1px}
.chk-body{flex:1}
.chk-label{font-size:11px;font-weight:bold;color:#1a1a1a}
.chk-detail{font-size:10px;color:#666;margin-top:2px}
@media print{
  body{background:#fff;padding:4px;font-size:9px}
  .toolbar,.lgd,.tab-bar,.no-print{display:none!important}
  .tab-pane{display:block!important}
  /* Scrollable table wrappers clip their off-screen content when printed —
     force full-width, unclipped rendering so scrolled-out columns show up. */
  .cb-wrap,.tw{overflow:visible!important;width:auto!important}
  /* Single-tab print mode: only the target pane */
  body[data-print-pane] .tab-pane{display:none!important}
  body[data-print-pane="pane1"] #pane1, body[data-print-pane="pane2"] #pane2,
  body[data-print-pane="pane3"] #pane3, body[data-print-pane="pane4"] #pane4,
  body[data-print-pane="pane5"] #pane5, body[data-print-pane="pane6"] #pane6,
  body[data-print-pane="pane7"] #pane7, body[data-print-pane="pane8"] #pane8,
  body[data-print-pane="pane9"] #pane9, body[data-print-pane="pane10"] #pane10,
  body[data-print-pane="pane11"] #pane11, body[data-print-pane="pane12"] #pane12,
  body[data-print-pane="pane13"] #pane13, body[data-print-pane="pane14"] #pane14,
  body[data-print-pane="pane15"] #pane15{display:block!important}
  .section{box-shadow:none;border:1px solid #ccc;margin-bottom:6px;padding:6px;border-radius:0}
  th{font-size:8px;padding:2px 3px}td{padding:1px 3px;font-size:9px}
  .hdr{padding:8px}.pg{grid-template-columns:repeat(4,1fr)}.scards{grid-template-columns:repeat(4,1fr)}
}
