:root{--exec-navy:#071b2b;--exec-blue:#155b83;--exec-gold:#c6a55b;--exec-paper:#f4f7f9}.portal-brand img{width:46px;height:46px;object-fit:contain;background:#fff;border-radius:9px;padding:5px}.top-search{display:grid}.top-search small{font-size:11px;font-weight:500;color:#8094a0;letter-spacing:1.2px}.notification-bell{position:relative;width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;font-size:22px;margin-right:18px}.notification-bell b{position:absolute;right:-5px;top:-5px;background:#c84646;color:#fff;border:2px solid #fff;min-width:21px;height:21px;padding:0 4px;border-radius:12px;font-size:10px;display:grid;place-items:center}.employee-theme-royal-blue{--nav:#0c2852;--primary:#235f9f;--teal:#337dba;--bg:#f2f6fb}.employee-theme-graphite{--nav:#171b22;--primary:#3c5368;--teal:#687e8e;--bg:#f3f4f6}.bento-dashboard{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-bottom:22px}.bento-card{background:#fff;border:1px solid #e0e8ed;border-radius:12px;padding:20px;box-shadow:0 10px 30px rgba(7,31,48,.055)}.bento-profile{grid-column:span 3;display:flex;gap:15px;align-items:center;background:linear-gradient(135deg,#0a2336,#123f56);color:#fff}.bento-profile>div:last-child{display:grid}.bento-profile small,.bento-profile span{font-size:11px;color:#b8cad3}.stat-card{grid-column:span 2;display:grid}.stat-card small,.notification-tile small{color:var(--muted);font-weight:750}.stat-card strong,.notification-tile strong{font:500 34px/1.2 Georgia,serif;color:var(--ink)}.stat-card span,.notification-tile span{font-size:12px;color:var(--muted)}.alert-stat{border-top:3px solid var(--exec-gold)}.notification-tile{grid-column:span 3;display:grid;background:linear-gradient(135deg,#eef4f7,#fff)}.notification-tile strong{color:var(--primary)}.attendance-chart{grid-column:span 7}.today-card{grid-column:span 5}.quick{grid-column:span 12}.chart-area{display:flex;align-items:center;justify-content:center;gap:45px}.donut{width:180px;height:180px;border-radius:50%;background:conic-gradient(var(--primary) calc(var(--present)*1%),#e6edf1 0);display:grid;place-items:center;position:relative}.donut:after{content:"";position:absolute;inset:20px;background:#fff;border-radius:50%}.donut span{position:relative;z-index:1;display:grid;text-align:center}.donut b{font:500 35px Georgia,serif}.donut small{color:var(--muted)}.chart-legend{display:grid;gap:13px;min-width:210px}.chart-legend span{display:grid;grid-template-columns:12px 1fr auto;gap:10px;align-items:center}.chart-legend i{width:10px;height:10px;border-radius:50%}.chart-legend i.green{background:var(--primary)}.chart-legend i.gold{background:var(--exec-gold)}.chart-legend i.gray{background:#dce4e8}.leave-balance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}.leave-balance-card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--leave-color);padding:19px;border-radius:10px;display:grid}.leave-balance-card small{color:var(--muted)}.leave-balance-card strong{font:500 35px Georgia,serif}.leave-balance-card span{font-size:12px;color:var(--muted)}.leave-balance-card>div{height:5px;background:#edf1f3;border-radius:4px;margin-top:15px}.leave-balance-card i{display:block;height:100%;background:var(--leave-color);border-radius:4px}.duration-pill{background:#f2ead7;color:#7b5e1e;padding:8px 12px;border-radius:20px;font-weight:750}.field-hint{font-size:12px;color:var(--muted);margin:-6px 0 0}.approval-track{display:flex;gap:0;margin:12px 0}.approval-track span{padding:5px 12px;background:#eef1f2;color:#859299;font-size:11px;position:relative}.approval-track span+span{margin-left:2px}.approval-track .done{background:#dff3ea;color:#176c4c}.approval-track .rejected{background:#ffe3e3;color:#a63232}.notification-inbox{padding:0;overflow:hidden}.notification-item{display:grid;grid-template-columns:42px 1fr auto;gap:15px;padding:20px;border-bottom:1px solid var(--line);align-items:start}.notification-item.unread{background:#f3f8fb;border-left:3px solid var(--primary)}.notification-item>i{width:42px;height:42px;border-radius:10px;background:#e8f0f4;display:grid;place-items:center;font-style:normal;color:var(--primary)}.notification-item p{margin:4px 0;color:var(--muted)}.notification-item small{color:#8a989f}.notification-item>span{font-size:11px;color:var(--primary)}.approval-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px}.approval-card{display:grid;gap:12px;border:1px solid var(--line);padding:18px;border-radius:10px;margin-bottom:13px}.approval-person{display:flex;gap:12px;align-items:center}.approval-person>span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#e7eff3;color:var(--primary);font-weight:900}.approval-person>div{display:grid}.approval-facts{display:grid;grid-template-columns:1fr 1fr;background:#f5f7f8;padding:11px}.approval-facts span{display:grid}.approval-facts small{color:var(--muted)}.approval-card textarea{width:100%;border:1px solid var(--line);padding:10px;min-height:70px}.approval-actions{display:flex;gap:8px}.approval-actions button{border:0;padding:10px 15px;font-weight:800;cursor:pointer}.attachment-link{color:var(--primary);font-weight:700}.payroll-layout{display:grid;grid-template-columns:minmax(400px,.9fr) 1.1fr;gap:22px}.payroll-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.payroll-form h3{margin:8px 0 0;border-bottom:1px solid var(--line);padding-bottom:8px}.official-payslip{padding:0;overflow:hidden;margin-bottom:24px}.official-payslip>header{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;background:#0a2234;color:#fff}.payslip-company{display:flex;align-items:center;gap:14px}.payslip-company img{width:62px;height:48px;object-fit:contain;background:#fff;padding:5px}.payslip-company>span{width:48px;height:48px;display:grid;place-items:center;border:1px solid #c6a55b;color:#e7ce91}.payslip-company>div{display:grid}.payslip-company small{color:#b9c9d1}.payslip-title{text-align:right}.payslip-title h2{margin:0 0 8px}.payment-badge{background:#daf4e7;color:#126b4a;padding:5px 10px;border-radius:3px;font-size:11px;font-weight:900}.employee-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#dfe6ea;margin:24px 28px}.employee-summary span{display:grid;background:#f5f7f8;padding:12px}.employee-summary small{color:var(--muted)}.salary-columns{display:grid;grid-template-columns:1fr 1fr;gap:25px;padding:0 28px}.salary-columns section{border:1px solid var(--line);padding:18px}.salary-columns h3{display:flex;justify-content:space-between;border-bottom:2px solid #dbe3e7;padding-bottom:12px}.salary-columns section>div{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px dashed #e4e9ec}.take-home{margin:24px 28px;background:linear-gradient(135deg,#0c2e43,#155a72);color:#fff;padding:22px 25px;display:flex;justify-content:space-between;align-items:center}.take-home>div{display:grid}.take-home small{letter-spacing:1.4px;color:#b9ccd5}.take-home strong{font:500 30px Georgia,serif}.take-home p{margin:3px 0 0;color:#cbdbe2}.official-payslip>footer{display:flex;justify-content:space-between;align-items:center;padding:0 28px 24px}.official-payslip>footer div{display:flex;gap:8px}.official-payslip>footer button,.official-payslip>footer a{border:1px solid var(--line);background:#fff;padding:10px 13px;font-weight:700}.hide-money .money{filter:blur(8px);user-select:none}.brand-upload-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.brand-upload{border:1px solid #dfe7ea;padding:15px;display:grid;gap:10px}.brand-upload img{height:70px;max-width:180px;object-fit:contain;background:#eef2f4;padding:6px}.brand-upload span{font-size:12px}@media(max-width:1200px){.bento-profile,.notification-tile{grid-column:span 6}.stat-card{grid-column:span 3}.attendance-chart,.today-card{grid-column:span 6}.payroll-layout{grid-template-columns:1fr}.leave-balance-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.bento-profile,.notification-tile,.stat-card,.attendance-chart,.today-card,.quick{grid-column:1/-1}.chart-area{flex-direction:column;gap:20px}.approval-grid,.salary-columns,.employee-summary,.payroll-fields{grid-template-columns:1fr}.leave-balance-grid{grid-template-columns:1fr 1fr}.official-payslip>header,.take-home,.official-payslip>footer{align-items:flex-start;flex-direction:column;gap:15px}.payslip-title{text-align:left}.notification-bell{margin-left:auto}.top-user{margin-left:0}}@media print{body *{visibility:hidden}.official-payslip.print-target,.official-payslip.print-target *{visibility:visible}.official-payslip.print-target{position:absolute;inset:0;width:100%;box-shadow:none;border:0}.official-payslip>footer{display:none}}
