:root{--sidebar-width:258px;--sidebar-collapsed:68px;--navbar-h:60px;--primary:#2563eb;--primary-dark:#1d4ed8;--primary-soft:#eff4ff;--primary-soft-2:#e2ecff;--accent-gold:#f5b544;--ink:#0b1220;--ink-2:#1f2937;--text:#3f4753;--text-muted:#6b7480;--text-faint:#9aa2ad;--line:#e9eaee;--line-strong:#e0e2e8;--canvas:#f7f8fa;--surface:#fff;--sidebar-bg:#fff;--sidebar-text:#4a515c;--sidebar-muted:#9aa2ad;--shadow-xs:0 1px 2px #0b12200a;--shadow-sm:0 1px 2px #0b12200d;--shadow-md:0 2px 4px #0b12200a, 0 8px 20px -8px #0b12201f;--shadow-lg:0 12px 32px -12px #0b12202e;--radius:12px;--radius-lg:16px;--radius-sm:9px;-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:Plus Jakarta Sans,Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--canvas);color:var(--text);font-feature-settings:"cv02", "cv03", "cv04", "ss01";letter-spacing:-.006em;overflow-x:hidden}#root{text-align:left;width:100%}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);z-index:1000;border-right:1px solid var(--line);height:100vh;padding-bottom:24px;transition:width .24s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:0;overflow:hidden auto}.sidebar.collapsed{width:var(--sidebar-collapsed)}.sidebar-brand{color:var(--ink);letter-spacing:-.03em;border-bottom:1px solid var(--line);white-space:nowrap;z-index:2;background:var(--surface);align-items:center;gap:10px;padding:18px;font-size:1.14rem;font-weight:800;text-decoration:none;display:flex;position:sticky;top:0}.sidebar-brand .brand-icon{color:var(--primary);background:var(--primary-soft);border-radius:9px;justify-content:center;align-items:center;width:32px;height:32px;font-size:1.15rem;display:inline-flex}.sidebar.collapsed .brand-text{display:none}.sidebar.collapsed .sidebar-brand{justify-content:center;padding:18px 0}.nav-section{letter-spacing:.11em;color:var(--sidebar-muted);text-transform:uppercase;white-space:nowrap;padding:16px 20px 5px;font-size:.65rem;font-weight:700}.sidebar.collapsed .nav-section{text-indent:-999px;background:var(--line);height:1px;margin:8px 18px;padding:10px 0 4px;overflow:hidden}.sidebar-link{color:var(--sidebar-text);white-space:nowrap;background:0 0;border:none;border-radius:8px;align-items:center;gap:11px;width:calc(100% - 20px);margin:1px 10px;padding:8px 11px;font-size:.85rem;font-weight:500;text-decoration:none;transition:background .14s,color .14s;display:flex;position:relative}.sidebar-link:hover{color:var(--ink);background:#f3f5f8}.sidebar-link.active{background:var(--primary-soft);color:var(--primary);font-weight:600}.sidebar-link.active:before{content:"";background:var(--primary);border-radius:0 3px 3px 0;width:3px;height:18px;position:absolute;top:50%;left:-10px;transform:translateY(-50%)}.sidebar-link i{text-align:center;width:18px;color:var(--text-faint);flex-shrink:0;font-size:.92rem;transition:color .14s}.sidebar-link:hover i,.sidebar-link.active i{color:currentColor}.sidebar.collapsed .sidebar-link span{display:none}.sidebar.collapsed .sidebar-link{justify-content:center;width:44px;margin:1px auto;padding:10px}.sidebar.collapsed .sidebar-link.active:before{display:none}.main-content{margin-left:var(--sidebar-width);min-height:100vh;transition:margin-left .24s cubic-bezier(.4,0,.2,1)}.main-content.expanded{margin-left:var(--sidebar-collapsed)}.topbar{height:var(--navbar-h);-webkit-backdrop-filter:saturate(180%)blur(10px);backdrop-filter:saturate(180%)blur(10px);border-bottom:1px solid var(--line);z-index:999;background:#ffffffe0;align-items:center;gap:12px;padding:0 22px;display:flex;position:sticky;top:0}.topbar-toggle{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;font-size:1rem;transition:all .14s;display:inline-flex}.topbar-toggle:hover{color:var(--ink);background:#f3f5f8}.topbar-spacer{flex:1}.avatar{background:var(--ink);color:#fff;letter-spacing:.02em;cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:.8rem;font-weight:700;transition:transform .14s;display:flex}.avatar:hover{transform:scale(1.05)}.page-content{padding:26px 30px;animation:.32s cubic-bezier(.16,1,.3,1) page-in}@keyframes page-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;display:flex}.page-title{color:var(--ink);letter-spacing:-.035em;font-size:1.5rem;font-weight:800;line-height:1.15}.page-subtitle{color:var(--text-muted);margin-top:4px;font-size:.85rem;font-weight:500}.stat-card{--sc:var(--primary);--sc-bg:var(--primary-soft);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-xs);padding:18px;transition:border-color .16s,box-shadow .16s;position:relative;overflow:hidden}.stat-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm)}.stat-value{letter-spacing:-.035em;color:var(--ink);font-variant-numeric:tabular-nums;font-size:1.7rem;font-weight:800;line-height:1.1}.stat-label{color:var(--text-muted);margin-top:3px;font-size:.78rem;font-weight:600}.stat-card>i,.stat-card .fa-solid,.stat-card .fa-regular{color:var(--sc)}.stat-blue{--sc:#2563eb;--sc-bg:#eff4ff}.stat-green{--sc:#059467;--sc-bg:#e7f7ee}.stat-orange{--sc:#ea6b0c;--sc-bg:#fff3e6}.stat-purple{--sc:#6d28d9;--sc-bg:#f3ecfe}.stat-red{--sc:#dc2626;--sc-bg:#fdecec}.stat-teal{--sc:#0d9488;--sc-bg:#e6f6f4}.card{background:var(--surface);transition:border-color .16s;border:1px solid var(--line)!important;border-radius:var(--radius)!important;box-shadow:none!important}.card-header{color:var(--ink);letter-spacing:-.015em;font-size:.92rem;font-weight:700;border-bottom:1px solid var(--line)!important;border-radius:var(--radius) var(--radius) 0 0!important;background:0 0!important;padding:15px 18px!important}.card:hover{border-color:var(--line-strong)!important}.card-body{padding:18px}.table{--bs-table-bg:transparent}.table th{text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);white-space:nowrap;background:0 0;padding:11px 16px;font-size:.68rem;font-weight:700;border-bottom:1px solid var(--line)!important}.table td{vertical-align:middle;color:var(--text);padding:13px 16px;font-size:.86rem;border-color:var(--line)!important}.table tbody tr{transition:background .1s}.table tbody tr:hover{background:#f7f8fa}.table>:not(caption)>*>*{box-shadow:none}.badge-status{letter-spacing:.01em;text-transform:capitalize;border-radius:7px;align-items:center;gap:5px;padding:3px 9px 3px 8px;font-size:.68rem;font-weight:700;display:inline-flex}.badge-status:before{content:"";opacity:.9;background:currentColor;border-radius:50%;width:6px;height:6px}.badge-Active,.badge-Approved,.badge-Present{color:#067647;background:#e7f7ee}.badge-Inactive,.badge-Absent{color:#c0322b;background:#fdecec}.badge-Pending,.badge-Draft,.badge-Half-Day{color:#b25e09;background:#fef4e2}.badge-Paid{color:#1d4ed8;background:#eef4ff}.badge-Computed{color:#6d28d9;background:#f3ecfe}.badge-Rejected{color:#b71c1c;background:#fdecec}.badge-Cancelled{color:#5b6470;background:#f1f3f6}.badge-Resigned{color:#c2410c;background:#fff1e6}.att-cell{cursor:pointer;border-radius:8px;justify-content:center;align-items:center;width:30px;height:30px;font-size:.66rem;font-weight:700;transition:transform .12s;display:inline-flex}.att-cell:hover{transform:scale(1.1)}.att-P{color:#067647;background:#e7f7ee}.att-A{color:#c0322b;background:#fdecec}.att-H{color:#b25e09;background:#fef4e2}.att-L{color:#1d4ed8;background:#eef4ff}.att-O{color:#5b6470;background:#f1f3f6}.att-W{color:#9d174d;background:#fbe9f0}.form-label{color:var(--ink-2);margin-bottom:6px;font-size:.8rem;font-weight:600}.form-control,.form-select{border-radius:var(--radius-sm);border-color:var(--line-strong);color:var(--text);background:var(--surface);padding:.5rem .8rem;font-size:.86rem;transition:border-color .14s,box-shadow .14s}.form-control::placeholder{color:var(--text-faint)}.form-control:focus,.form-select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #2563eb1f}.form-section{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:none;margin-bottom:18px;padding:22px}.form-section-title{color:var(--ink);border-bottom:1px solid var(--line);letter-spacing:-.015em;margin-bottom:16px;padding-bottom:11px;font-size:.88rem;font-weight:700}.form-section-title i{color:var(--primary)}.btn{letter-spacing:-.01em;border-radius:var(--radius-sm)!important;font-size:.85rem!important;font-weight:600!important;transition:all .14s!important}.btn:active{transform:translateY(.5px)}.btn-primary{background:var(--primary)!important;border-color:var(--primary)!important;box-shadow:none!important}.btn-primary:hover{background:var(--primary-dark)!important;border-color:var(--primary-dark)!important}.btn-outline-primary{color:var(--primary)!important;border-color:var(--line-strong)!important;background:var(--surface)!important}.btn-outline-primary:hover{background:var(--primary-soft)!important;border-color:var(--primary)!important;color:var(--primary-dark)!important}.btn-outline-secondary{color:var(--text-muted)!important;border-color:var(--line-strong)!important;background:var(--surface)!important}.btn-outline-secondary:hover{color:var(--ink)!important;border-color:var(--line-strong)!important;background:#f3f5f8!important}.btn-sm{border-radius:8px!important}.auth-wrapper{background:var(--canvas);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex;position:relative;overflow:hidden}.auth-wrapper:before{content:"";background:radial-gradient(50% 45% at 50% -10%,#2563eb14,#0000 70%);position:absolute;inset:0}.auth-card{background:var(--surface);border-radius:var(--radius-lg);width:100%;max-width:420px;box-shadow:var(--shadow-md);z-index:1;border:1px solid var(--line);padding:40px 38px;position:relative}.auth-logo{text-align:center;margin-bottom:26px}.auth-logo .rupee-icon{color:var(--primary);background:var(--primary-soft);border-radius:16px;justify-content:center;align-items:center;width:60px;height:60px;font-size:2.2rem;display:inline-flex}.auth-logo h1{color:var(--ink);letter-spacing:-.035em;margin-top:14px;font-size:1.6rem;font-weight:800}.quick-action{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);color:var(--text);text-align:center;flex-direction:column;align-items:center;gap:10px;padding:18px 12px;font-size:.78rem;font-weight:600;text-decoration:none;transition:all .16s;display:flex}.quick-action i{color:var(--primary);background:var(--primary-soft);border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.15rem;transition:all .16s;display:inline-flex}.quick-action:hover{border-color:var(--line-strong);color:var(--ink);transform:translateY(-2px)}.quick-action:hover i{background:var(--primary);color:#fff}.amount{font-variant-numeric:tabular-nums;letter-spacing:-.03em;font-family:JetBrains Mono,Courier New,monospace;font-weight:600}.payslip-container{background:var(--surface);border-radius:var(--radius-lg);max-width:820px;box-shadow:var(--shadow-xs);border:1px solid var(--line);margin:0 auto;padding:42px}.payslip-header{text-align:center;border-bottom:1px solid var(--line);margin-bottom:24px;padding-bottom:22px}.payslip-company-name{color:var(--ink);letter-spacing:-.035em;font-size:1.5rem;font-weight:800}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#d4d8de padding-box content-box;border:3px solid #0000;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:#b8bec7 padding-box content-box}.text-primary,.spinner-border.text-primary{color:var(--primary)!important}@media (width<=768px){.sidebar{width:0}.main-content{margin-left:0}.page-content{padding:18px 16px}.page-title{font-size:1.28rem}}@media print{.sidebar,.topbar,.btn,.no-print{display:none!important}.main-content{margin-left:0!important}body{background:#fff}.payslip-container{box-shadow:none;border:none}}