/* PHF QTTH — CHI PHÍ VPP (VPP UI V1).
   Builds on the Lương theo năm vocabulary (.phf-pa panels, .phf-pa-recon
   tables, .phf-pa-svg charts, .phf-payroll-filterbar) and the shared QTTH
   base. Corporate QTTH: Arial, square corners, PHF orange #F58220 accents,
   restrained chart colours; tables stay primary, charts secondary. */
.phf-vpp{--vpp-orange:#F58220;--vpp-orange-ink:#B8560A;--vpp-orange-wash:#FEF3E8;--vpp-ink:#1E2430;--vpp-muted:#5C6672;--vpp-line:#E3E6EB;--vpp-line-strong:#CDD2D9;font-family:Arial,Helvetica,sans-serif;color:var(--vpp-ink)}
.phf-vpp,.phf-vpp *{border-radius:0!important}
.phf-vpp .phf-qr-block-no{background:var(--vpp-orange)}
.phf-vpp .phf-payroll-filterbar{border-left-color:var(--vpp-orange)}
.phf-vpp .phf-vpp-search{min-width:240px;flex:1 1 240px;max-width:360px}
.phf-vpp .phf-vpp-search input{width:100%}
.phf-vpp .phf-qr-filters{align-items:flex-end}

/* notices */
.phf-vpp .phf-vpp-notice{margin:0 0 12px;padding:10px 12px;border:1px solid var(--vpp-line-strong);border-left:3px solid #55758a;background:#F7F9FA;font-size:12.5px;line-height:1.45;color:var(--vpp-ink)}
.phf-vpp .phf-vpp-notice.is-warn{border-left-color:#B45309;background:#FFF8EC}
.phf-vpp .phf-vpp-notice.is-source{border-left-color:#B42318;background:#FFF5F4}
.phf-vpp .phf-pa-panel .phf-vpp-notice{margin:6px 0 10px}

/* Section 01 matrix */
.phf-vpp .phf-pa-body>.phf-pa-panel{margin-bottom:14px}
.phf-vpp .phf-vpp-matrix{overflow-x:auto}
.phf-vpp .phf-vpp-matrix table{min-width:760px}
.phf-vpp .phf-pa-recon th.c-name,.phf-vpp .phf-pa-recon td.c-name{text-align:left;white-space:normal;min-width:190px}
.phf-vpp .phf-vpp-matrix th.c-name,.phf-vpp .phf-vpp-matrix td.c-name,.phf-vpp .phf-vpp-matrix tfoot td:first-child{position:sticky;left:0;background:#fff;z-index:1;box-shadow:1px 0 0 var(--vpp-line)}
.phf-vpp .phf-vpp-matrix thead th.c-name{background:#f6f7f8}
.phf-vpp .phf-vpp-matrix tfoot td:first-child{background:#f3f5f4}
.phf-vpp .phf-pa-recon td.is-na,.phf-vpp .phf-pa-recon th.is-na{color:#98a1ab}
.phf-vpp .phf-pa-recon td.is-zero{color:#8a949e}
.phf-vpp .phf-pa-recon td.c-total{font-weight:700!important}
.phf-vpp .phf-pa-recon th small{font-weight:400;text-transform:none;letter-spacing:0;color:var(--vpp-muted)}
.phf-vpp tr.phf-vpp-row{cursor:pointer}
.phf-vpp tr.phf-vpp-row:hover td{background:#FAFBFB}
.phf-vpp tr.phf-vpp-row:focus{outline:2px solid var(--vpp-orange);outline-offset:-2px}
.phf-vpp tr.phf-vpp-row.is-selected td{background:var(--vpp-orange-wash)}
.phf-vpp tr.phf-vpp-row.is-selected td:first-child{box-shadow:inset 3px 0 0 var(--vpp-orange),1px 0 0 var(--vpp-line)}
.phf-vpp tr.is-bucket td.c-name{font-style:italic}
.phf-vpp tr.is-unmapped td{background:#FFF8EC}

/* charts */
.phf-vpp .phf-vpp-chart{margin-top:12px;border-top:1px solid var(--vpp-line);padding-top:10px}
.phf-vpp .phf-vpp-chart-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:12.5px;margin-bottom:4px}
.phf-vpp .phf-vpp-line{max-height:250px}
.phf-vpp .phf-vpp-bars{max-height:260px}
.phf-vpp .phf-vpp-pick{cursor:pointer}
.phf-vpp .phf-vpp-pick:hover rect[style*="fill:#"]{opacity:.85}

/* two-column blocks */
.phf-vpp .phf-vpp-grid2{display:grid;grid-template-columns:minmax(300px,1fr) minmax(0,1.1fr);gap:16px;align-items:start}
.phf-vpp .phf-vpp-grid2.is-items{grid-template-columns:minmax(320px,.9fr) minmax(0,1.3fr)}
/* 3-column unit table must never hide Tỷ trọng inside the half-width column */
.phf-vpp .phf-vpp-unit-table{min-width:0!important}
.phf-vpp .phf-vpp-sub{margin:0 0 6px;font-size:12px;font-weight:700;color:var(--vpp-muted)}
.phf-vpp .phf-vpp-irow{grid-template-columns:minmax(150px,230px) minmax(0,1fr) 62px 52px}
.phf-vpp .phf-vpp-irow .phf-pa-oname b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.phf-vpp .phf-vpp-scrollbox{max-height:520px;overflow:auto}
.phf-vpp .phf-vpp-scrollbox thead th{position:sticky;top:0;background:#f6f7f8;z-index:1}
.phf-vpp .phf-vpp-code{display:block;font-size:10.5px;color:var(--vpp-muted);font-weight:400}
.phf-vpp .phf-vpp-line-table td{white-space:nowrap}
.phf-vpp .phf-vpp-line-table td.c-name{white-space:normal;min-width:200px}
.phf-vpp .phf-vpp-slip{font-size:12.5px}
.phf-vpp .phf-vpp-lines>.phf-qtth-btn{margin-top:8px}

/* read-only dispatch sheet */
.phf-vpp-sheet .phf-vpp-dl{display:grid;grid-template-columns:120px 1fr;gap:4px 12px;margin:0 0 10px;font-size:13px}
.phf-vpp-sheet .phf-vpp-dl dt{color:var(--qt-muted,#5C6672)}
.phf-vpp-sheet .phf-vpp-dl dd{margin:0;font-weight:700}
.phf-vpp-sheet .phf-vpp-code{display:block;font-size:10.5px;color:#5C6672;font-weight:400}
.phf-vpp-sheet,.phf-vpp-sheet *{border-radius:0!important}

/* Section 01 drillable money cells (open the read-only detail sheet) */
.phf-vpp .phf-pa-recon td.is-drill{padding:0}
.phf-vpp .phf-vpp-cellbtn{display:block;width:100%;padding:6px 8px;border:0;background:transparent;font:inherit;color:inherit;text-align:right;cursor:pointer;text-decoration:underline dotted #9aa3ad;text-underline-offset:3px}
.phf-vpp .phf-vpp-cellbtn:hover{background:var(--vpp-orange-wash);color:var(--vpp-orange-ink);text-decoration-color:var(--vpp-orange)}
.phf-vpp .phf-vpp-cellbtn:focus-visible{outline:2px solid var(--vpp-orange);outline-offset:-2px}

/* source identity: historical Bảng kê vs CSKH Phiếu xuất (quiet tags) */
.phf-vpp .phf-vpp-src,.phf-vpp-sheet .phf-vpp-src{display:inline-block;margin-left:6px;padding:0 4px;font-size:10px;line-height:15px;font-weight:400;border:1px solid var(--vpp-line-strong,#CDD2D9);color:#5C6672;vertical-align:1px;white-space:nowrap}
.phf-vpp .phf-vpp-src.is-hist{background:#F4F1EA;border-color:#DDD3C0}
.phf-vpp .phf-vpp-src.is-live{background:#EEF4F8;border-color:#C9D9E4}
.phf-vpp td.c-name .phf-vpp-src{margin-left:0;margin-top:2px}
.phf-vpp .phf-vpp-doc,.phf-vpp-sheet .phf-vpp-doc{font-size:12.5px}
.phf-vpp .phf-vpp-line-table tr.is-hist td:first-child{box-shadow:inset 2px 0 0 #DDD3C0}

/* cell detail sheet */
.phf-vpp-sheet header strong{display:block;letter-spacing:.02em}
.phf-vpp-sheet .phf-vpp-sheet-name{display:block;font-size:15px;margin-top:2px}
.phf-vpp-sheet header span b{color:#1E2430}
.phf-vpp-sheet .phf-vpp-back{display:block;margin-bottom:4px;font-size:12px}
.phf-vpp-sheet .phf-vpp-sheet-search{display:flex;flex-direction:column;gap:3px;margin:0 0 8px;max-width:360px;font-size:12px}
.phf-vpp-sheet .phf-vpp-sheet-search input{width:100%}
.phf-vpp-sheet .phf-vpp-sub{margin:0 0 6px;font-size:12px;font-weight:700;color:#5C6672}
.phf-vpp-sheet .phf-vpp-cell-table td{white-space:nowrap}
.phf-vpp-sheet .phf-vpp-cell-table td.c-name{white-space:normal;min-width:180px}
.phf-vpp-sheet .phf-qtth-tablewrap{overflow-x:auto}

@media (max-width:1100px){
  .phf-vpp .phf-vpp-grid2,.phf-vpp .phf-vpp-grid2.is-items{grid-template-columns:1fr}
}