/* v9 responsive navigation and organization */
html,body{max-width:100%;overflow-x:hidden}.portal-top button{display:grid;width:40px;height:40px;place-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);margin-right:16px}.portal aside nav .nav-label{display:block;margin:15px 12px 5px;color:#71918f;font-size:9px;font-weight:900;letter-spacing:1.7px}.portal aside nav a>i{width:20px;text-align:center;font-size:15px;color:#78bbb5}.portal aside nav a>em{margin-left:auto;min-width:20px;height:20px;padding:0 5px;border-radius:10px;display:grid;place-items:center;background:#d34f4f;color:#fff;font-size:10px;font-style:normal}.top-user>a{display:flex;align-items:center;gap:7px}.portal-overlay{display:none}.portal.sidebar-collapsed aside{width:82px}.portal.sidebar-collapsed .portal-brand div,.portal.sidebar-collapsed aside nav span,.portal.sidebar-collapsed aside nav .nav-label,.portal.sidebar-collapsed aside nav a>em{display:none}.portal.sidebar-collapsed .portal-brand{justify-content:center;padding-inline:0}.portal.sidebar-collapsed aside nav a{justify-content:center}.portal.sidebar-collapsed .portal-top{left:82px}.portal.sidebar-collapsed .portal-main{margin-left:82px}.portal-main{width:auto;min-width:0}.portal-main>*{max-width:100%}.metric-grid,.bento-dashboard,.dash-grid,.module-grid,.approval-grid,.payroll-layout,.profile-grid{min-width:0}.panel,.bento-card,.module-grid>*{min-width:0}.table-panel,.tablewrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-panel table,.tablewrap table{min-width:700px}.org-panel{margin-bottom:22px}.org-chart{display:flex;flex-direction:column;align-items:center;padding:15px;overflow:auto}.org-person{display:flex;align-items:center;gap:13px;width:min(430px,100%);padding:15px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 8px 25px rgba(7,31,48,.06)}.org-person>div:last-child{display:grid;min-width:0}.org-person b,.org-person span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.org-person small{font-size:9px;color:var(--primary);font-weight:900;letter-spacing:1.2px}.org-person span{font-size:12px;color:var(--muted)}.org-person.leadership{background:linear-gradient(135deg,#0b2a40,#155775);color:#fff}.org-person.leadership span{color:#c4d6df}.org-person.current{border:2px solid var(--primary);background:#eef8f6}.org-avatar{flex:0 0 44px;width:44px;height:44px;border-radius:13px;display:grid!important;place-items:center;background:#dcebea;color:var(--primary);font-weight:900}.leadership .org-avatar{background:#ffffff20;color:#fff}.org-line{height:28px;width:2px;background:#b8c8cf}.org-report-grid{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:12px;width:100%}.dashboard-org{margin-bottom:22px}.dashboard-org-flow{display:flex;align-items:center;gap:12px;overflow-x:auto;padding:4px 2px 10px}.dashboard-org-flow>article{min-width:190px;display:flex;align-items:center;gap:10px;background:#f4f7f8;padding:12px;border-radius:12px}.dashboard-org-flow>article>span{flex:0 0 38px;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#dfecea;color:var(--primary);font-weight:900}.dashboard-org-flow article div{display:grid}.dashboard-org-flow small{color:var(--muted);font-size:10px}.dashboard-org-flow>i{color:#9aabb2}.dashboard-org-flow .me{background:#e8f6f3;border:1px solid #bfe0d9}.report-count{min-width:110px;text-align:center;display:grid;place-items:center;padding:10px}.report-count i{color:var(--primary)}.current-row{background:#eef8f6}.hr-module-tabs{margin:12px 0 22px}
@media(min-width:761px) and (max-width:1100px){.portal aside{width:250px}.portal-brand div,.portal aside nav span{display:grid}.portal aside nav a{justify-content:flex-start;font-size:15px}.portal-top{left:250px}.portal-main{margin-left:250px}.portal.sidebar-collapsed aside{width:82px}.portal.sidebar-collapsed .portal-top{left:82px}.portal.sidebar-collapsed .portal-main{margin-left:82px}}
@media(max-width:900px){.org-report-grid{grid-template-columns:1fr 1fr}.metric-grid{grid-template-columns:1fr 1fr}.leave-workspace,.hr-grid{grid-template-columns:1fr}.salary-columns{grid-template-columns:1fr}}
@media(max-width:760px){.portal aside{width:min(290px,86vw);z-index:1000}.portal-overlay.show{display:block;position:fixed;inset:0;z-index:999;background:rgba(4,19,29,.56);backdrop-filter:blur(2px)}.portal-top{height:64px}.portal-main{padding:84px 12px 28px}.portal-head{gap:12px;margin-bottom:20px}.portal-head h1{font-size:26px}.top-user>a span{display:none}.notification-bell{margin-right:7px}.bento-dashboard{display:grid;grid-template-columns:1fr}.bento-profile,.notification-tile,.stat-card,.attendance-chart,.today-card,.quick{grid-column:1}.metric-grid,.leave-balance-grid{grid-template-columns:1fr 1fr;gap:10px}.metric{min-height:110px}.panel,.bento-card{padding:17px}.quick-grid{grid-template-columns:1fr 1fr}.org-report-grid{grid-template-columns:1fr}.dashboard-org-flow>article{min-width:170px}.form-row,.payroll-fields{grid-template-columns:1fr}.official-payslip{overflow-x:auto}.official-payslip>header,.employee-summary,.salary-columns,.take-home,.official-payslip>footer{min-width:0;margin-left:14px;margin-right:14px}.employee-summary{grid-template-columns:1fr 1fr}.approval-actions{flex-wrap:wrap}.approval-actions button{flex:1}.hr-nav,.tabs{max-width:100%;overflow-x:auto;flex-wrap:nowrap}.hr-nav a,.tabs a{white-space:nowrap}}
@media(max-width:420px){.metric-grid,.leave-balance-grid,.employee-summary{grid-template-columns:1fr}.quick-grid{grid-template-columns:1fr 1fr}.top-search{display:none}.portal-top{padding-inline:10px}.panel-title{gap:10px}.panel-title h2{font-size:18px}.portal-head .primary-btn{width:100%;text-align:center}}