/* Hành chính — payroll: CSS riêng của mục này, nạp ngay sau hanh-chinh.css và hanh-chinh-assets.css, hanh-chinh-insurance.css.
   Tách từ hanh-chinh.css ngày 2026-10-10 (tools/crm-visual/extract-module.cjs); thứ tự cascade đã kiểm. */

/* ============================================================
   BANG LUONG 22 COT (07/09/2026)
   Ghim ba cot trai theo dung dac ta: 44px / 90px / 170px.
   ============================================================ */
/* Module dung CHUNG khung the `.workspace-main-card` nhu moi module khac (nen trang, vien, bo
   goc, do do 20px). Ban dau khoi nay khong co khung nen noi dung dinh sat mep trai man hinh,
   khong giong bat ky trang nao con lai — Chu CRM bao "giao dien bi loi".

   `min-width: 0` la bat buoc, khong phai lam dep: khoi module la mot o trong luoi cua trang, va
   o luoi mac dinh `min-width: auto` nen NO TU CHOI CO LAI nho hon be ngang noi dung. Bang 22 cot
   + `white-space: nowrap` co be ngang tu nhien rat lon, du de day vo bo cuc ca trang. */
/* Chu CRM 08/09: "co le voi cac thu header, co dong, cot lai de hien thi duoc nhieu dong cot hon"
   — lay Quan Ly Chi Phi Phuc Loi lam chuan. Bang luong 20 cot nen tung pixel de danh cho o so. */
#modulePayroll { min-width: 0; padding: 12px 14px; }
.pr-wrap { overflow: auto; min-width: 0; max-width: 100%; max-height: calc(100vh - 210px); border: 1px solid #E8DFD5; border-radius: 10px; background: #fff; }
/* `min-width: 100%` de bang phu het be ngang the khi man hinh rong hon bang — neu khong se con
   mot mang trang chet o mep phai. Bang van tu gian rong hon khi can, va luc do `.pr-wrap` cuon. */
.pr-table { border-collapse: separate; border-spacing: 0; font-size: 12px; white-space: nowrap; min-width: 100%; }
.pr-table thead th {
    position: sticky; top: 0; z-index: 3;
    background: #F4EDE3; color: #5A4632; font-weight: 800; font-size: 10px;
    text-align: center; text-transform: uppercase; line-height: 1.2;
    padding: 2px 4px; letter-spacing: .01em;
}
/* Ghim chieu cao tang 1 dung 34px de moc `top: 34px` cua tang 2 la SO THAT, khong phai so doan.
   O `TỔNG THU NHẬP` co rowspan=2 va xuong hai dong, no keo tang 1 cao hon 34px neu khong ghim —
   luc cuon, tang 2 se de len tang 1. */
.pr-table thead tr:nth-child(1) th { height: 28px; }
.pr-table thead tr:nth-child(2) th { top: 28px; height: 24px; }
.pr-sticky { position: sticky; background: #fff; z-index: 2; }
.pr-table thead .pr-sticky { z-index: 5; background: #F4EDE3; }
/* 08/09: bo cot Ma nhan vien va cot Chuc vu — con HAI cot ghim trai. */
.pr-s1 { left: 0; width: 34px; min-width: 34px; }
.pr-s2 { left: 34px; width: 176px; min-width: 176px; box-shadow: 2px 0 0 #E8DFD5; }

/* Chuc vu xuong dong duoi ten, trong cung mot o. */
.pr-nguoi { padding: 2px 6px; }
.pr-ten { display: block; font-weight: 700; font-size: 12px; line-height: 1.2; }
.pr-nguoi .pr-txt + .pr-txt { margin-top: 2px; }

/* O Tinh trang phai du rong cho ca chu lan mui ten cua the select — truoc day chu bi cat
   thanh "Dang la…" vi cot qua hep. */
.pr-tt { min-width: 118px; }

/* Chu CRM 08/09: "can giua chu nghia tat ca can giua di". */
.pr-table th, .pr-table td {
    border-right: 1px solid #E8DFD5; border-bottom: 1px solid #E8DFD5; padding: 2px 5px; text-align: center; }
.pr-table .pr-subtotal-label { text-align: right; }
.pr-table .pr-branch > td, .pr-table .pr-dept > td { text-align: left; }

/* Dong tieu de phong ban — cung kieu voi Chi phi phuc loi va BHXH, nhat hon dong chi nhanh
   mot bac de nhin ra ngay cai nao long trong cai nao. */
.pr-dept td { background: #FBF6EE; color: #6B5334; font-weight: 700; font-size: 10.5px;
    letter-spacing: .04em; text-transform: uppercase; padding: 2px 6px 2px 20px; }
/* ---- Thanh loc + tim kiem + them nhan vien (08/09/2026) ---- */
.pr-filterbar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    padding: 5px 0 6px; }
.pr-filter-label { font-weight: 800; font-size: 10px; letter-spacing: .06em; color: #8A7355; }
.pr-chips { display: flex; gap: 5px; flex-wrap: wrap; }
.pr-chip { border: 1px solid #E8DFD5; background: #fff; color: #5A4632; border-radius: 999px;
    padding: 3px 9px; font-size: 11.5px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.pr-chip:hover { border-color: #C9A227; }
.pr-chip.is-on { background: #F4EDE3; border-color: #C9A227; color: #6B4E16; font-weight: 800; }
.pr-chip-warn { background: #FDF2F2; border-color: #F3D3D3; color: #A33A3A; }
.pr-chip-cash { background: #F2FAF4; border-color: #CFE9D7; color: #2F7A45; }
.pr-shown { font-size: 12px; color: #8A7355; font-weight: 600; }
.pr-search { display: flex; align-items: center; gap: 5px; margin-left: auto;
    border: 1px solid #E8DFD5; border-radius: 999px; padding: 3px 11px; background: #fff; }
.pr-search .material-icons { font-size: 15px; color: #A9967C; }
.pr-search input { border: 0; outline: 0; background: transparent; font-size: 12px; width: 160px; }
.pr-add-wrap { position: relative; }
.pr-add-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 40; width: 280px;
    background: #fff; border: 1px solid #E8DFD5; border-radius: 12px; overflow: hidden;
    box-shadow: 0 12px 28px rgba(60,45,25,.16); }
.pr-add-menu button { display: block; width: 100%; text-align: left; border: 0; background: #fff;
    padding: 11px 14px; cursor: pointer; }
.pr-add-menu button + button { border-top: 1px solid #F1EAE0; }
.pr-add-menu button:hover { background: #FBF7F1; }
.pr-add-menu strong { display: block; font-size: 13px; color: #3B3128; }
.pr-add-menu small { display: block; font-size: 11.5px; color: #8A7355; margin-top: 2px; }

/* ---- O chon nhan su ---- */
.pr-picker { position: fixed; inset: 0; z-index: 120; background: rgba(40,30,18,.42);
    align-items: center; justify-content: center; padding: 24px; }
.pr-picker-box { background: #fff; border-radius: 16px; width: min(760px, 100%);
    max-height: 84vh; display: flex; flex-direction: column; overflow: hidden; }
.pr-picker-head { display: flex; align-items: center; justify-content: space-between;
    padding: 14px 18px; border-bottom: 1px solid #F1EAE0; font-size: 15px; }
.pr-picker-x { border: 0; background: transparent; font-size: 18px; cursor: pointer; color: #8A7355; }
.pr-picker-search { margin: 12px 18px 6px; padding: 9px 14px; border: 1px solid #E8DFD5;
    border-radius: 10px; font-size: 13px; outline: 0; }
.pr-picker-body { overflow: auto; padding: 6px 12px 12px; }
.pr-pick-row { display: grid; grid-template-columns: 22px 96px 1fr 150px 84px; gap: 10px;
    align-items: center; padding: 8px 8px; border-radius: 8px; font-size: 13px; cursor: pointer; }
.pr-pick-code { font-family: inherit; font-size: 12px; }
.pr-picker-foot { display: flex; align-items: center; gap: 10px; padding: 12px 18px;
    border-top: 1px solid #F1EAE0; }
.pr-picker-note { font-size: 11.5px; color: #8A7355; margin-right: auto; }

/* ---- Dong tu them + dong tong toan cong ty ---- */
/* `font: inherit` la bat buoc: o input KHONG tu ke thua font cua trang, no dung font mac dinh
   cua he dieu hanh. Thieu dong nay thi dong tu them trong khac han cac dong con lai — Chu CRM
   goi la "loi font". Cac o so cung vay. */
.pr-txt { width: 100%; border: 1px solid #E8DFD5; border-radius: 5px; padding: 1px 4px;
    font: inherit; font-size: 12px; text-align: center; outline: 0; background: #FFFDF8; }
.pr-txt:focus { border-color: #C9A227; background: #fff; }
.pr-tu-them .pr-sticky { background: #FFFDF6; }
.pr-branch-count { float: right; font-weight: 600; font-size: 11.5px; opacity: .75; }
.pr-empty td { text-align: center; color: #8A7355; font-size: 12.5px; padding: 14px; }
.pr-grand td { background: #F4EDE3; font-weight: 800; border-top: 2px solid #C9A227; }

.pr-center { text-align: center; }
.pr-num { text-align: right; font-family: inherit; font-variant-numeric: tabular-nums; }
/* ============================================================
   SAU KHU VUC COT — MOI KHU MOT TONG (Chu CRM 08/09)
   Tat ca deu la mau RAT NHAT tren nen nga cua CRM: chi du de mat luot theo cot khi nhap lieu,
   khong doi lai su chu y voi con so. O tieu de dam hon o du lieu mot bac de nhin ra ranh gioi.
   ============================================================ */
.pr-table td.pr-g-std     { background: #FCF8F1; }   /* Tieu chuan — cat am */
.pr-table th.pr-g-std     { background: #F0E4D2; }
.pr-table td.pr-g-real    { background: #F6F9FB; }   /* Thuc te — xanh xam lanh */
.pr-table th.pr-g-real    { background: #E3EDF3; }
.pr-table td.pr-g-allow   { background: #F6FAF6; }   /* Phu cap — xanh la nhat */
.pr-table th.pr-g-allow   { background: #E1EFE4; }
.pr-table td.pr-g-income  { background: #FDF7EA; }   /* Tong thu nhap — ho phach */
.pr-table th.pr-g-income  { background: #F6E8C7; }
.pr-table td.pr-g-deduct  { background: #FCF7F6; }   /* Trich nop — hong dat */
.pr-table th.pr-g-deduct  { background: #F2E2DF; }
.pr-table td.pr-g-net     { background: #F2FAF7; }   /* Thuc linh — bac ha */
.pr-table th.pr-g-net     { background: #DAEFE8; }

/* O TONG trong tung khu: dam hon nen cua khu do mot chut, khong doi mau. */
.pr-table td.pr-tong { font-weight: 800; filter: brightness(0.975); }
/* Thanh toan (3)-(4) la con so ke toan nhin nhieu nhat — cho no dam va xanh ro hon. */
.pr-table .pr-net-strong { color: #15803D; font-weight: 800; }
.pr-table td.pr-net-strong { background: #E8F6EF; font-size: 12.5px; }

.pr-calc { color: #3B3128; }
.pr-in { width: 100%; border: 0; background: transparent; text-align: right; font: inherit; padding: 2px 3px; border-radius: 5px; }
.pr-payment { display:flex; align-items:center; justify-content:flex-end; gap:4px; min-height:28px; cursor:pointer; }
.pr-payment input { flex:0 0 auto; width:15px; height:15px; margin:0; accent-color:#af7c39; }
.pr-payment span { white-space:nowrap; }
#payrollBody .pr-in, #payrollBody .pr-txt { -webkit-user-drag:none; }
.pr-in:focus { outline: 2px solid #C27A34; background: #FFF8EF; }
.pr-in[readonly] { color: #3B3128; cursor: default; }
.pr-in[readonly]:focus { outline: none; background: transparent; }
#payrollBody .pr-txt[readonly] { color: inherit; border-color: transparent; background: transparent; cursor: default; }
.pr-center .pr-in { text-align: center; font-weight: 700; }
.pr-branch td { background: #E8DCCB; font-weight: 800; text-transform: uppercase; letter-spacing: .3px; position: sticky; left: 0; }
.pr-subtotal td { background: #FFF; font-weight: 800; }
.pr-subtotal-label { color: #D92D20; font-weight: 800; text-align: right; position: sticky; left: 0; background: #fff; }
.pr-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 0; }
.pr-dirty { display: none; align-items: center; gap: 4px; color: #B42318; font-weight: 700; font-size: 11.5px; }
/* Da doi lai duoc chieu doc thi tra het cho bang. */
body.hc-module-payroll .pr-wrap { max-height: calc(100vh - 148px); }

.pr-payment-amount { width:100%; border:0; background:transparent; padding:2px 0; color:inherit; font:inherit; text-align:right; cursor:pointer; }
.pr-payment-amount:disabled { cursor:default; opacity:1; }
.pr-payment-amount:focus-visible { outline:2px solid #af7c39; }
.pr-payment-dialog::backdrop { background:rgb(0 0 0 / 20%); }
.pr-payment-dialog p { margin:8px 0; }
.pr-payment-dialog .pr-payment { justify-content:flex-start; gap:8px; padding:5px 0; }
.pr-payment-close { margin-top:12px; padding:6px 16px; cursor:pointer; }

.pr-status { display:inline-block; font-weight:600; white-space:nowrap; }
.pr-status-active { color:#15803D; }

/* Calculated meal/parking amounts remain as legible as other payroll figures. */
.pr-table .pr-in[data-f="lunch"],
.pr-table .pr-in[data-f="parking"] { color:#3B3128; text-align:center; }

/* ---- v2 (tu 11/2026): nhom cot LUONG 70/30 + KPI ---- */
.pr-table td.pr-g-kpi     { background: #F7F4FB; }   /* Luong 70/30 + KPI — tim nhat */
.pr-table th.pr-g-kpi     { background: #E6DFF2; }
.pr-sel { width: 100%; border: 0; background: transparent; font: inherit; font-size: 11.5px; color: #3B3128; cursor: pointer; }
.pr-sel:disabled { cursor: default; opacity: 1; appearance: none; -webkit-appearance: none; text-align: center; }
.pr-table td.pr-tax-manual { box-shadow: inset 0 0 0 1.5px #F59E0B; }
.pr-table td.pr-tax-manual .pr-in { color: #B45309; font-weight: 700; }
.pr-version { font-size: 12px; color: #6B5B4B; margin-left: 8px; }
.pr-legend-v2 { font-size: 12px; color: #6B5B4B; margin: 2px 0 8px; line-height: 1.5; }
.pr-table .pr-in[data-f="kpiRate"] { text-align: center; font-weight: 700; }
