@import url(https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{background:#f5f7fa;font-family:Poppins,sans-serif;margin:0}.app-shell{min-height:100vh}.auth-container{display:flex;height:100vh}.auth-left{align-items:center;background:linear-gradient(135deg,#2ed8a3,#2bb7da,#1e6bd6);display:flex;flex:1 1;justify-content:center;overflow:hidden;padding:60px;position:relative}.auth-left:before{background:#ffffff14;border-radius:50%;content:"";height:650px;position:absolute;right:-180px;top:-180px;width:650px}.branding{max-width:520px;position:relative;z-index:2}.brand-logo{margin-bottom:35px;object-fit:contain;width:180px}.brand-heading{color:#fff;font-size:64px;font-weight:800;letter-spacing:-2px;line-height:1.05;margin:0}.brand-heading span{display:inline}.brand-subtitle{color:#ffffffeb;font-size:24px;font-weight:400;margin-bottom:22px;margin-top:28px}.brand-company{color:#ffffffc7;font-size:15px;line-height:1.6}.auth-right{align-items:center;background:#f4f5f9;flex:1 1;overflow:hidden;padding:60px}.auth-card,.auth-right{display:flex;justify-content:center}.auth-card{flex-direction:column;max-width:520px;overflow:visible;width:100%}.auth-card h2{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#1e6bd6,#2bb7da);background-clip:text;-webkit-background-clip:text;color:#1e6bd6;font-size:48px;font-size:52px;font-weight:800;letter-spacing:-2px;line-height:normal;line-height:1.1;margin:0 0 30px;margin-bottom:30px;padding-bottom:12px;padding-top:8px;white-space:nowrap}.auth-card form{display:flex;flex-direction:column;gap:18px;width:100%}.auth-card input{background:#fff;border:1px solid #e4e7ec;border-radius:18px;box-sizing:border-box;font-size:16px;height:58px;padding:0 18px;transition:.2s ease;width:100%}.auth-card button{background:linear-gradient(135deg,#1e6bd6,#2bb7da);border:none;border-radius:18px;color:#fff;cursor:pointer;font-size:17px;font-weight:700;height:58px;transition:.25s ease;width:100%}.auth-links{align-items:center;display:flex;justify-content:space-between;margin-top:24px;width:100%}.error{color:#e11d48;margin-top:12px}.success{color:#16a34a;margin-top:12px}.dashboard-layout{height:100vh}.sidebar{background:linear-gradient(180deg,#2ed8a3,#2bb7da,#1e6bd6);color:#fff;padding:24px;width:240px}.sidebar h2{margin-bottom:30px}.sidebar nav{display:flex;flex-direction:column;gap:14px}.sidebar a{color:#fff;font-size:15px;text-decoration:none}.dashboard-main{display:flex;flex:1 1;flex-direction:column}.topbar{border-bottom:1px solid #eee;height:70px;padding:0 24px}.dashboard-content{padding:24px}.dashboard-cards{display:flex;gap:20px;margin-top:20px}.card{background:#fff;border-radius:18px;box-shadow:0 2px 8px #0000000d;flex:1 1;padding:30px;text-align:center}.brand-title{color:#fff;font-size:86px;font-weight:800;letter-spacing:-4px;line-height:.95;margin:0}.login-powered{color:#777;font-size:14px;margin-top:30px}.back-link{margin-top:18px}.back-link a{color:#1e6bd6;font-size:14px;text-decoration:none}.back-link a:hover{text-decoration:underline}*{box-sizing:border-box;margin:0;padding:0}body{background:#f5f7fb;font-family:Inter,sans-serif}.dashboard-layout{background:#f5f7fb;display:flex;min-height:100vh}.sidebar{background:#fff;border-right:1px solid #e5e7eb;display:flex;flex-direction:column;justify-content:space-between;padding:30px 20px;width:280px}.brand h1{color:#2563eb;font-size:26px;font-weight:800;line-height:1}.brand span{color:#06b6d4}.brand p{color:#6b7280;font-size:14px;font-size:15px;margin-top:6px}.sidebar-menu{display:flex;flex-direction:column;gap:10px;margin-top:40px}.menu-item{align-items:center;background:#0000;border:none;border-radius:14px;color:#475569;cursor:pointer;display:flex;font-size:15px;font-weight:600;gap:14px;height:52px;padding:0 18px;transition:.2s}.menu-item:hover{background:#f1f5f9}.menu-item.active{background:#eff6ff;color:#2563eb}.sidebar-user{border-top:1px solid #e5e7eb;gap:12px;padding-top:20px}.sidebar-user,.user-avatar{align-items:center;display:flex}.user-avatar{background:#2563eb;border-radius:50%;color:#fff;font-weight:700;height:48px;justify-content:center;width:48px}.user-meta h4{font-size:14px}.user-meta p{color:#6b7280;font-size:12px}.main-area{flex:1 1}.topbar{align-items:center;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;height:78px;justify-content:space-between;padding:0 32px}.topbar h2{color:#111827;font-size:16px;font-weight:700;margin:0}.topbar p{color:#6b7280;font-size:12px;margin-top:4px}.logout-btn{align-items:center;background:#ef4444;border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:8px;height:46px;padding:0 20px}.page-content{padding:24px 28px}.stats-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(4,1fr)}.stat-card{background:#fff;border:1px solid #edf2f7;border-radius:18px;display:flex;justify-content:space-between;padding:22px}.stat-card h4{color:#6b7280;font-size:15px;font-weight:600}.stat-card h2{color:#111827;font-size:36px;margin:12px 0}.positive{color:#16a34a;font-weight:600}.negative{color:#dc2626;font-weight:600}.stat-icon{align-items:center;border-radius:14px;display:flex;font-size:28px;height:54px;justify-content:center;width:54px}.blue{background:#dbeafe}.green{background:#dcfce7}.orange{background:#ffedd5}.purple{background:#f3e8ff}.bottom-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:2fr 1fr;margin-top:28px}.activity-card,.leave-card{background:#fff;border:1px solid #edf2f7;border-radius:22px;padding:28px}.activity-card h3,.leave-card h3{color:#111827;font-size:18px;margin-bottom:24px}.activity-item{border-bottom:1px solid #f1f5f9;display:flex;gap:16px;padding:18px 0}.activity-avatar{align-items:center;background:#dbeafe;border-radius:50%;color:#2563eb;display:flex;font-weight:700;height:52px;justify-content:center;width:42px}.activity-item h4{font-size:15px;margin-bottom:6px}.activity-item p{color:#6b7280;font-size:13px}.leave-item{background:#f8fafc;border-radius:14px;margin-bottom:16px;padding:14px}.leave-item h4{font-size:15px;margin-bottom:5px}.leave-item p{color:#6b7280;font-size:13px;margin-bottom:6px}.leave-item span{color:#2563eb;font-size:13px;font-weight:600}.stats-grid{margin-top:10px}.bottom-grid{margin-top:20px}.employee-page{padding:24px 28px}.employee-header{margin-bottom:22px}.employee-header h1{color:#111827;font-size:24px;font-weight:700}.employee-header p{color:#6b7280;font-size:14px;margin-top:4px}.employee-toolbar{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:24px}.search-wrapper{align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:14px;display:flex;flex:1 1;gap:10px;height:50px;max-width:420px;padding:0 14px}.search-wrapper input{background:#0000;border:none;font-size:14px;outline:none;width:100%}.toolbar-actions{display:flex;gap:12px}.add-btn,.upload-btn{align-items:center;border:none;border-radius:14px;cursor:pointer;display:flex;font-weight:600;gap:8px;height:48px;padding:0 18px}.upload-btn{background:#f1f5f9;color:#111827}.add-btn{background:linear-gradient(135deg,#1e6bd6,#2bb7da);color:#fff}.employee-table-card{background:#fff;border:1px solid #edf2f7;border-radius:18px;padding:20px}.employee-table{border-collapse:collapse;width:100%}.employee-table th{border-bottom:1px solid #f1f5f9;color:#6b7280;font-size:13px;padding:14px;text-align:left}.employee-table td{border-bottom:1px solid #f8fafc;font-size:14px;padding:16px 14px}.employee-table tr:hover{background:#f9fafb}.empty-row{color:#9ca3af;padding:24px;text-align:center}.status-badge{border-radius:20px;font-size:12px;padding:6px 12px}.status-badge.active{background:#dcfce7;color:#15803d}.status-badge.inactive{background:#fee2e2;color:#dc2626}.action-buttons{display:flex;gap:8px}.delete-btn,.edit-btn,.view-btn{border:none;border-radius:10px;cursor:pointer;height:34px;width:34px}.view-btn{background:#eff6ff;color:#2563eb}.edit-btn{background:#fef3c7;color:#d97706}.delete-btn{background:#fee2e2;color:#dc2626}.modal-overlay{background:#0f172a73;z-index:999}.modal{padding:16px;position:relative}.large-modal,.modal{background:#fff;border-radius:24px}.large-modal{max-height:90vh;max-width:1400px;overflow-y:auto;padding:24px;width:95%}.modal-header{display:flex;justify-content:space-between;margin-bottom:18px}.modal-header h3{color:#111827;font-size:20px}.modal-header button{background:#0000;border:none;cursor:pointer}.modal input{border:1px solid #e5e7eb;border-radius:12px;height:48px;margin-bottom:12px;padding:14px;width:100%}.modal button{background:#2563eb;border:none;border-radius:12px;color:#fff;cursor:pointer;padding:12px 20px}.employee-form{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}.employee-form button{background:#2563eb;border:none;border-radius:12px;color:#fff;font-weight:600;grid-column:span 2;height:48px}.employee-form input,.employee-form select{border:1px solid #d9d9d9;border-radius:14px;height:56px;padding:0 16px;width:100%}.success{color:green;font-size:14px}.error{color:red;font-size:14px}.documents-page{padding:24px 28px}.documents-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.documents-header h1{color:#111827;font-size:24px;font-weight:700}.documents-header p{color:#6b7280;font-size:14px;margin-top:4px}.upload-document-btn{align-items:center;border:none;border-radius:14px;color:#fff;cursor:pointer;display:flex;font-size:15px;font-weight:600;gap:10px;height:50px;padding:0 26px}.upload-document-btn,.upload-document-btn:hover{background:linear-gradient(135deg,#1e6bd6,#2bb7da)}.modal-overlay{align-items:flex-start;background:#00000059;overflow-y:auto;z-index:9999}.upload-modal{box-shadow:0 20px 40px #0000001f;padding:32px;width:560px}.upload-modal h2{color:#111827;font-size:22px;margin-bottom:22px}.custom-file-upload{align-items:center;background:#fff;border:1px solid #dbe3ef;border-radius:18px;display:flex;gap:16px;height:72px;padding:0 16px;width:100%}.choose-file-btn{background:linear-gradient(135deg,#1e6bd6,#2bb7da);border:none;border-radius:14px;color:#fff;cursor:pointer;flex-shrink:0;font-size:15px;font-weight:600;height:44px;width:150px}.file-name{color:#6b7280;flex:1 1;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hidden-file-input{display:none!important}.upload-category{background:#fff;border:1px solid #dbe3ef;border-radius:18px;font-size:15px;height:64px;margin-top:16px;outline:none;padding:0 18px;width:100%}.modal-actions{gap:14px}.cancel-btn{color:#111827;font-size:15px;font-weight:500;height:48px;width:120px}.upload-btn{border:none;border-radius:14px;cursor:pointer;height:50px;min-width:140px;width:fit-content}.documents-toolbar-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;margin-bottom:28px;padding:20px}.document-filters{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.filter-btn{background:#f1f5f9;border:none;border-radius:12px;color:#475569;cursor:pointer;font-size:14px;font-weight:500;padding:10px 16px}.filter-btn.active{background:linear-gradient(135deg,#1e6bd6,#2bb7da);color:#fff}.documents-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.document-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:22px;transition:.2s ease}.document-card:hover{box-shadow:0 8px 20px #0000000f}.document-top{align-items:flex-start;display:flex;gap:16px}.document-icon{align-items:center;background:#f8fafc;border-radius:14px;color:#2563eb;display:flex;flex-shrink:0;height:52px;justify-content:center;width:52px}.document-info h3{color:#111827;font-size:16px;font-weight:600;margin-bottom:6px}.document-info p{color:#6b7280;font-size:13px;margin-bottom:6px}.document-info span{color:#64748b;font-size:13px}.document-bottom{align-items:center;border-top:1px solid #f1f5f9;display:flex;justify-content:space-between;margin-top:18px;padding-top:14px}.document-bottom span{color:#6b7280;font-size:13px}.document-actions{display:flex;gap:8px}.document-actions button{background:#f8fafc;border:none;border-radius:10px;color:#475569;cursor:pointer;height:34px;width:34px}.document-actions button:hover{background:#eff6ff;color:#2563eb}.document-actions .delete:hover{background:#fee2e2;color:#dc2626}.document-modal-content{display:flex;flex-direction:column;gap:16px;margin-top:20px}@media (max-width:768px){.documents-header{align-items:flex-start;flex-direction:column;gap:14px}.documents-grid{grid-template-columns:1fr}}.letter-btn{align-items:center;background:#eff6ff;border:none;border-radius:10px;color:#2563eb;cursor:pointer;display:flex;height:36px;justify-content:center;width:36px}.salary-grid{grid-gap:12px;display:grid;gap:12px;grid-column:1/-1;grid-template-columns:repeat(2,1fr)}.full-width{grid-column:1/-1}.salary-row{grid-gap:12px;display:grid;gap:12px;grid-template-columns:2fr 1fr 1fr auto;margin-bottom:12px;width:100%}.file-input{background:#0000!important;border:none!important;height:auto!important;padding:0!important;width:auto!important}.file-upload-wrapper{background:#fafafa;border:1px dashed #d9d9d9;border-radius:12px;padding:20px}.document-select{border:1px solid #d9d9d9;border-radius:12px;height:48px;margin-bottom:16px;padding:12px;width:250px}.documents-modal{max-width:700px}.document-section{display:flex;flex-direction:column;gap:20px;margin-top:24px}.employee-doc-header span{color:#777;font-size:13px}.employee-doc-header h4{font-size:22px;font-weight:600;margin-top:6px}.documents-modal .modal-header button{height:48px;min-width:48px;width:48px}.profile-section{margin-bottom:28px}.profile-section h4{border-bottom:1px solid #e5e7eb;color:#2563eb;font-size:18px;font-weight:600;margin-bottom:12px;padding-bottom:8px}.profile-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.profile-grid div{display:flex;flex-direction:column}.profile-grid label{color:#6b7280;font-size:12px;margin-bottom:4px}.profile-grid span{color:#111827;font-size:15px;font-weight:500}.documents-list h4{margin-bottom:12px}.document-item{background:#fafafa;margin-bottom:10px}.view-doc-btn{padding:8px 14px}.documents-list{margin-top:24px}.document-item{align-items:center;border:1px solid #e5e7eb;border-radius:10px;display:flex;justify-content:space-between;margin-top:10px;padding:12px}.view-doc-btn{background:#2563eb;border:none;border-radius:8px;color:#fff;cursor:pointer;padding:8px 16px}.save-btn{font-weight:600;height:48px;width:220px}.settings-container{background:#f8fafc;flex:1 1;min-height:100vh;overflow-y:auto;padding:20px}.settings-header{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;margin-bottom:20px}.settings-title{color:#1e293b;font-size:24px;font-weight:600;margin:0}.settings-subtitle{color:#64748b;font-size:13px;margin-top:6px}.settings-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:2fr 1fr}.settings-notification-section{display:flex;flex-direction:column;gap:20px}.settings-bottom-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(3,1fr);margin-top:20px}@media (max-width:1024px){.settings-bottom-grid,.settings-grid{grid-template-columns:1fr}}@media (max-width:768px){.settings-header{align-items:flex-start;flex-direction:column}}.profile-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 2px 8px #0000000d;padding:20px}.profile-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.profile-title{color:#1e293b;font-size:20px;font-weight:600}.profile-subtitle{color:#64748b;font-size:13px;margin-top:6px}.camera-btn,.edit-btn{align-items:center;background:#f1f5f9;border:none;border-radius:12px;cursor:pointer;display:flex;height:38px;justify-content:center;width:38px}.camera-btn:hover,.edit-btn:hover{background:#e2e8f0}.profile-content{align-items:flex-start;display:flex;gap:32px}.profile-avatar-section{align-items:center;display:flex;flex-direction:column;min-width:110px}.profile-avatar{align-items:center;background:linear-gradient(135deg,#1e6bd6,#2bb7da);border-radius:50%;color:#fff;display:flex;font-size:22px;font-weight:600;height:80px;justify-content:center;width:80px}.camera-btn{margin-top:12px}.profile-form-grid{grid-gap:16px;display:grid;flex:1 1;gap:16px;grid-template-columns:repeat(2,1fr)}.profile-label{color:#334155;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.input-wrapper{position:relative}.input-icon{left:12px;position:absolute;top:50%;transform:translateY(-50%)}.profile-input{border:1px solid #cbd5e1;border-radius:12px;font-size:14px;height:42px;outline:none;padding:0 16px 0 40px;width:100%}.input-disabled{background:#e2e8f0;color:#64748b;cursor:not-allowed}.button-row{display:flex;gap:12px;justify-content:flex-end;margin-top:20px}.discard-btn{background:#fff;border:1px solid #cbd5e1;border-radius:12px}.discard-btn,.save-btn{cursor:pointer;padding:10px 20px}.save-btn{background:linear-gradient(135deg,#1e6bd6,#2bb7da);border:none;border-radius:12px;color:#fff}@media(max-width:768px){.profile-content{flex-direction:column}.profile-form-grid{grid-template-columns:1fr}}.notifications-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 2px 8px #0000000d;padding:20px}.notifications-header{align-items:center;display:flex;gap:14px;margin-bottom:20px}.notifications-icon-box{align-items:center;background:#f8fafc;border-radius:12px;display:flex;height:42px;justify-content:center;width:42px}.notifications-title{color:#1e293b;font-size:16px;font-weight:600}.notifications-subtitle{color:#64748b;font-size:12px;margin-top:4px}.toggle-row{align-items:center;border-bottom:1px solid #f1f5f9;display:flex;justify-content:space-between;padding:14px 0}.toggle-row:last-child{border-bottom:none}.toggle-left{align-items:center;display:flex;gap:12px}.toggle-icon{color:#64748b}.toggle-title{color:#334155;font-size:14px;font-weight:500}.toggle-switch{background:#475569;border-radius:999px;cursor:pointer;height:24px;position:relative;transition:.3s;width:44px}.toggle-active{background:linear-gradient(135deg,#1e6bd6,#2bb7da)}.toggle-dot{background:#fff;border-radius:50%;height:16px;position:absolute;top:4px;transition:.3s;width:16px}.dot-left{left:4px}.dot-right{right:4px}.security-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 2px 8px #0000000d;padding:20px}.security-header{align-items:center;display:flex;gap:14px;margin-bottom:20px}.security-header-icon{align-items:center;background:#d1fae5;border-radius:12px;display:flex;height:42px;justify-content:center;width:42px}.security-title{color:#1e293b;font-size:16px;font-weight:600}.security-subtitle{color:#64748b;font-size:12px;margin-top:4px}.security-item{align-items:center;background:#fff;border:none;border-radius:14px;cursor:pointer;display:flex;gap:12px;margin-bottom:10px;padding:14px;transition:.25s;width:100%}.security-item:hover{background:#f8fafc}.security-item-icon{color:#64748b}.security-item-title{color:#334155;font-size:14px;font-weight:500}.modal-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0006;display:flex;inset:0;justify-content:center;padding:20px;position:fixed;z-index:1000}.modal-box{background:#fff;border-radius:20px;box-shadow:0 20px 50px #00000026;max-width:420px;padding:24px;width:100%}.modal-box h2,.modal-header h2{color:#0f172a;font-size:20px;font-weight:600}.modal-header p,.modal-subtext{color:#64748b;font-size:14px;margin-top:8px}.modal-form{display:flex;flex-direction:column;gap:14px;margin-top:20px}.form-group{margin-top:18px}.form-group label{color:#334155;display:block;font-size:14px;font-weight:500;margin-bottom:8px}.modal-input{background:#f8fafc;border:1px solid #d1d5db;border-radius:14px;font-size:14px;outline:none;padding:14px 16px;transition:.25s;width:100%}.modal-input:focus{background:#fff;border-color:#2563eb}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.cancel-btn{border:1px solid #d1d5db;border-radius:12px;padding:10px 18px}.primary-btn{background:linear-gradient(135deg,#2563eb,#06b6d4)}.primary-btn,.verify-btn{border:none;border-radius:12px;color:#fff;cursor:pointer;padding:10px 18px}.verify-btn{background:linear-gradient(135deg,#16a34a,#10b981)}.role-tabs{background:#fff;border:1px solid #e2e8f0;border-radius:18px;display:inline-flex;gap:10px;padding:8px}.role-btn{align-items:center;background:#0000;border:none;border-radius:12px;color:#334155;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:8px;padding:10px 18px;transition:.25s}.role-btn:hover{background:#e2e8f0;color:#000}.active-role{background:linear-gradient(135deg,#1e6bd6,#2bb7da);color:#fff}.active-role:hover{opacity:.95}.roles-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 2px 8px #0000000d;display:flex;flex-direction:column;height:100%;padding:20px}.roles-header{gap:14px;margin-bottom:20px}.roles-header,.roles-icon-box{align-items:center;display:flex}.roles-icon-box{background:#ede9fe;border-radius:12px;height:42px;justify-content:center;width:42px}.roles-title{color:#1e293b;font-size:16px;font-weight:600}.roles-subtitle{color:#64748b;font-size:12px;margin-top:4px}.role-item{align-items:center;border-bottom:1px solid #f1f5f9;display:flex;justify-content:space-between;padding:14px 0}.role-item:last-child{border-bottom:none}.role-item-left{align-items:center;display:flex;gap:12px}.role-item-title{color:#334155;font-size:14px;font-weight:500}.role-item-subtitle{color:#64748b;font-size:12px;margin-top:3px}.payroll-page{background:#f8fafc;flex:1 1;overflow-y:auto;padding:24px}.payroll-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:28px}.payroll-title{color:#0f172a;font-size:28px;font-weight:700}.payroll-subtitle{color:#64748b;font-size:14px;margin-top:6px}.payroll-actions{display:flex;gap:12px}.gradient-btn{align-items:center;background:linear-gradient(135deg,#1e6bd6,#2bb7da);border:none;border-radius:14px;color:#fff;cursor:pointer;display:flex;font-size:14px;gap:8px;padding:12px 18px;transition:.25s}.gradient-btn:hover{opacity:.92}.payroll-grid{grid-gap:18px;display:grid;gap:18px;grid-template-columns:repeat(4,1fr)}.payroll-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:0 4px 12px #0000000a;min-height:130px;padding:18px 20px}.card-content,.payroll-card{align-items:center;display:flex}.card-content{gap:16px;width:100%}.icon-box{align-items:center;border-radius:16px;display:flex;height:60px;justify-content:center;min-width:60px;width:60px}.indigo{background:#e0e7ff}.green{background:#d1fae5}.red{background:#fee2e2}.amber{background:#fef3c7}.card-label{color:#64748b;font-size:14px}.card-value{color:#0f172a;font-size:20px;font-weight:700;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.popup-overlay{align-items:center;background:#0006;display:flex;inset:0;justify-content:center;position:fixed;z-index:999}.popup-box{background:#fff;border-radius:24px;box-shadow:0 20px 50px #0000002e;max-width:540px;padding:28px;width:100%}.popup-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:24px}.popup-header h2{color:#0f172a;font-size:20px;font-weight:600}.popup-header p{color:#64748b;font-size:13px;margin-top:6px}.close-btn{background:#0000;border:none;border-radius:10px;cursor:pointer;padding:8px;transition:.25s}.close-btn:hover{background:#f1f5f9}.popup-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:28px}.popup-input{border:1px solid #cbd5e1;border-radius:14px;font-size:14px;outline:none;padding:14px 16px;transition:.25s;width:100%}.popup-input:focus{border-color:#2563eb}.popup-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:28px}.cancel-btn{background:#fff;border:1px solid #cbd5e1;border-radius:14px;cursor:pointer;font-size:14px;padding:11px 18px;transition:.25s}.cancel-btn:hover{background:#f8fafc}.history-card{background:#fff;border:1px solid #e2e8f0;border-radius:24px;box-shadow:0 4px 12px #0000000a;margin-top:28px;padding:28px}.history-title{color:#0f172a;font-size:22px;font-weight:700;margin-bottom:22px}.history-table{border-collapse:collapse;width:100%}.history-table th{color:#64748b;font-weight:600;padding:16px;text-align:left}.history-table td,.history-table th{border-bottom:1px solid #e2e8f0;font-size:15px}.history-table td{color:#0f172a;padding:20px 16px}.payroll-id{color:#4f46e5;font-weight:600}.deduction{color:#ef4444}.netpay{font-weight:700}.status-badge{background:#dcfce7;border-radius:999px;color:#047857;display:inline-flex;font-size:14px;font-weight:600;padding:8px 16px}.status-badge,.upload-overlay{align-items:center;justify-content:center}.upload-overlay{background:#0006;display:flex;inset:0;position:fixed;z-index:999}.upload-modal{background:#fff;border-radius:24px;box-shadow:0 20px 50px #0000002e;padding:26px;position:relative;text-align:center;width:340px}.upload-close{align-items:center;background:#f1f5f9;border:none;border-radius:50%;cursor:pointer;display:flex;height:34px;justify-content:center;position:absolute;right:14px;top:14px;transition:.25s;width:34px}.upload-close:hover{background:#e2e8f0}.upload-icon{align-items:center;background:linear-gradient(135deg,#1e6bd6,#2bb7da);border-radius:18px;color:#fff;display:flex;font-size:26px;height:58px;justify-content:center;margin:0 auto 14px;width:58px}.upload-modal h2{color:#0f172a;font-size:20px;font-weight:700;margin:0}.upload-modal p{color:#64748b;font-size:13px;line-height:1.5;margin:10px 0 20px}.upload-dropzone{align-items:center;background:#f8fafc;border:2px dashed #cbd5e1;border-radius:16px;cursor:pointer;display:flex;justify-content:center;margin-bottom:18px;min-height:95px;transition:.25s}.upload-dropzone:hover{background:#eff6ff;border-color:#1e6bd6}.upload-dropzone span{color:#334155;font-size:14px;font-weight:500}.upload-submit-btn{background:linear-gradient(135deg,#1e6bd6,#2bb7da);border:none;border-radius:14px;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:12px 16px;transition:.25s;width:100%}.upload-submit-btn:hover{opacity:.95}@media(max-width:900px){.history-card{overflow-x:auto}.history-table{min-width:850px}}@media(max-width:768px){.payroll-header{align-items:flex-start;flex-direction:column;gap:18px}.payroll-actions{flex-wrap:wrap;width:100%}.popup-grid{grid-template-columns:1fr}}.attendance-page{display:flex;flex-direction:column;gap:22px;max-width:1400px}.attendance-error{color:#dc2626;font-weight:600;margin:0}.attendance-page-header h1{color:#0f172a;font-size:30px;font-weight:700;letter-spacing:-.02em}.attendance-page-header p{color:#64748b;font-size:15px;margin-top:6px}.attendance-stats{grid-gap:18px;display:grid;gap:18px;grid-template-columns:repeat(4,minmax(0,1fr))}.attendance-stat-card{align-items:center;background:#fff;border:1px solid #e8edf4;border-radius:14px;box-shadow:0 1px 2px #0f172a0a;display:flex;gap:16px;padding:20px 22px}.attendance-stat-icon{align-items:center;border-radius:12px;display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}.attendance-stat-icon.present{background:#ecfdf5;color:#10b981}.attendance-stat-icon.absent{background:#fef2f2;color:#ef4444}.attendance-stat-icon.half-day{background:#fff7ed;color:#f59e0b}.attendance-stat-icon.late{background:#eff6ff;color:#3b82f6}.attendance-stat-label{color:#64748b;display:block;font-size:14px;font-weight:500}.attendance-stat-body strong{color:#0f172a;display:block;font-size:30px;font-weight:700;line-height:1;margin-top:6px}.attendance-calendar-card,.attendance-table-card{padding:24px 28px}.attendance-calendar-card,.attendance-mark-card,.attendance-table-card{background:#fff;border:1px solid #e8edf4;border-radius:14px;box-shadow:0 1px 2px #0f172a0a}.attendance-mark-card{padding:20px 24px}.attendance-mark-card h2{color:#111827;font-size:18px;margin:0 0 12px}.attendance-mark-form{grid-gap:10px;display:grid;gap:10px;grid-template-columns:repeat(6,minmax(0,1fr))}.attendance-mark-form input,.attendance-mark-form select{border:1px solid #dbe4ef;border-radius:10px;font-size:14px;min-height:42px;padding:10px 12px}.attendance-mark-form button{background:#2563eb;border:none;border-radius:10px;color:#fff;cursor:pointer;font-weight:600;min-height:42px}.attendance-save-msg{color:#2563eb;font-size:14px;margin-top:10px}.calendar-toolbar{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.calendar-toolbar h2{color:#0f172a;font-size:18px;font-weight:700}.calendar-nav{display:flex;gap:6px}.calendar-nav button{align-items:center;background:#fff;border:1px solid #e2e8f0;border-radius:8px;color:#475569;cursor:pointer;display:flex;height:34px;justify-content:center;width:34px}.calendar-nav button:hover{background:#f8fafc}.calendar-days,.calendar-weekdays{grid-gap:6px;display:grid;gap:6px;grid-template-columns:repeat(7,1fr)}.calendar-weekdays span{color:#94a3b8;font-size:13px;font-weight:600;padding:4px 0 10px;text-align:center}.calendar-day{align-items:center;background:#fff;border:1px solid #0000;border-radius:10px;color:#334155;display:flex;font-size:14px;font-weight:600;justify-content:center;min-height:52px}.calendar-day.empty{background:#0000}.calendar-day.neutral{background:#fff;color:#475569;font-weight:500}.calendar-day.present{background:#dcfce7;color:#15803d}.calendar-day.absent{background:#fee2e2;color:#b91c1c}.calendar-day.half-day{background:#ffedd5;color:#c2410c}.calendar-day.late{background:#dbeafe;color:#1d4ed8}.calendar-day.today{border-color:#6366f1;box-shadow:0 0 0 2px #6366f1;font-weight:700;position:relative;z-index:1}.calendar-legend{border-top:1px solid #f1f5f9;display:flex;flex-wrap:wrap;gap:20px;margin-top:22px;padding-top:18px}.calendar-legend span{align-items:center;color:#64748b;display:inline-flex;font-size:13px;font-weight:500;gap:8px}.legend-dot{border-radius:50%;display:inline-block;height:10px;width:10px}.legend-dot.present{background:#22c55e}.legend-dot.absent{background:#ef4444}.legend-dot.half-day{background:#f59e0b}.legend-dot.late{background:#3b82f6}.attendance-table-card h2{color:#0f172a;font-size:18px;font-weight:700;margin-bottom:18px}.attendance-table-wrap{overflow-x:auto}.attendance-table{border-collapse:collapse;width:100%}.attendance-table th{border-bottom:1px solid #f1f5f9;color:#94a3b8;font-size:13px;font-weight:600;padding:12px 16px 14px 0;text-align:left}.attendance-table th:last-child{padding-right:0}.attendance-table td{border-bottom:1px solid #f8fafc;color:#334155;font-size:14px;padding:18px 16px 18px 0;vertical-align:middle}.attendance-table td:last-child{padding-right:0}.attendance-table tbody tr:last-child td{border-bottom:none}.attendance-empty{color:#94a3b8;text-align:center}.employee-cell{align-items:center;display:flex;gap:12px}.employee-avatar{align-items:center;background:#ede9fe;border-radius:50%;color:#7c3aed;display:flex;flex-shrink:0;font-size:13px;font-weight:700;height:38px;justify-content:center;width:38px}.employee-name{color:#0f172a;font-weight:600}.muted-cell{color:#64748b}.status-text{font-size:14px;font-weight:600}.status-text-present{color:#16a34a}.status-text-absent{color:#dc2626}.status-text-half-day{color:#ea580c}.status-text-late{color:#2563eb}@media (max-width:1100px){.attendance-mark-form,.attendance-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.attendance-mark-form,.attendance-stats{grid-template-columns:1fr}.calendar-day{font-size:12px;min-height:40px}}.leave-page{display:flex;flex-direction:column;gap:20px}.leave-error{color:#dc2626;margin:0}.leave-message{color:#2563eb;margin:0}.leave-summary-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(4,minmax(0,1fr))}.leave-card,.leave-summary-card{background:#fff;border:1px solid #e8edf4;border-radius:14px;box-shadow:0 1px 2px #0f172a0a}.leave-summary-card{align-items:center;display:flex;gap:12px;padding:18px}.leave-summary-card h3{font-size:32px;margin:0}.leave-summary-card p{color:#64748b;font-size:13px;margin:4px 0 0}.leave-icon{align-items:center;border-radius:12px;display:flex;height:44px;justify-content:center;width:44px}.leave-icon.blue{background:#eff6ff;color:#2563eb}.leave-icon.green{background:#ecfdf5;color:#16a34a}.leave-icon.amber{background:#fff7ed;color:#d97706}.leave-icon.purple{background:#f5f3ff;color:#7c3aed}.leave-layout-grid{grid-gap:16px;display:grid;gap:16px;grid-template-columns:2fr 1.2fr}.leave-card{padding:18px 20px}.leave-card h3{align-items:center;display:flex;gap:8px;margin:0 0 12px}.leave-request-form{grid-gap:10px;display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}.balance-editor input,.balance-editor select,.leave-request-form input,.leave-request-form select{border:1px solid #dbe4ef;border-radius:10px;min-height:42px;padding:10px 12px}.balance-editor button,.cancel-btn,.leave-request-form button{background:#2563eb;border:none;border-radius:10px;color:#fff;cursor:pointer;font-weight:600;min-height:42px}.leave-list{display:flex;flex-direction:column;gap:10px}.leave-list-item{align-items:center;border:1px solid #f1f5f9;border-radius:10px;display:flex;justify-content:space-between;padding:10px 12px}.leave-list-item p{color:#64748b;font-size:13px;margin:2px 0 0}.leave-table{border-collapse:collapse;width:100%}.leave-table th{border-bottom:1px solid #f1f5f9;color:#64748b;font-size:13px;padding:10px 8px 12px 0;text-align:left}.leave-table td{border-bottom:1px solid #f8fafc;font-size:14px;padding:12px 8px 12px 0}.leave-status{border-radius:999px;display:inline-block;font-size:12px;font-weight:600;padding:4px 10px}.leave-status.approved{background:#dcfce7;color:#15803d}.leave-status.pending{background:#fef3c7;color:#b45309}.leave-status.rejected{background:#fee2e2;color:#b91c1c}.leave-status.cancelled{background:#e2e8f0;color:#334155}.leave-actions{display:flex;gap:8px}.approve-btn,.reject-btn{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;height:30px;justify-content:center;width:30px}.approve-btn{background:#dcfce7;color:#15803d}.reject-btn{background:#fee2e2;color:#b91c1c}.cancel-btn{background:#e2e8f0;color:#334155;min-height:30px;padding:0 10px}.balance-editor{display:flex;flex-direction:column;gap:10px}.balance-row{grid-gap:10px;align-items:center;display:grid;gap:10px;grid-template-columns:60px 1fr 1fr}.leave-balance-item{border-bottom:1px solid #f1f5f9;display:flex;justify-content:space-between;padding:10px 0}.leave-empty{color:#94a3b8;text-align:center}@media (max-width:1200px){.leave-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.leave-layout-grid{grid-template-columns:1fr}}@media (max-width:760px){.leave-request-form,.leave-summary-grid{grid-template-columns:1fr}}
/*# sourceMappingURL=main.99b72e77.css.map*/