.login-container{background:linear-gradient(135deg,#1e3a5f 0%,#036 100%);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-box{background:#fff;border-radius:16px;width:100%;max-width:400px;padding:40px;box-shadow:0 20px 60px #0000004d}.login-header{text-align:center;margin-bottom:32px}.login-header h1{color:#333;margin:0 0 8px;font-size:28px;font-weight:700}.login-header p{color:#666;margin:0;font-size:14px}.login-form{flex-direction:column;gap:20px;display:flex}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:#444;font-size:14px;font-weight:600}.form-group input{border:2px solid #e0e0e0;border-radius:8px;outline:none;padding:14px 16px;font-size:15px;transition:all .3s}.form-group input:focus{border-color:#1e3a5f;box-shadow:0 0 0 3px #1e3a5f1a}.form-group input::placeholder{color:#aaa}.login-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#1e3a5f 0%,#036 100%);border:none;border-radius:8px;margin-top:8px;padding:14px;font-size:16px;font-weight:600;transition:all .3s}.login-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #1e3a5f66}.login-button:disabled{opacity:.6;cursor:not-allowed}.login-footer{text-align:center;border-top:1px solid #eee;margin-top:24px;padding-top:20px}.login-footer p{color:#888;margin:0;font-size:12px}.dashboard{background:#f5f7fa;min-height:100vh;display:flex}.dashboard .sidebar{color:#fff;background:linear-gradient(135deg,#1e3a5f 0%,#036 100%);flex-direction:column;width:260px;padding:24px 0;display:flex}.dashboard .sidebar h2{text-align:center;margin-bottom:32px;padding:0 16px;font-size:22px}.dashboard .sidebar nav{flex-direction:column;gap:8px;padding:0 12px;display:flex}.dashboard .sidebar nav button{color:#fff;cursor:pointer;text-align:left;background:#ffffff1a;border:none;border-radius:10px;padding:14px 20px;font-size:15px;transition:all .3s}.dashboard .sidebar nav button:hover{background:#fff3;transform:translate(4px)}.dashboard .sidebar nav button.active{color:#667eea;background:#fff;font-weight:600}.dashboard .sidebar nav button.logout-btn{background:#ff64644d;margin-top:auto}.dashboard .sidebar nav button.logout-btn:hover{background:#ff646480}.dashboard .main-content{flex:1;padding:32px;overflow-y:auto}.card{background:#fff;border-radius:12px;margin-bottom:24px;padding:24px;box-shadow:0 2px 8px #00000014}.card h3{color:#333;margin:0 0 20px;font-size:18px}.card h4{color:#555;margin:0 0 12px;font-size:15px}.form-row{flex-wrap:wrap;gap:12px;display:flex}.form-row input{border:2px solid #e0e0e0;border-radius:8px;flex:1;min-width:150px;padding:12px 16px;font-size:14px;transition:border-color .3s}.form-row input:focus{border-color:#667eea;outline:none}.btn-primary{color:#fff;cursor:pointer;background:linear-gradient(135deg,#1e3a5f 0%,#036 100%);border:none;border-radius:8px;padding:12px 24px;font-weight:600;transition:transform .2s,box-shadow .2s}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-secondary{color:#666;cursor:pointer;background:#e0e0e0;border:none;border-radius:6px;margin-left:8px;padding:8px 16px}.btn-success{color:#fff;cursor:pointer;background:#28a745;border:none;border-radius:6px;padding:8px 16px}.btn-edit{color:#333;cursor:pointer;background:#ffc107;border:none;border-radius:6px;padding:6px 12px;font-size:13px}table{border-collapse:collapse;width:100%;margin-top:16px}table th{text-align:left;color:#555;background:#f8f9fa;border-bottom:2px solid #e0e0e0;padding:14px 12px;font-weight:600}table td{border-bottom:1px solid #eee;padding:12px}table tbody tr:hover{background:#f8f9fa}table input{border:1px solid #ddd;border-radius:4px;width:100%;padding:8px}.role-badge{text-transform:uppercase;border-radius:20px;padding:4px 10px;font-size:12px;font-weight:600}.role-badge.admin{color:#fff;background:#667eea}.role-badge.user{color:#fff;background:#28a745}.upload-section .card{max-width:600px}.upload-section p{color:#666;margin-bottom:20px}.upload-area{text-align:center;background:#fafafa;border:2px dashed #ccc;border-radius:12px;padding:40px}.upload-area input[type=file]{display:none}.upload-label{color:#fff;cursor:pointer;background:#667eea;border-radius:8px;padding:14px 32px;font-weight:600;transition:transform .2s;display:inline-block}.upload-label:hover{transform:translateY(-2px)}.upload-area .status{margin-top:16px;font-weight:600}.upload-area .status.success{color:#28a745}.upload-area .status.error{color:#dc3545}.upload-card{max-width:600px}.upload-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.upload-header h3{margin:0;font-size:20px}.upload-month-year{color:#fff;background:linear-gradient(135deg,#1e3a5f 0%,#036 100%);border-radius:20px;padding:8px 16px;font-size:14px;font-weight:600}.upload-card>p{color:#666;margin-bottom:20px}.upload-form{gap:16px;margin-bottom:20px;display:flex}.upload-select-group{flex:1}.upload-select-group label{color:#555;margin-bottom:8px;font-size:14px;font-weight:500;display:block}.upload-select-group select{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px 16px;font-size:15px;transition:border-color .3s}.upload-select-group select:focus{border-color:#667eea;outline:none}.month-selector{background:#fff;border-radius:12px;align-items:center;gap:12px;margin-bottom:20px;padding:16px 20px;display:flex;box-shadow:0 2px 8px #00000014}.month-selector label{color:#333;font-size:15px;font-weight:600}.month-selector select{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:8px;min-width:180px;padding:10px 16px;font-size:15px;transition:border-color .3s}.month-selector select:focus{border-color:#667eea;outline:none}.upload-section ul{color:#666;padding-left:20px}.upload-section li{margin-bottom:8px}.user-dashboard .summary-cards{grid-template-columns:repeat(5,1fr);gap:24px;margin-bottom:24px;display:grid}.user-dashboard .summary-card{text-align:center;background:#fff;border-radius:12px;padding:24px 20px;box-shadow:0 2px 8px #00000014}.user-dashboard .summary-card h4{color:#232121;margin:0;font-size:14px;font-weight:600}.user-dashboard .summary-card .summary-value{color:#1e3a5f;margin:16px 0 0;font-size:36px;font-weight:700}.user-dashboard .summary-card.late{border-left:4px solid pink}.user-dashboard .summary-card.no-data{border-left:4px solid #ffd966}.user-dashboard .summary-card.holiday{border-left:4px solid #667eea}.user-dashboard .summary-card.extra-leaves{border-left:4px solid #dc3545}.user-dashboard .summary-card.half-days{background:#fffbf0;border-left:4px solid #ffc107}.user-dashboard .summary-card.half-days h4,.user-dashboard .summary-card.half-days .summary-value{color:#856404}.user-dashboard .summary-card.late-marks{background:#fff0f5;border-left:4px solid #ff69b4}.user-dashboard .summary-card.late-marks h4,.user-dashboard .summary-card.late-marks .summary-value{color:#c71585}.user-dashboard .summary-card.extra-leaves-taken{border-left:4px solid #fd7e14}.user-dashboard .summary-card.extra-leaves-taken h4{color:#0d0c0b}.user-dashboard .summary-card.extra-leaves-taken .summary-value{color:#060605}.user-dashboard .summary-card.paid-leaves{border-left:4px solid #e29cef}.user-dashboard .summary-card.pending-minutes{background-color:#fff3e0;border-left:4px solid #ff5722}.user-dashboard .summary-card.pending-minutes .summary-value{color:#e64a19;font-size:1.8rem}.user-dashboard .summary-card.pending-minutes .summary-detail{color:#666;margin-top:4px;font-size:.75rem}.user-dashboard .summary-card.extra-minutes{background-color:#e8f5e9;border-left:4px solid #4caf50}.user-dashboard .summary-card.extra-minutes .summary-value{color:#2e7d32;font-size:1.8rem}.user-dashboard .summary-card.extra-minutes .summary-detail{color:#666;margin-top:4px;font-size:.75rem}.user-dashboard .summary-card.final-pending{background-color:#e3f2fd;border-left:4px solid #2196f3}.user-dashboard .summary-card.final-pending .summary-value{color:#1565c0;font-size:1.8rem}.user-dashboard .summary-card.final-pending .summary-detail{color:#666;margin-top:4px;font-size:.75rem}.paid-leaves-input-card{color:#fff;background:#00000014}.paid-leaves-input-card h3{color:#fff}.paid-leaves-form{flex-wrap:wrap;align-items:flex-end;gap:20px;display:flex}.paid-leaves-form .form-group{flex-direction:column;gap:8px;display:flex}.paid-leaves-form .form-group label{opacity:.9;font-size:14px;font-weight:500}.paid-leaves-form .form-group .value{font-size:24px;font-weight:700}.paid-leaves-form .form-group input{border:none;border-radius:8px;width:120px;padding:10px 16px;font-size:16px}.paid-leaves-form .save-btn{color:#667eea;cursor:pointer;background:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:16px;font-weight:600;transition:all .3s}.paid-leaves-form .save-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.paid-leaves-card{color:#333;background:#fff;border:1px solid #ddd}.paid-leaves-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.paid-leaves-header h3{color:#1e3a5f;margin:0}.paid-leaves-year{color:#fff;background:#1e3a5f;border-radius:20px;padding:8px 16px;font-weight:600}.paid-leaves-description{color:#666;margin-bottom:24px;line-height:1.5}.paid-leaves-form{margin-bottom:24px}.paid-leaves-select-group{flex-direction:column;gap:8px;display:flex}.paid-leaves-select-group label{color:#333;font-weight:500}.paid-leaves-select-group select{border:none;border-radius:8px;width:200px;padding:10px 16px;font-size:16px}.paid-leaves-users h4{color:#1e3a5f;margin-bottom:16px}.paid-leaves-users table{background:#f8f9fa;border:1px solid #ddd;border-radius:8px;width:100%;overflow:hidden}.paid-leaves-users th,.paid-leaves-users td{text-align:left;color:#333;padding:12px 16px}.paid-leaves-users th{background:#e9ecef;font-weight:600}.paid-leaves-users td input{border:1px solid #ccc;border-radius:4px;width:80px;padding:8px 12px;font-size:14px}.paid-leaves-users .btn-small{color:#fff;cursor:pointer;background:#1e3a5f;border:none;border-radius:4px;padding:6px 16px;font-weight:600;transition:all .3s}.paid-leaves-users .btn-small:hover{transform:translateY(-1px);box-shadow:0 2px 8px #0003}.dashboard .sidebar nav button.nav-btn{margin-top:auto}.loading{text-align:center;color:#666;padding:60px;font-size:18px}.no-data-message{text-align:center;color:#999;padding:40px;font-size:16px}.table-container{overflow-x:auto}.attendance-table{border-collapse:collapse;width:100%}.attendance-table th,.attendance-table td{white-space:nowrap;border-bottom:1px solid #e0e0e0;padding:14px 12px;font-size:16px}.attendance-table th{color:#fff;text-align:left;background:#1e3a5f;font-weight:600}.attendance-table tr:hover{background:#f5f5f5}.attendance-table .punches{text-overflow:ellipsis;max-width:200px;font-size:14px;overflow:hidden}.attendance-table .working-mins{text-align:center;font-size:16px;font-weight:600}.attendance-table .late-mark,.attendance-table .status-cell{text-align:center;font-size:15px;font-weight:600}.legend-card{max-width:500px}.legend{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;display:grid}.legend-item{color:#555;align-items:center;gap:8px;font-size:13px;display:flex}.legend-item .color-box{border:1px solid #ddd;border-radius:4px;width:24px;height:24px}.users-section .card{max-width:100%}@media (width<=768px){.dashboard{flex-direction:column}.dashboard .sidebar{width:100%;padding:16px 0}.dashboard .sidebar nav{flex-direction:row;padding:0 12px;overflow-x:auto}.dashboard .sidebar nav button{flex-shrink:0}.form-row{flex-direction:column}.form-row input{width:100%}}.holiday-form select{background:#fff;border:2px solid #e0e0e0;border-radius:8px;padding:10px 14px;font-size:14px}.add-holiday-form{flex-wrap:wrap;gap:12px;margin-bottom:24px;display:flex}.add-holiday-form input{border:2px solid #e0e0e0;border-radius:8px;padding:10px 14px;font-size:14px}.add-holiday-form select{background:#fff;border:2px solid #e0e0e0;border-radius:8px;padding:10px 14px;font-size:14px}.btn-delete{color:#fff;cursor:pointer;background:#dc3545;border:none;border-radius:6px;padding:6px 12px;font-size:13px}.btn-delete:hover{background:#c82333}.holidays-list{margin-top:24px}.holidays-list h4{color:#333;margin-bottom:12px}.holiday-card{max-width:600px}.holiday-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.holiday-header h3{margin:0;font-size:20px}.holiday-month-year{color:#fff;background:linear-gradient(135deg,#1e3a5f 0%,#036 100%);border-radius:20px;padding:8px 16px;font-size:14px;font-weight:600}.holiday-card .holiday-description{color:#666;margin-bottom:24px;line-height:1.5}.holiday-form{gap:16px;margin-bottom:24px;display:flex}.holiday-select-group{flex:1}.holiday-select-group label{color:#555;margin-bottom:8px;font-size:14px;font-weight:500;display:block}.holiday-select-group select{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px 16px;font-size:15px;transition:border-color .3s}.holiday-select-group select:focus{border-color:#667eea;outline:none}.holiday-counts{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px;display:grid}.holiday-input-group{text-align:center;background:#f8f9fa;border-radius:12px;padding:20px;transition:transform .2s,box-shadow .2s}.holiday-input-group:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.holiday-input-group .input-icon{margin-bottom:8px;font-size:32px}.holiday-input-group.saturday{border-bottom:4px solid #667eea}.holiday-input-group.sunday{border-bottom:4px solid #28a745}.holiday-input-group.holiday{border-bottom:4px solid #ffc107}.holiday-input-group label{color:#555;margin-bottom:10px;font-size:13px;font-weight:500;display:block}.holiday-input-group input{text-align:center;border:2px solid #e0e0e0;border-radius:8px;width:80px;padding:10px;font-size:18px;font-weight:600;transition:border-color .3s}.holiday-input-group input:focus{border-color:#667eea;outline:none}.holiday-summary{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:20px;padding:16px 20px;display:flex}.holiday-summary .summary-label{font-weight:500}.holiday-summary .summary-value{font-size:24px;font-weight:700}.holiday-card .holiday-description:last-of-type{margin-bottom:20px}.holiday-card .holiday-description:last-of-type input{border:2px solid #e0e0e0;border-radius:8px;width:100%;padding:12px 16px;font-size:14px;transition:border-color .3s}.holiday-card .holiday-description:last-of-type input:focus{border-color:#667eea;outline:none}.btn-save-holiday{width:100%;padding:14px;font-size:16px}@media (width<=768px){.holiday-form{flex-direction:column}.holiday-counts{grid-template-columns:1fr}}.user-non-working-card{color:#fff;background:linear-gradient(135deg,#1e3a5f 0%,#036 100%)}.user-non-working-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.user-non-working-header h3{color:#fff;margin:0}.user-non-working-month-year{background:#fff3;border-radius:20px;padding:8px 16px;font-weight:600}.user-non-working-description{opacity:.9;margin-bottom:24px;line-height:1.5}.user-non-working-form{flex-wrap:wrap;gap:16px;margin-bottom:24px;display:flex}.user-non-working-select-group{flex-direction:column;gap:8px;display:flex}.user-non-working-select-group label{opacity:.9;font-weight:500}.user-non-working-select-group select{border:none;border-radius:8px;min-width:180px;padding:10px 16px;font-size:16px}.user-non-working-summary{gap:16px;margin-bottom:24px;display:flex}.user-non-working-summary .summary-box{text-align:center;background:#fff3;border-radius:12px;flex:1;padding:16px}.user-non-working-summary .summary-label{opacity:.9;margin-bottom:8px;font-weight:500;display:block}.user-non-working-summary .summary-value{font-size:32px;font-weight:700}.user-non-working-days-list,.user-working-days-select{margin-bottom:24px}.user-non-working-days-list h4,.user-working-days-select h4{color:#fff;opacity:.95;margin-bottom:12px}.user-working-days-select .helper-text{opacity:.8;margin-bottom:12px;font-size:14px}.days-grid{flex-wrap:wrap;gap:8px;display:flex}.days-grid .day-tag{border-radius:8px;padding:8px 12px;font-size:14px;font-weight:500}.days-grid .day-tag.non-working{background:#ffffff40;border:1px solid #ffffff4d}.days-grid .day-btn{cursor:pointer;color:#fff;text-align:center;background:#ffffff26;border:2px solid #0000;border-radius:8px;padding:10px 14px;font-size:14px;font-weight:500;transition:all .2s}.days-grid .day-btn:hover{background:#ffffff40}.days-grid .day-btn.selected{background:#4caf50;border-color:#fff}.days-grid .day-btn small{opacity:.8;font-size:11px}.days-grid .no-data{opacity:.8;font-style:italic}.selected-dates-summary{background:#fff3;border-radius:8px;margin-bottom:16px;padding:12px 16px;font-weight:500}.selected-dates-summary.unmark{background:#4caf504d;border:1px solid #4caf50}.btn-save-non-working{width:100%;margin-top:16px;padding:14px;font-size:16px}.btn-save-non-working:disabled{opacity:.5;cursor:not-allowed}.user-non-working-card .status{text-align:center;border-radius:8px;margin-top:16px;padding:12px;font-weight:500}.user-non-working-card .status.success{background:#4caf504d}.user-non-working-card .status.error{background:#f443364d}@media (width<=768px){.user-non-working-form{flex-direction:column}.user-non-working-select-group,.user-non-working-select-group select{width:100%}.user-non-working-summary{flex-direction:column}}