.employee-profile-page{max-width:1500px;margin:auto}.employee-profile-page>.company-back{margin-bottom:20px;font-size:12px}.employee-cover{background:linear-gradient(110deg, var(--selected), color-mix(in srgb, var(--primary) 24%, var(--surface)));border:1px solid var(--border);border-bottom:0;border-radius:20px 20px 0 0;height:142px;position:relative;overflow:hidden}.employee-cover>span{inset-inline-end:28px;letter-spacing:-1px;color:var(--primary);opacity:.2;font-size:28px;font-weight:750;position:absolute;bottom:22px}.employee-cover-weave{opacity:.45;background-image:repeating-linear-gradient(120deg, transparent 0 24px, color-mix(in srgb, var(--surface) 75%, transparent) 24px 25px, transparent 25px 48px), repeating-linear-gradient(30deg, transparent 0 24px, color-mix(in srgb, var(--surface) 75%, transparent) 24px 25px, transparent 25px 48px);position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#000,#0000 85%);mask-image:linear-gradient(90deg,#000,#0000 85%)}.employee-profile-header{background:var(--surface);border:1px solid var(--border);border-top:0;align-items:center;gap:22px;min-width:0;padding:22px 30px 26px;display:flex;position:relative}.employee-heading-photo{border:5px solid var(--surface);background:var(--selected);width:84px;height:84px;color:var(--primary);box-shadow:0 0 0 1px var(--border);border-radius:20px;flex-shrink:0;place-items:center;margin-top:-50px;font-size:28px;font-weight:700;display:grid;overflow:hidden}.employee-heading-photo img,.employee-summary-photo img{object-fit:cover;width:100%;height:100%}.employee-heading-text{flex:1;min-width:0}.employee-heading-text .eyebrow{margin-bottom:8px;font-size:9px}.employee-heading-text h1{letter-spacing:-.5px;overflow-wrap:anywhere;margin:0 0 12px;font-size:26px;line-height:1.3}.employee-headline{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;font-size:11px;display:flex}.employee-headline>span:not(:last-child){border-inline-end:1px solid var(--border);padding-inline-end:10px}.employee-profile-header>.quiet-button{flex-shrink:0;align-items:center;gap:10px;font-size:11px;display:flex}.employee-profile-tabs{background:var(--surface);border:1px solid var(--border);scrollbar-width:thin;border-top:0;border-radius:0 0 14px 14px;max-width:100%;margin-bottom:26px;padding:0 20px;display:flex;overflow-x:auto}.employee-profile-tabs button{white-space:nowrap;color:var(--muted);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;flex-shrink:0;align-items:center;gap:8px;padding:18px 14px;font-size:11px;display:flex}.employee-profile-tabs button:hover{color:var(--primary);background:var(--selected)}.employee-profile-tabs button[aria-selected=true]{color:var(--primary);border-bottom-color:var(--primary);font-weight:650}.employee-profile-tabs button:focus-visible{outline:2px solid var(--focus);outline-offset:-5px;border-radius:8px}.employee-profile-layout{grid-template-columns:245px minmax(0,1fr);align-items:start;gap:22px;display:grid}.employee-summary{text-align:center;min-width:0;padding:25px 16px;position:sticky;top:100px}.employee-summary-photo{background:var(--selected);width:94px;height:100px;color:var(--primary);border-radius:14px;place-items:center;margin:0 auto 18px;font-size:32px;font-weight:650;display:grid;overflow:hidden}.employee-summary h2{overflow-wrap:anywhere;margin:0 0 6px;font-size:15px}.employee-summary p{color:var(--muted);margin:10px 0;font-size:11px;line-height:1.5}.employee-summary .employee-other-name{color:var(--muted);margin:5px 0}.employee-summary>small{color:var(--primary);margin:8px 0;font-size:10px}.employee-summary-badges{flex-wrap:wrap;justify-content:center;gap:6px;margin:16px 0;display:flex}.employee-summary-badges .badge{letter-spacing:0;padding:6px 9px;font-size:9px}.employee-summary dl{background:var(--background);border:1px solid var(--border);text-align:start;border-radius:10px;margin:20px 0 0;overflow:hidden}.employee-summary dl>div{border-bottom:1px solid var(--border);grid-template-columns:.8fr 1.2fr;align-items:start;gap:10px;padding:13px 10px;display:grid}.employee-summary dl>div:last-child{border-bottom:0}.employee-summary dt{color:var(--muted);font-size:10px;line-height:1.5}.employee-summary dd{text-align:end;overflow-wrap:anywhere;margin:0;font-size:10px;line-height:1.5}.employee-profile-content{min-width:0}.employee-section{margin-bottom:18px;padding:23px 25px}.employee-section-heading{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:15px;display:flex}.employee-section-heading h2{margin:0;font-size:15px;font-weight:600}.employee-section-heading .icon-button{color:var(--primary);background:0 0;border:0;padding:7px}.employee-info-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 35px;margin:0;display:grid}.employee-info-grid dt{color:var(--muted);margin-bottom:6px;font-size:11px}.employee-info-grid dd{overflow-wrap:anywhere;margin:0;font-size:12px;font-weight:550;line-height:1.5}.employee-info-grid dd[dir=ltr]{text-align:start}[dir=rtl] .employee-info-grid dd[dir=ltr]{text-align:right}.employee-overview-grid{grid-template-columns:1.6fr 1fr;gap:18px;display:grid}.employee-overview-card{background:linear-gradient(140deg, var(--selected), var(--surface));flex-direction:column;align-items:flex-start;gap:12px;padding:25px;display:flex}.employee-overview-card>span:not(.metric-icon){color:var(--muted);font-size:12px}.employee-overview-card strong{letter-spacing:-.5px;overflow-wrap:anywhere;font-size:29px;font-weight:650;line-height:1.2}.employee-overview-card strong small{font-size:12px;font-weight:400;display:inline}.employee-overview-card p{color:var(--muted);margin:0;font-size:11px}.employee-overview-card button{margin-top:auto;font-size:11px}.employee-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px;display:grid}.employee-shortcuts button{text-align:start;color:var(--foreground);cursor:pointer;align-items:center;gap:10px;margin:0;padding:18px 14px;display:flex}.employee-shortcuts button:hover{border-color:var(--primary)}.employee-shortcuts svg{color:var(--primary);flex-shrink:0}.employee-shortcuts strong{font-size:11px;font-weight:500}.employee-shortcuts span{color:var(--primary);margin-inline-start:auto}.employee-timeline>div{gap:13px;padding:0 0 22px;display:flex;position:relative}.employee-timeline>div:before{content:"";inset-inline-start:3px;background:var(--border);width:1px;position:absolute;top:14px;bottom:0}.employee-timeline>div:last-child:before{display:none}.employee-timeline>div>span{background:var(--primary);border-radius:50%;flex-shrink:0;width:7px;height:7px;margin-top:5px}.employee-timeline strong{font-size:12px;font-weight:550}.employee-timeline p{color:var(--muted);margin:7px 0;font-size:11px}.employee-timeline small{color:var(--muted);font-size:10px}.employee-warning{background:color-mix(in srgb, #d5ab51 9%, var(--surface));border:1px solid #d5ab51;border-radius:10px;margin-bottom:18px;padding:15px 20px;font-size:12px}.employee-warning p{margin:0 0 8px}.employee-warning p:last-child{margin-bottom:0}.employee-record-views{gap:8px;margin-bottom:16px;display:flex}.employee-record-views .selected{background:var(--selected);color:var(--primary)}.employee-record-card .table-toolbar{padding:20px}.employee-record-card .toolbar-actions{flex-wrap:wrap;justify-content:flex-end}.employee-record-card .quiet-button{align-items:center;gap:6px;font-size:11px;display:flex}.employee-record-count{color:var(--muted);border-top:1px solid var(--border);padding:12px 20px;font-size:10px}@media (min-width:1600px){.employee-profile-layout{grid-template-columns:270px minmax(0,1fr)}}@media (max-width:1100px){.employee-profile-layout{grid-template-columns:210px minmax(0,1fr);gap:16px}.employee-overview-grid{grid-template-columns:1fr}.employee-shortcuts{grid-template-columns:1fr 1fr}.employee-profile-header{gap:16px;padding:20px}.employee-heading-text h1{font-size:23px}.employee-profile-header>.quiet-button{padding:9px}}@media (max-width:750px){.employee-profile-layout{grid-template-columns:minmax(0,1fr)}.employee-summary{display:none;position:static}.employee-cover{border-radius:14px 14px 0 0;height:100px}.employee-profile-header{flex-wrap:wrap;align-items:flex-start;gap:14px;padding:18px 16px}.employee-heading-photo{border-width:4px;border-radius:15px;width:64px;height:64px;margin-top:-38px}.employee-heading-text{flex-basis:calc(100% - 90px)}.employee-heading-text h1{font-size:21px}.employee-headline{gap:7px;line-height:1.5}.employee-profile-header>.quiet-button{margin-inline-start:auto}.employee-profile-tabs{margin-bottom:18px;padding:0 8px}.employee-profile-tabs button{padding:14px 12px}.employee-section{padding:18px}.employee-info-grid{gap:18px 20px}.employee-info-grid dd{font-size:11px}.employee-record-card .table-toolbar{flex-direction:column;align-items:flex-start}.employee-record-card .toolbar-actions{justify-content:flex-start}.employee-overview-card{padding:20px}}@media (max-width:420px){.employee-info-grid{grid-template-columns:1fr}.employee-shortcuts{gap:8px}.employee-shortcuts button{padding:15px 10px}.employee-shortcuts strong{font-size:10px}.employee-heading-photo{width:55px;height:55px}.employee-heading-text h1{font-size:18px}}.personal-profile-title h2{margin:0;font-size:22px}.personal-profile-title>.quiet-button{align-items:center;gap:8px;display:flex}.self-employee-profile .employee-cover{background:linear-gradient(110deg, color-mix(in srgb, var(--muted) 15%, var(--surface)), color-mix(in srgb, var(--muted) 30%, var(--surface)));height:170px}.self-employee-profile .employee-cover-weave{opacity:.7;background-image:repeating-linear-gradient(90deg, transparent 0 32px, var(--surface) 33px 36px), repeating-linear-gradient(0deg, transparent 0 38px, var(--surface) 39px 42px);-webkit-mask-image:linear-gradient(90deg,#000,#0000 80%);mask-image:linear-gradient(90deg,#000,#0000 80%)}.self-employee-profile .employee-profile-header{padding:24px 30px}.self-employee-profile .employee-heading-photo{width:94px;height:94px;margin-top:-65px}.self-employee-profile .employee-profile-tabs{margin-bottom:28px}.employee-profile-layout.wide-layout{grid-template-columns:minmax(0,1fr)}.personal-overview-grid{grid-template-columns:1.35fr 1fr;align-items:start;gap:22px;display:grid}.personal-overview-grid>.employee-section{border-radius:22px;flex-direction:column;min-width:0;margin:0;padding:25px;display:flex}.personal-overview-grid .employee-section-heading input{border:1px solid var(--border);background:var(--surface);min-width:0;max-width:155px;color:var(--foreground);border-radius:8px;padding:8px 10px;font-size:12px}.profile-card-link{justify-content:center;align-items:center;gap:8px;width:100%;margin-top:22px;font-size:12px;display:flex}.personal-tenure{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;margin-top:18px;padding:16px 0 0;font-size:12px;display:flex}.personal-tenure>span{color:var(--muted)}.personal-attendance-metrics>div{border-bottom:1px solid var(--border);flex-direction:column;gap:10px;min-height:69px;padding:10px 20px;display:flex;position:relative}.personal-attendance-metrics>div:last-child{border:0}.personal-attendance-metrics span{color:var(--muted);font-size:12px}.personal-attendance-metrics strong{font-size:22px;font-weight:600}.personal-attendance-metrics i{inset-inline-end:0;background:#8facff;border-radius:4px;width:5px;height:36px;position:absolute;top:19px}.personal-attendance-metrics .absent i{background:#f39e9e}.personal-attendance-metrics .late i{background:#e3b05b}.personal-leave-summary{border:1px solid var(--border);border-radius:12px;padding:15px}.personal-leave-summary>span{color:var(--muted);font-size:12px;display:block}.personal-leave-summary>strong{margin:12px 0 20px;font-size:28px;display:block}.personal-leave-summary small{font-size:12px;font-weight:400}.personal-leave-summary dl{gap:28px;margin:0;display:flex}.personal-leave-summary dt{color:var(--muted);margin-bottom:7px;font-size:11px}.personal-leave-summary dd{margin:0;font-size:14px}.personal-reporting-chart{background-image:radial-gradient(var(--border) .8px, transparent .8px);background-size:18px 18px;border-radius:12px;flex-direction:column;align-items:center;min-height:240px;padding:25px 10px;display:flex}.reporting-person{text-align:center;border:1px solid var(--border);background:var(--surface);border-radius:14px;flex-direction:column;align-items:center;gap:8px;min-width:190px;max-width:100%;padding:18px 22px;display:flex;position:relative}.reporting-person>span{border:1px solid var(--border);width:38px;height:38px;color:var(--muted);border-radius:50%;place-items:center;display:grid}.reporting-person strong{overflow-wrap:anywhere;font-size:12px}.reporting-person small{color:var(--muted);font-size:10px}.reporting-person em{background:var(--selected);color:var(--primary);border-radius:8px;padding:4px 7px;font-size:9px;font-style:normal}.reporting-person.current{border-color:var(--primary)}.reporting-connector{background:var(--border);width:1px;height:45px}.personal-payroll-card>.muted{font-size:12px}.personal-salary-value{flex-wrap:wrap;align-items:center;gap:10px;margin:25px 0;display:flex}.personal-salary-value>strong{letter-spacing:2px;font-size:28px;font-weight:650}.personal-salary-value>small{color:var(--muted);font-size:12px}.personal-salary-value button{margin-inline-start:auto;font-size:11px}.employee-email-policy{background:var(--selected);color:var(--muted);border-radius:10px;align-items:center;gap:8px;margin:0 0 22px;padding:12px 14px;font-size:11px;line-height:1.8;display:flex}.employee-email-policy svg{color:var(--primary);flex-shrink:0}.employee-information-links{text-align:start;border-inline-start:1px solid var(--border);flex-direction:column;margin-top:22px;padding-inline-start:12px;display:flex}.employee-information-links a{color:var(--muted);padding:10px 5px;font-size:11px;text-decoration:none}.employee-information-links a:hover,.employee-information-links a:focus-visible{color:var(--primary);background:var(--selected);border-radius:7px}.employee-section[id]{scroll-margin-top:110px}.account-editor input[readonly]{background:var(--background);color:var(--muted);cursor:default}.account-editor>label>small{color:var(--muted);margin-top:7px;font-size:11px;line-height:1.8;display:block}@media (max-width:1000px){.personal-overview-grid{grid-template-columns:1fr 1fr;gap:16px}.personal-overview-grid>.employee-section{padding:20px}.personal-overview-grid .employee-info-grid{grid-template-columns:1fr}}@media (max-width:750px){.personal-overview-grid{grid-template-columns:minmax(0,1fr)}.personal-profile-title{flex-wrap:wrap;align-items:flex-start;gap:12px}.personal-profile-title h2{font-size:19px}.personal-profile-title>.quiet-button{font-size:11px}.self-employee-profile .employee-cover{height:120px}.self-employee-profile .employee-profile-header{padding:18px}.self-employee-profile .employee-heading-photo{width:64px;height:64px;margin-top:-45px}.personal-overview-grid .employee-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:420px){.personal-overview-grid .employee-info-grid{grid-template-columns:1fr}.personal-overview-grid>.employee-section{padding:18px}.personal-tenure{flex-wrap:wrap}.personal-salary-value>strong{font-size:25px}.personal-overview-grid .employee-section-heading h2{font-size:13px}.personal-overview-grid .employee-section-heading input{max-width:135px}}[data-theme=dark] .employee-cover{border:1px solid var(--glass-border);background:linear-gradient(110deg,#12343ed9 0,#14243ceb 100%);border-bottom:0;box-shadow:inset 0 1px 1px #ffffff29}[data-theme=dark] .employee-profile-header{-webkit-backdrop-filter:blur(28px)saturate(170%);border:1px solid var(--glass-border);background:linear-gradient(#101a2cd1 0,#0b1320e0 100%);border-top:0;box-shadow:inset 0 1px #ffffff14,0 16px 36px #00000059}[data-theme=dark] .employee-heading-photo,[data-theme=dark] .employee-summary-photo{box-shadow:0 0 0 1px var(--glass-border), 0 8px 24px #00000080, 0 0 20px #55cfd826;border-color:#101a2ce6}[data-theme=dark] .employee-profile-tabs{-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);background:linear-gradient(#0e1726cc 0,#0a111cdb 100%);border-top:0;box-shadow:0 12px 28px #00000040}[data-theme=dark] .employee-profile-tabs button:hover{color:#79dde4;background:#55cfd81f}[data-theme=dark] .employee-profile-tabs button[aria-selected=true]{color:#79dde4;text-shadow:0 0 12px #55cfd866;border-bottom-color:#55cfd8}[data-theme=dark] .employee-summary{-webkit-backdrop-filter:blur(28px)saturate(160%);border:1px solid var(--glass-border);box-shadow:var(--glass-specular), 0 20px 48px #0000008c;background:linear-gradient(145deg,#121e32c7 0,#0b1320d6 100%)}[data-theme=dark] .employee-summary dl{-webkit-backdrop-filter:blur(14px);border:1px solid var(--glass-border);background:#0a101ca6;box-shadow:inset 0 1px 1px #ffffff0f}[data-theme=dark] .employee-summary dl>div{border-bottom:1px solid #b6eaf014}[data-theme=dark] .employee-section,[data-theme=dark] .employee-overview-card{background:var(--glass-surface);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--glass-specular), var(--glass-shadow)}[data-theme=dark] .employee-shortcuts button{-webkit-backdrop-filter:blur(18px);border:1px solid var(--glass-border);background:linear-gradient(135deg,#ffffff0d 0,#ffffff04 100%),#101a2ab8;transition:all .22s cubic-bezier(.16,1,.3,1);box-shadow:inset 0 1px 1px #ffffff24,0 8px 24px #00000059}[data-theme=dark] .employee-shortcuts button:hover{border-color:var(--glass-border-hover);transform:translateY(-2px);box-shadow:inset 0 1px 1.5px #ffffff42,0 16px 36px #0000008c,0 0 22px #55cfd838}[data-theme=dark] .reporting-person{-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);background:#0e1828bf;box-shadow:inset 0 1px 1px #ffffff1f,0 8px 24px #00000059}[data-theme=dark] .reporting-person.current{border-color:var(--primary);box-shadow:inset 0 1px 1.5px #fff3,0 0 24px #55cfd847}[data-theme=dark] .personal-leave-summary{-webkit-backdrop-filter:blur(14px);border:1px solid var(--glass-border);background:#0c142299;box-shadow:inset 0 1px #ffffff14}[data-theme=dark] .employee-warning{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#d5ab511f;border-color:#d5ab5159}.employee-field-value{vertical-align:middle;align-items:flex-start;gap:6px;max-width:100%;display:inline-flex;position:relative}.employee-field-text{overflow-wrap:anywhere;min-width:0;padding-block:5px}.employee-copy-button{border:1px solid var(--border);background:var(--surface);width:28px;height:28px;color:var(--muted);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.employee-copy-button:hover,.employee-field-value.copy-copied .employee-copy-button{color:var(--primary);border-color:var(--primary);background:var(--selected)}.employee-field-value.copy-error .employee-copy-button{color:#b64b42}.employee-copy-feedback{z-index:5;border:1px solid var(--border);background:var(--surface);width:max-content;max-width:230px;color:var(--foreground);text-align:start;border-radius:5px;padding:5px 9px;font-size:11px;font-weight:400;position:absolute;inset-block-start:calc(100% + 3px);inset-inline-end:0;box-shadow:0 3px 12px #00000014}.employee-copy-feedback:empty{display:none}.deduction-month{align-items:center;gap:12px;margin-block:14px;font-size:13px;font-weight:600;display:flex}.deduction-month input{border:1px solid var(--border);background:var(--surface);width:auto;max-width:200px;color:inherit;font:inherit;border-radius:8px;padding:9px 12px}.deduction-summary{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-block:20px;display:grid}.deduction-summary>div{border:1px solid var(--border);background:var(--background);border-radius:10px;padding:14px}.deduction-summary dt{color:var(--muted);margin-block-end:8px;font-size:12px}.deduction-summary dd{overflow-wrap:anywhere;margin:0;font-size:16px;font-weight:700}.deduction-summary>div:last-child{border-color:var(--primary)}.deduction-form{border:1px solid var(--border);background:var(--background);border-radius:12px;margin-block:18px;padding:20px}.deduction-form h3{margin-block:0 16px}.deduction-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.deduction-form label,.deduction-cancel-form label{flex-direction:column;gap:8px;font-size:13px;display:flex}.deduction-form input:not([type=checkbox]),.deduction-form select,.deduction-form textarea,.deduction-cancel-form input{border:1px solid var(--border);background:var(--surface);width:100%;min-width:0;color:inherit;font:inherit;border-radius:8px;padding:10px 12px}.deduction-form textarea{resize:vertical;min-height:80px}.deduction-form .deduction-check{flex-direction:row;align-items:flex-start;margin-block:16px;line-height:1.6}.deduction-check input{accent-color:var(--primary);flex-shrink:0;width:18px;height:18px;margin-block-start:5px}.deduction-form-actions{align-items:center;gap:16px;margin-block-start:18px;display:flex}.deduction-list{margin:20px 0 0;padding:0;list-style:none}.deduction-list>li{border-block-start:1px solid var(--border);overflow-wrap:anywhere;padding:18px 0}.deduction-item-heading{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.deduction-item-heading>strong:first-child{margin-inline-end:auto}.deduction-list p{margin-block:8px;font-size:13px}.deduction-cancelled{opacity:.75}.deduction-cancel-form{flex-wrap:wrap;align-items:flex-end;gap:14px;margin-block-start:14px;display:flex}.deduction-cancel-form label{flex:1;min-width:180px}.deduction-empty{text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:10px;padding:24px}@media (max-width:700px){.deduction-summary,.deduction-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.deduction-form{padding:14px}.employee-deductions .employee-section-heading{flex-wrap:wrap;gap:12px}}@media (max-width:450px){.deduction-form-grid{grid-template-columns:minmax(0,1fr)}}
.monthly-payroll-workspace{gap:20px;display:grid}.monthly-payroll-controls,.monthly-payroll-summary,.monthly-payroll-employee-detail,.monthly-finalize,.payroll-policy-card{min-width:0;padding:24px}.monthly-payroll-controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;display:flex}.monthly-payroll-controls .toolbar-actions{flex-wrap:wrap;gap:10px;display:flex}.monthly-payroll-metrics{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-block:20px;display:grid}.monthly-payroll-metrics>div{border:1px solid var(--border);background:var(--background);border-radius:12px;padding:18px}.monthly-payroll-metrics span{color:var(--muted);margin-block-end:10px;font-size:12px;display:block}.monthly-payroll-metrics strong{font-variant-numeric:tabular-nums;overflow-wrap:anywhere;font-size:20px;display:block}.monthly-payroll-metrics>div:last-child{border-color:var(--primary)}.monthly-payroll-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-block:22px;display:grid}.monthly-payroll-columns>section{min-width:0}.monthly-payroll-columns h3{margin-block:0 14px;font-size:16px}.monthly-payroll-lines{margin:0}.monthly-payroll-lines>div{border-block-end:1px solid var(--border);justify-content:space-between;align-items:flex-start;gap:20px;padding-block:12px;font-size:13px;display:flex}.monthly-payroll-lines dt{overflow-wrap:anywhere;min-width:0}.monthly-payroll-lines dd{font-variant-numeric:tabular-nums;flex-shrink:0;margin:0}.monthly-payroll-lines small{color:var(--muted);margin-block-start:4px;display:block}.monthly-payroll-lines .monthly-total{border-block-end:2px solid var(--primary);font-weight:700}.monthly-attendance-totals{flex-wrap:wrap;gap:16px;margin-block:24px;display:flex}.monthly-attendance-totals>div{border:1px solid var(--border);border-radius:8px;flex:1;min-width:110px;padding:12px}.monthly-attendance-totals dt{color:var(--muted);font-size:12px}.monthly-attendance-totals dd{margin:8px 0 0;font-size:18px;font-weight:700}.monthly-payroll-table{border-collapse:collapse;width:100%;min-width:1200px}.monthly-payroll-table th,.monthly-payroll-table td{white-space:nowrap;border-block-end:1px solid var(--border);text-align:start;padding:14px 10px;font-size:12px}.monthly-payroll-table small{color:var(--muted);margin-block-start:6px;display:block}.monthly-payroll-table tfoot{background:var(--selected);font-weight:700}.monthly-payroll-issues,.monthly-attendance-detail,.earning-history{margin-block:18px;font-size:13px}.monthly-payroll-issues summary,.monthly-attendance-detail summary,.earning-history summary{cursor:pointer;padding:12px 0;font-weight:600}.monthly-payroll-issues ul{max-height:220px;line-height:1.8;overflow:auto}.payroll-issue-alert{background:color-mix(in srgb, #faad14 14%, var(--surface));border:1px solid #faad1466;border-radius:14px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-block:16px 20px;padding:16px 20px;display:flex}.payroll-issue-alert-content{flex:1;align-items:flex-start;gap:12px;min-width:260px;display:flex}.payroll-issue-icon{font-size:24px;line-height:1}.payroll-issue-alert-content strong{color:#d46b08;margin-bottom:4px;font-size:14px;display:block}[data-theme=dark] .payroll-issue-alert-content strong{color:#ffc069}.payroll-issue-alert-content p{color:var(--foreground);opacity:.88;margin:0;font-size:12px;line-height:1.5}.payroll-issue-alert-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.payroll-issue-alert-actions .quiet-button,.payroll-issue-alert-actions .primary-button{white-space:nowrap;padding:8px 14px;font-size:12px}.payroll-table-issue-badge{color:#d46b08;background:#faad1428;border:1px solid #faad1455;border-radius:10px;align-items:center;gap:3px;padding:2px 6px;font-size:10px;font-weight:700;display:inline-flex}[data-theme=dark] .payroll-table-issue-badge{color:#ffc069}.employee-monthly-payroll .employee-deductions{border:1px solid var(--border);box-shadow:none;margin-block-start:24px;padding:20px}.payroll-policy-card{margin-block:24px}.payroll-policy-card .deduction-check,.monthly-finalize .deduction-check{align-items:flex-start;gap:10px;margin-block:20px;line-height:1.7;display:flex}.monthly-payroll-print{display:none}@page employee-payslip{size:A4 portrait;margin:12mm}@media print{:is(html:has(.employee-payslip-print),body:has(.employee-payslip-print)){--lightningcss-light:initial!important;--lightningcss-dark: !important;color-scheme:light!important;background:#fff!important}.employee-payslip-print{page:employee-payslip;width:100%;font-family:Tahoma,Arial,sans-serif;position:static}.employee-payslip-print .employee-payslip-letterhead{text-align:start;justify-content:space-between;align-items:center;gap:18px;padding-block-end:14px;display:flex}.employee-payslip-letterhead img{object-fit:contain}.employee-payslip-print .monthly-attendance-totals{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.employee-payslip-identity{grid-template-columns:1fr 1fr;gap:12px 24px;margin-block:16px;display:grid}.employee-payslip-identity dd{margin:3px 0 0;font-weight:700}.employee-payslip-footer{border-block-start:1px solid #bbb;margin-block-start:20px;padding-block-start:10px;font-size:10px}.employee-payslip-letterhead,.employee-payslip-identity{break-inside:avoid}}@media (max-width:700px){.monthly-payroll-controls,.monthly-payroll-summary,.monthly-payroll-employee-detail,.monthly-finalize,.payroll-policy-card{padding:16px}.monthly-payroll-columns{grid-template-columns:minmax(0,1fr)}.monthly-payroll-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.monthly-payroll-metrics>div{padding:12px}.monthly-payroll-metrics strong{font-size:16px}.employee-monthly-payroll .employee-deductions{padding:12px}}@media print{@page{size:A4 landscape;margin:12mm}body:has(.monthly-payroll-print){color:#111!important;background:#fff!important}body:has(.monthly-payroll-print)>:not(.monthly-payroll-print){display:none!important}.monthly-payroll-print,.monthly-payroll-print *{visibility:visible!important}.monthly-payroll-print{color:#111;--border:#bbb;--foreground:#111;--muted:#333;--surface:#fff;--background:#fff;--selected:#f5f5f5;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:#fff;font-family:Arial,sans-serif;font-size:11px;display:block!important}.monthly-payroll-print h1{font-size:22px}.monthly-payroll-print h2{font-size:16px}.monthly-payroll-print header{text-align:center;border-block-end:2px solid #111;margin-block-end:14px}.monthly-payroll-print .table-scroll{overflow:visible}.monthly-payroll-print .monthly-payroll-table{table-layout:auto;min-width:0}.monthly-payroll-print .monthly-payroll-table td,.monthly-payroll-print .monthly-payroll-table th{white-space:normal;color:#111;border-color:#bbb;padding:7px 4px;font-size:10px}.monthly-payroll-print table,.monthly-payroll-print td{color:#111!important;background:#fff!important}.monthly-payroll-print th{color:#111!important;background:#eee!important}.monthly-payroll-print .monthly-payroll-metrics{grid-template-columns:repeat(3,1fr)}.monthly-payroll-print .monthly-payroll-metrics>div{background:#fff;border-color:#aaa;padding:10px}.monthly-payroll-print .monthly-payroll-metrics strong{font-size:15px}.monthly-payroll-print .monthly-payroll-columns{grid-template-columns:1fr 1fr;gap:20px}.monthly-payroll-print .monthly-payroll-lines>div{break-inside:avoid;border-color:#bbb;padding-block:7px;font-size:10px}.monthly-payroll-print .monthly-payroll-issues ul{max-height:none;overflow:visible}.monthly-payroll-print .monthly-print-employee{break-before:page}.monthly-payroll-print .monthly-print-totals{padding-block:14px;font-size:12px}.monthly-payroll-print tr{break-inside:avoid}.monthly-payroll-print thead{display:table-header-group}.monthly-payroll-print .muted,.monthly-payroll-print small,.monthly-payroll-print span,.monthly-payroll-print dt{color:#333!important}.monthly-payroll-print .monthly-attendance-totals>div{background:#fff;border-color:#aaa}}
:root:not([data-theme=dark]) .app-shell{--background:#f0f4f8;--surface:#fff;--popup:#fff;--foreground:#1c2d41;--muted:#586b80;--border:#dce5ee;--field:#8294aa;--primary:#087985;--hover:#05616c;--selected:#e6f3f3;--on-selected:#08616c;background:var(--background);color:var(--foreground)}:root:not([data-theme=dark]) .app-shell .sidebar{background:#fcfdff;border-color:#d7e1ec;box-shadow:4px 0 24px #1f344f08}:root:not([data-theme=dark]) .app-shell .app-header{background:#fff;border-color:#dce5ee;box-shadow:0 2px 12px #1f344f08}:root:not([data-theme=dark]) .app-shell :is(.workspace-label,.nav-search){background:#f3f6fa;border-color:#e0e7ef}:root:not([data-theme=dark]) .app-shell .nav-item{color:#52667d}:root:not([data-theme=dark]) .app-shell .sidebar nav h2{color:#5b7088;letter-spacing:0;margin:18px 12px 7px;font-size:11px;font-weight:700;line-height:1.6}:root:not([data-theme=dark]) .app-shell .sidebar nav section:first-child h2{margin-top:4px}:root:not([data-theme=dark]) .app-shell .nav-item:hover{color:#253d57;background:#edf3f8}:root:not([data-theme=dark]) .app-shell .nav-item.active{color:#075e69;background:#e2f1f1;font-weight:700}:root:not([data-theme=dark]) .app-shell .quiet-button{color:#40556d;background:#fff;border:1px solid #d8e2ec;box-shadow:0 1px 2px #1f344f08}:root:not([data-theme=dark]) .app-shell .quiet-button:hover{color:#08616c;background:#f3f7fa;border-color:#a9c3ce}:root:not([data-theme=dark]) .app-shell .card{border-color:#dce5ee;box-shadow:0 3px 6px #1f344f05,0 12px 30px -18px #1f344f2e}:root:not([data-theme=dark]) .app-content:has(.dashboard-stats){background:radial-gradient(680px 280px at 95% 0,#e5f0f3 0,#0000 75%)}:root:not([data-theme=dark]) .dashboard-stats .metric-card{--metric-accent:#087985;--metric-tint:#e5f3f3;border-top:3px solid var(--metric-accent);background:linear-gradient(135deg,#fff 70%,#f4f9fa)}:root:not([data-theme=dark]) .dashboard-stats .metric-card:nth-child(2){--metric-accent:#3765ae;--metric-tint:#eaf0fc}:root:not([data-theme=dark]) .dashboard-stats .metric-card:nth-child(3){--metric-accent:#986517;--metric-tint:#fcf2de}:root:not([data-theme=dark]) .dashboard-stats .metric-card:nth-child(4){--metric-accent:#7354a7;--metric-tint:#f1ebfa}:root:not([data-theme=dark]) .metric-card:after{background:var(--metric-tint);opacity:.6}:root:not([data-theme=dark]) .metric-card .metric-icon{background:var(--metric-tint);color:var(--metric-accent);border:1px solid color-mix(in srgb, var(--metric-accent) 15%, transparent);box-shadow:none}:root:not([data-theme=dark]) .metric-card .online-dot{background:var(--metric-accent)}:root:not([data-theme=dark]) .metric-card>strong{color:#20344e;-webkit-text-fill-color:#20344e}:root:not([data-theme=dark]) .metric-card .metric-top>span:first-child{color:#4e6279;font-weight:600}:root:not([data-theme=dark]) .dashboard-grid .quick-action-card{background:linear-gradient(145deg,#eaf5f4,#fafdff 80%);border-color:#c7dfdf}:root:not([data-theme=dark]) .quick-links a{color:#28465b;background:#fff;border-color:#d5e5e8}:root:not([data-theme=dark]) .quick-links a:hover{background:#f1f9f8;border-color:#86b9bd}:root:not([data-theme=dark]) .chart-legend>div{background:#f5f8fb;border-color:#e6edf4}:root:not([data-theme=dark]) .legend-dot{box-shadow:none}:root:not([data-theme=dark]) .weekly-events-card{background:linear-gradient(115deg,#fff,#f0f7f8)}:root:not([data-theme=dark]) .app-shell th{color:#4c6077;background:#edf2f7}:root:not([data-theme=dark]) .app-shell tbody tr:hover{background:#f1f7fa}:root:not([data-theme=dark]) .app-shell :is(input,select,textarea):focus-visible{outline-offset:2px;border-color:#087985;outline:3px solid #c9e6e8}:root:not([data-theme=dark]) .alert-time-pill.urgency-soon,:root:not([data-theme=dark]) .weekly-events-header-badge{color:#85530c;background:#fff4db;border-color:#efd7a4}
@font-face{font-family:Workspace Cairo;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/cairo-0.woff2)format("woff2");unicode-range:U+6??,U+750-77F,U+8A0-8FF,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}@font-face{font-family:Workspace Cairo;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/cairo-2.woff2)format("woff2");unicode-range:U+??,U+2000-206F,U+20AC,U+2122}.app-shell{--workspace-radius:22px;--workspace-motion:.18s cubic-bezier(.2, .7, .3, 1)}html[lang=ar] .app-shell{font-family:Workspace Cairo,Tahoma,Arial,sans-serif;line-height:1.65}.app-shell .sidebar nav h2{color:var(--muted);letter-spacing:0;margin:18px 12px 7px;font-size:11px;font-weight:700;line-height:1.6}:root:not([data-theme=dark]) .app-shell{--workspace-glass:linear-gradient(135deg, #ffffffdb, #ffffff94);--workspace-glass-border:#ffffffe0;--workspace-glass-shadow:inset 0 1px 0 #fffffffa, 0 8px 28px -14px #2b45633d, 0 0 0 1px #8ba6b926;background:radial-gradient(1000px 760px at 100% 0,#c8e6e7 0,#0000 72%),radial-gradient(850px 720px at 0 40%,#d9e1f3 0,#0000 74%),radial-gradient(1000px 650px at 90% 100%,#d7eae4 0,#0000 76%),#eaf0f5}:root[data-theme=dark] .app-shell{--glass-surface:linear-gradient(135deg, #ffffff0d, #ffffff03), #121f31c7;--glass-border:#cae3f424;--glass-border-hover:#74d7df5c;--glass-specular:inset 0 1px 0 #ffffff1f;--glass-shadow:0 12px 36px -16px #00000073;--glass-shadow-hover:inset 0 1px 0 #ffffff29, 0 18px 40px -18px #0000008c;background:radial-gradient(1000px 650px at 100% 0,#30808a3b,#0000 72%),radial-gradient(950px 750px at 0,#4c60972e,#0000 74%),#0d1726}:root:not([data-theme=dark]) .app-shell :is(.card,.sidebar,.app-header,.modal-panel){box-shadow:var(--workspace-glass-shadow);background:#fafdff;border-color:#d5e1e9}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){:root:not([data-theme=dark]) .app-shell :is(.card,.sidebar,.app-header,.modal-panel){background:var(--workspace-glass);border-color:var(--workspace-glass-border)}:root:not([data-theme=dark]) .app-shell :is(.sidebar,.app-header,.modal-panel),:root:not([data-theme=dark]) .app-shell :is(.dashboard-grid,.dashboard-stats)>.card{-webkit-backdrop-filter:blur(20px)saturate(125%);backdrop-filter:blur(20px)saturate(125%)}:root:not([data-theme=dark]) .app-shell .app-content>.card:not(:has(.modal-backdrop)){-webkit-backdrop-filter:blur(20px)saturate(125%);backdrop-filter:blur(20px)saturate(125%)}:root:not([data-theme=dark]) .app-shell .sidebar{background:linear-gradient(160deg,#ffffffe0,#f5fafdc2)}:root:not([data-theme=dark]) .app-shell .app-header{background:#ffffffc2}:root:not([data-theme=dark]) .app-shell .quick-action-card{background:linear-gradient(135deg,#e1f4f2e0,#ffffffad)}}:root:not([data-theme=dark]) .app-shell .metric-card{border-top-color:var(--metric-accent,var(--primary))}:root:not([data-theme=dark]) .app-shell .modal-backdrop{background:#1b2e4252}:root:not([data-theme=dark]) .app-shell .modal-panel{--workspace-glass:linear-gradient(135deg, #fffffff7, #f6fcffe6)}:root:not([data-theme=dark]) .app-shell :is(input,select,textarea,.quick-links a){background-color:#ffffffeb}:root:not([data-theme=dark]) .app-shell select.action-select{background:var(--primary);color:var(--on-primary);-webkit-text-fill-color:var(--on-primary);border:1px solid var(--hover);box-shadow:inset 0 1px #ffffff2e,0 3px 8px #08616c1f}:root:not([data-theme=dark]) .app-shell select.action-select:hover{background:var(--hover)}:root:not([data-theme=dark]) .app-shell select.action-select option{background:var(--popup);color:var(--foreground);-webkit-text-fill-color:var(--foreground)}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){:is(:root[data-theme=dark] .app-shell :is(.sidebar,.app-header,.modal-panel),:root[data-theme=dark] .app-shell .card:not(:has(.modal-backdrop))){-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)}}@supports (not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px)))) and ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){:root:not([data-theme=dark]) .app-shell :is(.sidebar,.app-header,.modal-panel),:root:not([data-theme=dark]) .app-shell :is(.dashboard-grid,.dashboard-stats)>.card{background:var(--workspace-glass);-webkit-backdrop-filter:blur(20px)saturate(125%)}}.app-shell .card:has(.modal-backdrop){-webkit-backdrop-filter:none;backdrop-filter:none}.app-shell :is(.card,.modal-panel,.notif-popover){border-radius:var(--workspace-radius)}.app-shell .page-heading{gap:20px;margin-block-end:24px}.app-shell .page-heading h1{margin-block-end:6px;font-size:clamp(25px,2.25vw,34px);font-weight:700;line-height:1.5}.app-shell .page-heading p{font-size:13px}.app-content:has(.dashboard-stats)>.page-heading .animated-greeting{min-height:1.5em}.app-shell .section-heading{border-bottom-color:color-mix(in srgb, var(--border) 65%, transparent);margin-block-end:20px}.app-shell .section-heading h2{font-size:17px;line-height:1.6}.app-shell .nav-item{border-radius:12px;padding-block:10px;font-size:12px}.app-shell .nav-item.active{box-shadow:inset 0 1px #ffffff47}.app-shell .nav-item[aria-current=page]:after{content:"";background:currentColor;border-radius:50%;flex-shrink:0;align-self:center;width:5px;height:5px;margin-inline-start:auto}.app-shell :is(.quiet-button,.primary-button,.action-select,.theme-toggle){border-radius:12px}.app-shell .primary-button{box-shadow:inset 0 1px #fff3,0 5px 12px -7px #08616c8c}.app-shell :is(input,select,textarea){border-radius:10px}.app-shell .nav-search input{background:0 0}.app-shell .table-card{overflow:hidden}.app-shell :is(th,td){padding-block:16px}.app-shell th{font-size:11px}.app-shell .dashboard-stats{gap:18px}.app-shell .dashboard-stats .card.metric-card{border-top-width:1px;padding:24px;animation:.65s cubic-bezier(.2,.7,.3,1) both dashboard-card-enter}.app-shell .dashboard-stats .metric-card:nth-child(2){animation-delay:80ms}.app-shell .dashboard-stats .metric-card:nth-child(3){animation-delay:.16s}.app-shell .dashboard-stats .metric-card:nth-child(4){animation-delay:.24s}.app-shell .metric-card:after{display:none}.app-shell .metric-card:before{transition:transform .5s,opacity .5s}.app-shell .metric-card .metric-icon{border-radius:14px;width:44px;height:44px}.app-shell .metric-card>strong{letter-spacing:-1px;margin-block:16px 10px;font-size:38px}.app-shell .metric-card>small{font-size:11px}.app-shell .metric-card .online-dot{box-shadow:0 0 0 0 color-mix(in srgb, var(--metric-accent,var(--primary)) 35%, transparent);animation:2.4s ease-out infinite metric-status-pulse}.app-shell .dashboard-main,.app-shell .quick-action-card{animation:.7s cubic-bezier(.2,.7,.3,1) .32s both dashboard-card-enter}.app-shell .quick-action-card{position:relative;overflow:hidden}.app-shell .quick-action-card:after{content:"";inset-inline-end:-70px;background:radial-gradient(circle, color-mix(in srgb, var(--primary) 18%, transparent), transparent 68%);pointer-events:none;border-radius:50%;width:180px;height:180px;transition:transform .5s;position:absolute;bottom:-100px}.app-shell .weekly-events-card{padding-block:20px}.app-shell .weekly-events-card .section-heading{flex-wrap:wrap;margin-block-end:12px;padding-block-end:12px}.app-shell .weekly-events-card .section-heading>div:first-child{flex:220px;min-width:0}.app-shell .weekly-events-header-badge{white-space:nowrap;flex-shrink:0}.app-shell .quick-links a{border-radius:13px;padding:13px 15px}.app-shell .attendance-ring{box-shadow:0 12px 30px -18px #087f8c73}.app-shell .legend-dot{box-shadow:none}.app-shell .workspace-footer{opacity:.85;font-size:11px}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.app-shell .notif-popover{-webkit-backdrop-filter:blur(28px)saturate(125%);backdrop-filter:blur(28px)saturate(125%)}:root:not([data-theme=dark]) .app-shell .notif-popover{background:#f9fdfff0;border-color:#ffffffe6}}.app-shell .app-header:has(.notif-popover){-webkit-backdrop-filter:none;backdrop-filter:none}@media (min-width:1000px){.app-shell{gap:20px;padding:18px}.app-shell .sidebar{border:1px solid var(--border);border-radius:24px;width:260px;height:calc(100dvh - 36px);padding:25px 14px 16px;top:18px}.app-shell .app-header{border:1px solid var(--border);border-radius:20px;height:72px;padding-inline:24px;top:18px}.app-shell .app-content{padding:30px 6px}.app-shell .workspace-label{border-radius:14px;margin-block:24px 18px}.app-shell .header-actions{gap:8px}}@media (hover:hover) and (prefers-reduced-motion:no-preference){.app-shell :is(.primary-button,.quiet-button,.nav-item,.quick-links a){transition:background-color var(--workspace-motion), border-color var(--workspace-motion), box-shadow var(--workspace-motion), transform var(--workspace-motion)}.app-shell :is(.primary-button,.quiet-button):hover:not(:disabled){transform:translateY(-1px)}.app-shell .quick-links a:hover,.app-shell .metric-card:hover{transform:translateY(-2px)}.app-shell .metric-card:hover .metric-icon{transform:none}.app-shell .metric-card:hover:before{transform:scale(1.2)}.app-shell .quick-action-card:hover:after{transform:translate(-18px,-18px)scale(1.2)}}@keyframes dashboard-card-enter{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes metric-status-pulse{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--metric-accent,var(--primary)) 30%, transparent)}45%{box-shadow:0 0 0 5px #0000}}@media (max-width:560px){.app-shell .sidebar{padding:14px 16px}.app-shell .dashboard-stats{gap:12px}.app-shell .dashboard-stats .card.metric-card{padding:17px}.app-shell .metric-card>strong{font-size:30px}.app-shell .metric-card>small{font-size:10px}.app-shell .page-heading h1{font-size:25px}.app-shell .app-content{padding:22px 14px}.app-shell .header-actions{gap:5px}.app-shell .header-actions .quiet-button{padding:7px}.app-shell :is(.card,.modal-panel){border-radius:18px}.app-content:has(.dashboard-stats)>.page-heading .animated-greeting{min-height:3em}}@media (prefers-reduced-motion:reduce){.app-shell *,.app-shell :before,.app-shell :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.app-shell :is(.metric-card,.quick-links a,.primary-button,.quiet-button):hover{transform:none!important}}@media (max-width:750px){:root:not([data-theme=dark]) .app-shell :is(.dashboard-grid,.dashboard-stats)>.card{-webkit-backdrop-filter:none;backdrop-filter:none}}@media (prefers-reduced-transparency:reduce){:root:not([data-theme=dark]) .app-shell :is(.card,.sidebar,.app-header,.modal-panel){-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#fafdff!important}:root[data-theme=dark] .app-shell :is(.card,.sidebar,.app-header,.modal-panel){background:var(--surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}@media print{.app-shell :is(.card,.sidebar,.app-header,.modal-panel){-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important}}
.dashboard-hero{--hero-accent:#087985;--hero-muted:#526c7c;isolation:isolate;background:linear-gradient(115deg,#f5fcfc,#dceff0);border:1px solid #ffffffeb;border-radius:28px;grid-template-columns:minmax(0,1fr) 285px;align-items:center;gap:28px;margin-block-end:24px;padding:30px 34px;animation:.7s cubic-bezier(.2,.7,.3,1) both dashboard-hero-enter;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 1px #fff,0 20px 46px -30px #14495d59}.dashboard-hero:before{content:"";inset-inline-end:-70px;pointer-events:none;background:radial-gradient(circle,#60c3be40,#0000 67%);border-radius:50%;width:400px;height:400px;animation:9s ease-in-out infinite alternate hero-glow-drift;position:absolute;top:-180px}.dashboard-hero:after{content:"";pointer-events:none;background:linear-gradient(115deg,#0000 20%,#ffffff47 45%,#0000 68%);animation:8s ease-in-out 1.5s infinite hero-glass-sheen;position:absolute;inset:0;transform:translate(-120%)}.dashboard-hero-copy,.dashboard-hero-aside{z-index:1;min-width:0;position:relative}.dashboard-hero-eyebrow{letter-spacing:1.4px;color:var(--hero-accent);align-items:center;gap:9px;font-size:10px;font-weight:700;display:inline-flex}[lang=ar] .dashboard-hero-eyebrow{letter-spacing:0;font-size:11px}.dashboard-hero-eyebrow>span{width:7px;height:7px;box-shadow:0 0 0 4px color-mix(in srgb, var(--hero-accent) 10%, transparent);background:currentColor;border-radius:50%}.dashboard-hero h1{letter-spacing:-1px;color:var(--foreground);margin:12px 0 6px;font-size:clamp(28px,2.6vw,38px);line-height:1.5}.dashboard-hero .animated-greeting{min-height:1.5em}.dashboard-hero-copy>p{max-width:470px;color:var(--hero-muted);margin:0;font-size:13px;line-height:1.9}.dashboard-refresh{color:#126272;background:#ffffffa8;border:1px solid #ffffffe6;border-radius:12px;justify-content:center;align-items:center;gap:9px;margin-block-start:22px;padding:10px 16px;font-size:12px;font-weight:600;transition:background-color .18s,box-shadow .18s;display:inline-flex;box-shadow:inset 0 1px #fff,0 3px 10px -6px #08616c59}.dashboard-refresh:hover:not(:disabled){background:#fff;box-shadow:inset 0 1px #fff,0 6px 18px -8px #08616c52}.dashboard-hero-aside{flex-direction:column;justify-content:center;align-items:center;padding:8px 15px;display:flex}.dashboard-orbit{pointer-events:none;border:1px solid #ffffff8c;border-radius:32px;width:170px;height:170px;position:absolute;box-shadow:inset 0 1px #ffffff59}.dashboard-orbit-one{inset-inline-end:7px;background:linear-gradient(130deg,#b9dae92e,#49aab01f);animation:8s ease-in-out infinite orbit-float;top:10px;transform:rotate(24deg)}.dashboard-orbit-two{inset-inline-start:7px;background:linear-gradient(140deg,#ffffff40,#0000);width:140px;height:140px;animation:8s ease-in-out 1.2s infinite reverse orbit-float-secondary;top:22px;transform:rotate(-17deg)}.dashboard-date-card{background:#ffffffa6;border:1px solid #ffffffe6;border-radius:20px;width:220px;max-width:100%;padding:17px 20px;animation:6s ease-in-out .8s infinite date-card-float;position:relative;box-shadow:inset 0 1px #fff,0 16px 30px -22px #1f536366}.dashboard-date-heading{color:var(--hero-accent);justify-content:space-between;align-items:center;font-size:11px;font-weight:600;display:flex}.dashboard-date-card time{align-items:center;gap:15px;margin-block:11px;display:flex}.dashboard-date-card time>strong{letter-spacing:-2px;font-variant-numeric:tabular-nums;font-size:48px;font-weight:600;line-height:1.1}.dashboard-date-card time>span{font-size:12px;font-weight:600}.dashboard-date-card time small{color:var(--hero-muted);margin-block-start:3px;font-size:10px;font-weight:400}.dashboard-date-company{color:var(--hero-muted);border-block-start:1px solid #0879851f;align-items:center;gap:7px;padding-block-start:10px;font-size:10px;display:flex}.dashboard-date-company span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.dashboard-date-company svg{flex-shrink:0}.dashboard-hero-caption{color:var(--hero-muted);margin-block-start:12px;font-size:9px}:root[data-theme=dark] .dashboard-hero{--hero-accent:#82d9d5;--hero-muted:#a8c0ca;background:linear-gradient(115deg,#122c38f2,#184349c2);border-color:#98d8dc36;box-shadow:inset 0 1px #d0fcff1f,0 22px 48px -30px #0009}@keyframes dashboard-hero-enter{0%{opacity:0;transform:translateY(12px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes hero-glow-drift{0%{opacity:.75;transform:translateY(10px)scale(.94)}to{opacity:1;transform:translate(-26px,30px)scale(1.08)}}@keyframes hero-glass-sheen{0%,35%{transform:translate(-120%)}65%,to{transform:translate(120%)}}@keyframes orbit-float{0%,to{transform:rotate(24deg)translateY(0)}50%{transform:rotate(28deg)translateY(-8px)}}@keyframes orbit-float-secondary{0%,to{transform:rotate(-17deg)translateY(0)}50%{transform:rotate(-21deg)translateY(-8px)}}@keyframes date-card-float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-5px)rotate(.5deg)}}:root[data-theme=dark] .dashboard-date-card{background:#10232ead;border-color:#afe0e63d;box-shadow:inset 0 1px #ffffff1a,0 16px 32px -22px #000000b3}:root[data-theme=dark] .dashboard-orbit{border-color:#9ededf30;box-shadow:inset 0 1px #ffffff12}:root[data-theme=dark] .dashboard-date-company{border-color:#afe0e626}:root[data-theme=dark] .dashboard-refresh{color:#c4edec;background:#a3e1e217;border-color:#afe0e633;box-shadow:inset 0 1px #ffffff12}:root[data-theme=dark] .dashboard-refresh:hover:not(:disabled){background:#a3e1e226}.app-shell .dashboard-stats .card.metric-card{border-top-color:var(--workspace-glass-border,var(--glass-border));min-height:182px}.app-shell .metric-card:before{content:"";inset-inline-end:-45px;background:radial-gradient(circle, color-mix(in srgb, var(--metric-accent,var(--primary)) 10%, transparent), transparent 70%);pointer-events:none;border-radius:50%;width:210px;height:210px;position:absolute;top:-60px}.app-shell .metric-card>*{position:relative}:root[data-theme=dark] .metric-card[data-tone=mint]{--metric-accent:#7ed4ce;--metric-tint:#7ed4ce1a}:root[data-theme=dark] .metric-card[data-tone=blue]{--metric-accent:#95b9f2;--metric-tint:#95b9f21a}:root[data-theme=dark] .metric-card[data-tone=amber]{--metric-accent:#dfc28e;--metric-tint:#dfc28e1a}:root[data-theme=dark] .metric-card[data-tone=violet]{--metric-accent:#b8a7e9;--metric-tint:#b8a7e91a}:root[data-theme=dark] .app-shell .metric-card .metric-icon{background:var(--metric-tint);color:var(--metric-accent);border-color:color-mix(in srgb, var(--metric-accent) 20%, transparent);box-shadow:inset 0 1px #ffffff0f}.app-shell .dashboard-stats .metric-card>strong{font-size:42px;font-weight:600}.app-shell .metric-card .online-dot{background:var(--metric-accent,var(--primary))}.app-shell .dashboard-main .attendance-chart{padding-block:14px 18px}.app-shell .dashboard-main .chart-legend>div{border:0;border-block-end:1px solid var(--border);background:0 0;border-radius:0;margin-block-end:0;padding-block:14px}.app-shell .dashboard-main .chart-legend>div:last-child{border-block-end:0}.app-shell .dashboard-grid .quick-action-card{border-color:color-mix(in srgb, var(--primary) 16%, var(--border))}.app-shell .header-actions .quiet-button{border-radius:11px}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.dashboard-hero{-webkit-backdrop-filter:blur(24px)saturate(120%);backdrop-filter:blur(24px)saturate(120%)}.dashboard-date-card{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}}@media (max-width:1100px){.dashboard-hero{grid-template-columns:minmax(0,1fr) 235px;gap:16px;padding:26px}.dashboard-date-card{width:205px;padding:16px}}@media (max-width:800px){.dashboard-hero{grid-template-columns:minmax(0,1fr)}.dashboard-hero-aside{display:none}}@media (max-width:560px){.dashboard-hero{border-radius:22px;margin-block-end:18px;padding:24px}.dashboard-hero h1{font-size:25px}.dashboard-hero .animated-greeting{min-height:3em}.dashboard-hero-copy>p{font-size:12px}.dashboard-refresh{margin-block-start:18px}.app-shell .dashboard-stats .card.metric-card{min-height:160px}.app-shell .dashboard-stats .metric-card>strong{font-size:32px}}@media (prefers-reduced-transparency:reduce){.dashboard-hero,.dashboard-date-card{background:var(--surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}@media print{.dashboard-hero,.dashboard-date-card{-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}.dashboard-orbit{display:none}}
.app-shell .dashboard-hero{background:linear-gradient(115deg,#f9ffffe3,#c7ebe8b0 65%,#d4def8ad);min-height:280px}.dashboard-hero-light,.dashboard-hero-grid{pointer-events:none;position:absolute;inset:0}.dashboard-hero-light{background:radial-gradient(350px circle at var(--spotlight-x,65%) var(--spotlight-y,35%), #ffffffa6, transparent 75%);opacity:0;transition:opacity .4s}.dashboard-hero-grid{background-image:linear-gradient(#1f788912 1px,#0000 1px),linear-gradient(90deg,#1f788912 1px,#0000 1px);background-size:34px 34px;-webkit-mask-image:linear-gradient(90deg,#0000 30%,#000);mask-image:linear-gradient(90deg,#0000 30%,#000)}[dir=rtl] .dashboard-hero-grid{transform:scaleX(-1)}.dashboard-floating-chip{z-index:2;color:var(--hero-accent);white-space:nowrap;background:#edf9f8;border:1px solid #ffffffe6;border-radius:12px;align-items:center;gap:8px;padding:9px 13px;font-size:10px;font-weight:600;display:inline-flex;position:absolute;box-shadow:inset 0 1px #ffffffb3,0 8px 24px -14px #11475a66}.dashboard-floating-chip-top{top:-20px;inset-inline-end:0;transform:rotate(5deg)}.dashboard-floating-chip-bottom{bottom:-17px;inset-inline-start:-20px;transform:rotate(-5deg)}.dashboard-hero-aside{padding-block:20px 25px}.dashboard-hero-caption{margin-block-start:18px}.app-shell .dashboard-refresh{transition:transform .2s,box-shadow .2s,background-color .2s}.dashboard-refresh:disabled svg{animation:1s linear infinite dashboard-refresh-spin}.attendance-visual{justify-content:space-evenly;align-items:center;gap:26px;padding-block:10px;display:flex}.attendance-gauge{aspect-ratio:1;flex:0 0 210px;width:210px;position:relative}.attendance-gauge svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}.attendance-gauge circle{fill:none}.attendance-gauge-guide{stroke:var(--border);stroke-width:1px;stroke-dasharray:1 6}.attendance-gauge-track{stroke:color-mix(in srgb, var(--border) 65%, transparent);stroke-width:13px}.attendance-gauge-progress{stroke:var(--attendance-accent);stroke-width:13px;stroke-linecap:butt;filter:drop-shadow(0 3px 5px color-mix(in srgb, var(--attendance-accent) 25%, transparent));transition:stroke-dasharray .8s cubic-bezier(.2,.7,.3,1),stroke .3s}.attendance-gauge-value{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;inset:36px}.attendance-gauge-value>span{color:var(--muted);letter-spacing:.6px;font-size:8px;font-weight:600}[lang=ar] .attendance-gauge-value>span{letter-spacing:0;font-size:9px}.attendance-gauge-value strong{font-variant-numeric:tabular-nums;letter-spacing:-1.5px;color:var(--foreground);font-size:40px;line-height:1.15}.attendance-gauge-value small{color:var(--attendance-accent);font-size:12px;font-weight:600}.attendance-controls{flex:1;min-width:0;max-width:290px}.attendance-controls button{text-align:start;width:100%;color:var(--muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:12px;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:10px;margin-block-end:5px;padding:12px 13px 17px;font-family:inherit;font-size:12px;transition:background-color .2s,border-color .2s,transform .2s;display:grid;position:relative}.attendance-controls button[aria-pressed=true]{background:color-mix(in srgb, var(--status-color) 9%, transparent);border-color:color-mix(in srgb, var(--status-color) 25%, transparent);color:var(--foreground)}.attendance-controls button:focus-visible,.dashboard-refresh:focus-visible{outline:2px solid var(--primary);outline-offset:3px}.attendance-status-dot{background:var(--status-color);border-radius:50%;width:7px;height:7px}.attendance-controls strong{color:var(--foreground);font-variant-numeric:tabular-nums;font-size:15px}.attendance-status-track{inset-inline:32px 13px;background:var(--border);border-radius:4px;height:2px;position:absolute;bottom:7px;overflow:hidden}.attendance-status-track i{background:var(--status-color);height:100%;transition:width .8s;display:block}.attendance-controls p{color:var(--muted);margin:10px 2px 0;font-size:9px;line-height:1.8}.app-shell .dashboard-stats .metric-card{background-image:linear-gradient(135deg, color-mix(in srgb, var(--metric-accent) 8%, transparent), transparent 65%)}.app-shell .department-bar i{background:linear-gradient(90deg, var(--primary), #79c8bd);transform-origin:0;animation:.85s cubic-bezier(.2,.7,.3,1) both dashboard-bar-grow}[dir=rtl] .app-shell .department-bar i{transform-origin:100%}:root[data-theme=dark] .app-shell .dashboard-hero{background:linear-gradient(115deg,#122736f2,#184349c2 65%,#273051bf)}:root[data-theme=dark] .dashboard-hero-light{background:radial-gradient(350px circle at var(--spotlight-x,65%) var(--spotlight-y,35%), #71d7d121, transparent 75%)}:root[data-theme=dark] .dashboard-hero-grid{opacity:.65;background-image:linear-gradient(#9fe8e21f 1px,#0000 1px),linear-gradient(90deg,#9fe8e21f 1px,#0000 1px)}:root[data-theme=dark] .dashboard-floating-chip{background:#183d48;border-color:#98d8dc3d;box-shadow:inset 0 1px #ffffff17,0 8px 24px -14px #000}@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.dashboard-floating-chip{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#f4fffdc4}:root[data-theme=dark] .dashboard-floating-chip{background:#183d48cc}}@media (hover:hover) and (prefers-reduced-motion:no-preference){.dashboard-hero:hover .dashboard-hero-light{opacity:1}.app-shell .dashboard-refresh:hover:not(:disabled){transform:translateY(-2px)}.attendance-controls button:hover{background-color:color-mix(in srgb, var(--status-color) 8%, transparent);transform:translateY(-1px)}.app-shell .metric-card:hover .metric-icon{transform:rotate(-7deg)scale(1.06)}.dashboard-floating-chip-top{animation:7s ease-in-out infinite dashboard-chip-drift}.dashboard-floating-chip-bottom{animation:8s ease-in-out 1s infinite reverse dashboard-chip-drift}}@keyframes dashboard-chip-drift{0%,to{translate:0}50%{translate:0 -7px}}@keyframes dashboard-bar-grow{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes dashboard-refresh-spin{to{transform:rotate(360deg)}}@media (max-width:1100px){.attendance-visual{gap:12px}.attendance-gauge{flex-basis:175px;width:175px}.attendance-gauge-value{inset:28px}.attendance-gauge-value strong{font-size:34px}}@media (max-width:800px){.app-shell .dashboard-hero{min-height:auto}}@media (max-width:560px){.attendance-visual{flex-direction:column;gap:14px}.attendance-gauge{flex-basis:auto;width:200px}.attendance-controls{width:100%;max-width:none}.attendance-controls button{min-height:48px}}@media (prefers-reduced-motion:reduce){.app-shell .attendance-gauge-progress,.app-shell .attendance-status-track i{transition:none}.dashboard-hero-light{display:none}}@media (prefers-reduced-transparency:reduce){.app-shell .dashboard-hero,.dashboard-floating-chip{background:var(--surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.dashboard-hero-light,.dashboard-hero-grid{display:none}}@media print{.dashboard-hero-light,.dashboard-hero-grid,.dashboard-floating-chip{display:none}.attendance-gauge-progress{filter:none}}