@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@500;600&display=swap";
:root{--brand-primary:#6366f1;--brand-primary-hover:#4f46e5;--brand-dark:#0f172a;--brand-header:#020617;--clr-success:#059669;--clr-warning:#d97706;--clr-danger:#dc2626;--clr-info:#2563eb;--bg-app:#f1f5f9;--bg-card:#fff;--bg-input:#fff;--border-sharp:#cbd5e1;--border-focus:#6366f1;--txt-main:#0f172a;--txt-muted:#64748b;--txt-on-dark:#f8fafc;--radius-xs:4px;--radius-sm:50px;--radius-md:12px;--radius-lg:16px;--shadow-sharp:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--shadow-elevated:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000001a;--transition-fast:all .2s cubic-bezier(.4,0,.2,1)}[data-theme=dark]{--bg-app:#030712;--bg-card:#0f172a;--bg-input:#1e293b;--border-sharp:#334155;--txt-main:#f1f5f9;--txt-muted:#94a3b8;--shadow-sharp:0 1px 3px 0 #00000080}[data-theme=dark] label{color:#e2e8f0!important;font-weight:600!important}[data-theme=dark] .section-header{color:#f8fafc!important;background:#1e293b!important;border-bottom-color:#334155!important}[data-theme=dark] .section-content{color:#f1f5f9!important}[data-theme=dark] .styled-input,[data-theme=dark] .remarks-input,[data-theme=dark] .status-select{color:#fff!important;background:#1e293b!important;border-color:#475569!important}[data-theme=dark] .data-table th{color:#fff!important;background:#1e293b!important;border-bottom-color:#475569!important}[data-theme=dark] .ledger-item{color:#cbd5e1;background:#1e293b;border-color:#334155}[data-theme=dark] .ledger-item:hover{color:#fff;background:#334155}[data-theme=dark] .styled-input.zero-value{color:#22d3ee!important;background-color:#083344!important;border-color:#0891b2!important}*{box-sizing:border-box;margin:0;padding:0;font-family:inherit}html{font-size:115%}body{background-color:var(--bg-app);color:var(--txt-main);-webkit-font-smoothing:antialiased;transition:var(--transition-fast);background-image:linear-gradient(135deg,#00ff9640 0%,#0000b440 100%);background-attachment:fixed;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}.app-container{flex-direction:column;gap:2rem;width:95%;max-width:1800px;margin:0 auto;padding:2rem;display:flex}.header-section{color:#fff;border-radius:var(--radius-md);background:linear-gradient(135deg,#4f46e5 0%,#06b6d4 50%,#10b981 100%);border-bottom:3px solid #fff3;flex-direction:column;gap:1.5rem;padding:1.5rem 2rem;display:flex;box-shadow:0 10px 15px -3px #0003}[data-theme=dark] .header-section{color:#fff;background:linear-gradient(135deg,#3730a3 0%,#0e7490 50%,#065f46 100%)}.header-bar{justify-content:space-between;align-items:center;display:flex}.header-bar h1{letter-spacing:-.05em;text-transform:uppercase;color:#fff;font-size:1.5rem;font-weight:800}.header-content{border-top:1px solid #ffffff0d;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:2rem;padding-top:1.5rem;display:grid}.section-card{background-color:var(--bg-card);border:1px solid var(--border-sharp);border-radius:var(--radius-md);box-shadow:var(--shadow-sharp);transition:var(--transition-fast);background-image:linear-gradient(135deg,#a5f3fc59 0%,#d8b4fe59 100%);background-size:400% 400%;animation:6s infinite gradientBreathing;position:relative;overflow:hidden}@keyframes gradientBreathing{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.section-card:hover{box-shadow:var(--shadow-elevated);border-color:var(--brand-primary)}.section-header{text-transform:none;letter-spacing:.05em;background:var(--brand-header);color:#fff;border-bottom:2px solid #ffffff1a;align-items:center;gap:.5rem;padding:1rem 1.5rem;font-size:1.1rem;font-weight:700;display:flex}.header-primary{color:#fff;background:#3b82f6}.header-success{color:#fff;background:#059669}.header-warning{color:#fff;background:#14b8a6}.header-info{color:#fff;background:#6366f1}.header-slate{color:#fff;background:#334155}.section-content{flex:1;padding:1.5rem}.data-table{border-collapse:collapse;width:100%;font-size:.8125rem}.data-table th{text-align:left;color:var(--brand-dark);text-transform:none;letter-spacing:.1em;border-bottom:2px solid var(--brand-dark);background:linear-gradient(90deg,#eef2ff 0%,#ecfeff 100%);padding:1rem .5rem;font-weight:700}.data-table td{border-bottom:1px solid var(--border-sharp);color:var(--txt-main);vertical-align:middle;padding:.875rem .25rem}:is(.data-table td:has(.styled-input),.data-table td:has(.shift-select)){vertical-align:middle;padding-top:.375rem;padding-bottom:.375rem}.col-center{text-align:center}.col-push-right{padding-left:2rem!important}.data-table tr:hover td{background-color:#f1f5f9}[data-theme=dark] .data-table tr:hover td{background-color:#1e293b}.total-row{background:#f1f5f9}.total-row td{color:#0f172a;border-top:2px solid var(--border-sharp);text-transform:uppercase;padding:1rem .75rem;font-size:.95rem;text-align:center!important;font-weight:800!important}[data-theme=dark] .total-row{background:#1e293b}[data-theme=dark] .total-row td{color:#fff}[data-theme=dark] .data-table th{color:#f1f5f9;background:linear-gradient(90deg,#1e293b 0%,#312e81 100%);border-bottom:2px solid #6366f1}.pendency-box{border:1px solid var(--border-sharp);border-radius:var(--radius-sm);transition:var(--transition-fast);background:linear-gradient(90deg,#eef2ff 0%,#ecfeff 100%);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;box-shadow:0 1px 2px #0000000d}[data-theme=dark] .pendency-box{background:linear-gradient(90deg,#1e293b 0%,#312e81 100%)}.pendency-label{color:#0f172a;text-transform:uppercase;letter-spacing:.05em;transition:var(--transition-fast);font-size:.8rem;font-weight:900}[data-theme=dark] .pendency-label{color:#f8fafc}.styled-input,.remarks-input{background:var(--bg-input);border:1px solid var(--border-sharp);border-left:5px solid var(--brand-primary);border-radius:var(--radius-sm);width:100%;color:var(--txt-main);text-align:center;transition:var(--transition-fast);padding:.5rem .75rem;font-size:.875rem;font-weight:800;line-height:1.25rem;box-shadow:0 2px 4px #0000000d}.status-select{background:var(--bg-input);border:1px solid var(--border-sharp);border-left:5px solid var(--brand-primary);border-radius:var(--radius-sm);width:100%;max-width:100%;color:var(--txt-main);text-align:center;transition:var(--transition-fast);cursor:pointer;appearance:none;padding:.25rem 1rem;font-weight:800;box-shadow:0 2px 4px #0000000d}.styled-input:focus,.remarks-input:focus,.status-select:focus{border-color:var(--brand-primary);outline:none;box-shadow:0 0 0 4px #6366f126}.styled-input:disabled{color:var(--txt-muted);cursor:not-allowed;background-color:#f8fafc}.styled-input.zero-value{color:#0891b2!important;background-color:#ecfeff!important;border-color:#06b6d4!important;font-weight:800!important}.shift-select{background-color:var(--bg-input);border:2px solid var(--border-sharp);border-radius:var(--radius-sm);letter-spacing:-.02em;width:100%;color:var(--brand-dark);cursor:pointer;transition:var(--transition-fast);text-align:center;appearance:none;padding:.5rem 1rem;font-size:.825rem;font-weight:800;line-height:1.25rem;box-shadow:0 2px 4px #0000000d}.shift-select:hover,.shift-select:focus{border-color:var(--brand-primary);outline:none;box-shadow:0 4px 12px #6366f126}[data-theme=dark] .shift-select{color:#f1f5f9;background-color:#1e293b;border-color:#334155}input[type=date].styled-input::-webkit-calendar-picker-indicator{filter:invert()brightness(1.5);cursor:pointer;opacity:.8;transition:var(--transition-fast)}input[type=date].styled-input:hover::-webkit-calendar-picker-indicator{opacity:1}.ledger-horizontal{flex-wrap:wrap;gap:.75rem;padding:1rem;display:flex}.ledger-item{border-radius:var(--radius-sm);border:1px solid var(--border-sharp);color:var(--txt-main);cursor:pointer;transition:var(--transition-fast);white-space:nowrap;background:#fff;padding:.5rem 1rem;font-size:.8125rem;font-weight:700}.ledger-item:hover{border-color:var(--brand-primary);color:var(--brand-primary);background:#f8fafc}.ledger-item.active{background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}.mt-10{margin-top:2.5rem}.calculated-value{color:var(--brand-primary);border:1px solid #6366f11a;border-left:5px solid var(--brand-primary);border-radius:var(--radius-sm);text-align:center;background:#6366f10d;justify-content:center;align-items:center;padding:.5rem 1rem;font-weight:800;display:flex;box-shadow:0 1px 2px #0000000d}.grand-total{color:#fff;background:var(--brand-primary);border-radius:var(--radius-sm);padding:.5rem 1rem;font-weight:800;box-shadow:0 4px 6px -1px #6366f166}.stripe-primary{border-left:5px solid var(--brand-primary)!important}.stripe-success{border-left:5px solid var(--clr-success)!important}.stripe-warning{border-left:5px solid #14b8a6!important}.stripe-info{border-left:5px solid #6366f1!important}.stripe-slate{border-left:5px solid #334155!important}.btn-terminate{color:#fff;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);white-space:nowrap;background:#00000026;border:1px solid #ffffff4d;border-radius:2rem;padding:.5rem 1.25rem;font-size:.75rem;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #0000001a}.btn-terminate:hover{color:#fff;background:#dc2626e6;border-color:#ef4444;transform:translateY(-1px);box-shadow:0 4px 12px #dc262666}.btn-primary{background:var(--brand-primary);color:#fff;border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.025em;cursor:pointer;transition:var(--transition-fast);border:none;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:700;display:flex}.theme-toggle-btn{cursor:pointer;color:#fff;background:#ffffff14;border:1px solid #ffffff26;border-radius:2rem;align-items:center;gap:.6rem;padding:.4rem .8rem;font-size:.75rem;font-weight:700;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.theme-toggle-btn:hover{border-color:var(--brand-primary);background:#ffffff26;transform:translateY(-1px);box-shadow:0 4px 12px #6366f14d}.theme-icon{font-size:1rem;transition:transform .4s}.theme-toggle-btn:hover .theme-icon{transform:rotate(15deg)scale(1.1)}[data-theme=dark] .theme-toggle-btn{background:#6366f126;border-color:#6366f166}.btn-primary:hover{background:var(--brand-primary-hover);transform:translateY(-2px);box-shadow:0 10px 15px -3px #6366f14d}.grid-3{grid-template-columns:repeat(3,1fr);align-items:flex-start;gap:2rem;display:grid}.mt-6{margin-top:1.5rem}.status-badge{text-transform:uppercase;letter-spacing:.05em;text-align:center;border-radius:4px;padding:.25rem .5rem;font-size:.65rem;font-weight:800}.in{color:#fff;background:#059669}.leave{color:#fff;background:#dc2626}.wfh{color:#fff;background:#2563eb}.wo{color:#fff;background:#475569}.login-container{background-color:#020617;background-image:radial-gradient(at 0 0,#4f46e526 0,#0000 50%),radial-gradient(at 100% 100%,#10b9811a 0,#0000 50%);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{border-top:4px solid var(--brand-primary);background:#fff;border-radius:4px;width:100%;max-width:440px;padding:3rem 3rem 2.35rem;box-shadow:0 25px 50px -12px #00000080}@media (max-width:1400px){.grid-3{grid-template-columns:1fr 1fr}}@media (max-width:900px){.grid-3,.header-content{grid-template-columns:1fr}}