.employees-cards-container{padding:20px;background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);border-radius:16px;margin-top:24px}.employees-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid rgba(0,0,0,0.08);flex-wrap:wrap;gap:12px}.employees-title{font-size:22px;font-weight:700;color:#1a1a1a;margin:0;display:flex;align-items:center;gap:12px}.employees-title i{color:#6366f1;font-size:24px}.employees-actions{display:flex;gap:12px;align-items:center}.select-all-container{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 12px;border-radius:8px;background:rgba(99,102,241,0.1);transition:all 0.3s ease}.select-all-container:hover{background:rgba(99,102,241,0.2)}.select-all-container input[type="checkbox"]{cursor:pointer;width:18px;height:18px;accent-color:#6366f1}.select-all-container span{font-size:14px;font-weight:500;color:#333}.employees-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px;animation:fadeIn 0.4s ease}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.employee-card{background:white;border-radius:12px;padding:16px;box-shadow:0 2px 8px rgba(0,0,0,0.08);transition:all 0.3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;border:1px solid rgba(0,0,0,0.05);display:flex;flex-direction:column}.employee-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#6366f1,#8b5cf6);transform:scaleX(0);transform-origin:left;transition:transform 0.3s ease}.employee-card:hover{box-shadow:0 8px 24px rgba(99,102,241,0.15);transform:translateY(-4px)}.employee-card:hover::before{transform:scaleX(1)}.employee-card input[type="checkbox"]{position:absolute;top:12px;right:12px;width:20px;height:20px;cursor:pointer;accent-color:#6366f1;z-index:10}.employee-card-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;padding-right:28px}.employee-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);display:flex;align-items:center;justify-content:center;color:white;font-weight:700;font-size:18px;flex-shrink:0;box-shadow:0 2px 8px rgba(99,102,241,0.3)}.employee-info{flex:1;min-width:0}.employee-name{font-size:16px;font-weight:700;color:#1a1a1a;margin:0 0 4px 0;word-break:break-word}.employee-email{font-size:12px;color:#666;margin:0;word-break:break-all;display:block}.payroll-status-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;white-space:nowrap;margin-top:4px}.payroll-status-badge i{font-size:11px}.status-calculated{background:#e0e7ff;color:#4f46e5}.status-approved{background:#dcfce7;color:#16a34a}.status-paid{background:#d1fae5;color:#059669}.status-pending{background:#fef3c7;color:#d97706}.status-rejected{background:#fee2e2;color:#dc2626}.employee-card-body{display:flex;flex-direction:column;gap:12px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid rgba(0,0,0,0.05);flex:1}.employee-stats-grid{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}@media(max-width:1400px){.employee-stats-grid{grid-template-columns:1fr!important}}.employee-stat{background:linear-gradient(135deg,#f8f9fa 0%,#f0f1f3 100%)!important;padding:10px!important;border-radius:8px!important;display:flex!important;align-items:center!important;gap:10px!important;transition:all 0.3s ease!important;border:1px solid rgba(0,0,0,0.03)!important}.employee-stat:hover{background:linear-gradient(135deg,#f0f1f3 0%,#e8e9eb 100%)!important;transform:translateY(-2px)!important}.employee-stat.full-width{grid-column:1 / -1!important}.employee-stat-icon{width:36px!important;height:36px!important;border-radius:8px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%)!important;color:white!important;font-size:16px!important;flex-shrink:0!important}.employee-stat:nth-child(1).employee-stat-icon{background:linear-gradient(135deg,#10b981 0%,#059669 100%)!important}.employee-stat:nth-child(2).employee-stat-icon{background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%)!important}.employee-stat:nth-child(3).employee-stat-icon{background:linear-gradient(135deg,#6366f1 0%,#4f46e5 100%)!important}.employee-stat:nth-child(4).employee-stat-icon{background:linear-gradient(135deg,#8b5cf6 0%,#7c3aed 100%)!important}.employee-stat:nth-child(5).employee-stat-icon{background:linear-gradient(135deg,#ec4899 0%,#db2777 100%)!important}.employee-stat:nth-child(6).employee-stat-icon{background:linear-gradient(135deg,#14b8a6 0%,#0d9488 100%)!important}.employee-stat-content{flex:1!important;min-width:0!important}.employee-stat-label{display:block!important;font-size:10px!important;color:#666!important;font-weight:500!important;margin-bottom:4px!important;text-transform:uppercase!important;letter-spacing:0.5px!important}.employee-stat-value{display:block!important;font-size:13px!important;font-weight:600!important;color:#1a1a1a!important;word-break:break-word!important}.employee-stat-value.currency{font-size:13px!important;color:#6366f1!important}.employee-stat-value .loading-text{font-size:11px!important;color:#999!important;font-weight:400!important}.employee-stat-value .loading-text i{margin-left:5px!important}.attendance-mini-stats{display:flex;flex-direction:column;gap:6px}.mini-stat-item{display:flex;align-items:center;gap:6px;font-size:11px;color:#333}.mini-stat-item i{font-size:12px}.pending-requests-info{display:flex;flex-direction:column;gap:4px}.requests-count{display:flex;align-items:center;gap:6px;font-size:11px;color:#f59e0b;font-weight:600}.requests-count i{font-size:12px}.requests-amount{font-size:10px}.approval-info{background:linear-gradient(135deg,#d1fae5 0%,#a7f3d0 100%);padding:10px;border-radius:8px;border-right:3px solid #10b981;margin-top:8px}.approval-info i{color:#10b981;margin-left:6px}.approval-info span{display:block;font-size:11px;color:#065f46;margin-bottom:4px}.approval-info span:last-child{margin-bottom:0}.approval-info .approver{font-weight:600}.salary-breakdown{grid-column:1 / -1;background:linear-gradient(135deg,#f3f4f6 0%,#e5e7eb 100%);padding:12px;border-radius:8px;border-left:4px solid #6366f1}.net-salary{font-size:14px;font-weight:600;color:#1a1a1a;margin-bottom:6px}.salary-details{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}.salary-details small{font-size:11px;color:#666;display:flex;align-items:center;gap:4px}.salary-details small strong{color:#1a1a1a;font-weight:600}.attendance-summary{grid-column:1 / -1;background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);padding:12px;border-radius:8px;border-left:4px solid #f59e0b}.attendance-summary-title{font-size:12px;font-weight:600;color:#92400e;margin-bottom:8px;display:flex;align-items:center;gap:6px}.attendance-stats{display:flex;justify-content:space-around;gap:8px;flex-wrap:wrap}.stat-item{text-align:center;flex:1;min-width:60px}.stat-item-value{display:block;font-size:14px;font-weight:700;color:#92400e}.stat-item-label{display:block;font-size:10px;color:#b45309;margin-top:2px}.employee-requests-count{grid-column:1 / -1;background:linear-gradient(135deg,#dbeafe 0%,#bfdbfe 100%);padding:12px;border-radius:8px;border-left:4px solid #3b82f6;display:flex;justify-content:space-between;align-items:center}.requests-count-label{font-size:12px;font-weight:600;color:#1e40af;display:flex;align-items:center;gap:6px}.requests-count-value{font-size:16px;font-weight:700;color:#1e40af}.employee-card-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between}.employee-card-actions .btn{flex:1;min-width:90px;padding:8px 12px;font-size:12px;border-radius:6px;border:none;cursor:pointer;transition:all 0.3s ease;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}.btn-view{background:#e0e7ff;color:#4f46e5}.btn-view:hover{background:#c7d2fe;transform:translateY(-2px)}.btn-approve{background:#dcfce7;color:#16a34a}.btn-approve:hover{background:#bbf7d0;transform:translateY(-2px)}.btn-pay{background:#d1fae5;color:#059669}.btn-pay:hover{background:#a7f3d0;transform:translateY(-2px)}.btn-edit{background:#fef3c7;color:#d97706}.btn-edit:hover{background:#fde68a;transform:translateY(-2px)}.loading-employees{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.loading-spinner{font-size:48px;color:#6366f1;margin-bottom:16px;animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.loading-employees p{font-size:14px;color:#666;margin:0}.empty-employees{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.empty-icon{font-size:64px;color:#d1d5db;margin-bottom:16px}.empty-title{font-size:18px;font-weight:700;color:#1a1a1a;margin-bottom:8px}.empty-description{font-size:14px;color:#666;margin:0}@media(max-width:1024px){.employees-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.employee-card-body{grid-template-columns:1fr}.employees-title{font-size:20px}}@media(max-width:768px){.employees-cards-container{padding:16px;margin-top:16px}.employees-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:20px}.employees-title{font-size:18px;width:100%}.employees-actions{width:100%;justify-content:flex-start}.employees-grid{grid-template-columns:1fr;gap:16px}.employee-stats-grid{grid-template-columns:1fr!important}.employee-card{padding:14px}.employee-card-header{margin-bottom:14px;padding-right:24px}.employee-avatar{width:44px;height:44px;font-size:16px}.employee-name{font-size:15px}.employee-email{font-size:11px}.employee-card-body{gap:10px;margin-bottom:14px;padding-bottom:14px}.employee-stat{padding:10px}.employee-stat-label{font-size:10px}.employee-stat-value{font-size:15px}.employee-card-actions{gap:6px}.employee-card-actions .btn{min-width:75px;padding:7px 10px;font-size:11px}.salary-breakdown,.attendance-summary,.employee-requests-count{padding:10px}.attendance-stats{gap:6px}.stat-item{min-width:50px}.stat-item-value{font-size:13px}.stat-item-label{font-size:9px}.payroll-status-badge{padding:5px 10px;font-size:11px}}@media(max-width:600px){.employees-cards-container{padding:12px;margin-top:12px}.employees-header{margin-bottom:16px}.employees-title{font-size:16px}.employees-title i{font-size:20px}.select-all-container{padding:6px 10px;font-size:13px}.select-all-container input[type="checkbox"]{width:16px;height:16px}.employee-card{padding:12px}.employee-card input[type="checkbox"]{width:18px;height:18px}.employee-card-header{margin-bottom:12px;padding-right:22px;gap:10px}.employee-avatar{width:40px;height:40px;font-size:14px}.employee-name{font-size:14px}.employee-email{font-size:10px}.employee-card-body{gap:8px;margin-bottom:12px;padding-bottom:12px}.employee-stat{padding:8px}.employee-stat-label{font-size:9px;margin-bottom:4px}.employee-stat-value{font-size:13px}.employee-stat-value.currency{font-size:12px}.salary-breakdown,.attendance-summary,.employee-requests-count{padding:8px}.net-salary{font-size:12px;margin-bottom:4px}.attendance-summary-title{font-size:11px;margin-bottom:6px}.attendance-stats{gap:4px}.stat-item{min-width:45px}.stat-item-value{font-size:12px}.stat-item-label{font-size:8px;margin-top:1px}.requests-count-label{font-size:11px}.requests-count-value{font-size:14px}.payroll-status-badge{padding:4px 8px;font-size:10px}.payroll-status-badge i{font-size:10px}.employee-card-actions{gap:5px}.employee-card-actions .btn{min-width:65px;padding:6px 8px;font-size:10px;gap:4px}}@media(max-width:480px){.employees-cards-container{padding:10px;margin-top:10px}.employees-header{margin-bottom:14px;padding-bottom:12px}.employees-title{font-size:15px}.employees-title i{font-size:18px}.select-all-container{padding:5px 8px;font-size:12px}.select-all-container input[type="checkbox"]{width:15px;height:15px}.employee-stats-grid{grid-template-columns:1fr!important}.employee-card{padding:10px}.employee-card input[type="checkbox"]{width:16px;height:16px;top:10px;right:10px}.employee-card-header{margin-bottom:10px;padding-right:20px;gap:8px}.employee-avatar{width:36px;height:36px;font-size:12px}.employee-name{font-size:13px}.employee-email{font-size:9px}.employee-card-body{gap:6px;margin-bottom:10px;padding-bottom:10px}.employee-stat{padding:6px}.employee-stat-label{font-size:8px;margin-bottom:3px}.employee-stat-value{font-size:12px}.employee-stat-value.currency{font-size:11px}.salary-breakdown,.attendance-summary,.employee-requests-count{padding:6px}.net-salary{font-size:11px;margin-bottom:3px}.attendance-summary-title{font-size:10px;margin-bottom:4px}.attendance-stats{gap:3px}.stat-item{min-width:40px}.stat-item-value{font-size:11px}.stat-item-label{font-size:7px;margin-top:1px}.requests-count-label{font-size:10px}.requests-count-value{font-size:12px}.payroll-status-badge{padding:3px 6px;font-size:9px}.payroll-status-badge i{font-size:8px}.employee-card-actions{gap:4px}.employee-card-actions .btn{min-width:55px;padding:5px 6px;font-size:9px;gap:3px}}@media(max-width:360px){.employees-cards-container{padding:8px;margin-top:8px}.employees-header{margin-bottom:12px;padding-bottom:10px}.employees-title{font-size:14px}.employees-title i{font-size:16px}.employee-card{padding:8px}.employee-card-header{margin-bottom:8px;padding-right:18px;gap:6px}.employee-avatar{width:32px;height:32px;font-size:11px}.employee-name{font-size:12px}.employee-email{font-size:8px}.employee-card-body{gap:5px;margin-bottom:8px;padding-bottom:8px}.employee-stat{padding:5px}.employee-stat-label{font-size:7px;margin-bottom:2px}.employee-stat-value{font-size:11px}.salary-breakdown,.attendance-summary,.employee-requests-count{padding:5px}.net-salary{font-size:10px;margin-bottom:2px}.attendance-summary-title{font-size:9px;margin-bottom:3px}.stat-item{min-width:35px}.stat-item-value{font-size:10px}.stat-item-label{font-size:6px}.employee-card-actions .btn{min-width:50px;padding:4px 5px;font-size:8px}}