*{margin:0;padding:0}.navbar{color:#fff;background:#0f172a;justify-content:space-between;align-items:center;height:60px;padding:0 24px;font-family:system-ui,-apple-system,sans-serif;display:flex}.logo{color:#fff;font-size:20px;font-weight:700;text-decoration:none}.nav-links{gap:20px;display:flex}.nav-links a{color:#cbd5f5;font-size:14px;text-decoration:none}.nav-links a.active{color:#fff;font-weight:500}.nav-links a:hover{color:#fff}.logout-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:4px;padding:6px 12px}.logout-btn:hover{background:#dc2626}.login-container{height:100vh;font-family:system-ui,-apple-system,sans-serif;display:flex}.login-left{color:#fff;background:#0f172a;flex-direction:column;flex:1;justify-content:center;padding:60px;display:flex}.login-left h1{margin-bottom:10px;font-size:52px;font-weight:700}.login-left p{margin-bottom:6px;font-size:18px}.login-left span{opacity:.7;font-size:14px}.login-right{background:#f1f5f9;flex:1;justify-content:center;align-items:center;display:flex}.login-form{flex-direction:column;gap:16px;width:320px;display:flex}.login-form h2{margin-bottom:10px}.input-group input{border:1px solid #cbd5e1;border-radius:6px;outline:none;padding:10px;transition:all .2s}.login-form button{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:6px;margin-top:8px;padding:10px;transition:all .2s}.login-form button:hover:not(:disabled){background:#1f2937}.login-form button:disabled{opacity:.6;cursor:not-allowed}.login-error{color:#dc2626;font-size:14px}.login-footer{text-align:center;font-size:14px}.login-footer a{color:#4f46e5;text-decoration:none}.login-footer a:hover{text-decoration:underline}.signup-container{height:100vh;font-family:system-ui,-apple-system,sans-serif;display:flex}.signup-left{color:#fff;background:linear-gradient(135deg,#1e293b,#0f172a);flex-direction:column;flex:1;justify-content:center;padding:60px;display:flex}.signup-left h1{margin-bottom:10px;font-size:52px}.signup-left p{font-size:18px}.signup-left span{opacity:.7;font-size:14px}.signup-right{background:#f8fafc;flex:1;justify-content:center;align-items:center;display:flex}.signup-form{flex-direction:column;gap:16px;width:320px;display:flex}.signup-form h2{margin-bottom:10px}.signup-form button{color:#fff;cursor:pointer;background:#059669;border:none;border-radius:6px;margin-top:8px;padding:10px}.signup-form button:hover:not(:disabled){background:#047857}.signup-form button:disabled{opacity:.6;cursor:not-allowed}.signup-error{color:#dc2626;font-size:14px}.signup-footer{text-align:center;font-size:14px}.signup-footer a{color:#059669;text-decoration:none}.signup-footer a:hover{text-decoration:underline}.employees-container{padding:24px;font-family:system-ui,-apple-system,sans-serif}.employees-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.employees-header h2{margin:0}.employees-filters{gap:10px;display:flex}.employees-filters input,.employees-filters select{border:1px solid #cbd5e1;border-radius:6px;outline:none;padding:8px 10px}.employees-filters input:focus,.employees-filters select:focus{border-color:#6366f1}.employees-filters button{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:6px;padding:8px 12px}.employees-filters button:disabled{opacity:.6;cursor:not-allowed}.employees-table{border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.employees-row{border-bottom:1px solid #e2e8f0;grid-template-columns:1fr 1.5fr 1fr;padding:12px;display:grid}.employees-head{background:#f1f5f9;font-weight:600}.employees-row:last-child{border-bottom:none}.employees-loading,.employees-error,.employees-empty{text-align:center;margin:20px 0}.employees-error{color:#dc2626}.employees-page-container{justify-content:center;align-items:center;gap:12px;margin-top:20px;display:flex}.employees-page-container button{color:#fff;cursor:pointer;background:#0f172a;border:none;border-radius:4px;padding:6px 12px}.employees-page-container button:disabled{opacity:.5;cursor:not-allowed}.page-number{font-weight:500}.employee-link{color:#4f46e5;font-weight:500;text-decoration:none}.employee-link:hover{text-decoration:underline}.employees-header{justify-content:space-between;align-items:center;display:flex}.employees-header-actions{align-items:center;gap:16px;display:flex}.add-employee-btn{color:#fff;background:#059669;border-radius:6px;padding:8px 14px;font-size:14px;font-weight:500;text-decoration:none}.add-employee-btn:hover{background:#047857}.each-employee-container{padding:24px;font-family:system-ui,-apple-system,sans-serif}.each-employee-header{margin-bottom:16px}.each-employee-loading,.each-employee-error{text-align:center;margin:20px 0}.each-employee-error{color:#dc2626}.each-employee-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;max-width:500px;padding:20px}.each-employee-info h2{margin-bottom:16px}.each-employee-field{margin-bottom:12px}.each-employee-field span{color:#64748b;font-size:12px}.each-employee-field p{margin:4px 0 0;font-weight:500}.each-employee-actions{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.each-employee-actions button{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:4px;padding:6px 12px}.each-employee-actions .danger{background:#dc2626}.each-employee-actions .danger:hover{background:#b91c1c}.dept-link{color:#4f46e5;align-items:center;font-size:14px;text-decoration:none;display:flex}.each-employee-edit-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;max-width:500px;padding:20px}.each-employee-form{flex-direction:column;gap:14px;display:flex}.input-group input,.input-group select{border:1px solid #cbd5e1;border-radius:6px;outline:none;padding:8px}.input-group input:focus,.input-group select:focus{border-color:#6366f1}.form-actions{gap:10px;margin-top:10px;display:flex}.form-actions button{cursor:pointer;color:#fff;background:#111827;border:none;border-radius:6px;padding:8px 14px}.form-actions .secondary{background:#64748b}.form-actions .secondary:hover{background:#475569}.create-employee-container{padding:24px;font-family:system-ui,-apple-system,sans-serif}.create-employee-header{margin-bottom:16px}.back-link{color:#4f46e5;font-size:14px;text-decoration:none}.create-employee-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;max-width:400px;padding:20px}.create-employee-card h2{margin-bottom:16px}.create-employee-form{flex-direction:column;gap:14px;display:flex}.input-group{flex-direction:column;gap:4px;display:flex}.input-group label{color:#334155;font-size:14px}.input-group input{border:1px solid #cbd5e1;border-radius:6px;outline:none;padding:8px}.input-group input:focus{border-color:#6366f1;box-shadow:0 0 0 2px #6366f133}.create-employee-form button{color:#fff;cursor:pointer;background:#059669;border:none;border-radius:6px;margin-top:8px;padding:10px}.create-employee-form button:hover:not(:disabled){background:#047857}.create-employee-form button:disabled{opacity:.6;cursor:not-allowed}.create-employee-error{color:#dc2626;margin-top:4px;font-size:14px}.account-container{padding:24px;font-family:system-ui,-apple-system,sans-serif}.account-header{margin-bottom:16px}.account-loading,.account-error{text-align:center;margin:20px 0}.account-error{color:#dc2626}.account-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;max-width:420px;padding:20px}.account-info h3{margin-bottom:14px}.account-field{margin-bottom:12px}.account-field span{color:#64748b;font-size:12px}.account-field p{margin:4px 0 0;font-weight:500}.role{text-transform:capitalize;border-radius:6px;padding:2px 8px;font-size:12px;display:inline-block}.role.admin{color:#1e40af;background:#dbeafe;margin-left:5px}.role.employee{color:#166534;background:#dcfce7;margin-left:5px}.account-actions{flex-wrap:wrap;gap:10px;margin-top:18px;display:flex}.dept-link{color:#4f46e5;font-size:14px;text-decoration:none}.edit-btn{color:#fff;background:#111827;border-radius:6px;padding:6px 12px;text-decoration:none}.edit-btn:hover{background:#1f2937}.departments-container{padding:24px;font-family:system-ui,-apple-system,sans-serif}.departments-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.create-btn{color:#fff;cursor:pointer;background:#059669;border:none;border-radius:6px;padding:8px 14px}.create-btn:hover{background:#047857}.departments-loading,.departments-error,.departments-empty{text-align:center;margin:16px 0}.departments-error{color:#dc2626}.departments-list{flex-direction:column;gap:10px;display:flex}.department-item{background:#fff;border:1px solid #e2e8f0;border-radius:6px;padding:12px}.department-form{flex-direction:column;gap:12px;max-width:300px;display:flex}.form-actions button{cursor:pointer;border:none;border-radius:6px;padding:8px 12px}.form-actions .departments-cancel-btn{color:#fff;background:#64748b}.form-actions .departments-cancel-btn:hover{background:#475569}.form-actions .departments-submit-btn{color:#fff;background:#059669}.form-actions .departments-submit-btn:hover{background:#047857}.department-link{color:#4f46e5;font-weight:500;text-decoration:none}.department-link:hover{text-decoration:underline}.each-department-container{padding:24px;font-family:system-ui,-apple-system,sans-serif}.each-department-header{margin-bottom:16px}.back-btn{color:#4f46e5;cursor:pointer;background:0 0;border:none;font-size:14px}.each-departments-loading,.each-departments-error{text-align:center;margin:16px 0}.each-departments-error{color:#dc2626}.each-department-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;max-width:400px;padding:20px}.each-department-card h2{margin-bottom:16px}.each-department-actions{gap:10px;display:flex}.each-department-actions button{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:6px;padding:6px 12px}.each-department-actions .danger{background:#dc2626}.each-department-edit-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;max-width:400px;padding:20px}.department-form{flex-direction:column;gap:12px;display:flex}.department-form input{border:1px solid #cbd5e1;border-radius:6px;padding:8px}.form-actions{gap:10px;display:flex}.form-actions .submit-btn{color:#fff;background:#059669}.form-actions .cancel-btn{color:#fff;background:#64748b}
