@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{font-family:DM Sans,sans-serif;color:#20263a;background:#f6f8fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Plus Jakarta Sans,sans-serif}.app{display:flex;min-height:100vh}.sidebar{width:256px;background:#fff;border-right:1px solid #edf0f6;display:flex;flex-direction:column;padding:28px 16px;position:fixed;inset:0 auto 0 0;z-index:5}.logo{display:flex;align-items:center;gap:10px;padding:0 10px 48px;font-size:21px;font-weight:800;letter-spacing:-1px}.brand-icon{background:#635bff;color:#fff;border-radius:12px;display:grid;place-items:center;width:40px;height:40px}.accent{color:#635bff}.nav-label,.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.7px;color:#9198aa}.nav-label{padding:0 15px 14px}.sidebar nav{display:grid;gap:5px}.nav{border:0;background:transparent;color:#697287;padding:14px 16px;display:flex;align-items:center;gap:14px;text-align:left;border-radius:10px;font-weight:700}.nav.active{background:#f0efff;color:#5d54ed}.active-dot{width:6px;height:6px;background:#625aff;border-radius:50%;margin-left:auto}.sidebar-bottom{margin-top:auto;display:flex;align-items:center;gap:10px;border-top:1px solid #edf0f6;padding:22px 4px 0}.user-circle,.avatar{background:#e9e7ff;color:#5548db;font-weight:800;border-radius:50%;display:grid;place-items:center}.user-circle{width:39px;height:39px}.avatar{width:34px;height:34px}.user-info{display:grid;gap:3px;flex:1;min-width:0}.user-info strong{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-info span{font-size:11px;text-transform:capitalize;color:#9ba2b0}.icon-button{border:0;background:transparent;color:#8891a5;padding:7px}.main{margin-left:256px;width:calc(100% - 256px)}.topbar{height:78px;background:#fff;border-bottom:1px solid #edf0f6;display:flex;align-items:center;justify-content:space-between;padding:0 45px}.breadcrumbs{font-size:13px;color:#9ba2b0}.breadcrumbs span{padding:0 11px;color:#c7cbd5}.breadcrumbs strong{color:#353d50}.top-right{display:flex;align-items:center;gap:25px}.pill{font-size:11px;color:#279a69;background:#eaf9f1;padding:8px 12px;border-radius:20px;font-weight:700}.content{max-width:1380px;margin:auto;padding:45px}.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:34px;gap:15px}.eyebrow{margin-bottom:12px}.page-head h1{font-size:29px;letter-spacing:-1.2px;margin-bottom:10px}.page-head p,.muted{color:#929aaa;font-size:13px}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:25px}.stat,.panel{background:#fff;border:1px solid #edf0f6;border-radius:16px;box-shadow:0 4px 20px #20263a04}.stat{padding:25px}.stat-top{display:flex;align-items:center;justify-content:space-between;color:#7d8599;font-size:13px;font-weight:600}.stat-icon{width:44px;height:44px;background:#f0efff;color:#645bff;display:grid;place-items:center;border-radius:12px}.stat>strong{display:block;font-size:34px;letter-spacing:-1px;margin:6px 0}.stat small{color:#9ba2b0}.panel{padding:28px;margin-bottom:24px}.welcome{display:flex;justify-content:space-between;align-items:center;min-height:240px;background:linear-gradient(110deg,#fff,#fff 60%,#f0efff)}.welcome h2{font-size:23px;max-width:460px;line-height:1.4}.welcome p{max-width:540px;font-size:13px;line-height:1.8;color:#8992a4}.decor{color:#beb8ff;padding:25px 65px}.primary,.secondary{border:0;border-radius:10px;padding:12px 18px;display:inline-flex;gap:10px;align-items:center;justify-content:center;font-weight:700;font-size:13px}.primary{background:#635bff;color:#fff}.secondary{background:#f0efff;color:#5e55ea}.panel h3{font-size:16px;margin-bottom:22px}.progress-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:12px}.progress-row strong{color:#625aff}.progress{height:9px;background:#f0efff;border-radius:9px;overflow:hidden;margin-bottom:12px}.progress span{display:block;width:32%;height:100%;background:#635bff;border-radius:9px}.table-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:22px}.table-head h3{margin:0}.count{font-size:11px;color:#625aff;background:#f0efff;padding:4px 8px;border-radius:20px;margin-left:5px}.search{border:1px solid #e5e8f0;border-radius:9px;padding:10px 13px;display:flex;gap:8px;align-items:center;color:#a1a8b5}.search input{border:0;outline:0;min-width:200px;font-size:12px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{font-size:11px;color:#9aa2b2;background:#f9fafd;padding:15px;text-transform:uppercase;letter-spacing:.5px}td{font-size:12px;color:#6b7488;padding:18px 15px;border-bottom:1px solid #f0f2f6}.employee{display:flex;align-items:center;gap:12px}.employee-avatar{height:37px;width:37px;border-radius:10px;background:#eeecff;color:#5c53df;display:grid;place-items:center;font-weight:800}.employee strong,.employee small{display:block}.employee strong{color:#30384a;margin-bottom:4px}.employee small{color:#a0a7b4}.status{background:#e8f8ef;color:#289c6b;border-radius:20px;padding:6px 11px;text-transform:capitalize;font-weight:700;font-size:11px}.status.inactive{background:#ffeded;color:#c45656}.status.on_leave{background:#fff5e4;color:#b9872d}.empty{text-align:center;padding:45px}.placeholder{text-align:center;padding:90px 25px}.placeholder p{color:#9199a9}.placeholder-icon{margin:0 auto 18px;background:#f0efff;color:#625aff;width:70px;height:70px;display:grid;place-items:center;border-radius:18px}.auth{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top right,#e8e5ff,#f8f9fc 55%)}.login-card{width:min(430px,92vw);background:#fff;padding:40px;border:1px solid #eee;border-radius:20px;box-shadow:0 25px 80px #4e49a017}.login-card h1{margin:25px 0 8px}.login-card p{color:#929aaa;font-size:13px}.login-card form{margin:28px 0;display:grid;gap:17px}label{font-size:12px;font-weight:700;color:#4c556a;display:grid;gap:8px}label input,label select{border:1px solid #e1e5ef;border-radius:9px;padding:12px;outline:0;background:#fff;min-width:0}label input:focus,label select:focus{border-color:#635bff}.login-card .primary{width:100%;margin-top:5px}.login-card small{display:flex;align-items:center;gap:6px;justify-content:center;color:#a2a9b7}.error{color:#c33d48!important;font-size:12px}.alert{background:#fff0f0;padding:12px;border-radius:8px}.loading{padding:80px;text-align:center}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#10162c77;z-index:20;display:grid;place-items:center;padding:20px}.modal{background:#fff;border-radius:18px;padding:28px;width:min(650px,100%);max-height:90vh;overflow:auto}.modal-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:25px}.modal-head h2{margin-bottom:5px}.modal-head p{color:#929aaa;font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:26px}.mobile{display:none}@media (max-width:1050px){.sidebar{width:215px}.main{margin-left:215px;width:calc(100% - 215px)}.content{padding:30px}.topbar{padding:0 30px}.stats{gap:12px}}@media (max-width:760px){.sidebar{transform:translate(-100%);transition:transform .2s;width:255px;box-shadow:10px 0 30px #0000000c}.sidebar.open{transform:translate(0)}.main{margin-left:0;width:100%}.mobile{display:block}.topbar{height:65px;padding:0 18px}.breadcrumbs{margin-right:auto;margin-left:10px}.content{padding:25px 17px}.page-head h1{font-size:23px}.stats{grid-template-columns:1fr}.welcome .decor,.pill{display:none}.form-grid{grid-template-columns:1fr}.page-head{align-items:start}.table-head{flex-wrap:wrap}.search,.search input{width:100%}}.profile-modal{width:min(850px,96vw)}.profile-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.profile-details{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:18px;background:#f8f9fd;border-radius:12px;margin-bottom:25px}.profile-details div{display:grid;gap:7px;min-width:0}.profile-details small,.record-row small{color:#9199a9;font-size:11px}.profile-details strong{font-size:13px;overflow-wrap:anywhere}.record-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #edf0f6}.record-row strong,.record-row small{display:block;margin:3px 0}.inline-form{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 30px}.inline-form input,.inline-form select{min-width:120px;flex:1;border:1px solid #e1e5ef;border-radius:9px;padding:10px}.small-btn{padding:8px 10px}.profile-modal h3{margin:24px 0 10px}@media (max-width:760px){.profile-details{grid-template-columns:repeat(2,1fr)}}.attendance-panel .table-head{align-items:center;gap:16px;flex-wrap:wrap}.attendance-panel input,.attendance-panel select{min-width:100px;max-width:180px;padding:9px;border:1px solid #e0e4ef;border-radius:8px;background:#fff}.attendance-panel td{vertical-align:middle}.attendance-panel td input{max-width:145px}.attendance-panel td input[type=time]{max-width:115px}.att-notice{color:#087b4a;font-weight:600}.report-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.report-actions input{padding:10px;border:1px solid #dfe3ef;border-radius:8px}.report-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;margin:18px 0}.report-stats>div{border:1px solid #e9eaf2;border-radius:12px;padding:15px}.report-stats small{display:block;color:#6c7286}.report-stats strong{display:block;font-size:24px;margin-top:6px}.finance-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.finance-detail-grid section{min-width:0}.finance-detail-grid h3{margin-bottom:12px}.finance-bars{height:230px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px;padding:12px 0 0;border-bottom:1px solid #e9eaf1}.finance-bar-col{display:flex;flex-direction:column;align-items:center;justify-content:end;min-width:0}.finance-bar-stack{height:185px;width:75%;max-width:36px;display:flex;flex-direction:column;justify-content:end}.finance-bar-expenses{background:#6756ff;min-height:0}.finance-bar-payroll{background:#313a58;min-height:0}.finance-bar-col small{font-size:11px;color:#8990a4;padding:7px 0}@media (max-width:850px){.finance-detail-grid{grid-template-columns:1fr}.finance-bars{gap:3px}.finance-bar-col small{font-size:9px}}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.settings-grid label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600}.settings-grid input,.settings-grid select{width:100%;min-width:0;padding:11px 12px;border:1px solid #e2e6ef;border-radius:8px;background:#fff;font:inherit}@media (max-width:700px){.settings-grid{grid-template-columns:1fr}}.sidebar .logo.logo-image-only{padding:0 10px 38px;min-height:76px;justify-content:flex-start;overflow:hidden}.sidebar .sidebar-company-logo{display:block;width:auto;height:auto;max-width:100%;max-height:78px;object-fit:contain;object-position:left center;filter:none;-webkit-filter:none}.phase17-review{padding:18px 0;border-top:1px solid #e5e7eb;margin-top:14px}.phase17-review .table-wrap{overflow-x:auto}.phase17-review table{min-width:1000px}.salary-history-panel{margin:22px 0;padding:18px;border:1px solid #e7e9f3;border-radius:12px;background:#fafbff}.salary-history-panel .inline-form{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:12px 0}.salary-history-panel .inline-form label{display:flex;flex-direction:column;gap:5px;min-width:140px;flex:1}.salary-history-panel .table-wrap{overflow-x:auto}.notification-holder,.notification-bell{position:relative}.notification-count{position:absolute;top:-5px;right:-6px;min-width:17px;height:17px;border-radius:20px;background:#6257ff;color:#fff;font-size:10px;display:grid;place-items:center;padding:0 3px}.notification-panel{position:absolute;right:0;top:calc(100% + 12px);width:min(370px,calc(100vw - 24px));background:#fff;border:1px solid #e4e7f1;border-radius:14px;box-shadow:0 15px 45px #1d254026;z-index:100;padding:14px}.notification-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.notification-heading button{font-size:12px;padding:7px 9px}.notification-list{max-height:350px;overflow:auto}.notification-item{display:flex;flex-direction:column;gap:5px;width:100%;border:0;border-bottom:1px solid #edf0f5;background:#fff;text-align:left;padding:12px 8px;cursor:pointer;color:#2c344c}.notification-item.unread{background:#f3f1ff}.notification-item span{font-size:12px;line-height:1.4}.notification-item small{color:#8b95a8}.notification-item-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.notification-category{display:inline-flex!important;width:max-content;border-radius:999px;background:#eceaff;color:#5849dc;padding:3px 8px;font-size:10px!important;font-weight:700}.notification-unread-dot{display:block!important;flex:none;width:8px;height:8px;border-radius:50%;background:#6257ff}.notification-item:hover,.notification-item:focus-visible{background:#eeecff;outline-offset:-2px}.notification-item strong{font-size:13px}@media (max-width:600px){.notification-panel{position:fixed;top:62px;left:12px;right:12px;width:auto;max-height:calc(100dvh - 80px);overflow:auto;padding:12px}.notification-list{max-height:calc(100dvh - 160px)}.notification-heading strong{font-size:16px}.notification-item{padding:12px 7px}}.performance-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 22px}.performance-summary>div{padding:16px;border:1px solid #e5e8f2;border-radius:12px;background:#f8f9ff;min-width:0}.performance-summary span{display:block;color:#78849a;font-size:12px;margin-bottom:7px}.performance-summary strong{font-size:23px;color:#252e43}.performance-table-wrap{max-width:100%;overflow-x:auto}.performance-table-wrap table{width:100%;min-width:0;table-layout:auto}.performance-table-wrap th,.performance-table-wrap td{vertical-align:middle}.performance-history .performance-preview{display:block;max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.performance-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#18203599;z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px}.performance-modal{background:#fff;border-radius:16px;padding:24px;width:min(650px,100%);max-height:85vh;overflow:auto;box-shadow:0 24px 65px #0002}.performance-modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.performance-modal h4{margin:20px 0 6px}.performance-detail-text{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6}.performance-tabs{flex-wrap:wrap}@media (max-width:700px){.performance-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.performance-modal{padding:18px}.performance-table-wrap table{min-width:650px}}.recruitment-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 22px}.recruitment-stats>div{border:1px solid #e4e7f1;border-radius:14px;padding:18px;background:#f8f9fd}.recruitment-stats small{display:block;color:#758098;margin-bottom:8px}.recruitment-stats strong{font-size:26px}.recruitment-tabs{display:flex;gap:10px;margin:20px 0}.recruitment-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:950px;margin:16px 0 30px}.recruitment-form label{display:flex;flex-direction:column;gap:6px;font-weight:600}.recruitment-form input,.recruitment-form select,.recruitment-form textarea{width:100%;min-width:0;padding:11px;border:1px solid #dfe3ed;border-radius:9px;font:inherit}.recruitment-wide{grid-column:1/-1}.recruitment-module .table-wrap{overflow-x:auto}.recruitment-module table{min-width:700px}@media (max-width:760px){.recruitment-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.recruitment-form{grid-template-columns:1fr}}.hr-analytics-section{margin-top:24px}.hr-analytics-section h3{margin-bottom:12px}.hr-analytics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.hr-analytics-stat{padding:18px;border:1px solid #e0e5f0;background:#f8f9fe;border-radius:14px;display:flex;flex-direction:column;gap:10px;min-width:0}.hr-analytics-stat small{color:#68758c}.hr-analytics-stat strong{font-size:24px;color:#1d273b;overflow-wrap:anywhere}@media (max-width:650px){.hr-analytics-grid{grid-template-columns:1fr 1fr}.hr-analytics-stat{padding:12px}.hr-analytics-stat strong{font-size:19px}}@media print{.sidebar,.topbar,.report-actions{display:none!important}.main,.content{margin:0!important;padding:0!important}.hr-analytics-stat{break-inside:avoid}}.hr-detail-report{margin-top:32px;padding-top:22px;border-top:1px solid #e5e9f3}.hr-detail-report h3{margin-bottom:8px}.hr-detail-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:12px;margin:18px 0}.hr-detail-filters label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:12px}.hr-detail-filters input,.hr-detail-filters select{width:100%;min-width:0;padding:10px;border:1px solid #dfe3ee;border-radius:8px;background:#fff}.hr-detail-report .table-wrap{margin-top:14px;overflow-x:auto}.hr-detail-report td{max-width:260px;white-space:normal;overflow-wrap:anywhere}@media print{.sidebar,.topbar,.report-actions,.hr-detail-filters{display:none!important}.hr-detail-report .table-wrap{overflow:visible}.hr-detail-report td{font-size:9px}}.offboarding-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:950px;margin:20px 0}.offboarding-form label,.offboarding-case label{display:grid;gap:6px;font-weight:600}.offboarding-form textarea,.offboarding-case textarea{min-height:70px}.offboarding-form button{justify-self:start}.offboarding-case{border:1px solid #e5e9f3;border-radius:14px;padding:20px;margin:14px 0;display:grid;gap:14px}.offboarding-checks{display:flex;flex-wrap:wrap;gap:12px 24px}.offboarding-checks label{display:flex;align-items:center;gap:6px;font-weight:500}@media (max-width:700px){.offboarding-form{grid-template-columns:1fr}}.settlement-section{margin-top:28px;padding-top:24px;border-top:1px solid #e6eaf2}.settlement-new{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:20px 0}.settlement-new label{min-width:270px;flex:1}.settlement-card{border:1px solid #e5e9f2;border-radius:12px;padding:18px;margin:18px 0;background:#fff}.settlement-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.settlement-fields label{min-width:0}.settlement-fields input,.settlement-fields textarea,.settlement-fields select{width:100%;box-sizing:border-box}.settlement-wide{grid-column:1/-1}.settlement-totals{display:flex;gap:18px;flex-wrap:wrap;padding:16px 0;border-top:1px solid #e6eaf2}.settlement-totals span{display:flex;flex-direction:column;gap:6px}.settlement-actions{display:flex;gap:10px;flex-wrap:wrap}.settlement-payment{border-top:1px solid #e6eaf2;margin-top:18px;padding-top:15px}@media (max-width:700px){.settlement-fields{grid-template-columns:1fr}}.audit-filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:18px 0 22px}.audit-filters label{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;min-width:135px;flex:1}.audit-filters input{width:100%;min-width:0}.audit-filters button{white-space:nowrap}.table-wrap td code{font-size:12px;overflow-wrap:anywhere}
