/* v10 employee portal: photo, leave, payroll, Excel and polished responsive UI */
.profile-photo-wrap{width:132px;height:132px;margin:0 auto 18px;border-radius:30px;padding:5px;background:linear-gradient(135deg,#54b9a8,#123f59);box-shadow:0 18px 35px #0b354025}.profile-photo-wrap img,.profile-fallback{width:100%;height:100%;border-radius:25px;object-fit:cover}.profile-fallback{font-size:42px;display:grid;place-items:center;background:#e7f3f1;color:#125466}.executive-profile{text-align:center;background:linear-gradient(160deg,#fff 58%,#edf7f5)}.executive-profile .profile-meta{text-align:left}.profile-edit-form>.panel-title>i,.payroll-form>.panel-title>i{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#e7f4f2;color:#176d72}.photo-dropzone{display:flex!important;align-items:center;gap:14px;padding:18px!important;border:1px dashed #9bbfbd!important;border-radius:14px;background:#f2f8f7;cursor:pointer}.photo-dropzone>i{font-size:24px;color:#168078}.photo-dropzone span{display:grid}.photo-dropzone small{font-weight:400;color:var(--muted)}.photo-dropzone input{padding:0!important;border:0!important;background:transparent!important}.directory-search{position:relative;display:flex}.directory-search>i{position:absolute;left:15px;top:15px;color:#789}.directory-search input{padding-left:40px}.directory-person{align-items:center;transition:.25s}.directory-person:hover{transform:translateY(-3px);box-shadow:0 17px 36px #12304716}.directory-photo{flex:0 0 70px;width:70px;height:70px;border-radius:18px;object-fit:cover}.directory-nik{font-size:9px;font-weight:900;letter-spacing:1.2px;color:#188078}
.leave-balance-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:22px}.leave-balance-card{position:relative;overflow:hidden;padding:22px;border:1px solid var(--line);border-radius:17px;background:#fff;box-shadow:0 10px 28px #1735480c}.leave-balance-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--leave-color)}.leave-balance-card small,.leave-balance-card span{display:block;color:var(--muted)}.leave-balance-card strong{display:block;margin:8px 0 2px;font-size:34px;color:#173b52}.leave-balance-card>div{height:6px;margin-top:17px;border-radius:5px;background:#e9eef1;overflow:hidden}.leave-balance-card>div i{display:block;height:100%;border-radius:5px;background:var(--leave-color)}.leave-workspace{display:grid;grid-template-columns:minmax(330px,.85fr) minmax(430px,1.15fr);gap:20px}.duration-pill{padding:8px 12px;border-radius:20px;background:#e7f5f2;color:#17736d;font-size:11px;font-weight:800}.field-hint{margin-top:-5px;color:#71818b;font-size:11px}.request-history{height:max-content}.request-card{display:flex;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}.request-card>div{min-width:0}.request-card small{display:block;color:var(--muted)}.request-card p{margin:8px 0}.approval-track{display:flex;gap:5px;margin:12px 0}.approval-track span{padding:6px 9px;border-radius:15px;background:#edf1f3;color:#71818b;font-size:9px;font-weight:900;text-transform:uppercase}.approval-track .done{background:#e2f3ed;color:#15745d}.approval-track .rejected{background:#fce7e7;color:#ac3939}
.payroll-section{padding:18px;margin:8px 0 18px;border:1px solid var(--line);border-radius:15px;background:#f8fafb}.payroll-section h3{margin:0 0 14px;font-size:14px}.payroll-section.income h3{color:#17745e}.payroll-section.deduction h3{color:#9a4e4e}.currency-input{display:flex;align-items:center;border:1px solid #d9e2e7;border-radius:10px;background:#fff;overflow:hidden}.currency-input b{padding:0 11px;color:#54717c;font-size:12px}.currency-input input{border:0!important;border-left:1px solid #e4eaed!important;border-radius:0!important}.payroll-live-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:17px 0}.payroll-live-summary span,.payroll-live-summary strong{display:flex;justify-content:space-between;padding:12px;border-radius:10px;background:#f1f5f6}.payroll-live-summary strong{grid-column:1/-1;background:linear-gradient(135deg,#103e57,#176e78);color:#fff;font-size:16px}.quick-grid a i{display:grid;width:42px;height:42px;place-items:center;border-radius:12px;background:#e7f3f1;color:#16786f;font-size:17px}.dropzone>i{display:block;margin-bottom:10px;font-size:25px;color:#198078}
@media(max-width:1050px){.leave-balance-grid{grid-template-columns:1fr 1fr}.leave-workspace,.payroll-layout{grid-template-columns:1fr}}
@media(max-width:620px){.leave-balance-grid{grid-template-columns:1fr}.leave-workspace{display:block}.leave-workspace>*+*{margin-top:16px}.request-card{flex-direction:column}.employee-directory{grid-template-columns:1fr}.directory-person{padding:15px}.employee-profile-grid{grid-template-columns:1fr}.payroll-live-summary{grid-template-columns:1fr}.payroll-live-summary strong{grid-column:auto}.photo-dropzone{align-items:flex-start;flex-wrap:wrap}}
.portal aside nav a:first-child:not(.active){background:transparent;border-left-color:transparent;color:#bccbd3}.portal aside nav a.active{background:linear-gradient(90deg,#c9a75922,transparent)!important;border-left-color:#c9a759!important;color:#f1ddaa!important}.portal aside nav a.active>i{color:#e2c675!important}
.app-toast{position:fixed;z-index:12000;top:24px;right:24px;width:min(430px,calc(100vw - 32px));display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:16px 17px;border:1px solid #d5e5e1;border-left:5px solid #167762;border-radius:14px;background:#fff;color:#203d42;box-shadow:0 20px 60px #102e3d33;animation:toast-in .3s ease}.app-toast>i{font-size:21px;color:#167762}.app-toast button{padding:5px;border:0;background:transparent;color:#718187}.app-toast.toast-warning{border-left-color:#cf8a22}.app-toast.toast-warning>i{color:#cf8a22}.app-toast.toast-error{border-left-color:#c94b4b}.app-toast.toast-error>i{color:#c94b4b}.app-toast.toast-hide{opacity:0;transform:translateY(-12px);transition:.35s}@keyframes toast-in{from{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:none}}.cancel-leave-form{margin-top:11px}.cancel-leave-form button{padding:8px 11px;border:1px solid #e2baba;background:#fff5f5;color:#a43b3b;font-size:11px}.cancel-leave-form button:hover{background:#a43b3b;color:#fff}@media(max-width:620px){.app-toast{top:12px;right:16px}}
