/* SPPG JANJI BILAH BARAT — Penghasilan Executive V10.3.10
   Styling KHUSUS modul Penghasilan, tanpa mengubah API, kalkulasi, atau izin.
   Navy premium + champagne gold, mobile-friendly tables. */
#payrollPage{--pay-navy:#102740;--pay-deep:#0b1b31;--pay-gold:#b38d51;--pay-line:#dce5ed;--pay-muted:#637b91;min-width:0}
#payrollPage>.card{position:relative;border:1px solid var(--pay-line);background:#fff;border-radius:22px;box-shadow:0 12px 34px rgba(12,32,54,.055);padding:clamp(18px,2vw,30px);overflow:visible}
#payrollPage>.card:first-child{border-top:4px solid #b9975d}
#payrollPage>.card:first-child>.row:first-child{padding-bottom:16px;border-bottom:1px solid #e6edf2;align-items:center}
#payrollPage>.card:first-child>.row:first-child h2{color:#102740;font-size:clamp(19px,1.55vw,25px);letter-spacing:-.03em;margin:0}
#payrollPage .muted{color:#627b94;line-height:1.7}
#payrollPage label{font-size:12px;font-weight:800;color:#3c536a}
#payrollPage input[type=date],#payrollPage select{background:#fbfdff;border-color:#cedde9;min-height:46px}
#payrollPage>.card:first-child>.grid:nth-of-type(1){margin:16px 0 19px;gap:12px}
/* Kartu metrik, mengikuti grid 5 item asli */
#payrollPage #payMsg + .grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px;margin:15px 0 17px}
#payrollPage #payMsg + .grid > div{min-width:0;min-height:119px;padding:18px 16px;border:1px solid #dce6ed;border-radius:17px;background:linear-gradient(160deg,#f8fbfe,#fff);display:flex;flex-direction:column;justify-content:space-between;gap:12px;box-shadow:0 5px 17px rgba(12,32,54,.035)}
#payrollPage #payMsg + .grid > div:first-child{background:linear-gradient(150deg,#132e4d,#1e466a);border-color:#1b3957;color:#fff}
#payrollPage #payMsg + .grid > div:nth-child(4){background:linear-gradient(155deg,#f0faf4,#fff);border-color:#d6eee0}
#payrollPage #payMsg + .grid > div:nth-child(5){background:linear-gradient(155deg,#fff6f3,#fff);border-color:#f2e2dc}
#payrollPage #payMsg + .grid strong{font-size:12px;line-height:1.45;color:#51677a}
#payrollPage #payMsg + .grid > div:first-child strong{color:#ebdfc5}
#payrollPage #payMsg + .grid h2{font-size:clamp(21px,2vw,29px);line-height:1.2;color:#183b5f;margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
#payrollPage #payMsg + .grid > div:first-child h2{color:#fff}
#payrollPage #payMsg + .grid > div:nth-child(4) h2{color:#156648}
#payrollPage #payMsg + .grid > div:nth-child(5) h2{color:#9b4236}
#payrollPage .tablewrap{border:1px solid var(--pay-line);border-radius:15px;overflow:auto;-webkit-overflow-scrolling:touch;max-width:100%}
#payrollPage table{min-width:940px;width:100%;border-collapse:separate;border-spacing:0;font-variant-numeric:tabular-nums;font-size:12.5px}
#payrollPage table th{background:#142e4b;color:#fff;border-color:#29445f;white-space:nowrap;padding:13px 11px;font-size:11px;letter-spacing:.012em}
#payrollPage table td{padding:13px 11px;color:#344c63;vertical-align:middle;border-bottom:1px solid #edf1f5}
#payrollPage table tbody tr:nth-child(even){background:#f8fafc}
#payrollPage table tbody tr:hover{background:#eff5fa}
#payrollPage .actions{gap:9px;margin:6px 0 14px;flex-wrap:wrap}
#payrollPage button{border-radius:11px;min-height:40px}
#payrollPage button:not(.secondary):not(:disabled){background:#15385a;border-color:#15385a}
#payrollPage button:not(.secondary):not(:disabled):hover{background:#0d2944;border-color:#0d2944}
#payrollPage button.secondary{background:#f9f4ea;border-color:#e7d6b8;color:#805b2c}
#payrollPage button.secondary:not(:disabled):hover{background:#f3e6cf;color:#6f4d23}
#payrollPage #payFinalCard{border-top:4px solid #b9975d}
#payrollPage #payFinalCard h3{font-size:clamp(18px,1.55vw,22px);color:#142f4d;margin:0 0 8px}
#payrollPage #payFinalCard>.row{justify-content:flex-start;margin:18px 0 15px;gap:9px}
#payrollPage #payFinalSummary{background:#f4f7fa;border:1px solid #e3eaf0;border-radius:12px;padding:12px 14px;margin:14px 0;white-space:pre-wrap}
#payrollPage #payFinalRows td:last-child button{white-space:nowrap}
#payrollPage #payMsg .msg,#payrollPage #payFinalMsg .msg{border-radius:11px}
@media(max-width:1180px){#payrollPage #payMsg + .grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){#payrollPage>.card{padding:17px;border-radius:16px}#payrollPage #payMsg + .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}#payrollPage #payMsg + .grid > div{padding:14px;min-height:110px}#payrollPage #payMsg + .grid > div:first-child{grid-column:1/-1;min-height:95px}#payrollPage #payFinalCard>.row button{width:100%}#payrollPage .actions button{flex:1 1 auto}#payrollPage .tablewrap:after{content:none}}
@media print{#payrollPage>.card{box-shadow:none!important;break-inside:auto}#payrollPage table{min-width:0;font-size:10px}#payrollPage .tablewrap{overflow:visible}#payrollPage button{display:none!important}}
/* Perbaikan warna Total Penghasilan */
#payTotal {
  color: #FFFFFF !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}