.app-header{background:linear-gradient(135deg,#1a1a1a,#2d2d2d);border-bottom:2px solid #404040;box-shadow:0 2px 8px #0000004d;position:sticky;top:0;z-index:100;padding:0}.header-content{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;height:70px;max-width:100%}.header-left{display:flex;align-items:center;gap:16px;flex:1}.menu-toggle{background:#333;border:1px solid #555555;color:#fff;width:40px;height:40px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;font-size:0}.menu-toggle:hover{background:#404040;border-color:#666;transform:scale(1.05)}.menu-toggle:active{transform:scale(.95)}.header-logo-section{display:flex;align-items:center;gap:12px}.header-logo-text{display:flex;flex-direction:column;gap:2px}.header-title{font-size:18px;font-weight:700;color:#fff;margin:0;letter-spacing:.5px}.header-subtitle{font-size:12px;color:#b0b0b0;margin:0;font-weight:400;letter-spacing:.3px}.header-right{display:flex;align-items:center;gap:20px}.notification-wrapper{position:relative}.notification-btn{background:#333;border:1px solid #555555;color:#fff;width:40px;height:40px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;transition:all .3s ease;font-size:0}.notification-btn:hover{background:#404040;border-color:#666;transform:scale(1.05)}.notification-badge{position:absolute;top:-8px;right:-8px;background:#f44;color:#fff;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;border:2px solid #1a1a1a}.notification-dropdown{position:absolute;top:50px;right:0;background:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 8px 24px #00000026;width:320px;max-height:400px;overflow:hidden;display:flex;flex-direction:column;z-index:1000;animation:slideDown .3s ease}.notification-dropdown .dropdown-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #f0f0f0;background:#fafafa}.notification-dropdown .dropdown-header h3{margin:0;font-size:14px;font-weight:600;color:#1a1a1a}.close-btn{background:none;border:none;font-size:24px;color:#666;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;transition:color .2s ease}.close-btn:hover{color:#1a1a1a}.notification-list{flex:1;overflow-y:auto;max-height:250px}.notification-item{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid #f5f5f5;cursor:pointer;transition:background .2s ease}.notification-item:hover{background:#f9f9f9}.notification-dot{width:8px;height:8px;background:#f44;border-radius:50%;margin-top:6px;flex-shrink:0}.notification-content{flex:1}.notification-title{margin:0;font-size:13px;font-weight:500;color:#1a1a1a}.notification-time{margin:4px 0 0;font-size:12px;color:#999}.notification-dropdown .dropdown-footer{padding:12px 16px;border-top:1px solid #f0f0f0;background:#fafafa}.view-all-btn{width:100%;padding:8px 12px;background:#1a1a1a;color:#fff;border:none;border-radius:4px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease}.view-all-btn:hover{background:#333}.user-profile-wrapper{position:relative}.user-profile{background:#333;border:1px solid #555555;color:#fff;padding:8px 12px;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .3s ease;font-size:0}.user-profile:hover{background:#404040;border-color:#666}.user-avatar{width:36px;height:36px;background:linear-gradient(135deg,#555,#333);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #666666;flex-shrink:0}.avatar-initials{font-size:12px;font-weight:700;color:#fff}.user-info{display:flex;flex-direction:column;gap:2px;text-align:left}.user-name{font-size:13px;font-weight:600;color:#fff;margin:0}.user-role{font-size:11px;color:#b0b0b0;margin:0}.chevron-icon{width:14px;height:14px;color:#b0b0b0;transition:transform .3s ease}.user-profile:hover .chevron-icon{transform:rotate(180deg);color:#fff}.user-dropdown{position:absolute;top:50px;right:0;background:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 8px 24px #00000026;width:280px;z-index:1000;animation:slideDown .3s ease}.user-dropdown .dropdown-header{display:flex;gap:12px;padding:16px;border-bottom:1px solid #f0f0f0;background:#fafafa}.user-avatar-large{width:48px;height:48px;background:linear-gradient(135deg,#555,#333);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #666666;flex-shrink:0}.avatar-initials-large{font-size:16px;font-weight:700;color:#fff}.dropdown-user-name{margin:0;font-size:14px;font-weight:600;color:#1a1a1a}.dropdown-user-email{margin:4px 0 0;font-size:12px;color:#666}.dropdown-user-role{margin:4px 0 0;font-size:11px;color:#999;font-weight:500}.dropdown-divider{height:1px;background:#f0f0f0;margin:0}.dropdown-menu-items{display:flex;flex-direction:column;padding:8px 0}.dropdown-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:none;border:none;color:#1a1a1a;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s ease;text-align:left}.dropdown-item:hover{background:#f5f5f5;color:#000}.dropdown-item svg{width:14px;height:14px;flex-shrink:0}.dropdown-item.logout{color:#f44}.dropdown-item.logout:hover{background:#fff5f5;color:#c00}@media(max-width:768px){.header-content{padding:12px 16px;height:60px}.header-title{font-size:16px}.header-subtitle{font-size:10px}.header-right{gap:12px}.user-info{display:none}.notification-dropdown,.user-dropdown{width:280px;right:-10px}}@media(max-width:480px){.header-left{gap:8px}.header-logo-text{display:none}.header-title{font-size:14px}.notification-dropdown,.user-dropdown{width:240px;right:-20px}.dropdown-header h3{font-size:13px}}.notification-list::-webkit-scrollbar{width:6px}.notification-list::-webkit-scrollbar-track{background:#f5f5f5}.notification-list::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:3px}.notification-list::-webkit-scrollbar-thumb:hover{background:#b0b0b0}:root{--primary: #000000;--primary-light: #1f2937;--primary-lighter: #374151;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #2d3748;--gray-800: #1f2937;--gray-900: #111827;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 2px 8px rgba(0, 0, 0, .1);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .15);--transition: all .2s cubic-bezier(.4, 0, .2, 1)}.sidebar-overlay{position:fixed;inset:0;z-index:15;background:#0006;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;animation:fadeIn .2s ease-out forwards;pointer-events:auto}@keyframes fadeIn{to{opacity:1}}.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:25;width:200px;background:#fff;color:#1f2937;transform:translate(-100%);transition:var(--transition);box-shadow:1px 0 8px #0000000f;border-right:1px solid #e5e7eb;display:flex;flex-direction:column}.sidebar.open{transform:translate(0);box-shadow:2px 0 12px #0000001a}.sidebar-content{display:flex;flex-direction:column;height:100%;position:relative}.sidebar-logo{display:flex;align-items:center;justify-content:flex-start;height:56px;padding:0 10px;background:linear-gradient(135deg,#fff,#f9fafb);gap:8px;border-bottom:1px solid #e5e7eb;position:relative;transition:var(--transition)}.sidebar-logo:hover{background:linear-gradient(135deg,#f9fafb,#f3f4f6)}.logo-icon-wrapper{width:32px;height:32px;background:linear-gradient(135deg,#000,#1f2937);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 6px #0000001a;transition:var(--transition)}.sidebar-logo:hover .logo-icon-wrapper{transform:scale(1.05);box-shadow:0 3px 8px #0000001f}.sidebar-logo-icon{color:#fff;width:18px;height:18px;transition:var(--transition)}.logo-text-wrapper{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.sidebar-logo-text{font-size:13px;font-weight:700;color:#000;letter-spacing:-.3px;transition:var(--transition);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-logo-subtitle{font-size:8px;color:#6b7280;font-weight:500;letter-spacing:.3px;text-transform:uppercase;transition:var(--transition);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-logo:hover .sidebar-logo-text{color:#000}.sidebar-logo:hover .sidebar-logo-subtitle{color:#4b5563}.sidebar-nav{flex:1;padding:8px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#d1d5db transparent}.sidebar-nav::-webkit-scrollbar{width:4px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:2px;transition:var(--transition)}.sidebar-nav::-webkit-scrollbar-thumb:hover{background:#9ca3af}.nav-group{margin-bottom:4px}.nav-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 10px;border:none;border-radius:6px;background:transparent;color:#4b5563;text-align:left;cursor:pointer;font-size:12px;font-weight:500;transition:var(--transition);text-decoration:none;position:relative;overflow:hidden;border:1px solid transparent;min-height:32px}.nav-item-content{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.nav-icon{width:16px;height:16px;flex-shrink:0;transition:var(--transition);color:#6b7280}.nav-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:var(--transition);font-size:12px}.nav-item:hover{background:#1f2937;color:#fff;border-color:#1f2937;transform:translate(1px);box-shadow:0 1px 4px #1f29371a}.nav-item:hover .nav-icon{color:#fff;transform:scale(1.08)}.nav-item:hover .nav-label,.nav-item:hover .submenu-toggle{color:#fff}.nav-item.active{background:#000;color:#fff;border-color:#000;box-shadow:0 2px 6px #00000026;font-weight:600}.nav-item.active .nav-icon{color:#fff;filter:drop-shadow(0 1px 2px rgba(255,255,255,.1))}.nav-item.active .nav-label{color:#fff}.nav-item.active:hover{background:#1f2937;border-color:#1f2937;box-shadow:0 3px 8px #0003;transform:translate(2px)}.nav-item:focus-visible{outline:2px solid #000000;outline-offset:1px}.submenu-toggle{width:16px;height:16px;display:flex;align-items:center;justify-content:center;transition:var(--transition);color:#9ca3af;flex-shrink:0}.nav-item:hover .submenu-toggle,.nav-item.active .submenu-toggle{color:#fff}.submenu-toggle.open{transform:rotate(180deg)}.submenu{border-left:2px solid #e5e7eb;margin:4px 0 6px 4px;padding:4px 0 4px 8px;animation:slideDown .2s cubic-bezier(.4,0,.2,1)}.submenu-item{font-size:11px;padding:7px 8px;margin-bottom:2px;background:transparent;border-radius:4px;color:#6b7280;border:1px solid transparent;transition:var(--transition);cursor:pointer;position:relative;display:flex;align-items:center;gap:6px;min-height:28px}.submenu-item .nav-icon{width:14px;height:14px}.submenu-item .nav-label{font-size:11px}.submenu-item:hover{background:#2d3748;color:#fff;border-color:#2d3748;transform:translate(1px);box-shadow:0 1px 4px #2d37481a}.submenu-item:hover .nav-icon{color:#fff;transform:scale(1.06)}.submenu-item.active{background:#1f2937;color:#fff;border-color:#1f2937;font-weight:600;box-shadow:0 1px 4px #1f29371a}.submenu-item.active .nav-icon{color:#fff;filter:drop-shadow(0 1px 2px rgba(255,255,255,.1))}.submenu-item:focus-visible{outline:2px solid #000000;outline-offset:1px}@media(min-width:1024px){.sidebar{position:static;transform:translate(0);box-shadow:1px 0 8px #0000000d;border-right:1px solid #e5e7eb;width:200px}.sidebar-overlay{display:none}}@media(max-width:1023px)and (min-width:768px){.sidebar{width:180px}.sidebar-logo{height:52px;padding:0 8px;gap:6px}.logo-icon-wrapper{width:28px;height:28px}.sidebar-logo-icon{width:16px;height:16px}.sidebar-logo-text{font-size:12px}.sidebar-logo-subtitle{font-size:7px}.sidebar-nav{padding:6px}.nav-item{padding:7px 8px;font-size:11px;min-height:30px}.nav-item-content{gap:6px}.nav-icon{width:14px;height:14px}.submenu{margin:3px 0 4px 3px;padding:3px 0 3px 6px}.submenu-item{font-size:10px;padding:6px;margin-bottom:2px;min-height:26px;gap:5px}.submenu-item .nav-icon{width:12px;height:12px}.submenu-item .nav-label{font-size:10px}}@media(max-width:767px){.sidebar{width:200px}.sidebar-logo{height:56px;padding:0 10px;gap:8px}.logo-icon-wrapper{width:32px;height:32px}.sidebar-logo-icon{width:18px;height:18px}.sidebar-logo-text{font-size:13px}.sidebar-logo-subtitle{font-size:8px}.sidebar-nav{padding:8px}.nav-item{padding:8px 10px;font-size:12px;min-height:32px}.nav-item-content{gap:8px}.nav-icon{width:16px;height:16px}.submenu{margin:4px 0 6px 4px;padding:4px 0 4px 8px}.submenu-item{font-size:11px;padding:7px 8px;margin-bottom:2px;min-height:28px;gap:6px}.submenu-item .nav-icon{width:14px;height:14px}.submenu-item .nav-label{font-size:11px}}@media(max-width:479px){.sidebar{width:160px}.sidebar-logo{height:48px;padding:0 6px;gap:6px}.logo-icon-wrapper{width:28px;height:28px}.sidebar-logo-icon{width:16px;height:16px}.sidebar-logo-text{font-size:11px}.sidebar-logo-subtitle{font-size:7px}.sidebar-nav{padding:6px}.nav-item{padding:6px 8px;font-size:10px;min-height:28px}.nav-item-content{gap:6px}.nav-icon{width:14px;height:14px}.nav-label{font-size:10px}.submenu-toggle{width:14px;height:14px}.submenu{margin:3px 0 4px 3px;padding:3px 0 3px 6px}.submenu-item{font-size:9px;padding:5px 6px;margin-bottom:1px;min-height:24px;gap:4px}.submenu-item .nav-icon{width:12px;height:12px}.submenu-item .nav-label{font-size:9px}}@media(min-width:1440px){.sidebar{width:220px}.sidebar-logo{height:60px;padding:0 12px;gap:10px}.logo-icon-wrapper{width:36px;height:36px}.sidebar-logo-icon{width:20px;height:20px}.sidebar-logo-text{font-size:14px}.sidebar-logo-subtitle{font-size:9px}.sidebar-nav{padding:10px}.nav-item{padding:9px 12px;font-size:13px;min-height:34px}.nav-item-content{gap:10px}.nav-icon{width:18px;height:18px}.submenu{margin:5px 0 8px 5px;padding:5px 0 5px 10px}.submenu-item{font-size:12px;padding:8px 10px;margin-bottom:3px;min-height:30px;gap:8px}.submenu-item .nav-icon{width:16px;height:16px}.submenu-item .nav-label{font-size:12px}}@media(min-width:1920px){.sidebar{width:240px}.sidebar-logo{height:64px;padding:0 14px;gap:12px}.logo-icon-wrapper{width:40px;height:40px}.sidebar-logo-icon{width:22px;height:22px}.sidebar-logo-text{font-size:15px}.sidebar-logo-subtitle{font-size:10px}.sidebar-nav{padding:12px}.nav-item{padding:10px 14px;font-size:14px;min-height:36px}.nav-item-content{gap:12px}.nav-icon{width:20px;height:20px}.submenu{margin:6px 0 10px 6px;padding:6px 0 6px 12px}.submenu-item{font-size:13px;padding:9px 12px;margin-bottom:4px;min-height:32px;gap:10px}.submenu-item .nav-icon{width:18px;height:18px}.submenu-item .nav-label{font-size:13px}}.nav-item:focus-visible,.submenu-item:focus-visible{outline:2px solid #000000;outline-offset:1px}@media(prefers-reduced-motion:reduce){.sidebar,.nav-item,.submenu-item,.sidebar-logo{transition:none}.submenu{animation:none}}@media(prefers-color-scheme:dark){.sidebar{background:#1f2937;color:#f3f4f6;border-right-color:#374151}.sidebar-logo{background:linear-gradient(135deg,#1f2937,#111827);border-bottom-color:#374151}.sidebar-logo-text{color:#f3f4f6}.sidebar-logo-subtitle{color:#9ca3af}.sidebar-logo:hover{background:linear-gradient(135deg,#111827,#000)}.nav-item{color:#d1d5db}.nav-item:hover{background:#374151;color:#f3f4f6}.nav-item.active{background:#fff;color:#1f2937}.nav-item.active:hover{background:#f3f4f6}.submenu{border-left-color:#374151}.submenu-item{color:#d1d5db}.submenu-item:hover{background:#374151;color:#f3f4f6}.submenu-item.active{background:#2d3748;color:#f3f4f6}}@media print{.sidebar,.sidebar-overlay{display:none}}.dashboard-panel{padding:24px;background-color:#f9fafb;min-height:100vh;width:100%;max-width:none}.dashboard-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:32px;padding-bottom:20px;border-bottom:2px solid #e5e7eb}.header-info{flex:1}.dashboard-title{font-size:32px;font-weight:700;color:#111827;margin:0 0 8px;line-height:1.2}.dashboard-subtitle{font-size:16px;color:#6b7280;margin:0;line-height:1.4}.dashboard-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.dashboard-actions .btn-primary,.dashboard-actions .btn-secondary{display:flex;align-items:center;gap:8px;padding:10px 20px;font-weight:500}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-bottom:32px;width:100%}.stat-card{background-color:#fff;padding:24px;border-radius:12px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;transition:all .3s ease;position:relative;overflow:hidden}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#3b82f6,#1d4ed8)}.stat-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}.stat-title{font-size:14px;color:#6b7280;font-weight:500;margin:0 0 8px;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:28px;font-weight:700;color:#111827;line-height:1.2}.stat-icon{padding:12px;border-radius:12px;color:#fff;flex-shrink:0}.stat-icon.blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}.stat-icon.green{background:linear-gradient(135deg,#10b981,#059669)}.stat-icon.yellow{background:linear-gradient(135deg,#f59e0b,#d97706)}.stat-icon.purple{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.stat-footer{display:flex;align-items:center;justify-content:space-between}.stat-change{display:flex;align-items:center;gap:4px;font-size:14px;font-weight:600}.stat-change.positive{color:#059669}.stat-change.negative{color:#dc2626}.change-period{font-size:12px;color:#9ca3af}.content-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(450px,1fr));gap:24px;margin-bottom:32px;width:100%}.activity-card,.payroll-card{background-color:#fff;border-radius:12px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;overflow:hidden}.card-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 16px;border-bottom:1px solid #f3f4f6}.card-header h3{font-size:18px;font-weight:600;color:#111827;margin:0}.view-all-btn{font-size:14px;color:#3b82f6;background:none;border:none;cursor:pointer;font-weight:500;padding:4px 8px;border-radius:6px;transition:all .2s ease}.view-all-btn:hover{background-color:#eff6ff;color:#1d4ed8}.activity-list{padding:0 24px 20px}.activity-item{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid #f9fafb}.activity-item:last-child{border-bottom:none}.activity-dot{width:8px;height:8px;border-radius:50%;margin-top:6px;flex-shrink:0}.activity-dot.success{background-color:#10b981}.activity-dot.warning{background-color:#f59e0b}.activity-dot.info{background-color:#3b82f6}.activity-content{flex:1}.activity-text{font-size:14px;color:#111827;line-height:1.4;margin-bottom:4px}.activity-time{font-size:12px;color:#6b7280}.payroll-list{padding:0 24px 20px}.payroll-item{display:flex;align-items:center;justify-content:space-between;padding:16px;margin-bottom:12px;background-color:#f9fafb;border-radius:8px;border:1px solid #f3f4f6;transition:all .2s ease}.payroll-item:hover{background-color:#f3f4f6;border-color:#e5e7eb}.payroll-item:last-child{margin-bottom:0}.payroll-info{flex:1}.department-name{font-size:16px;font-weight:600;color:#111827;margin:0 0 4px}.payroll-details{display:flex;align-items:center;gap:12px;font-size:13px;color:#6b7280}.payroll-date{font-weight:500}.employee-count{padding:2px 8px;background-color:#eff6ff;color:#1d4ed8;border-radius:12px;font-size:12px;font-weight:500}.payroll-actions{text-align:right}.payroll-amount{font-size:16px;font-weight:700;color:#111827;margin-bottom:6px}.process-btn{font-size:13px;color:#3b82f6;background:none;border:none;cursor:pointer;font-weight:600;padding:4px 12px;border-radius:6px;transition:all .2s ease}.process-btn:hover{background-color:#eff6ff;color:#1d4ed8}.quick-actions-section{background-color:#fff;padding:24px;border-radius:12px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;width:100%}.section-title{font-size:20px;font-weight:600;color:#111827;margin:0 0 20px;padding-bottom:12px;border-bottom:1px solid #f3f4f6}.quick-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.quick-action{display:flex;align-items:center;padding:20px;text-align:left;border:1px solid #e5e7eb;border-radius:12px;background-color:#fafafa;cursor:pointer;transition:all .3s ease;gap:16px}.quick-action:hover{background-color:#fff;border-color:#d1d5db;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.action-icon{padding:12px;border-radius:12px;color:#fff;flex-shrink:0;display:flex;align-items:center;justify-content:center}.action-icon.blue{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}.action-icon.green{background:linear-gradient(135deg,#10b981,#059669)}.action-icon.purple{background:linear-gradient(135deg,#8b5cf6,#7c3aed)}.action-icon.orange{background:linear-gradient(135deg,#f97316,#ea580c)}.action-content{flex:1;display:flex;flex-direction:column;gap:4px}.action-title{font-size:16px;font-weight:600;color:#111827;line-height:1.2}.action-description{font-size:13px;color:#6b7280;line-height:1.3}@media(max-width:1024px){.content-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}@media(max-width:768px){.dashboard-panel{padding:16px}.dashboard-header{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:24px}.dashboard-title{font-size:28px}.dashboard-actions{width:100%;justify-content:flex-start}.stats-grid{grid-template-columns:1fr;gap:16px;margin-bottom:24px}.stat-card{padding:20px}.stat-value{font-size:24px}.content-grid{gap:16px;margin-bottom:24px}.card-header{padding:16px 20px 12px}.activity-list,.payroll-list{padding:0 20px 16px}.quick-actions-section{padding:20px}.quick-actions-grid{grid-template-columns:1fr;gap:12px}.quick-action{padding:16px}}@media(max-width:480px){.dashboard-panel{padding:12px}.dashboard-title{font-size:24px}.dashboard-subtitle{font-size:14px}.dashboard-actions{flex-direction:column;width:100%}.dashboard-actions .btn-primary,.dashboard-actions .btn-secondary{width:100%;justify-content:center}.stats-grid{gap:12px}.stat-card{padding:16px}.stat-header{margin-bottom:12px}.stat-value{font-size:20px}.stat-icon{padding:10px}.payroll-item{flex-direction:column;align-items:flex-start;gap:12px}.payroll-actions{width:100%;display:flex;justify-content:space-between;align-items:center}.quick-action{padding:14px;gap:12px}.action-icon{padding:10px}}:root{--primary: #4F46E5;--primary-dark: #4338CA;--primary-light: #EEF2FF;--secondary: #10B981;--secondary-light: #ECFDF5;--danger: #EF4444;--danger-light: #FEF2F2;--warning: #F59E0B;--warning-light: #FFFBEB;--info: #3B82F6;--info-light: #EFF6FF;--success: #059669;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--shadow-xs: 0 1px 1px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1);--transition: all .3s cubic-bezier(.4, 0, .2, 1)}.panel-container-employee{padding:16px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh;font-family:Segoe UI,Roboto,-apple-system,sans-serif}.emp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;background:#fff;padding:14px 16px;border-radius:8px;box-shadow:var(--shadow-md);gap:12px;flex-wrap:wrap}.emp-header-left{display:flex;align-items:center;gap:12px;flex:1;min-width:200px}.emp-header-icon{width:44px;height:44px;background:linear-gradient(135deg,var(--primary-light) 0%,#F5F3FF 100%);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--primary);flex-shrink:0}.emp-header-icon svg{width:22px;height:22px}.emp-header-title{font-size:16px;font-weight:700;color:var(--gray-900);margin:0}.emp-header-subtitle{font-size:12px;color:var(--gray-500);margin:2px 0 0}.emp-header-right{display:flex;gap:8px;flex-wrap:wrap}.emp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap}.emp-btn svg{width:16px;height:16px}.emp-btn-primary{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:var(--shadow-md)}.emp-btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.emp-btn-primary:active{transform:translateY(0)}.emp-btn-primary:disabled{opacity:.6;cursor:not-allowed}.emp-btn-secondary{background:#fff;color:var(--gray-700);border:1px solid var(--gray-300);width:40px;padding:8px}.emp-btn-secondary:hover{background:var(--gray-50);border-color:var(--primary);color:var(--primary);transform:translateY(-1px)}.emp-btn-secondary:disabled{opacity:.6;cursor:not-allowed}.emp-btn-cancel{background:var(--gray-100);color:var(--gray-700);flex:1}.emp-btn-cancel:hover{background:var(--gray-200)}.emp-spin{animation:spin 1s linear infinite}.emp-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px}.emp-stat-card{background:#fff;padding:14px;border-radius:8px;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:12px;transition:var(--transition);border-left:4px solid var(--gray-200)}.emp-stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.emp-stat-card.emp-stat-total{border-left-color:var(--info)}.emp-stat-card.emp-stat-worker-perm{border-left-color:var(--secondary)}.emp-stat-card.emp-stat-worker-casual{border-left-color:var(--warning)}.emp-stat-card.emp-stat-staff-perm{border-left-color:#06b6d4}.emp-stat-card.emp-stat-staff-casual{border-left-color:#a855f7}.emp-stat-icon{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.emp-stat-icon svg{width:20px;height:20px}.emp-stat-card.emp-stat-total .emp-stat-icon{background:var(--info-light);color:var(--info)}.emp-stat-card.emp-stat-worker-perm .emp-stat-icon{background:var(--secondary-light);color:var(--secondary)}.emp-stat-card.emp-stat-worker-casual .emp-stat-icon{background:var(--warning-light);color:var(--warning)}.emp-stat-card.emp-stat-staff-perm .emp-stat-icon{background:#cffafe;color:#06b6d4}.emp-stat-card.emp-stat-staff-casual .emp-stat-icon{background:#f3e8ff;color:#a855f7}.emp-stat-info{flex:1;min-width:0}.emp-stat-value{font-size:18px;font-weight:700;color:var(--gray-900)}.emp-stat-label{font-size:12px;color:var(--gray-500);margin-top:2px;font-weight:500}.emp-search-section{margin-bottom:16px}.emp-search-box{position:relative;background:#fff;border-radius:8px;box-shadow:var(--shadow-md);display:flex;align-items:center;padding:10px 12px;gap:8px}.emp-search-box svg{color:var(--gray-400);flex-shrink:0;width:16px;height:16px}.emp-search-input{flex:1;border:none;outline:none;font-size:13px;color:var(--gray-900);background:transparent}.emp-search-input::placeholder{color:var(--gray-400)}.emp-table-card{background:#fff;border-radius:8px;box-shadow:var(--shadow-md);overflow:hidden;margin-bottom:16px}.emp-table-wrapper{overflow-x:auto;max-height:550px;position:relative}.emp-table{width:100%;border-collapse:collapse;font-size:12px}.emp-table thead{background:linear-gradient(135deg,var(--gray-800) 0%,var(--gray-700) 100%);position:sticky;top:0;z-index:10}.emp-table thead th{padding:10px 12px;text-align:left;font-weight:600;text-transform:uppercase;letter-spacing:.4px;font-size:11px;color:#fff;border-bottom:1px solid var(--gray-600);white-space:nowrap;height:36px;vertical-align:middle}.emp-table tbody tr{border-bottom:1px solid var(--gray-100);transition:var(--transition);height:36px}.emp-table tbody tr:hover{background:linear-gradient(90deg,var(--primary-light) 0%,white 100%)}.emp-table tbody td{padding:8px 12px;color:var(--gray-700);vertical-align:middle;font-size:12px;height:36px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.emp-emp-id{font-weight:600;color:var(--gray-900);background:var(--info-light);padding:4px 8px;border-radius:4px;display:inline-block}.emp-name{font-weight:500;color:var(--gray-900)}.emp-badge{display:inline-block;padding:5px 10px;border-radius:6px;font-size:11px;font-weight:600;text-align:center}.badge-worker-permanent{background:#d1fae5;color:#065f46;border-left:3px solid var(--secondary)}.badge-worker-casual{background:#fef3c7;color:#92400e;border-left:3px solid var(--warning)}.badge-staff-permanent{background:#cffafe;color:#164e63;border-left:3px solid #06B6D4}.badge-staff-casual{background:#f3e8ff;color:#6b21a8;border-left:3px solid #A855F7}.badge-default{background:var(--gray-100);color:var(--gray-700)}.emp-actions{display:flex;gap:6px;justify-content:center}.emp-action-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);border-radius:6px;cursor:pointer;transition:var(--transition);background:#fff;padding:0}.emp-action-btn svg{width:16px;height:16px}.emp-action-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.emp-edit-btn{color:var(--warning)}.emp-edit-btn:hover{background:var(--warning-light);border-color:var(--warning)}.emp-delete-btn{color:var(--danger)}.emp-delete-btn:hover{background:var(--danger-light);border-color:var(--danger)}.emp-no-data{background:#fff}.emp-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.emp-no-data-img{width:80px;height:auto;opacity:.4;margin-bottom:12px}.emp-no-data-container p{font-size:13px;color:var(--gray-500);margin:0}.emp-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;background:#fff;border-radius:8px;margin:20px auto;max-width:300px;box-shadow:var(--shadow-md)}.emp-spinner{width:32px;height:32px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:12px}.emp-loading p{font-size:12px;color:var(--gray-600);margin:0}.emp-error-box{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;text-align:center;background:#fff;border-radius:8px;margin:20px auto;max-width:350px;box-shadow:var(--shadow-md);color:var(--danger);border-left:4px solid var(--danger)}.emp-error-box svg{width:32px;height:32px;margin-bottom:12px}.emp-error-box h2{font-size:14px;font-weight:700;margin:0 0 8px}.emp-error-box p{font-size:12px;color:var(--gray-600);margin:0 0 12px}.emp-retry-btn{padding:8px 16px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;border:none;border-radius:6px;font-weight:600;font-size:12px;cursor:pointer;transition:var(--transition)}.emp-retry-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.emp-pagination{background:#fff;border-radius:8px;padding:12px 14px;box-shadow:var(--shadow-md);display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}.emp-pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 12px;background:#fff;border:1px solid var(--gray-300);border-radius:6px;cursor:pointer;transition:var(--transition);color:var(--gray-700);font-weight:600;font-size:11px;white-space:nowrap}.emp-pagination-btn svg{width:14px;height:14px}.emp-pagination-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-color:var(--primary);color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-md)}.emp-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.emp-pagination-goto{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--gray-700);font-weight:600}.emp-pagination-input{width:50px;padding:6px 8px;border:1px solid var(--gray-300);border-radius:6px;text-align:center;font-size:11px;font-weight:600;color:var(--gray-900);transition:var(--transition)}.emp-pagination-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.emp-pagination-input:disabled{background:var(--gray-100);cursor:not-allowed}.emp-pagination-info{font-size:11px;color:var(--gray-600);font-weight:600;min-width:160px;text-align:center;background:var(--gray-50);padding:6px 10px;border-radius:4px}.emp-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.emp-modal{background:#fff;border-radius:8px;box-shadow:var(--shadow-xl);max-width:400px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.emp-modal-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--gray-100);background:linear-gradient(135deg,var(--primary-light) 0%,#F5F3FF 100%);gap:8px;position:sticky;top:0;z-index:100}.emp-modal-title-section{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.emp-modal-title-section svg{color:var(--primary);flex-shrink:0;width:18px;height:18px}.emp-modal-title-section h2{font-size:13px;font-weight:700;color:var(--gray-900);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.emp-modal-close{background:none;border:none;font-size:18px;color:var(--gray-400);cursor:pointer;transition:var(--transition);padding:4px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}.emp-modal-close:hover{background:var(--gray-100);color:var(--gray-900)}.emp-modal-body{padding:14px;max-height:calc(85vh - 44px);overflow-y:auto}.emp-form{display:flex;flex-direction:column;gap:12px}.emp-form-group{display:flex;flex-direction:column;gap:5px;position:relative}.emp-form-label{font-size:11px;font-weight:600;color:var(--gray-900);text-transform:uppercase;letter-spacing:.4px}.emp-form-input,.emp-form-select{padding:8px 10px;border:1px solid var(--gray-300);border-radius:6px;font-size:12px;font-family:inherit;transition:var(--transition);background:#fff;color:var(--gray-900)}.emp-form-input:focus,.emp-form-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.emp-form-input.emp-disabled{background:var(--gray-50);color:var(--gray-600);cursor:not-allowed;border-color:var(--gray-200)}.emp-form-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%234F46E5' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px}.emp-form-actions{display:flex;gap:10px;margin-top:8px}.emp-form-actions .emp-btn{flex:1;padding:8px 12px}.emp-suggestions{position:absolute;top:100%;left:0;right:0;border:1px solid var(--gray-200);border-top:none;border-radius:0 0 6px 6px;max-height:200px;overflow-y:auto;z-index:101;box-shadow:var(--shadow-lg);margin-top:-1px;background:#fff}.emp-suggestion-item{padding:8px 10px;cursor:pointer;border-bottom:1px solid var(--gray-100);transition:var(--transition);background-color:#fff;font-size:11px}.emp-suggestion-item:hover{background-color:var(--primary-light);padding-left:12px}.emp-suggestion-item:last-child{border-bottom:none}.emp-suggestion-id{font-weight:700;color:var(--gray-900);font-size:11px;margin-bottom:2px}.emp-suggestion-name{font-size:11px;color:var(--gray-600)}.emp-suggestions::-webkit-scrollbar,.emp-modal-body::-webkit-scrollbar,.emp-table-wrapper::-webkit-scrollbar{width:6px;height:6px}.emp-suggestions::-webkit-scrollbar-track,.emp-modal-body::-webkit-scrollbar-track,.emp-table-wrapper::-webkit-scrollbar-track{background:var(--gray-100);border-radius:3px}.emp-suggestions::-webkit-scrollbar-thumb,.emp-modal-body::-webkit-scrollbar-thumb,.emp-table-wrapper::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}.emp-suggestions::-webkit-scrollbar-thumb:hover,.emp-modal-body::-webkit-scrollbar-thumb:hover,.emp-table-wrapper::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.emp-export-section{background:#fff;border-radius:8px;padding:12px 14px;box-shadow:var(--shadow-md);margin-bottom:16px}.emp-export-header{margin-bottom:10px}.emp-export-header h3{font-size:12px;font-weight:700;color:var(--gray-900);margin:0;text-transform:uppercase;letter-spacing:.4px}.emp-export-buttons{display:flex;gap:10px;flex-wrap:wrap}.emp-export-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:1px solid var(--gray-300);border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:var(--transition);background:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;min-height:32px}.emp-export-btn svg{width:16px;height:16px}.emp-export-btn span{font-size:11px}.emp-export-excel{color:#1f7e34;border-color:#1f7e34}.emp-export-excel:hover{background:#e8f5e9;border-color:#1f7e34;transform:translateY(-1px);box-shadow:0 2px 6px #1f7e3433}.emp-export-csv{color:#06c;border-color:#06c}.emp-export-csv:hover{background:#e3f2fd;border-color:#06c;transform:translateY(-1px);box-shadow:0 2px 6px #06c3}.emp-export-pdf{color:#d32f2f;border-color:#d32f2f}.emp-export-pdf:hover{background:#ffebee;border-color:#d32f2f;transform:translateY(-1px);box-shadow:0 2px 6px #d32f2f33}.emp-export-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}@media(max-width:1024px){.emp-stats-grid{grid-template-columns:repeat(3,1fr)}.emp-header{flex-direction:column;align-items:flex-start}.emp-header-right{width:100%}.emp-modal{max-width:90%}}@media(max-width:768px){.panel-container-employee{padding:12px}.emp-header{padding:12px;margin-bottom:12px}.emp-header-title{font-size:14px}.emp-header-subtitle{font-size:11px}.emp-stats-grid{grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px}.emp-stat-card{padding:12px}.emp-stat-value{font-size:16px}.emp-stat-label{font-size:11px}.emp-table-wrapper{max-height:400px}.emp-table{font-size:11px}.emp-table thead th{padding:8px 10px;font-size:10px;height:32px}.emp-table tbody td{padding:6px 10px;font-size:11px;height:32px}.emp-action-btn{width:28px;height:28px}.emp-action-btn svg{width:14px;height:14px}.emp-modal{max-width:85%}.emp-pagination{padding:10px 12px;gap:6px}.emp-pagination-info{min-width:auto;font-size:10px}.emp-export-btn{padding:6px 12px;font-size:10px;min-height:30px}.emp-export-btn svg{width:14px;height:14px}}@media(max-width:480px){.panel-container-employee{padding:8px}.emp-header{padding:10px;margin-bottom:10px;flex-direction:column;align-items:flex-start}.emp-header-left{width:100%;min-width:auto}.emp-header-icon{width:36px;height:36px}.emp-header-icon svg{width:18px;height:18px}.emp-header-title{font-size:13px}.emp-header-subtitle{font-size:10px}.emp-header-right{width:100%;flex-direction:column}.emp-btn{width:100%;padding:6px 10px;font-size:11px}.emp-stats-grid{grid-template-columns:1fr;gap:8px;margin-bottom:10px}.emp-stat-card{padding:10px}.emp-stat-value{font-size:14px}.emp-stat-label{font-size:10px}.emp-search-box{padding:8px 10px;gap:6px}.emp-search-input{font-size:11px}.emp-table-wrapper{max-height:300px}.emp-table{font-size:10px}.emp-table thead th{padding:6px 8px;font-size:9px;height:28px}.emp-table tbody td{padding:5px 8px;font-size:10px;height:28px}.emp-action-btn{width:24px;height:24px}.emp-action-btn svg{width:12px;height:12px}.emp-modal{max-width:95%;max-height:80vh}.emp-modal-header{padding:10px 12px}.emp-modal-title-section h2{font-size:12px}.emp-modal-body{padding:12px}.emp-form-label{font-size:10px}.emp-form-input,.emp-form-select{padding:6px 8px;font-size:11px}.emp-form-actions{flex-direction:column;gap:8px;margin-top:6px}.emp-form-actions .emp-btn{padding:6px 10px;font-size:11px}.emp-pagination{flex-direction:column;padding:10px 12px;gap:6px}.emp-pagination-btn{width:100%;padding:6px 10px;font-size:10px}.emp-pagination-goto{width:100%;justify-content:space-between;font-size:10px}.emp-pagination-input{width:45px;padding:5px 6px;font-size:10px}.emp-pagination-info{width:100%;font-size:10px;min-width:auto}.emp-export-section{padding:10px 12px;margin-bottom:10px}.emp-export-header h3{font-size:11px;margin-bottom:8px}.emp-export-buttons{flex-direction:column;gap:8px}.emp-export-btn{width:100%;padding:6px 10px;font-size:10px;min-height:28px}.emp-export-btn svg{width:14px;height:14px}.emp-export-btn span{font-size:10px}}@media(prefers-color-scheme:dark){:root{--gray-50: #1F2937;--gray-100: #2D3748;--gray-200: #374151;--gray-300: #4B5563;--gray-400: #6B7280;--gray-500: #9CA3AF;--gray-600: #D1D5DB;--gray-700: #E5E7EB;--gray-800: #F3F4F6;--gray-900: #F9FAFB}.panel-container-employee{background:linear-gradient(135deg,#1f2937,#111827)}.emp-header,.emp-table-card,.emp-modal,.emp-pagination,.emp-search-box,.emp-stat-card,.emp-export-section{background:#2d3748;color:#f9fafb}.emp-table thead{background:linear-gradient(135deg,#111827,#1f2937)}.emp-table tbody tr:hover{background:#374151}.emp-table tbody td{color:#e5e7eb}.emp-form-input,.emp-form-select{background:#374151;color:#f9fafb;border-color:#4b5563}.emp-suggestions{background:#374151;border-color:#4b5563}.emp-suggestion-item:hover{background:#4b5563}.emp-modal-header{background:linear-gradient(135deg,#2d3748,#1f2937);border-bottom-color:#4b5563}.emp-stat-value{color:#f9fafb}.emp-stat-label{color:#9ca3af}.emp-pagination-btn{background:#374151;border-color:#4b5563;color:#e5e7eb}.emp-pagination-btn:hover:not(:disabled){background:var(--primary);border-color:var(--primary)}.emp-header-title,.emp-modal-title-section h2,.emp-form-label,.emp-export-header h3{color:#f9fafb}.emp-header-subtitle{color:#9ca3af}.emp-btn-secondary{background:#374151;color:#e5e7eb;border-color:#4b5563}.emp-btn-secondary:hover{background:#4b5563}.emp-export-btn{background:#374151;border-color:#4b5563}.emp-export-excel:hover{background:#1f4620}.emp-export-csv:hover{background:#1e3a8a}.emp-export-pdf:hover{background:#7f1d1d}}.emp-btn:focus-visible,.emp-action-btn:focus-visible,.emp-form-input:focus-visible,.emp-form-select:focus-visible,.emp-pagination-btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@media print{.emp-header,.emp-search-section,.emp-pagination,.emp-export-section,.emp-action-btn,.emp-btn{display:none}.emp-table-wrapper{max-height:none;overflow:visible}.emp-modal-overlay{display:none}.panel-container-employee{background:#fff;padding:0}}.panel-container-payroll{padding:16px;background:linear-gradient(135deg,#abaeb1,#d1d8df 50%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh}.payroll-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding:16px 20px;background:#fff;border-radius:8px;box-shadow:0 2px 6px #0000000f;flex-wrap:wrap;gap:12px}.payroll-header-left{display:flex;align-items:center;gap:12px}.payroll-dashboard-title{font-size:22px;font-weight:700;color:#1a1a1a;margin:0;display:flex;align-items:center;gap:10px}.payroll-title-icon{font-size:26px;color:#2d3748}.payroll-header-right{display:flex;gap:8px;flex-wrap:wrap}.common-add-btn-payroll,.common-refresh-btn-payroll{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap;text-transform:uppercase;letter-spacing:.5px}.common-add-btn-payroll{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33}.common-add-btn-payroll:hover{background:#2d2d2d;transform:translateY(-2px);box-shadow:0 4px 12px #1a1a1a4d}.common-refresh-btn-payroll{background:#6c757d;color:#fff;box-shadow:0 2px 8px #6c757d33}.common-refresh-btn-payroll:hover{background:#5a6268;transform:translateY(-2px);box-shadow:0 4px 12px #6c757d4d}.payroll-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:16px}.payroll-stat-card{background:#fff;padding:16px;border-radius:8px;box-shadow:0 2px 6px #0000000f;display:flex;align-items:center;gap:12px;transition:all .3s ease}.payroll-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.payroll-stat-icon{width:48px;height:48px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.payroll-stat-icon.total{background:#3b82f6}.payroll-stat-icon.active{background:#10b981}.payroll-stat-icon.recent{background:#8b5cf6}.payroll-stat-content{flex:1}.payroll-stat-number{font-size:20px;font-weight:700;color:#1a1a1a;margin-bottom:2px}.payroll-stat-label{font-size:12px;color:#6b7280;font-weight:500}.payroll-controls-section{display:flex;justify-content:flex-start;gap:16px;margin-bottom:16px}.payroll-search-box{flex:1;min-width:250px}.payroll-search-input{width:100%;padding:10px 14px;border:2px solid #e9ecef;border-radius:6px;font-size:13px;color:#2d3748;background:#fff;transition:all .3s ease}.payroll-search-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 3px #4950571a}.payroll-search-input::placeholder{color:#adb5bd}.payroll-table-section{background:#fff;border-radius:8px;box-shadow:0 2px 6px #0000000f;overflow:hidden;margin-bottom:16px}.payroll-table-wrapper{overflow-x:auto;max-height:600px;position:relative}.payroll-data-table{width:100%;border-collapse:collapse;font-size:13px;background:#fff}.payroll-data-table thead{background:#2d3748;position:sticky;top:0;z-index:10}.payroll-data-table thead th{padding:12px 14px;text-align:left;font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:12px;color:#fff;border-bottom:2px solid #1a1a1a;white-space:nowrap}.payroll-data-table tbody tr{border-bottom:1px solid #e9ecef;transition:all .2s ease}.payroll-data-table tbody tr:hover{background:#f8f9fa}.payroll-data-table tbody td{padding:12px 14px;color:#2d3748;vertical-align:middle}.payroll-id-cell{font-weight:600;color:#6b7280;width:50px}.payroll-id-badge{display:inline-block;background:#f3f4f6;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600}.payroll-name-cell{font-weight:600;color:#1a1a1a;min-width:150px}.payroll-name-text{display:block;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.payroll-time-cell{min-width:100px}.payroll-time-badge{display:inline-flex;align-items:center;gap:6px;background:#dbeafe;color:#1e40af;padding:6px 10px;border-radius:4px;font-size:12px;font-weight:600}.payroll-user-cell{min-width:100px}.payroll-user-badge{display:inline-flex;align-items:center;gap:4px;background:#f3e8ff;color:#6b21a8;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.payroll-date-cell{color:#6b7280;font-size:12px;min-width:100px}.payroll-table-actions{width:120px;text-align:center}.payroll-actions-group{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.payroll-action-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:none;border-radius:4px;cursor:pointer;transition:all .3s ease;background:#f8f9fa;border:1px solid #dee2e6}.payroll-action-btn:hover{transform:translateY(-2px);box-shadow:0 2px 6px #0000001a}.payroll-action-btn.edit{color:#0d6efd}.payroll-action-btn.edit:hover{background:#e7f1ff}.payroll-action-btn.delete{color:#dc3545}.payroll-action-btn.delete:hover{background:#f8d7da}.payroll-pagination-section{background:#fff;border-radius:8px;padding:12px 16px;box-shadow:0 2px 6px #0000000f;margin-bottom:16px}.payroll-pagination-controls{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}.payroll-pagination-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;background:#fff;border:2px solid #e9ecef;border-radius:4px;cursor:pointer;transition:all .3s ease;color:#495057;font-weight:600;font-size:14px;white-space:nowrap}.payroll-pagination-btn:hover:not(:disabled){background:#2d3748;border-color:#2d3748;color:#fff;transform:translateY(-2px)}.payroll-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.payroll-pagination-goto{display:flex;align-items:center;gap:8px;font-size:13px;color:#495057;font-weight:600}.payroll-pagination-input{width:60px;padding:6px 8px;border:2px solid #e9ecef;border-radius:4px;text-align:center;font-size:13px;font-weight:600;color:#1a1a1a}.payroll-pagination-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 3px #4950571a}.payroll-pagination-info{font-size:13px;color:#495057;font-weight:600;min-width:200px;text-align:center}.payroll-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;color:#6b7280}.payroll-no-data-image{max-width:150px;margin-bottom:16px;opacity:.6}.payroll-no-data-container p{font-size:14px;margin:0}.payroll-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;background:#fff;border-radius:8px;margin:40px auto;max-width:500px}.payroll-spinner{width:40px;height:40px;border:4px solid #e9ecef;border-top-color:#2d3748;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.payroll-loading-panel p{font-size:14px;color:#495057;margin:0}.payroll-modal-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.payroll-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:500px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.payroll-modal-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.payroll-modal-header-content{display:flex;align-items:center;gap:12px;flex:1}.payroll-modal-header-icon{flex-shrink:0;opacity:.9}.payroll-modal-header-text{flex:1}.payroll-modal-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.payroll-modal-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0;font-size:18px;font-weight:700}.payroll-modal-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.payroll-modal-body{flex:1;overflow-y:auto;padding:20px}.payroll-form{display:flex;flex-direction:column;gap:16px}.payroll-form-group{display:flex;flex-direction:column;gap:6px}.payroll-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.payroll-input,.payroll-select,.payroll-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.payroll-input::placeholder,.payroll-textarea::placeholder{color:#d1d5db}.payroll-input:focus,.payroll-select:focus,.payroll-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.payroll-textarea{resize:vertical;min-height:80px}.payroll-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.payroll-cancel-btn,.payroll-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.payroll-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.payroll-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.payroll-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.payroll-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.payroll-submit-btn:disabled,.payroll-cancel-btn:disabled{opacity:.6;cursor:not-allowed}.payroll-table-wrapper::-webkit-scrollbar,.payroll-modal-body::-webkit-scrollbar{width:6px}.payroll-table-wrapper::-webkit-scrollbar-track,.payroll-modal-body::-webkit-scrollbar-track{background:#f9fafb}.payroll-table-wrapper::-webkit-scrollbar-thumb,.payroll-modal-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.payroll-table-wrapper::-webkit-scrollbar-thumb:hover,.payroll-modal-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.panel-container-payroll{padding:12px}.payroll-dashboard-header{flex-direction:column;align-items:flex-start}.payroll-header-right{width:100%;justify-content:flex-start}.payroll-stats-grid{grid-template-columns:repeat(2,1fr)}.payroll-modal{max-width:95%}.payroll-table-wrapper{max-height:400px}}@media(max-width:480px){.payroll-dashboard-title{font-size:18px}.payroll-stats-grid{grid-template-columns:1fr}.payroll-stat-card{padding:12px}.payroll-stat-number{font-size:18px}.payroll-stat-label{font-size:11px}.payroll-modal{max-width:100%;border-radius:6px}.payroll-data-table{font-size:11px}.payroll-data-table thead th,.payroll-data-table tbody td{padding:8px 6px}.payroll-pagination-controls{gap:8px}.payroll-pagination-btn{padding:6px 10px;font-size:12px}.payroll-form-actions{flex-direction:column-reverse;gap:8px}.payroll-cancel-btn,.payroll-submit-btn{width:100%}}.payroll-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.payroll-desc-cell{min-width:120px}.payroll-desc-badge{display:inline-block;background:#fef08a;color:#854d0e;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.payroll-empty-badge{display:inline-block;background:#f3f4f6;color:#9ca3af;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}@media(max-width:768px){.payroll-form-row{grid-template-columns:1fr}}.ts-container{padding:15px;background:#f8f9fa;min-height:100vh}.ts-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;background:#fff;border-radius:6px;padding:30px}.ts-spinner{width:30px;height:30px;border:3px solid #e0e0e0;border-top:3px solid #3182ce;border-radius:50%;animation:spin 1s linear infinite}.ts-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;background:#fff;padding:12px 15px;border-radius:6px;box-shadow:0 1px 3px #0000001a}.ts-header-left{display:flex;align-items:center}.ts-title{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:700;color:#2d3748;margin:0}.ts-header-right{display:flex;gap:8px}.ts-btn{display:flex;align-items:center;gap:5px;padding:8px 12px;border:none;border-radius:5px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease}.ts-btn-add{background:#48bb78;color:#fff}.ts-btn-add:hover{background:#38a169}.ts-btn-refresh{background:#4299e1;color:#fff;padding:8px}.ts-btn-refresh:hover{background:#3182ce}.ts-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:15px}.ts-stat{background:#fff;border-radius:6px;padding:12px;text-align:center;box-shadow:0 1px 3px #0000001a}.ts-stat-value{font-size:20px;font-weight:700;color:#2d3748}.ts-stat-label{font-size:11px;color:#718096;margin-top:4px}.ts-search{margin-bottom:15px}.ts-search-input{width:100%;padding:8px 12px;border:1px solid #cbd5e0;border-radius:5px;font-size:13px}.ts-search-input:focus{outline:none;border-color:#3182ce;box-shadow:0 0 0 2px #3182ce1a}.ts-table-wrapper{background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 1px 3px #0000001a;margin-bottom:15px;overflow-x:auto}.ts-table{width:100%;border-collapse:collapse;font-size:12px}.ts-table thead{background:#2d3748;color:#fff}.ts-table th{padding:10px;text-align:left;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.ts-table tbody tr{border-bottom:1px solid #e2e8f0;transition:background-color .2s}.ts-table tbody tr:hover{background-color:#f7fafc}.ts-table td{padding:10px;color:#2d3748}.ts-name{font-weight:600}.ts-date{color:#718096}.ts-day{background:#edf2f7;padding:4px 8px;border-radius:3px;display:inline-block}.ts-badge{display:inline-block;padding:4px 8px;border-radius:3px;font-size:11px;font-weight:600}.ts-badge-no-pay{background:#fed7d7;color:#742a2a}.ts-badge-pay-only{background:#bee3f8;color:#2c5282}.ts-badge-pay-with-ot{background:#c6f6d5;color:#22543d}.ts-ot{font-weight:600;color:#3182ce}.ts-status{display:inline-block;padding:4px 8px;border-radius:3px;font-size:11px;font-weight:600}.ts-status.active{background:#c6f6d5;color:#22543d}.ts-status.inactive{background:#fed7d7;color:#742a2a}.ts-actions{display:flex;gap:6px;justify-content:center}.ts-action-btn{padding:6px;border:none;border-radius:4px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.ts-action-btn.edit{background:#bee3f8}.ts-action-btn.edit:hover{background:#90cdf4}.ts-action-btn.delete{background:#fed7d7}.ts-action-btn.delete:hover{background:#fc8181}.ts-action-btn img{width:14px;height:14px}.ts-no-data{text-align:center}.ts-no-data-img{width:80px;height:80px;opacity:.4;margin-bottom:10px}.ts-no-data p{color:#718096;margin:0}.ts-pagination{display:flex;align-items:center;justify-content:center;gap:10px;background:#fff;padding:12px;border-radius:6px;box-shadow:0 1px 3px #0000001a}.ts-pag-btn{padding:6px 10px;border:1px solid #cbd5e0;background:#fff;border-radius:4px;cursor:pointer;font-size:12px;transition:all .2s}.ts-pag-btn:hover:not(:disabled){background:#3182ce;color:#fff;border-color:#3182ce}.ts-pag-btn:disabled{opacity:.5;cursor:not-allowed}.ts-pag-goto{display:flex;align-items:center;gap:6px;font-size:12px}.ts-pag-input{width:50px;padding:5px;border:1px solid #cbd5e0;border-radius:4px;font-size:12px;text-align:center}.ts-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.ts-modal{background:#fff;border-radius:8px;width:90%;max-width:450px;max-height:85vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.ts-modal-header{display:flex;justify-content:space-between;align-items:center;padding:15px;border-bottom:1px solid #e2e8f0;background:#f7fafc}.ts-modal-header h2{font-size:16px;font-weight:700;color:#2d3748;margin:0}.ts-close-btn{background:none;border:none;font-size:20px;cursor:pointer;color:#718096}.ts-close-btn:hover{color:#2d3748}.ts-form{padding:15px;display:flex;flex-direction:column;gap:12px}.ts-form-group{display:flex;flex-direction:column}.ts-form-group label{font-size:12px;font-weight:600;color:#4a5568;margin-bottom:4px}.ts-form-group input,.ts-form-group select{padding:8px 10px;border:1px solid #cbd5e0;border-radius:5px;font-size:13px;font-family:inherit}.ts-form-group input:focus,.ts-form-group select:focus{outline:none;border-color:#3182ce;box-shadow:0 0 0 2px #3182ce1a}.ts-form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ts-form-group.checkbox{flex-direction:row;align-items:center}.ts-form-group.checkbox label{display:flex;align-items:center;gap:6px;margin-bottom:0}.ts-form-group.checkbox input{width:16px;height:16px}.ts-form-actions{display:flex;gap:8px;margin-top:8px}.ts-btn-cancel,.ts-btn-submit{flex:1;padding:10px;border:none;border-radius:5px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.ts-btn-cancel{background:#e2e8f0;color:#2d3748}.ts-btn-cancel:hover:not(:disabled){background:#cbd5e0}.ts-btn-submit{background:#3182ce;color:#fff}.ts-btn-submit:hover:not(:disabled){background:#2c5aa0}.ts-btn-cancel:disabled,.ts-btn-submit:disabled{opacity:.6;cursor:not-allowed}.ts-btn-sync{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #667eea4d}.ts-btn-sync:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.ts-btn-sync:active:not(:disabled){transform:translateY(0)}.ts-btn-sync:disabled{opacity:.7;cursor:not-allowed}.ts-btn-sync svg.spinning{animation:spin 1s linear infinite}.ts-header-right{display:flex;align-items:center;gap:8px}.sm-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.sm-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.sm-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.sm-header-icon{font-size:18px}.sm-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.sm-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.sm-buttons-row::-webkit-scrollbar{height:4px}.sm-buttons-row::-webkit-scrollbar-track{background:transparent}.sm-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.sm-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.sm-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.sm-btn-with-label.active{border-color:#667eea;background:#f0f4ff;color:#667eea}.sm-btn-icon{font-size:14px}.sm-btn-text{display:inline-block}.sm-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.sm-close-all-compact:hover{background:#fecaca;color:#dc2626}.sm-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.sm-tab-content{animation:slideIn .2s ease-out}.sm-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.sm-empty-icon{font-size:64px;opacity:.4}.sm-empty p{font-size:14px;margin:0;color:#9ca3af}.sm-content::-webkit-scrollbar{width:8px}.sm-content::-webkit-scrollbar-track{background:transparent}.sm-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.sm-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.sm-button-bar{height:52px;gap:8px}.sm-btn-with-label{padding:6px 10px;font-size:11px}.sm-btn-icon{font-size:13px}.sm-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.sm-header-compact{height:44px;padding:0 12px}.sm-header-title{font-size:14px;gap:8px}.sm-header-icon{font-size:16px}.sm-button-bar{height:48px;padding:0 8px;gap:6px}.sm-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.sm-btn-icon{font-size:12px}.sm-close-all-compact{padding:6px 8px;font-size:10px}.sm-content{padding:16px}}@media(max-width:480px){.sm-header-compact{height:40px;padding:0 8px}.sm-header-title{font-size:12px;gap:6px}.sm-header-icon{font-size:14px}.sm-button-bar{height:44px;padding:0 6px;gap:4px}.sm-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.sm-btn-icon{font-size:11px}.sm-btn-text{display:none}.sm-close-all-compact{padding:4px 6px;font-size:9px}.sm-close-all-compact span{display:none}.sm-content{padding:12px}}.add-employee-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.add-employee-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid var(--border-gray)}.add-employee-header{background:var(--primary-black);color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--secondary-black)}.add-employee-header-content{display:flex;align-items:center;gap:12px;flex:1}.add-employee-header-icon{flex-shrink:0;opacity:.9}.add-employee-header-text{flex:1}.add-employee-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.add-employee-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.add-employee-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0;position:relative;overflow:hidden}.add-employee-close-btn:hover:not(:disabled){background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d,inset 0 0 10px #ffffff1a}.add-employee-close-btn:active:not(:disabled){transform:scale(.95) rotate(90deg)}.add-employee-close-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.add-employee-close-btn:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.add-employee-close-btn svg{width:18px;height:18px;stroke-width:2.5}.add-employee-close-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff80;transform:translate(-50%,-50%);pointer-events:none}.add-employee-close-btn:active:not(:disabled):before{animation:ripple .6s ease-out}@keyframes ripple{to{width:60px;height:60px;opacity:0}}.add-employee-tabs{display:flex;background:var(--light-gray);border-bottom:1px solid var(--border-gray);padding:0;gap:0}.add-employee-tab{flex:1;padding:12px 16px;border:none;background:transparent;color:var(--text-gray);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:6px;border-bottom:3px solid transparent;position:relative}.add-employee-tab svg{flex-shrink:0}.add-employee-tab:hover:not(:disabled){background:#1a1a1a0d;color:var(--text-dark)}.add-employee-tab.active{background:#fff;color:var(--primary-black);border-bottom-color:var(--primary-black)}.add-employee-tab:disabled{opacity:.6;cursor:not-allowed}.add-employee-tab-required{color:var(--error-red);font-size:10px;font-weight:700}.add-employee-body{flex:1;overflow-y:auto;padding:0}.add-employee-form{padding:20px}.add-employee-tab-content{animation:fadeIn .2s ease-out}.add-employee-tab-header{margin-bottom:20px}.add-employee-tab-header h3{font-size:16px;font-weight:700;color:var(--text-dark);margin:0 0 4px}.add-employee-tab-header p{font-size:12px;color:var(--text-gray);margin:0;font-weight:500}.add-employee-form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.add-employee-form-group:last-of-type{margin-bottom:0}.add-employee-label{font-size:12px;font-weight:600;color:var(--text-dark);text-transform:uppercase;letter-spacing:.3px;display:flex;align-items:center;gap:4px}.add-employee-label svg{flex-shrink:0;color:var(--primary-black)}.add-employee-required{color:var(--error-red);font-size:14px;font-weight:700}.add-employee-input,.add-employee-select{width:100%;padding:10px 12px;border:1px solid var(--border-gray);border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:var(--text-dark);transition:all .3s ease;outline:none}.add-employee-input::placeholder,.add-employee-select::placeholder{color:#d1d5db}.add-employee-input:focus,.add-employee-select:focus{border-color:var(--primary-black);box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.add-employee-input:disabled,.add-employee-select:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed;opacity:.6}.add-employee-input.error{border-color:var(--error-red);box-shadow:0 0 0 3px #ef44441a}.add-employee-input.error:focus{border-color:var(--error-red);box-shadow:0 0 0 3px #ef444426}.add-employee-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.add-employee-select option{color:var(--text-dark);background:#fff;padding:8px}.add-employee-hint{font-size:11px;color:var(--text-gray);font-weight:500;display:block}.add-employee-error{font-size:11px;color:var(--error-red);font-weight:600;display:flex;align-items:center;gap:4px}.add-employee-info-box{display:flex;align-items:flex-start;gap:10px;padding:12px;background:#3b82f61a;border:1px solid rgba(59,130,246,.3);border-radius:6px;margin-top:16px;color:#1e40af;font-size:12px;font-weight:500}.add-employee-info-box svg{flex-shrink:0;margin-top:2px}.add-employee-info-box p{margin:0}.add-employee-file-upload{position:relative;border:2px dashed var(--border-gray);border-radius:6px;background:var(--light-gray);padding:16px;text-align:center;transition:all .3s ease;cursor:pointer}.add-employee-file-upload:hover{border-color:var(--primary-black);background:#1a1a1a05}.add-employee-file-input{display:none}.add-employee-file-label{display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer}.add-employee-file-icon{width:40px;height:40px;border-radius:6px;background:var(--primary-black);display:flex;align-items:center;justify-content:center;color:#fff}.add-employee-file-text{display:flex;flex-direction:column;gap:2px}.add-employee-file-main{font-size:13px;font-weight:600;color:var(--text-dark);display:block}.add-employee-file-sub{font-size:11px;color:var(--text-gray);display:block}.add-employee-image-preview{position:relative;width:100%;max-width:150px;margin-top:12px;border-radius:6px;overflow:hidden;box-shadow:0 2px 8px #0000001a}.add-employee-image-preview img{width:100%;height:auto;display:block;border-radius:6px}.add-employee-preview-remove{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;background:#0009;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;transition:all .2s ease}.add-employee-preview-remove:hover{background:#000c;transform:scale(1.1)}.add-employee-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border-gray)}.add-employee-cancel-btn,.add-employee-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.add-employee-cancel-btn{background:var(--light-gray);color:var(--text-gray);border:1px solid var(--border-gray)}.add-employee-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.add-employee-submit-btn{background:var(--primary-black);color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.add-employee-submit-btn:hover:not(:disabled){background:var(--secondary-black);transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.add-employee-submit-btn:active:not(:disabled){transform:translateY(0)}.add-employee-submit-btn:disabled,.add-employee-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.add-employee-spinner{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.add-employee-body::-webkit-scrollbar{width:6px}.add-employee-body::-webkit-scrollbar-track{background:#f9fafb}.add-employee-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-employee-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.add-employee-modal{max-width:95%;max-height:90vh}.add-employee-header{padding:12px}.add-employee-title{font-size:16px}.add-employee-subtitle{font-size:11px}.add-employee-tabs{padding:0}.add-employee-tab{padding:10px 12px;font-size:11px;gap:4px}.add-employee-tab svg{width:14px;height:14px}.add-employee-form{padding:16px}.add-employee-tab-header h3{font-size:14px}.add-employee-form-group{margin-bottom:14px}.add-employee-input,.add-employee-select{padding:8px 10px;font-size:12px}.add-employee-file-upload{padding:12px}.add-employee-file-icon{width:36px;height:36px}.add-employee-file-main{font-size:12px}.add-employee-file-sub{font-size:10px}.add-employee-cancel-btn,.add-employee-submit-btn{padding:8px 12px;font-size:11px;min-height:36px}.add-employee-actions{gap:8px;margin-top:16px;padding-top:12px}}@media(max-width:480px){.add-employee-overlay{padding:8px}.add-employee-modal{max-width:100%;border-radius:6px}.add-employee-header{padding:10px;gap:8px}.add-employee-header-content{gap:8px}.add-employee-title{font-size:14px}.add-employee-subtitle{font-size:10px}.add-employee-close-btn{width:28px;height:28px}.add-employee-tabs{flex-wrap:wrap}.add-employee-tab{flex:1;min-width:80px;padding:8px 10px;font-size:10px}.add-employee-tab span:last-child{display:none}.add-employee-form{padding:12px}.add-employee-tab-header h3{font-size:13px}.add-employee-tab-header p,.add-employee-label{font-size:11px}.add-employee-form-group{margin-bottom:12px;gap:4px}.add-employee-input,.add-employee-select{padding:8px 10px;font-size:12px}.add-employee-hint,.add-employee-error{font-size:10px}.add-employee-info-box{padding:10px;font-size:11px;gap:8px}.add-employee-file-upload{padding:12px}.add-employee-file-icon{width:32px;height:32px}.add-employee-file-main{font-size:11px}.add-employee-file-sub{font-size:9px}.add-employee-image-preview{max-width:120px}.add-employee-cancel-btn,.add-employee-submit-btn{padding:8px 12px;font-size:10px;min-height:34px;flex:1}.add-employee-submit-btn{min-width:auto}.add-employee-actions{flex-direction:column-reverse;gap:6px;margin-top:14px;padding-top:10px}}@media print{.add-employee-overlay{display:none}}.add-employee-bank-autocomplete,.add-employee-autocomplete-wrapper{position:relative}.add-employee-autocomplete-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#9ca3af;pointer-events:none}.add-employee-suggestions-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #D1D5DB;border-top:none;border-radius:0 0 6px 6px;max-height:200px;overflow-y:auto;z-index:101;box-shadow:0 10px 15px -3px #0000001a;margin-top:-1px}.add-employee-suggestion-item{padding:10px 12px;cursor:pointer;border-bottom:1px solid #F3F4F6;transition:all .2s ease;background-color:#fff;display:flex;justify-content:space-between;align-items:center;gap:8px}.add-employee-suggestion-item:hover{background-color:#f3f4f6;padding-left:14px}.add-employee-suggestion-item:last-child{border-bottom:none}.add-employee-suggestion-name{font-weight:500;color:#111827;font-size:12px;flex:1}.add-employee-suggestion-code{font-size:10px;color:#9ca3af;background:#f9fafb;padding:2px 6px;border-radius:3px;font-weight:600;white-space:nowrap}.add-employee-suggestions-dropdown::-webkit-scrollbar{width:6px}.add-employee-suggestions-dropdown::-webkit-scrollbar-track{background:#f3f4f6;border-radius:3px}.add-employee-suggestions-dropdown::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-employee-suggestions-dropdown::-webkit-scrollbar-thumb:hover{background:#9ca3af}.edit-employee-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.edit-employee-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid var(--border-gray)}.edit-employee-header{background:var(--primary-black);color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--secondary-black)}.edit-employee-header-content{display:flex;align-items:center;gap:12px;flex:1}.edit-employee-header-icon{flex-shrink:0;opacity:.9}.edit-employee-header-text{flex:1}.edit-employee-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.edit-employee-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.edit-employee-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0;position:relative;overflow:hidden}.edit-employee-close-btn:hover:not(:disabled){background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d,inset 0 0 10px #ffffff1a}.edit-employee-close-btn:active:not(:disabled){transform:scale(.95) rotate(90deg)}.edit-employee-close-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.edit-employee-close-btn:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.edit-employee-close-btn svg{width:18px;height:18px;stroke-width:2.5}.edit-employee-body{flex:1;overflow-y:auto;padding:0}.edit-employee-form{padding:20px}.edit-employee-section{margin-bottom:24px}.edit-employee-section:last-of-type{margin-bottom:0}.edit-employee-section-title{font-size:14px;font-weight:700;color:var(--text-dark);margin:0 0 16px;text-transform:uppercase;letter-spacing:.5px;padding-bottom:8px;border-bottom:2px solid var(--border-gray)}.edit-employee-photo-container{display:flex;gap:20px;align-items:flex-start}.edit-employee-photo-preview,.edit-employee-photo-placeholder{position:relative;width:120px;height:120px;border-radius:8px;background:var(--light-gray);display:flex;align-items:center;justify-content:center;flex-shrink:0;border:2px solid var(--border-gray);overflow:hidden}.edit-employee-photo-preview img{width:100%;height:100%;object-fit:cover}.edit-employee-photo-placeholder{color:var(--text-gray);flex-direction:column;gap:8px;font-size:12px}.edit-employee-photo-placeholder svg{opacity:.5}.edit-employee-photo-remove{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:50%;background:#000000b3;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;transition:all .2s ease}.edit-employee-photo-remove:hover{background:#000000e6;transform:scale(1.1)}.edit-employee-photo-upload{flex:1;display:flex;flex-direction:column;gap:8px}.edit-employee-file-input{display:none}.edit-employee-upload-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;background:var(--primary-black);color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease}.edit-employee-upload-btn:hover{background:var(--secondary-black);transform:translateY(-1px)}.edit-employee-upload-hint{font-size:11px;color:var(--text-gray);margin:0}.edit-employee-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.edit-employee-form-group{display:flex;flex-direction:column;gap:6px}.edit-employee-label{font-size:12px;font-weight:600;color:var(--text-dark);text-transform:uppercase;letter-spacing:.3px;display:flex;align-items:center;gap:4px}.edit-employee-label svg{flex-shrink:0;color:var(--primary-black)}.edit-employee-input,.edit-employee-select{width:100%;padding:10px 12px;border:1px solid var(--border-gray);border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:var(--text-dark);transition:all .3s ease;outline:none}.edit-employee-input::placeholder{color:#d1d5db}.edit-employee-input:focus,.edit-employee-select:focus{border-color:var(--primary-black);box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.edit-employee-input:disabled,.edit-employee-select:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed;opacity:.6}.edit-employee-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.edit-employee-select option{color:var(--text-dark);background:#fff;padding:8px}.edit-employee-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px;padding-top:16px;border-top:1px solid var(--border-gray)}.edit-employee-cancel-btn,.edit-employee-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.edit-employee-cancel-btn{background:var(--light-gray);color:var(--text-gray);border:1px solid var(--border-gray)}.edit-employee-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.edit-employee-submit-btn{background:var(--primary-black);color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.edit-employee-submit-btn:hover:not(:disabled){background:var(--secondary-black);transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.edit-employee-submit-btn:active:not(:disabled){transform:translateY(0)}.edit-employee-submit-btn:disabled,.edit-employee-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.edit-employee-spinner{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.edit-employee-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.edit-employee-loading-panel .edit-employee-spinner{width:40px;height:40px;border:4px solid #e9ecef;border-top-color:#2d3748;margin-bottom:16px}.edit-employee-loading-panel p{font-size:14px;color:#495057;margin:0}.edit-employee-body::-webkit-scrollbar{width:6px}.edit-employee-body::-webkit-scrollbar-track{background:#f9fafb}.edit-employee-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.edit-employee-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.edit-employee-modal{max-width:95%;max-height:90vh}.edit-employee-header{padding:12px}.edit-employee-title{font-size:16px}.edit-employee-subtitle{font-size:11px}.edit-employee-form{padding:16px}.edit-employee-form-row{grid-template-columns:1fr;gap:12px}.edit-employee-photo-container{flex-direction:column;align-items:center}.edit-employee-photo-preview,.edit-employee-photo-placeholder{width:100px;height:100px}.edit-employee-input,.edit-employee-select{padding:8px 10px;font-size:12px}.edit-employee-cancel-btn,.edit-employee-submit-btn{padding:8px 12px;font-size:11px;min-height:36px}.edit-employee-actions{gap:8px;margin-top:16px;padding-top:12px}}@media(max-width:480px){.edit-employee-overlay{padding:8px}.edit-employee-modal{max-width:100%;border-radius:6px}.edit-employee-header{padding:10px;gap:8px}.edit-employee-header-content{gap:8px}.edit-employee-title{font-size:14px}.edit-employee-subtitle{font-size:10px}.edit-employee-close-btn{width:36px;height:36px}.edit-employee-form{padding:12px}.edit-employee-form-row{grid-template-columns:1fr}.edit-employee-section-title{font-size:12px;margin-bottom:12px}.edit-employee-label{font-size:11px}.edit-employee-input,.edit-employee-select{padding:8px 10px;font-size:12px}.edit-employee-photo-preview,.edit-employee-photo-placeholder{width:80px;height:80px}.edit-employee-cancel-btn,.edit-employee-submit-btn{padding:8px 12px;font-size:10px;min-height:34px;flex:1}.edit-employee-submit-btn{min-width:auto}.edit-employee-actions{flex-direction:column-reverse;gap:6px;margin-top:14px;padding-top:10px}}.edit-employee-input-error{border-color:#ef4444!important;background-color:#fef2f2}.edit-employee-input-error:focus{border-color:#ef4444!important;box-shadow:0 0 0 3px #ef44441a!important}.edit-employee-error{display:flex;align-items:center;gap:6px;font-size:11px;color:#ef4444;margin-top:4px;font-weight:500}.edit-employee-error svg{width:12px;height:12px;flex-shrink:0}.edit-employee-required{color:#ef4444;font-weight:700;margin-left:2px}.edit-employee-disabled{background-color:#f3f4f6!important;color:#6b7280!important;cursor:not-allowed!important;border-color:#e5e7eb!important}.edit-employee-hint{display:block;font-size:10px;color:#6b7280;margin-top:4px;font-weight:400}.edit-employee-bank-autocomplete,.edit-employee-autocomplete-wrapper{position:relative}.edit-employee-autocomplete-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#9ca3af;pointer-events:none}.edit-employee-suggestions-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #D1D5DB;border-top:none;border-radius:0 0 6px 6px;max-height:200px;overflow-y:auto;z-index:101;box-shadow:0 10px 15px -3px #0000001a;margin-top:-1px}.edit-employee-suggestion-item{padding:10px 12px;cursor:pointer;border-bottom:1px solid #F3F4F6;transition:all .2s ease;background-color:#fff;display:flex;justify-content:space-between;align-items:center;gap:8px}.edit-employee-suggestion-item:hover{background-color:#f3f4f6;padding-left:14px}.edit-employee-suggestion-item:last-child{border-bottom:none}.edit-employee-suggestion-name{font-weight:500;color:#111827;font-size:12px;flex:1}.edit-employee-suggestion-code{font-size:10px;color:#9ca3af;background:#f9fafb;padding:2px 6px;border-radius:3px;font-weight:600;white-space:nowrap}.edit-employee-suggestions-dropdown::-webkit-scrollbar{width:6px}.edit-employee-suggestions-dropdown::-webkit-scrollbar-track{background:#f3f4f6;border-radius:3px}.edit-employee-suggestions-dropdown::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.edit-employee-suggestions-dropdown::-webkit-scrollbar-thumb:hover{background:#9ca3af}.view-employee-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.view-employee-modal{background:#fff;border-radius:8px;box-shadow:0 20px 25px -5px #0000001a;max-width:1000px;width:100%;max-height:700px;overflow-y:auto;animation:slideUp .3s ease-out;display:flex;flex-direction:column}.view-employee-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #E5E7EB;background:linear-gradient(135deg,#eff6ff,#f0f9ff);gap:8px;position:sticky;top:0;z-index:100;flex-shrink:0}.view-employee-header-content{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.view-employee-header-icon{color:#3b82f6;flex-shrink:0;width:18px;height:18px}.view-employee-header-text{flex:1;min-width:0}.view-employee-title{font-size:13px;font-weight:700;color:#111827;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-employee-subtitle{font-size:10px;color:#6b7280;margin:2px 0 0}.view-employee-close-btn{background:none;border:none;font-size:18px;color:#9ca3af;cursor:pointer;transition:all .2s ease;padding:4px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}.view-employee-close-btn:hover{background:#f3f4f6;color:#111827}.view-employee-body{padding:14px;overflow-y:auto;flex:1}.view-employee-profile-section{display:flex;align-items:center;gap:16px;padding:14px;background:#fff;border:1px solid #E5E7EB;border-radius:8px;margin-bottom:14px;box-shadow:0 1px 3px #0000001a}.view-employee-profile-image{position:relative;width:70px;height:70px;flex-shrink:0}.view-employee-profile-image img{width:100%;height:100%;border-radius:8px;object-fit:cover;display:block}.view-employee-profile-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#4f46e5,#7c3aed);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:16px}.view-employee-profile-info{flex:1}.view-employee-profile-name{font-size:15px;font-weight:700;color:#111827;margin:0 0 3px}.view-employee-profile-title{font-size:11px;color:#6b7280;margin:0 0 8px;font-weight:500}.view-employee-profile-meta{display:flex;gap:8px;flex-wrap:wrap}.view-employee-status-badge{display:inline-block;padding:3px 8px;border-radius:6px;font-size:10px;font-weight:600;text-transform:capitalize}.view-employee-status-badge.active{background:#ecfdf5;color:#065f46}.view-employee-status-badge.inactive{background:#fef2f2;color:#991b1b}.view-employee-department-badge{display:inline-block;padding:3px 8px;border-radius:6px;font-size:10px;font-weight:600;background:#eef2ff;color:#3730a3}.view-employee-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.view-employee-card{background:#fff;border:1px solid #E5E7EB;border-radius:8px;overflow:hidden;transition:all .2s ease;display:flex;flex-direction:column}.view-employee-card:hover{border-color:#d1d5db;box-shadow:0 4px 12px -2px #00000014;transform:translateY(-2px)}.view-employee-card-header{display:flex;align-items:center;gap:6px;padding:10px 12px;background:linear-gradient(135deg,#f9fafb,#f3f4f6);border-bottom:1px solid #E5E7EB;flex-shrink:0}.view-employee-card-header svg{width:16px;height:16px;color:#4f46e5;flex-shrink:0}.view-employee-card-header h4{font-size:11px;font-weight:700;color:#111827;margin:0;text-transform:uppercase;letter-spacing:.3px}.view-employee-card-content{padding:10px 12px;display:flex;flex-direction:column;gap:8px;flex:1}.view-employee-info-row{display:flex;flex-direction:column;gap:2px;font-size:11px}.view-employee-label{display:flex;align-items:center;gap:4px;color:#6b7280;font-weight:600;flex-shrink:0}.view-employee-label svg{width:12px;height:12px;color:#9ca3af}.view-employee-value{color:#111827;font-weight:500;word-break:break-word;padding-left:16px;font-size:10px}.view-employee-value.salary{color:#059669;font-weight:700}.view-employee-link{color:#4f46e5;text-decoration:none;transition:all .2s ease;word-break:break-all}.view-employee-link:hover{color:#4338ca;text-decoration:underline}.view-employee-modal::-webkit-scrollbar{width:6px}.view-employee-modal::-webkit-scrollbar-track{background:#f3f4f6}.view-employee-modal::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.view-employee-modal::-webkit-scrollbar-thumb:hover{background:#9ca3af}.view-employee-body::-webkit-scrollbar{width:6px}.view-employee-body::-webkit-scrollbar-track{background:transparent}.view-employee-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.view-employee-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:1200px){.view-employee-grid{grid-template-columns:repeat(3,1fr);gap:10px}.view-employee-modal{max-width:900px}}@media(max-width:768px){.view-employee-grid{grid-template-columns:repeat(2,1fr);gap:10px}.view-employee-modal{max-width:600px;max-height:90vh}.view-employee-profile-section{flex-direction:column;text-align:center;padding:12px;gap:12px}.view-employee-profile-image{width:60px;height:60px}.view-employee-profile-name{font-size:13px}.view-employee-card-header{padding:8px 10px}.view-employee-card-header h4{font-size:10px}.view-employee-card-content{padding:8px 10px;gap:6px}.view-employee-body{padding:10px}}@media(max-width:480px){.view-employee-grid{grid-template-columns:1fr;gap:8px}.view-employee-modal{max-width:95%;max-height:85vh}.view-employee-header{padding:10px 12px}.view-employee-title{font-size:12px}.view-employee-body{padding:8px}.view-employee-profile-section{padding:10px;margin-bottom:10px}.view-employee-profile-image{width:50px;height:50px}.view-employee-profile-name{font-size:12px}.view-employee-profile-title,.view-employee-info-row{font-size:10px}.view-employee-value{font-size:9px}}.panel-container-employee{padding:12px;background:#f8f9fa;min-height:100vh;font-family:Segoe UI,sans-serif}.employee-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;background:#fff;padding:10px 12px;border-radius:6px;box-shadow:0 2px 4px #0000000d;gap:10px;flex-wrap:wrap}.employee-header-left{display:flex;align-items:center;gap:8px}.employee-dashboard-title{font-size:14px;font-weight:700;color:#1f2937;margin:0;display:flex;align-items:center;gap:6px}.employee-header-subtitle{font-size:10px;color:#6b7280;margin:0}.employee-header-right{display:flex;gap:6px}.employee-btn-add,.employee-btn-refresh{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;transition:all .2s;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.employee-btn-add{background:#3b82f6;color:#fff}.employee-btn-add:hover{background:#2563eb;transform:translateY(-1px)}.employee-btn-refresh{background:#e5e7eb;color:#374151}.employee-btn-refresh:hover{background:#d1d5db}.employee-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-bottom:12px}.employee-stat-card{background:#fff;padding:10px;border-radius:6px;box-shadow:0 2px 4px #0000000d;display:flex;align-items:center;gap:8px;border-left:3px solid #3b82f6}.employee-stat-icon{font-size:20px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.employee-stat-content{flex:1;min-width:0}.employee-stat-number{font-size:14px;font-weight:700;color:#1f2937}.employee-stat-label{font-size:9px;color:#6b7280;margin-top:2px;font-weight:500}.employee-filter-section{background:#fff;padding:10px 12px;border-radius:6px;box-shadow:0 2px 4px #0000000d;margin-bottom:12px}.employee-filter-row{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}.employee-filter-item{display:flex;flex-direction:column;gap:4px;min-width:120px}.employee-filter-item label{font-size:9px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.3px}.employee-filter-input{padding:6px 8px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;background:#fff;color:#1f2937;height:30px;cursor:pointer}.employee-filter-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.employee-filter-actions{display:flex;gap:6px;margin-left:auto;position:relative}.employee-btn-columns{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:1px solid #d1d5db;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;background:#fff;color:#374151;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.employee-btn-columns:hover{background:#f3f4f6;border-color:#3b82f6;color:#3b82f6}.employee-column-menu{position:absolute;top:100%;right:0;background:#fff;border:1px solid #d1d5db;border-radius:4px;box-shadow:0 10px 15px -3px #0000001a;z-index:1001;min-width:200px;margin-top:4px;overflow:hidden}.employee-column-header{padding:8px 10px;border-bottom:1px solid #e5e7eb;background:#f9fafb;font-size:10px;font-weight:700;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.employee-column-list{display:flex;flex-direction:column;gap:0;padding:6px;max-height:300px;overflow-y:auto}.employee-column-list label{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:11px;cursor:pointer;color:#374151;font-weight:500;border-radius:3px;transition:all .2s;-webkit-user-select:none;user-select:none}.employee-column-list label:hover{background:#f3f4f6;color:#3b82f6}.employee-column-list input[type=checkbox]{cursor:pointer;width:14px;height:14px;accent-color:#3b82f6;flex-shrink:0}.employee-table-section{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d;overflow:hidden;margin-bottom:12px;overflow-x:auto;max-height:450px}.employee-table{width:100%;border-collapse:collapse;font-size:11px}.employee-table thead{background:#2d3748;position:sticky;top:0;z-index:10}.employee-table th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;height:32px}.employee-table tbody tr{border-bottom:1px solid #e5e7eb;transition:all .2s;height:32px}.employee-table tbody tr:hover{background:#f9fafb}.employee-table td{padding:6px 10px;color:#374151;vertical-align:middle;font-size:10px;height:32px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.employee-no-data{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px}.employee-no-data p{font-size:12px;color:#6b7280;margin:0}.employee-export-section{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:0 2px 4px #0000000d;display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.employee-export-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 12px;border:1px solid #d1d5db;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;background:#fff;text-transform:uppercase;letter-spacing:.3px;transition:all .2s}.employee-export-btn.excel{color:#1f7e34;border-color:#1f7e34}.employee-export-btn.excel:hover{background:#e8f5e9}.employee-export-btn.csv{color:#06c;border-color:#06c}.employee-export-btn.csv:hover{background:#e3f2fd}.employee-export-btn.pdf{color:#d32f2f;border-color:#d32f2f}.employee-export-btn.pdf:hover{background:#ffebee}.employee-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;background:#fff;border-radius:6px;margin:20px auto;max-width:300px;box-shadow:0 2px 4px #0000000d}.employee-spinner{width:28px;height:28px;border:3px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:10px}.employee-loading-panel p{font-size:11px;color:#6b7280;margin:0}.employee-error-panel{background:#fee2e2;border:1px solid #dc2626;color:#7f1d1d;padding:12px;border-radius:6px;margin:12px;font-size:12px;font-weight:500}.modal-content{background:#fff;border-radius:6px;box-shadow:0 10px 40px #0000004d;max-width:500px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.modal-content.image{max-width:400px}@media(max-width:1024px){.employee-stats-grid{grid-template-columns:repeat(2,1fr)}.employee-filter-row{flex-wrap:wrap}.employee-filter-actions{margin-left:0;width:100%}}@media(max-width:768px){.panel-container-employee{padding:8px}.employee-dashboard-header{padding:8px 10px;margin-bottom:10px}.employee-dashboard-title{font-size:12px}.employee-stats-grid{grid-template-columns:repeat(2,1fr);gap:6px;margin-bottom:10px}.employee-filter-section{padding:8px 10px;margin-bottom:10px}.employee-filter-item{min-width:100px}.employee-table-section{max-height:350px}.employee-table th,.employee-table td{padding:4px 8px;font-size:9px}.employee-pagination,.employee-export-section{padding:8px 10px;margin-bottom:10px}}@media(max-width:480px){.panel-container-employee{padding:6px}.employee-dashboard-header{flex-direction:column;align-items:flex-start;padding:6px 8px}.employee-header-right,.employee-btn-add,.employee-btn-refresh{width:100%}.employee-stats-grid{grid-template-columns:1fr}.employee-filter-row{flex-direction:column}.employee-filter-item{width:100%;min-width:auto}.employee-filter-actions,.employee-btn-columns{width:100%}.employee-table-section{max-height:250px}.employee-table th,.employee-table td{padding:3px 6px;font-size:8px}.modal-content,.modal-content.large{max-width:95%}}.employee-pagination{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:0 2px 4px #0000000d;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.employee-pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 12px;background:#fff;border:1px solid #d1d5db;border-radius:4px;cursor:pointer;font-size:10px;font-weight:600;transition:all .2s;color:#374151;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.employee-pagination-btn:hover:not(:disabled){background:#3b82f6;border-color:#3b82f6;color:#fff;transform:translateY(-1px)}.employee-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.employee-pagination-btn svg{width:12px;height:12px}.employee-pagination-goto{display:flex;align-items:center;gap:6px;font-size:10px;color:#374151;font-weight:600}.employee-pagination-goto label{margin:0;text-transform:uppercase;letter-spacing:.3px}.employee-pagination-input{width:45px;padding:6px 8px;border:1px solid #d1d5db;border-radius:4px;font-size:10px;text-align:center;font-weight:600;color:#1f2937;height:30px;transition:all .2s}.employee-pagination-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.employee-pagination-input:disabled{background:#f3f4f6;cursor:not-allowed}.employee-pagination-info{font-size:10px;color:#6b7280;font-weight:600;min-width:150px;text-align:center;text-transform:uppercase;letter-spacing:.3px}@media(max-width:1024px){.employee-pagination{gap:6px;padding:8px 10px}.employee-pagination-btn{padding:5px 10px;font-size:9px;height:28px}.employee-pagination-goto{font-size:9px;gap:4px}.employee-pagination-input{width:40px;padding:5px 6px;font-size:9px;height:28px}.employee-pagination-info{font-size:9px;min-width:120px}}@media(max-width:768px){.employee-pagination{gap:6px;padding:8px 10px;margin-bottom:10px}.employee-pagination-btn{padding:5px 10px;font-size:9px;height:28px}.employee-pagination-goto{font-size:9px}.employee-pagination-input{width:40px;padding:5px 6px;font-size:9px;height:28px}.employee-pagination-info{font-size:9px;min-width:120px}}@media(max-width:480px){.employee-pagination{flex-direction:column;gap:8px;padding:8px 10px;margin-bottom:8px}.employee-pagination-btn{width:100%;padding:6px 8px;font-size:9px;height:32px}.employee-pagination-goto{width:100%;justify-content:space-between;font-size:9px}.employee-pagination-input{width:50px;padding:6px;font-size:9px;height:32px}.employee-pagination-info{width:100%;font-size:8px;min-width:auto}}.employee-pagination-btn:focus-visible,.employee-pagination-input:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}@media(prefers-color-scheme:dark){.employee-pagination{background:#2d3748}.employee-pagination-btn{background:#374151;border-color:#4b5563;color:#e5e7eb}.employee-pagination-btn:hover:not(:disabled){background:#3b82f6;border-color:#3b82f6;color:#fff}.employee-pagination-goto{color:#e5e7eb}.employee-pagination-input{background:#374151;color:#f9fafb;border-color:#4b5563}.employee-pagination-input:focus{border-color:#3b82f6}.employee-pagination-info{color:#9ca3af}}@media print{.employee-pagination{display:none}}.add-department-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.add-department-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.add-department-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.add-department-header-content{display:flex;align-items:center;gap:12px;flex:1}.add-department-header-icon{flex-shrink:0;opacity:.9}.add-department-header-text{flex:1}.add-department-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.add-department-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.add-department-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.add-department-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.add-department-body{flex:1;overflow-y:auto;padding:20px}.add-department-form{display:flex;flex-direction:column;gap:16px}.add-department-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.add-department-form-group{display:flex;flex-direction:column;gap:6px}.add-department-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.add-department-input,.add-department-select,.add-department-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.add-department-input::placeholder,.add-department-textarea::placeholder{color:#d1d5db}.add-department-input:focus,.add-department-select:focus,.add-department-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.add-department-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.add-department-textarea{resize:vertical;min-height:80px}.add-department-color-picker{display:flex;gap:10px;flex-wrap:wrap}.add-department-color-option{width:40px;height:40px;border-radius:6px;border:3px solid transparent;cursor:pointer;transition:all .3s ease}.add-department-color-option:hover{transform:scale(1.1)}.add-department-color-option.selected{border-color:#1a1a1a;box-shadow:0 0 0 2px #fff,0 0 0 4px #1a1a1a}.add-department-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.add-department-cancel-btn,.add-department-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.add-department-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.add-department-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.add-department-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.add-department-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.add-department-submit-btn:active:not(:disabled){transform:translateY(0)}.add-department-submit-btn:disabled,.add-department-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.add-department-spinner-small{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.add-department-body::-webkit-scrollbar{width:6px}.add-department-body::-webkit-scrollbar-track{background:#f9fafb}.add-department-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-department-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.add-department-modal{max-width:95%}.add-department-form-row{grid-template-columns:1fr}}@media(max-width:480px){.add-department-modal{max-width:100%;border-radius:6px}.add-department-header{padding:12px}.add-department-title{font-size:16px}.add-department-body{padding:16px}.add-department-form-actions{flex-direction:column-reverse;gap:8px}.add-department-cancel-btn,.add-department-submit-btn{width:100%}}.edit-department-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.edit-department-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.edit-department-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.edit-department-header-content{display:flex;align-items:center;gap:12px;flex:1}.edit-department-header-icon{flex-shrink:0;opacity:.9}.edit-department-header-text{flex:1}.edit-department-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.edit-department-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.edit-department-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.edit-department-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.edit-department-body{flex:1;overflow-y:auto;padding:20px}.edit-department-form{display:flex;flex-direction:column;gap:16px}.edit-department-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.edit-department-form-group{display:flex;flex-direction:column;gap:6px}.edit-department-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.edit-department-input,.edit-department-select,.edit-department-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.edit-department-input::placeholder,.edit-department-textarea::placeholder{color:#d1d5db}.edit-department-input:focus,.edit-department-select:focus,.edit-department-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.edit-department-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.edit-department-textarea{resize:vertical;min-height:80px}.edit-department-color-picker{display:flex;gap:10px;flex-wrap:wrap}.edit-department-color-option{width:40px;height:40px;border-radius:6px;border:3px solid transparent;cursor:pointer;transition:all .3s ease}.edit-department-color-option:hover{transform:scale(1.1)}.edit-department-color-option.selected{border-color:#1a1a1a;box-shadow:0 0 0 2px #fff,0 0 0 4px #1a1a1a}.edit-department-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.edit-department-cancel-btn,.edit-department-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.edit-department-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.edit-department-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.edit-department-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.edit-department-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.edit-department-submit-btn:active:not(:disabled){transform:translateY(0)}.edit-department-submit-btn:disabled,.edit-department-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.edit-department-spinner-small{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.edit-department-body::-webkit-scrollbar{width:6px}.edit-department-body::-webkit-scrollbar-track{background:#f9fafb}.edit-department-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.edit-department-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.edit-department-modal{max-width:95%}.edit-department-form-row{grid-template-columns:1fr}}@media(max-width:480px){.edit-department-modal{max-width:100%;border-radius:6px}.edit-department-header{padding:12px}.edit-department-title{font-size:16px}.edit-department-body{padding:16px}.edit-department-form-actions{flex-direction:column-reverse;gap:8px}.edit-department-cancel-btn,.edit-department-submit-btn{width:100%}}.view-department-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.view-department-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.view-department-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.view-department-header-content{display:flex;align-items:center;gap:12px;flex:1}.view-department-header-icon{flex-shrink:0;opacity:.9}.view-department-header-text{flex:1}.view-department-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.view-department-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.view-department-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.view-department-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.view-department-body{flex:1;overflow-y:auto;padding:20px}.view-department-color-section{display:flex;gap:16px;align-items:center;padding:16px;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-radius:8px;border:1px solid #e9ecef;margin-bottom:20px}.view-department-color-display{width:60px;height:60px;border-radius:8px;border:2px solid white;box-shadow:0 2px 8px #0000001a;flex-shrink:0}.view-department-color-info{flex:1}.view-department-color-label{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.3px;margin:0}.view-department-color-value{font-size:14px;font-weight:700;color:#1f2937;margin:4px 0 0;font-family:Monaco,Courier New,monospace}.view-department-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:20px}.view-department-card{background:#fff;border:1px solid #e9ecef;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px #0000000d;transition:all .3s ease}.view-department-card:hover{box-shadow:0 4px 12px #0000001a;border-color:#1a1a1a}.view-department-card-header{display:flex;align-items:center;gap:10px;padding:12px;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-bottom:2px solid #e9ecef}.view-department-card-header svg{color:#1a1a1a;flex-shrink:0}.view-department-card-header h4{font-size:12px;font-weight:700;color:#1f2937;margin:0;text-transform:uppercase;letter-spacing:.3px}.view-department-card-content{padding:12px;display:flex;flex-direction:column;gap:10px}.view-department-info-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #e9ecef}.view-department-info-row:last-child{border-bottom:none;padding-bottom:0}.view-department-label{font-size:11px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.2px;flex-shrink:0}.view-department-value{font-size:13px;color:#1f2937;font-weight:500;text-align:right;flex:1;word-break:break-word}.view-department-status-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.view-department-status-badge.active{background:#dcfce7;color:#16a34a}.view-department-status-badge.inactive{background:#fee2e2;color:#dc2626}.view-department-description{font-size:13px;color:#1f2937;line-height:1.6;margin:0}.view-department-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:12px;border-top:1px solid #e9ecef}.view-department-close-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;background:#1a1a1a;color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #1a1a1a33}.view-department-close-action-btn:hover{background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.view-department-close-action-btn:active{transform:translateY(0)}.view-department-body::-webkit-scrollbar{width:6px}.view-department-body::-webkit-scrollbar-track{background:#f9fafb}.view-department-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.view-department-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.view-department-modal{max-width:95%}.view-department-grid{grid-template-columns:1fr}.view-department-color-section{flex-direction:column;align-items:flex-start}}@media(max-width:480px){.view-department-modal{max-width:100%;border-radius:6px}.view-department-header{padding:12px}.view-department-title{font-size:16px}.view-department-body{padding:16px}.view-department-color-display{width:50px;height:50px}.view-department-info-row{flex-direction:column;align-items:flex-start}.view-department-value{text-align:left}.view-department-actions{flex-direction:column;gap:8px}.view-department-close-action-btn{width:100%}}:root{--primary: #4F46E5;--primary-dark: #4338CA;--primary-light: #EEF2FF;--white: #FFFFFF;--off-white: #FAFBFC;--light-bg: #F9FAFB;--lighter-bg: #F3F4F6;--lightest-bg: #FCFDFE;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--success: #10B981;--success-light: #ECFDF5;--danger: #EF4444;--danger-light: #FEF2F2;--warning: #F59E0B;--warning-light: #FFFBEB;--info: #3B82F6;--info-light: #EFF6FF;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--transition: all .2s cubic-bezier(.4, 0, .2, 1)}.panel-container-department{padding:12px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh;font-family:Segoe UI,Roboto,-apple-system,sans-serif}.department-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;background:var(--white);padding:12px 14px;border-radius:8px;box-shadow:var(--shadow-md);gap:12px;flex-wrap:wrap}.department-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:200px}.department-dashboard-title{font-size:16px;font-weight:700;color:var(--gray-900);margin:0;display:flex;align-items:center;gap:8px}.department-title-icon{color:var(--primary);width:20px;height:20px;flex-shrink:0}.department-header-right{display:flex;gap:8px;flex-wrap:wrap}.common-add-btn-department,.common-refresh-btn-department{display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap;min-height:38px}.common-add-btn-department{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:var(--white);box-shadow:var(--shadow-md)}.common-add-btn-department:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.common-add-btn-department:active{transform:translateY(0)}.common-refresh-btn-department{background:var(--white);color:var(--gray-700);border:1.5px solid var(--gray-300);width:42px;padding:9px}.common-refresh-btn-department:hover{background:var(--light-bg);border-color:var(--primary);color:var(--primary);transform:translateY(-1px)}.common-refresh-btn-department:disabled{opacity:.6;cursor:not-allowed}.department-stats-grid-compact{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:12px}.department-stat-card-compact{background:var(--white);padding:14px;border-radius:8px;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:12px;transition:var(--transition);border-left:4px solid var(--primary)}.department-stat-card-compact:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.stat-icon{width:48px;height:48px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--primary-light);color:var(--primary);flex-shrink:0}.stat-number{font-size:20px;font-weight:700;color:var(--gray-900);line-height:1}.stat-label{font-size:12px;color:var(--gray-600);margin-top:4px;font-weight:500}.department-controls-section{background:var(--white);border-radius:8px;padding:12px;box-shadow:var(--shadow-md);margin-bottom:12px}.department-search-input{width:100%;padding:10px 14px;border:1.5px solid var(--gray-300);border-radius:6px;font-size:13px;color:var(--gray-900);background:var(--white);transition:var(--transition)}.department-search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.department-search-input::placeholder{color:var(--gray-400)}.department-cards-container{background:var(--white);border-radius:8px;padding:14px;box-shadow:var(--shadow-md);margin-bottom:12px;min-height:200px}.department-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.department-card{background:var(--white);border:1.5px solid var(--gray-200);border-radius:8px;overflow:hidden;transition:var(--transition);display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}.department-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.card-header{display:flex;justify-content:space-between;align-items:flex-start;padding:14px;border-bottom:1.5px solid var(--gray-100);background:linear-gradient(135deg,var(--light-bg) 0%,var(--white) 100%);gap:10px}.card-title{font-size:14px;font-weight:700;color:var(--gray-900);margin:0;flex:1;word-break:break-word;line-height:1.4}.card-actions{display:flex;gap:6px;flex-shrink:0}.card-action-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--gray-200);border-radius:6px;cursor:pointer;transition:var(--transition);background:var(--white);padding:0;flex-shrink:0}.card-action-btn img{width:16px;height:16px}.card-body{padding:14px;flex:1}.card-info-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:10px;gap:10px}.info-label{color:var(--gray-600);font-weight:600;flex-shrink:0}.info-value{color:var(--gray-900);font-weight:700;text-align:right;flex:1}.department-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.department-no-data-image{width:120px;height:auto;opacity:.5;margin-bottom:16px}.department-no-data-container p{font-size:15px;color:var(--gray-600);margin:0;font-weight:500}.department-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;background:var(--white);border-radius:8px;margin:20px auto;max-width:300px;box-shadow:var(--shadow-md)}.department-spinner{width:40px;height:40px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.department-loading-panel p{font-size:14px;color:var(--gray-700);margin:0;font-weight:500}.department-pagination-section{background:var(--white);border-radius:8px;padding:14px;box-shadow:var(--shadow-md);display:flex;justify-content:center;align-items:center}.department-pagination-wrapper{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;width:100%}.department-pagination-btn{display:flex;align-items:center;justify-content:center;width:42px;height:42px;background:var(--white);border:1.5px solid var(--gray-300);border-radius:6px;cursor:pointer;transition:var(--transition);color:var(--gray-700);font-weight:600;padding:0}.department-pagination-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-color:var(--primary);color:var(--white);transform:translateY(-2px);box-shadow:var(--shadow-md)}.department-pagination-btn:active:not(:disabled){transform:translateY(0)}.department-pagination-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--lighter-bg)}.department-pagination-btn svg{width:20px;height:20px;stroke-width:2.5}.department-pagination-info-group{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.department-pagination-goto{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gray-700);font-weight:600}.department-pagination-input{width:55px;padding:9px 12px;border:1.5px solid var(--gray-300);border-radius:6px;text-align:center;font-size:13px;font-weight:600;color:var(--gray-900);transition:var(--transition);background:var(--white)}.department-pagination-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.department-pagination-input:disabled{background:var(--lighter-bg);cursor:not-allowed;color:var(--gray-500)}.pagination-divider{color:var(--gray-600);font-weight:600;font-size:13px}.pagination-total{color:var(--gray-900);font-weight:700;font-size:13px}.department-pagination-count{font-size:13px;color:var(--gray-700);font-weight:600;background:var(--light-bg);padding:8px 12px;border-radius:6px;border:1.5px solid var(--gray-200)}@media(max-width:1024px){.panel-container-department{padding:10px}.department-cards-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.department-dashboard-title{font-size:15px}.stat-number{font-size:18px}.stat-label{font-size:11px}.card-title{font-size:13px}.card-info-row{font-size:12px;margin-bottom:8px}}@media(max-width:768px){.panel-container-department{padding:8px}.department-dashboard-header{padding:10px 12px;margin-bottom:10px;gap:8px}.department-header-left{min-width:150px}.department-dashboard-title{font-size:14px}.common-add-btn-department,.common-refresh-btn-department{padding:8px 12px;font-size:12px;min-height:36px}.common-add-btn-department{flex:1;min-width:120px}.common-refresh-btn-department{width:38px;padding:8px}.department-stats-grid-compact{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.stat-icon{width:44px;height:44px}.stat-number{font-size:16px}.stat-label{font-size:11px}.department-controls-section{padding:10px;margin-bottom:10px}.department-search-input{padding:9px 12px;font-size:12px}.department-cards-container{padding:12px;margin-bottom:10px}.department-cards-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}.card-header{padding:12px;gap:8px}.card-title{font-size:12px}.card-action-btn{width:32px;height:32px}.card-action-btn img{width:14px;height:14px}.card-body{padding:12px}.card-info-row{font-size:11px;margin-bottom:6px}.info-label,.info-value{font-size:11px}.department-pagination-section{padding:10px 12px;margin-bottom:10px}.department-pagination-wrapper{gap:10px}.department-pagination-btn{width:38px;height:38px}.department-pagination-btn svg{width:18px;height:18px}.department-pagination-info-group{gap:10px}.department-pagination-goto{font-size:12px;gap:6px}.department-pagination-input{width:50px;padding:8px 10px;font-size:12px}.pagination-divider,.pagination-total{font-size:12px}.department-pagination-count{font-size:12px;padding:6px 10px}}@media(max-width:480px){.panel-container-department{padding:6px}.department-dashboard-header{flex-direction:column;align-items:stretch;padding:8px 10px;margin-bottom:8px;gap:8px}.department-header-left{width:100%}.department-header-right{width:100%;display:grid;grid-template-columns:1fr auto;gap:8px}.department-dashboard-title{font-size:13px}.department-title-icon{width:18px;height:18px}.common-add-btn-department{grid-column:1;padding:8px 10px;font-size:11px}.common-refresh-btn-department{grid-column:2;width:36px;height:36px;padding:6px}.common-refresh-btn-department svg{width:16px;height:16px}.department-stats-grid-compact{grid-template-columns:1fr;gap:8px;margin-bottom:8px}.department-stat-card-compact{padding:12px}.stat-icon{width:40px;height:40px}.stat-icon svg{width:18px;height:18px}.stat-number{font-size:14px}.stat-label{font-size:10px}.department-controls-section{padding:8px;margin-bottom:8px}.department-search-input{padding:8px 10px;font-size:11px}.department-cards-container{padding:10px;margin-bottom:8px}.department-cards-grid{grid-template-columns:1fr;gap:8px}.card-header{padding:10px;gap:6px}.card-title{font-size:11px}.card-action-btn{width:30px;height:30px}.card-action-btn img{width:12px;height:12px}.card-body{padding:10px}.card-info-row{font-size:10px;margin-bottom:5px;flex-direction:column;align-items:flex-start}.info-label{font-size:10px}.info-value{font-size:10px;text-align:left}.department-no-data-image{width:80px;margin-bottom:12px}.department-no-data-container p{font-size:12px}.department-pagination-section{padding:8px 10px}.department-pagination-wrapper{flex-direction:column;gap:8px}.department-pagination-btn{width:36px;height:36px}.department-pagination-btn svg{width:16px;height:16px}.department-pagination-info-group{width:100%;justify-content:center;gap:8px}.department-pagination-goto{font-size:11px;gap:5px}.department-pagination-input{width:45px;padding:7px 8px;font-size:11px}.pagination-divider,.pagination-total{font-size:11px}.department-pagination-count{font-size:11px;padding:5px 8px}.department-loading-panel{padding:40px 15px;max-width:250px}.department-spinner{width:36px;height:36px;border:2.5px solid var(--gray-200)}.department-loading-panel p{font-size:12px}}@media(max-width:360px){.department-dashboard-title{font-size:12px}.common-add-btn-department{font-size:10px;padding:7px 8px}.card-title{font-size:10px}.card-info-row,.info-label,.info-value{font-size:9px}.department-pagination-goto{font-size:10px}.department-pagination-input{width:40px;font-size:10px}}@media(prefers-color-scheme:dark){:root{--white: #1F2937;--light-bg: #2D3748;--lighter-bg: #374151}.department-dashboard-header,.department-controls-section,.department-cards-container,.department-pagination-section,.department-stat-card-compact,.department-card,.department-search-input,.department-pagination-input,.common-refresh-btn-department{background:var(--white);color:#f3f4f6}.department-dashboard-title,.card-title,.stat-number,.pagination-total{color:#f3f4f6}.department-search-input,.department-pagination-input{background:var(--lighter-bg);color:#f9fafb;border-color:#4b5563}.stat-label,.info-label,.pagination-divider,.department-pagination-count{color:#9ca3af}.info-value{color:#e5e7eb}.card-action-btn{background:var(--lighter-bg);border-color:#4b5563}.department-pagination-btn{background:var(--lighter-bg);border-color:#4b5563;color:#e5e7eb}.department-pagination-btn:disabled{background:var(--white);opacity:.3}}.add-bank-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.add-bank-modal{background:#fff;border-radius:8px;box-shadow:0 20px 25px -5px #0000001a;max-width:400px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.add-bank-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #E5E7EB;background:linear-gradient(135deg,#ecfdf5,#f0fdf4);gap:8px;position:sticky;top:0;z-index:100}.add-bank-header-content{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.add-bank-header-icon{color:#10b981;flex-shrink:0;width:18px;height:18px}.add-bank-header-text{flex:1;min-width:0}.add-bank-title{font-size:13px;font-weight:700;color:#111827;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.add-bank-subtitle{font-size:10px;color:#6b7280;margin:2px 0 0}.add-bank-close-btn{background:none;border:none;font-size:18px;color:#9ca3af;cursor:pointer;transition:all .2s ease;padding:4px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}.add-bank-close-btn:hover{background:#f3f4f6;color:#111827}.add-bank-body{padding:14px;max-height:calc(85vh - 44px);overflow-y:auto}.add-bank-form{display:flex;flex-direction:column;gap:12px}.add-bank-form-group{display:flex;flex-direction:column;gap:5px}.add-bank-label{font-size:11px;font-weight:600;color:#111827;text-transform:uppercase;letter-spacing:.4px}.add-bank-input,.add-bank-textarea{padding:8px 10px;border:1px solid #D1D5DB;border-radius:6px;font-size:12px;font-family:inherit;transition:all .2s ease;background:#fff;color:#111827}.add-bank-input:focus,.add-bank-textarea:focus{outline:none;border-color:#10b981;box-shadow:0 0 0 3px #ecfdf5}.add-bank-textarea{resize:vertical;min-height:80px}.add-bank-form-actions{display:flex;gap:10px;margin-top:8px}.add-bank-cancel-btn,.add-bank-submit-btn{flex:1;padding:8px 12px;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.3px}.add-bank-cancel-btn{background:#f3f4f6;color:#374151}.add-bank-cancel-btn:hover{background:#e5e7eb}.add-bank-cancel-btn:disabled{opacity:.6;cursor:not-allowed}.add-bank-submit-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff;display:flex;align-items:center;justify-content:center;gap:6px}.add-bank-submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.add-bank-submit-btn:disabled{opacity:.6;cursor:not-allowed}.add-bank-spinner-small{width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}@media(max-width:768px){.add-bank-modal{max-width:90%}.add-bank-header{padding:10px 12px}.add-bank-title{font-size:12px}.add-bank-body{padding:12px}.add-bank-form{gap:10px}.add-bank-label{font-size:10px}.add-bank-input,.add-bank-textarea{padding:6px 8px;font-size:11px}}@media(max-width:480px){.add-bank-modal{max-width:95%;max-height:80vh}.add-bank-header{padding:8px 10px}.add-bank-title{font-size:11px}.add-bank-body{padding:10px}.add-bank-form-actions{flex-direction:column;gap:8px}}.edit-bank-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.edit-bank-modal{background:#fff;border-radius:8px;box-shadow:0 20px 25px -5px #0000001a;max-width:400px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.edit-bank-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #E5E7EB;background:linear-gradient(135deg,#fef3c7,#fef9e7);gap:8px;position:sticky;top:0;z-index:100}.edit-bank-header-content{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.edit-bank-header-icon{color:#f59e0b;flex-shrink:0;width:18px;height:18px}.edit-bank-header-text{flex:1;min-width:0}.edit-bank-title{font-size:13px;font-weight:700;color:#111827;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.edit-bank-subtitle{font-size:10px;color:#6b7280;margin:2px 0 0}.edit-bank-close-btn{background:none;border:none;font-size:18px;color:#9ca3af;cursor:pointer;transition:all .2s ease;padding:4px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}.edit-bank-close-btn:hover{background:#f3f4f6;color:#111827}.edit-bank-body{padding:14px;max-height:calc(85vh - 44px);overflow-y:auto}.edit-bank-form{display:flex;flex-direction:column;gap:12px}.edit-bank-form-group{display:flex;flex-direction:column;gap:5px}.edit-bank-label{font-size:11px;font-weight:600;color:#111827;text-transform:uppercase;letter-spacing:.4px}.edit-bank-input,.edit-bank-textarea{padding:8px 10px;border:1px solid #D1D5DB;border-radius:6px;font-size:12px;font-family:inherit;transition:all .2s ease;background:#fff;color:#111827}.edit-bank-input:focus,.edit-bank-textarea:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #fffbeb}.edit-bank-textarea{resize:vertical;min-height:80px}.edit-bank-form-actions{display:flex;gap:10px;margin-top:8px}.edit-bank-cancel-btn,.edit-bank-submit-btn{flex:1;padding:8px 12px;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.3px}.edit-bank-cancel-btn{background:#f3f4f6;color:#374151}.edit-bank-cancel-btn:hover{background:#e5e7eb}.edit-bank-cancel-btn:disabled{opacity:.6;cursor:not-allowed}.edit-bank-submit-btn{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;display:flex;align-items:center;justify-content:center;gap:6px}.edit-bank-submit-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b4d}.edit-bank-submit-btn:disabled{opacity:.6;cursor:not-allowed}.edit-bank-spinner-small{width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}@media(max-width:768px){.edit-bank-modal{max-width:90%}.edit-bank-header{padding:10px 12px}.edit-bank-title{font-size:12px}.edit-bank-body{padding:12px}.edit-bank-form{gap:10px}.edit-bank-label{font-size:10px}.edit-bank-input,.edit-bank-textarea{padding:6px 8px;font-size:11px}}@media(max-width:480px){.edit-bank-modal{max-width:95%;max-height:80vh}.edit-bank-header{padding:8px 10px}.edit-bank-title{font-size:11px}.edit-bank-body{padding:10px}.edit-bank-form-actions{flex-direction:column;gap:8px}}.view-bank-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.view-bank-modal{background:#fff;border-radius:8px;box-shadow:0 20px 25px -5px #0000001a;max-width:400px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.view-bank-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #E5E7EB;background:linear-gradient(135deg,#eff6ff,#f0f9ff);gap:8px;position:sticky;top:0;z-index:100}.view-bank-header-content{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.view-bank-header-icon{color:#3b82f6;flex-shrink:0;width:18px;height:18px}.view-bank-header-text{flex:1;min-width:0}.view-bank-title{font-size:13px;font-weight:700;color:#111827;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-bank-subtitle{font-size:10px;color:#6b7280;margin:2px 0 0}.view-bank-close-btn{background:none;border:none;font-size:18px;color:#9ca3af;cursor:pointer;transition:all .2s ease;padding:4px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}.view-bank-close-btn:hover{background:#f3f4f6;color:#111827}.view-bank-body{padding:14px;max-height:calc(85vh - 44px);overflow-y:auto}.view-bank-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px}.view-bank-card{background:#f9fafb;border:1px solid #E5E7EB;border-radius:6px;padding:12px;transition:all .2s ease}.view-bank-card:hover{background:#f3f4f6;border-color:#d1d5db}.view-bank-card-header{display:flex;align-items:center;gap:8px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #E5E7EB}.view-bank-card-header svg{width:16px;height:16px;color:#3b82f6;flex-shrink:0}.view-bank-card-header h4{font-size:11px;font-weight:600;color:#111827;margin:0;text-transform:uppercase;letter-spacing:.3px}.view-bank-card-content{display:flex;flex-direction:column;gap:8px}.view-bank-info-row{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;font-size:11px}.view-bank-label{color:#6b7280;font-weight:600;flex-shrink:0}.view-bank-value{color:#111827;font-weight:500;text-align:right;flex:1;word-break:break-word}.view-bank-actions{display:flex;gap:10px;margin-top:12px}.view-bank-close-action-btn{flex:1;padding:8px 12px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;text-transform:uppercase;letter-spacing:.3px}.view-bank-close-action-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}@media(max-width:768px){.view-bank-modal{max-width:90%}.view-bank-header{padding:10px 12px}.view-bank-title{font-size:12px}.view-bank-body{padding:12px}.view-bank-card{padding:10px}.view-bank-card-header h4,.view-bank-info-row{font-size:10px}}@media(max-width:480px){.view-bank-modal{max-width:95%;max-height:80vh}.view-bank-header{padding:8px 10px}.view-bank-title{font-size:11px}.view-bank-body{padding:10px}.view-bank-grid{gap:10px}}:root{--primary: #4F46E5;--primary-dark: #4338CA;--primary-light: #EEF2FF;--secondary: #10B981;--secondary-dark: #059669;--secondary-light: #ECFDF5;--danger: #EF4444;--danger-light: #FEF2F2;--warning: #F59E0B;--warning-light: #FFFBEB;--info: #3B82F6;--info-light: #EFF6FF;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--transition: all .2s cubic-bezier(.4, 0, .2, 1)}.panel-container-bank{padding:16px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh;font-family:Segoe UI,Roboto,-apple-system,sans-serif}.bank-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;background:#fff;padding:14px 16px;border-radius:8px;box-shadow:var(--shadow-md);gap:12px;flex-wrap:wrap}.bank-header-left{display:flex;align-items:center;gap:12px;flex:1;min-width:200px}.bank-dashboard-title{font-size:16px;font-weight:700;color:var(--gray-900);margin:0;display:flex;align-items:center;gap:8px}.bank-title-icon{color:var(--secondary)}.bank-header-right{display:flex;gap:8px;flex-wrap:wrap}.common-add-btn-bank,.common-refresh-btn-bank{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap}.common-add-btn-bank{background:linear-gradient(135deg,var(--secondary) 0%,var(--secondary-dark) 100%);color:#fff;box-shadow:var(--shadow-md)}.common-add-btn-bank:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.common-add-btn-bank:active{transform:translateY(0)}.common-add-btn-bank:disabled{opacity:.6;cursor:not-allowed}.common-refresh-btn-bank{background:#fff;color:var(--gray-700);border:1px solid var(--gray-300);width:40px;padding:8px}.common-refresh-btn-bank:hover{background:var(--gray-50);border-color:var(--secondary);color:var(--secondary);transform:translateY(-1px)}.common-refresh-btn-bank:disabled{opacity:.6;cursor:not-allowed}.bank-stats-grid-compact{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px}.bank-stat-card-compact{background:#fff;padding:14px;border-radius:8px;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:12px;transition:var(--transition);border-left:4px solid var(--secondary)}.bank-stat-card-compact:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.bank-stat-card-compact .stat-icon{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--secondary-light);color:var(--secondary);flex-shrink:0}.bank-stat-card-compact .stat-icon svg{width:20px;height:20px}.bank-stat-card-compact .stat-info{flex:1;min-width:0}.bank-stat-card-compact .stat-number{font-size:18px;font-weight:700;color:var(--gray-900)}.bank-stat-card-compact .stat-label{font-size:12px;color:var(--gray-500);margin-top:2px;font-weight:500}.bank-controls-section{margin-bottom:16px}.bank-search-input{width:100%;padding:10px 12px;border:1px solid var(--gray-300);border-radius:8px;font-size:13px;color:var(--gray-900);background:#fff;transition:var(--transition);box-shadow:var(--shadow-sm)}.bank-search-input:focus{outline:none;border-color:var(--secondary);box-shadow:0 0 0 3px var(--secondary-light)}.bank-search-input::placeholder{color:var(--gray-400)}.bank-cards-container{background:#fff;border-radius:8px;padding:16px;box-shadow:var(--shadow-md);margin-bottom:16px;min-height:200px}.bank-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.bank-card{background:#fff;border:1px solid var(--gray-200);border-radius:8px;overflow:hidden;transition:var(--transition);display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}.bank-card:hover{border-color:var(--secondary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.bank-card .card-header{display:flex;justify-content:space-between;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--gray-100);background:linear-gradient(135deg,var(--gray-50) 0%,white 100%)}.bank-card .card-title{font-size:13px;font-weight:600;color:var(--gray-900);margin:0;flex:1;word-break:break-word}.bank-card .card-actions{display:flex;gap:6px;margin-left:8px;flex-shrink:0}.bank-card .card-action-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);border-radius:6px;cursor:pointer;transition:var(--transition);background:#fff;padding:0}.bank-card .card-action-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.bank-card .card-action-btn.view:hover{background:var(--info-light);border-color:var(--info)}.bank-card .card-action-btn.edit:hover{background:var(--warning-light);border-color:var(--warning)}.bank-card .card-action-btn.delete:hover{background:var(--danger-light);border-color:var(--danger)}.bank-card .card-action-btn img{width:14px;height:14px}.bank-card .card-body{padding:12px 14px;flex:1}.bank-card .card-info-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:8px}.bank-card .card-info-row:last-child{margin-bottom:0}.bank-card .info-label{color:var(--gray-600);font-weight:500}.bank-card .info-value{color:var(--gray-900);font-weight:600}.bank-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.bank-no-data-image{width:80px;height:auto;opacity:.4;margin-bottom:12px}.bank-no-data-container p{font-size:13px;color:var(--gray-500);margin:0}.bank-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;background:#fff;border-radius:8px;margin:20px auto;max-width:300px;box-shadow:var(--shadow-md)}.bank-spinner{width:32px;height:32px;border:3px solid var(--gray-200);border-top-color:var(--secondary);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:12px}.bank-loading-panel p{font-size:12px;color:var(--gray-600);margin:0}.bank-pagination-section{background:#fff;border-radius:8px;padding:12px 14px;box-shadow:var(--shadow-md);display:flex;justify-content:center;align-items:center}.bank-pagination-wrapper{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;width:100%}.bank-pagination-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#fff;border:2px solid var(--gray-300);border-radius:6px;cursor:pointer;transition:var(--transition);color:var(--gray-700);font-weight:600;padding:0}.bank-pagination-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--secondary) 0%,var(--secondary-dark) 100%);border-color:var(--secondary);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.bank-pagination-btn:active:not(:disabled){transform:translateY(0)}.bank-pagination-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--gray-100)}.bank-pagination-btn svg{width:20px;height:20px;stroke-width:2.5}.bank-pagination-info-group{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.bank-pagination-goto{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--gray-700);font-weight:600}.bank-pagination-input{width:50px;padding:6px 8px;border:1px solid var(--gray-300);border-radius:6px;text-align:center;font-size:11px;font-weight:600;color:var(--gray-900);transition:var(--transition)}.bank-pagination-input:focus{outline:none;border-color:var(--secondary);box-shadow:0 0 0 3px var(--secondary-light)}.bank-pagination-input:disabled{background:var(--gray-100);cursor:not-allowed}.pagination-divider{color:var(--gray-500);font-weight:600;font-size:11px}.pagination-total{color:var(--gray-900);font-weight:700;font-size:11px}.bank-pagination-count{font-size:11px;color:var(--gray-600);font-weight:600;background:var(--gray-50);padding:6px 10px;border-radius:4px}@media(max-width:1024px){.bank-cards-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}@media(max-width:768px){.panel-container-bank{padding:12px}.bank-dashboard-header{padding:12px;margin-bottom:12px;flex-direction:column;align-items:flex-start}.bank-header-left{width:100%;min-width:auto}.bank-header-right{width:100%}.bank-dashboard-title{font-size:14px}.bank-stats-grid-compact{grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:12px}.bank-stat-card-compact{padding:12px}.bank-stat-card-compact .stat-number{font-size:16px}.bank-stat-card-compact .stat-label{font-size:11px}.bank-controls-section{margin-bottom:12px}.bank-search-input{padding:8px 10px;font-size:12px}.bank-cards-container{padding:12px;margin-bottom:12px}.bank-cards-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.bank-card .card-header{padding:10px 12px}.bank-card .card-title{font-size:12px}.bank-card .card-body{padding:10px 12px}.bank-card .card-info-row{font-size:11px}.bank-pagination-section{padding:10px 12px}.bank-pagination-wrapper{gap:8px}.bank-pagination-btn{width:36px;height:36px}.bank-pagination-input{width:45px;padding:5px 6px;font-size:10px}}@media(max-width:480px){.panel-container-bank{padding:8px}.bank-dashboard-header{padding:10px;margin-bottom:10px}.bank-dashboard-title{font-size:13px}.bank-stats-grid-compact{grid-template-columns:1fr;gap:8px;margin-bottom:10px}.bank-cards-grid{grid-template-columns:1fr;gap:10px}.bank-pagination-wrapper{gap:6px;flex-direction:column}.bank-pagination-btn{width:34px;height:34px}.bank-pagination-info-group{width:100%;justify-content:center}}@media(prefers-color-scheme:dark){:root{--gray-50: #1F2937;--gray-100: #2D3748;--gray-200: #374151;--gray-300: #4B5563;--gray-400: #6B7280;--gray-500: #9CA3AF;--gray-600: #D1D5DB;--gray-700: #E5E7EB;--gray-800: #F3F4F6;--gray-900: #F9FAFB}.panel-container-bank{background:linear-gradient(135deg,#1f2937,#111827)}.bank-dashboard-header,.bank-controls-section,.bank-cards-container,.bank-pagination-section{background:#2d3748;color:#f9fafb}.bank-stat-card-compact{background:#374151;border-left-color:var(--secondary)}.bank-search-input{background:#374151;color:#f9fafb;border-color:#4b5563}.bank-card{background:#374151;border-color:#4b5563}.bank-card .card-header{background:#2d3748;border-bottom-color:#4b5563}.bank-card .card-title{color:#f9fafb}.bank-card .info-label{color:#9ca3af}.bank-card .info-value{color:#f9fafb}.bank-pagination-btn{background:#374151;border-color:#4b5563;color:#e5e7eb}.bank-pagination-input{background:#374151;color:#f9fafb;border-color:#4b5563}}.em-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.em-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.em-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.em-header-icon{font-size:18px}.em-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.em-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.em-buttons-row::-webkit-scrollbar{height:4px}.em-buttons-row::-webkit-scrollbar-track{background:transparent}.em-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.em-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.em-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.em-btn-with-label.active{border-color:#667eea;background:#f0f4ff;color:#667eea}.em-btn-icon{font-size:14px}.em-btn-text{display:inline-block}.em-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.em-close-all-compact:hover{background:#fecaca;color:#dc2626}.em-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.em-tab-content{animation:slideIn .2s ease-out}.em-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.em-empty-icon{font-size:64px;opacity:.4}.em-empty p{font-size:14px;margin:0;color:#9ca3af}.em-content::-webkit-scrollbar{width:8px}.em-content::-webkit-scrollbar-track{background:transparent}.em-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.em-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.em-button-bar{height:52px;gap:8px}.em-btn-with-label{padding:6px 10px;font-size:11px}.em-btn-icon{font-size:13px}.em-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.em-header-compact{height:44px;padding:0 12px}.em-header-title{font-size:14px;gap:8px}.em-header-icon{font-size:16px}.em-button-bar{height:48px;padding:0 8px;gap:6px}.em-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.em-btn-icon{font-size:12px}.em-close-all-compact{padding:6px 8px;font-size:10px}.em-content{padding:16px}}@media(max-width:480px){.em-header-compact{height:40px;padding:0 8px}.em-header-title{font-size:12px;gap:6px}.em-header-icon{font-size:14px}.em-button-bar{height:44px;padding:0 6px;gap:4px}.em-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.em-btn-icon{font-size:11px}.em-btn-text{display:none}.em-close-all-compact{padding:4px 6px;font-size:9px}.em-close-all-compact span{display:none}.em-content{padding:12px}}.add-allowance-type-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.add-allowance-type-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.add-allowance-type-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.add-allowance-type-header-content{display:flex;align-items:center;gap:12px;flex:1}.add-allowance-type-header-icon{flex-shrink:0;opacity:.9}.add-allowance-type-header-text{flex:1}.add-allowance-type-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.add-allowance-type-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.add-allowance-type-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.add-allowance-type-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.add-allowance-type-body{flex:1;overflow-y:auto;padding:20px}.add-allowance-type-form{display:flex;flex-direction:column;gap:16px}.add-allowance-type-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.add-allowance-type-form-group{display:flex;flex-direction:column;gap:6px}.add-allowance-type-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.add-allowance-type-input,.add-allowance-type-select,.add-allowance-type-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.add-allowance-type-input::placeholder,.add-allowance-type-textarea::placeholder{color:#d1d5db}.add-allowance-type-input:focus,.add-allowance-type-select:focus,.add-allowance-type-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.add-allowance-type-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.add-allowance-type-textarea{resize:vertical;min-height:60px}.add-allowance-type-checkbox-group{display:flex;gap:20px;flex-wrap:wrap;border:1px solid #e9ecef;border-radius:6px;padding:12px 16px;background:#f8f9fa}.add-allowance-type-checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;font-weight:500;color:#1f2937;-webkit-user-select:none;user-select:none}.add-allowance-type-checkbox{width:18px;height:18px;cursor:pointer;accent-color:#1a1a1a}.add-allowance-type-checkbox:hover{opacity:.8}.add-allowance-type-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.add-allowance-type-cancel-btn,.add-allowance-type-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.add-allowance-type-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.add-allowance-type-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.add-allowance-type-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.add-allowance-type-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.add-allowance-type-submit-btn:active:not(:disabled){transform:translateY(0)}.add-allowance-type-submit-btn:disabled,.add-allowance-type-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.add-allowance-type-spinner-small{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.add-allowance-type-body::-webkit-scrollbar{width:6px}.add-allowance-type-body::-webkit-scrollbar-track{background:#f9fafb}.add-allowance-type-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-allowance-type-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.add-allowance-type-modal{max-width:95%}.add-allowance-type-form-row{grid-template-columns:1fr}}@media(max-width:480px){.add-allowance-type-modal{max-width:100%;border-radius:6px}.add-allowance-type-header{padding:12px}.add-allowance-type-title{font-size:16px}.add-allowance-type-body{padding:16px}.add-allowance-type-form-actions{flex-direction:column-reverse;gap:8px}.add-allowance-type-cancel-btn,.add-allowance-type-submit-btn{width:100%}.add-allowance-type-checkbox-group{flex-direction:column;gap:12px}}.edit-allowance-type-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.edit-allowance-type-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.edit-allowance-type-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.edit-allowance-type-header-content{display:flex;align-items:center;gap:12px;flex:1}.edit-allowance-type-header-icon{flex-shrink:0;opacity:.9}.edit-allowance-type-header-text{flex:1}.edit-allowance-type-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.edit-allowance-type-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.edit-allowance-type-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.edit-allowance-type-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.edit-allowance-type-body{flex:1;overflow-y:auto;padding:20px}.edit-allowance-type-form{display:flex;flex-direction:column;gap:16px}.edit-allowance-type-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.edit-allowance-type-form-group{display:flex;flex-direction:column;gap:6px}.edit-allowance-type-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.edit-allowance-type-input,.edit-allowance-type-select,.edit-allowance-type-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.edit-allowance-type-input::placeholder,.edit-allowance-type-textarea::placeholder{color:#d1d5db}.edit-allowance-type-input:focus,.edit-allowance-type-select:focus,.edit-allowance-type-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.edit-allowance-type-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.edit-allowance-type-textarea{resize:vertical;min-height:60px}.edit-allowance-type-checkbox-group{display:flex;gap:20px;flex-wrap:wrap;padding:12px 16px;border:1px solid #e9ecef;border-radius:6px;background:#f8f9fa}.edit-allowance-type-checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;font-weight:500;color:#1f2937;-webkit-user-select:none;user-select:none}.edit-allowance-type-checkbox{width:18px;height:18px;cursor:pointer;accent-color:#1a1a1a}.edit-allowance-type-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.edit-allowance-type-cancel-btn,.edit-allowance-type-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.edit-allowance-type-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.edit-allowance-type-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.edit-allowance-type-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.edit-allowance-type-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.edit-allowance-type-submit-btn:active:not(:disabled){transform:translateY(0)}.edit-allowance-type-submit-btn:disabled,.edit-allowance-type-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.edit-allowance-type-spinner-small{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.edit-allowance-type-body::-webkit-scrollbar{width:6px}.edit-allowance-type-body::-webkit-scrollbar-track{background:#f9fafb}.edit-allowance-type-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.edit-allowance-type-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.edit-allowance-type-modal{max-width:95%}.edit-allowance-type-form-row{grid-template-columns:1fr}}@media(max-width:480px){.edit-allowance-type-modal{max-width:100%;border-radius:6px}.edit-allowance-type-header{padding:12px}.edit-allowance-type-title{font-size:16px}.edit-allowance-type-body{padding:16px}.edit-allowance-type-form-actions{flex-direction:column-reverse;gap:8px}.edit-allowance-type-cancel-btn,.edit-allowance-type-submit-btn{width:100%}.edit-allowance-type-checkbox-group{flex-direction:column;gap:12px}}.view-allowance-type-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.view-allowance-type-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.view-allowance-type-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.view-allowance-type-header-content{display:flex;align-items:center;gap:12px;flex:1}.view-allowance-type-header-icon{flex-shrink:0;opacity:.9}.view-allowance-type-header-text{flex:1}.view-allowance-type-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.view-allowance-type-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.view-allowance-type-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.view-allowance-type-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.view-allowance-type-body{flex:1;overflow-y:auto;padding:20px}.view-allowance-type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-bottom:20px}.view-allowance-type-card{background:#fff;border:1px solid #e9ecef;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px #0000000d;transition:all .3s ease}.view-allowance-type-card:hover{box-shadow:0 4px 12px #0000001a;border-color:#1a1a1a}.view-allowance-type-card.full-width{grid-column:1 / -1}.view-allowance-type-card-header{display:flex;align-items:center;gap:10px;padding:12px;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-bottom:2px solid #e9ecef}.view-allowance-type-card-header svg{color:#1a1a1a;flex-shrink:0}.view-allowance-type-card-header h4{font-size:12px;font-weight:700;color:#1f2937;margin:0;text-transform:uppercase;letter-spacing:.3px}.view-allowance-type-card-content{padding:12px;display:flex;flex-direction:column;gap:10px}.view-allowance-type-info-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #e9ecef}.view-allowance-type-info-row:last-child{border-bottom:none;padding-bottom:0}.view-allowance-type-label{font-size:11px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.2px;flex-shrink:0}.view-allowance-type-value{font-size:13px;color:#1f2937;font-weight:500;text-align:right;flex:1;word-break:break-word}.view-allowance-type-status-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.view-allowance-type-status-badge.active{background:#dcfce7;color:#16a34a}.view-allowance-type-status-badge.inactive{background:#fee2e2;color:#dc2626}.view-allowance-type-calculation-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize;background:#e0e7ff;color:#4f46e5}.view-allowance-type-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600}.view-allowance-type-badge.yes{background:#dcfce7;color:#16a34a}.view-allowance-type-badge.no{background:#fee2e2;color:#dc2626}.view-allowance-type-description{font-size:13px;color:#1f2937;line-height:1.6;margin:0}.view-allowance-type-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:12px;border-top:1px solid #e9ecef}.view-allowance-type-close-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;background:#1a1a1a;color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #1a1a1a33}.view-allowance-type-close-action-btn:hover{background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.view-allowance-type-close-action-btn:active{transform:translateY(0)}.view-allowance-type-body::-webkit-scrollbar{width:6px}.view-allowance-type-body::-webkit-scrollbar-track{background:#f9fafb}.view-allowance-type-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.view-allowance-type-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.view-allowance-type-modal{max-width:95%}.view-allowance-type-grid{grid-template-columns:1fr}}@media(max-width:480px){.view-allowance-type-modal{max-width:100%;border-radius:6px}.view-allowance-type-header{padding:12px}.view-allowance-type-title{font-size:16px}.view-allowance-type-body{padding:16px}.view-allowance-type-info-row{flex-direction:column;align-items:flex-start}.view-allowance-type-value{text-align:left}.view-allowance-type-actions{flex-direction:column;gap:8px}.view-allowance-type-close-action-btn{width:100%}}.panel-container-allowance-type{padding:16px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh;font-family:Segoe UI,Roboto,-apple-system,sans-serif}.allowance-type-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;background:#fff;padding:14px 16px;border-radius:8px;box-shadow:var(--shadow-md);gap:12px;flex-wrap:wrap}.allowance-type-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:200px}.allowance-type-dashboard-title{font-size:16px;font-weight:700;color:var(--gray-900);margin:0;display:flex;align-items:center;gap:8px}.allowance-type-title-icon{color:var(--primary)}.allowance-type-header-right{display:flex;gap:8px;flex-wrap:wrap}.common-add-btn-allowance-type,.common-refresh-btn-allowance-type{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap}.common-add-btn-allowance-type{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:var(--shadow-md)}.common-add-btn-allowance-type:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.common-add-btn-allowance-type:active{transform:translateY(0)}.common-refresh-btn-allowance-type{background:#fff;color:var(--gray-700);border:1px solid var(--gray-300);width:40px;padding:8px}.common-refresh-btn-allowance-type:hover{background:var(--gray-50);border-color:var(--primary);color:var(--primary);transform:translateY(-1px)}.common-refresh-btn-allowance-type:disabled{opacity:.6;cursor:not-allowed}.allowance-type-stats-grid-compact{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:16px}.allowance-type-stat-card-compact{background:#fff;padding:14px;border-radius:8px;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:12px;transition:var(--transition);border-left:4px solid var(--primary)}.allowance-type-stat-card-compact.active{border-left-color:var(--secondary)}.allowance-type-stat-card-compact:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.stat-icon{width:44px;height:44px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--primary-light);color:var(--primary);flex-shrink:0}.stat-icon.active{background:var(--secondary-light);color:var(--secondary)}.stat-info{flex:1}.stat-number{font-size:18px;font-weight:700;color:var(--gray-900)}.stat-label{font-size:12px;color:var(--gray-500);margin-top:2px;font-weight:500}.allowance-type-controls-section{background:#fff;border-radius:8px;padding:12px;box-shadow:var(--shadow-md);margin-bottom:16px}.allowance-type-search-input{width:100%;padding:10px 14px;border:1px solid var(--gray-300);border-radius:6px;font-size:13px;color:var(--gray-900);background:#fff;transition:var(--transition)}.allowance-type-search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.allowance-type-search-input::placeholder{color:var(--gray-400)}.allowance-type-cards-container{background:#fff;border-radius:8px;padding:16px;box-shadow:var(--shadow-md);margin-bottom:16px;min-height:200px}.allowance-type-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.allowance-type-card{background:#fff;border:1px solid var(--gray-200);border-radius:8px;overflow:hidden;transition:var(--transition);display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}.allowance-type-card:hover{border-color:var(--primary);box-shadow:var(--shadow-lg);transform:translateY(-3px)}.card-header{display:flex;justify-content:space-between;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--gray-100);background:linear-gradient(135deg,var(--gray-50) 0%,white 100%)}.card-title{font-size:13px;font-weight:600;color:var(--gray-900);margin:0;flex:1;word-break:break-word}.card-actions{display:flex;gap:6px;margin-left:8px;flex-shrink:0}.card-action-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);border-radius:6px;cursor:pointer;transition:var(--transition);background:#fff;padding:0}.card-action-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.card-action-btn.view:hover{background:var(--info-light);border-color:var(--info)}.card-action-btn.edit:hover{background:var(--warning-light);border-color:var(--warning)}.card-action-btn.delete:hover{background:var(--danger-light);border-color:var(--danger)}.card-action-btn img{width:14px;height:14px}.card-body{padding:12px 14px;flex:1}.card-info-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:8px}.card-info-row:last-child{margin-bottom:0}.info-label{color:var(--gray-600);font-weight:500}.info-value{color:var(--gray-900);font-weight:600}.status-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.status-badge.active{background:var(--secondary-light);color:var(--secondary)}.status-badge.inactive{background:var(--danger-light);color:var(--danger)}.allowance-type-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px;text-align:center}.allowance-type-no-data-image{width:100px;height:auto;opacity:.4;margin-bottom:14px}.allowance-type-no-data-container p{font-size:14px;color:var(--gray-500);margin:0}.allowance-type-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px;text-align:center;background:#fff;border-radius:8px;margin:20px auto;max-width:300px;box-shadow:var(--shadow-md)}.allowance-type-spinner{width:36px;height:36px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:14px}.allowance-type-loading-panel p{font-size:13px;color:var(--gray-600);margin:0}.allowance-type-pagination-section{background:#fff;border-radius:8px;padding:14px 16px;box-shadow:var(--shadow-md);display:flex;justify-content:center;align-items:center}.allowance-type-pagination-wrapper{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;width:100%}.allowance-type-pagination-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#fff;border:2px solid var(--gray-300);border-radius:6px;cursor:pointer;transition:var(--transition);color:var(--gray-700);font-weight:600;padding:0}.allowance-type-pagination-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-color:var(--primary);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.allowance-type-pagination-btn:active:not(:disabled){transform:translateY(0)}.allowance-type-pagination-btn:disabled{opacity:.4;cursor:not-allowed;background:var(--gray-100)}.allowance-type-pagination-btn svg{width:20px;height:20px;stroke-width:2.5}.allowance-type-pagination-info-group{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.allowance-type-pagination-goto{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--gray-700);font-weight:600}.allowance-type-pagination-input{width:50px;padding:8px 10px;border:2px solid var(--gray-300);border-radius:6px;text-align:center;font-size:12px;font-weight:600;color:var(--gray-900);transition:var(--transition)}.allowance-type-pagination-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.allowance-type-pagination-input:disabled{background:var(--gray-100);cursor:not-allowed}.pagination-divider{color:var(--gray-500);font-weight:600;font-size:12px}.pagination-total{color:var(--gray-900);font-weight:700;font-size:12px}.allowance-type-pagination-count{font-size:12px;color:var(--gray-600);font-weight:600;background:var(--gray-50);padding:6px 10px;border-radius:4px;border:1px solid var(--gray-200)}@media(max-width:768px){.panel-container-allowance-type{padding:12px}.allowance-type-dashboard-header{padding:12px;margin-bottom:12px}.allowance-type-dashboard-title{font-size:14px}.allowance-type-stats-grid-compact{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.allowance-type-stat-card-compact{padding:12px}.stat-number{font-size:16px}.allowance-type-cards-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.allowance-type-pagination-section{padding:12px}.allowance-type-pagination-wrapper{gap:12px}.allowance-type-pagination-btn{width:36px;height:36px}.allowance-type-pagination-btn svg{width:18px;height:18px}}@media(max-width:480px){.panel-container-allowance-type{padding:8px}.allowance-type-dashboard-header{padding:10px;margin-bottom:10px;flex-direction:column;align-items:stretch}.allowance-type-header-left,.allowance-type-header-right{width:100%}.allowance-type-dashboard-title{font-size:13px}.common-add-btn-allowance-type,.common-refresh-btn-allowance-type{width:100%;justify-content:center}.allowance-type-stats-grid-compact{grid-template-columns:1fr;gap:8px;margin-bottom:10px}.allowance-type-cards-grid{grid-template-columns:1fr;gap:10px}.allowance-type-pagination-wrapper{flex-direction:column;gap:10px}.allowance-type-pagination-info-group{width:100%;justify-content:center}.allowance-type-pagination-btn{width:34px;height:34px}.allowance-type-pagination-btn svg{width:16px;height:16px}}.panel-container-employee-allowance{padding:16px;background:linear-gradient(135deg,#abaeb1,#d1d8df 50%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh}.employee-allowance-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding:16px 20px;background:#fff;border-radius:8px;box-shadow:0 2px 6px #0000000f;flex-wrap:wrap;gap:12px}.employee-allowance-header-left{display:flex;align-items:center;gap:12px}.employee-allowance-dashboard-title{font-size:22px;font-weight:700;color:#1a1a1a;margin:0;display:flex;align-items:center;gap:10px}.employee-allowance-header-right{display:flex;gap:8px;flex-wrap:wrap}.common-add-btn-employee-allowance,.common-refresh-btn-employee-allowance{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap;text-transform:uppercase;letter-spacing:.5px}.common-add-btn-employee-allowance{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33}.common-add-btn-employee-allowance:hover{background:#2d2d2d;transform:translateY(-2px);box-shadow:0 4px 12px #1a1a1a4d}.common-refresh-btn-employee-allowance{background:#6c757d;color:#fff;box-shadow:0 2px 8px #6c757d33}.common-refresh-btn-employee-allowance:hover{background:#5a6268;transform:translateY(-2px);box-shadow:0 4px 12px #6c757d4d}.employee-allowance-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:16px}.employee-allowance-stat-card{background:#fff;padding:16px;border-radius:8px;box-shadow:0 2px 6px #0000000f;display:flex;align-items:center;gap:12px;transition:all .3s ease}.employee-allowance-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.employee-allowance-stat-icon{width:48px;height:48px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.employee-allowance-stat-icon.total{background:#8b5cf6}.employee-allowance-stat-icon.active{background:#10b981}.employee-allowance-stat-icon.inactive{background:#f59e0b}.employee-allowance-stat-content{flex:1}.employee-allowance-stat-number{font-size:20px;font-weight:700;color:#1a1a1a;margin-bottom:2px}.employee-allowance-stat-label{font-size:12px;color:#6b7280;font-weight:500}.employee-allowance-controls-section{display:flex;justify-content:flex-start;gap:16px;margin-bottom:16px;flex-wrap:wrap}.employee-allowance-search-box{flex:1;min-width:250px}.employee-allowance-search-input{width:100%;padding:10px 14px;border:2px solid #e9ecef;border-radius:6px;font-size:13px;color:#2d3748;background:#fff;transition:all .3s ease}.employee-allowance-search-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 3px #4950571a}.employee-allowance-filter-box{display:flex;align-items:center;gap:8px;background:#fff;padding:10px 14px;border-radius:6px;border:2px solid #e9ecef}.employee-allowance-filter-box label{font-size:13px;font-weight:600;color:#2d3748;white-space:nowrap}.employee-allowance-select-input{padding:6px 10px;border:none;border-radius:4px;font-size:13px;cursor:pointer;background:#f8f9fa;color:#2d3748}.employee-allowance-table-section{background:#fff;border-radius:8px;box-shadow:0 2px 6px #0000000f;overflow:hidden;margin-bottom:16px}.employee-allowance-table-wrapper{overflow-x:auto;max-height:600px;position:relative}.employee-allowance-data-table{width:100%;border-collapse:collapse;font-size:13px;background:#fff}.employee-allowance-data-table thead{background:#2d3748;position:sticky;top:0;z-index:10}.employee-allowance-data-table thead th{padding:12px 14px;text-align:left;font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:12px;color:#fff;border-bottom:2px solid #1a1a1a;white-space:nowrap}.employee-allowance-data-table tbody tr{border-bottom:1px solid #e9ecef;transition:all .2s ease}.employee-allowance-data-table tbody tr:hover{background:#f8f9fa}.employee-allowance-data-table tbody td{padding:12px 14px;color:#2d3748;vertical-align:middle}.employee-allowance-name-cell{font-weight:600;color:#1a1a1a}.employee-allowance-code-text{color:#6b7280;font-size:11px}.employee-allowance-amount-cell{font-weight:600;color:#10b981}.employee-allowance-frequency-badge{display:inline-block;padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600;background:#eef2ff;color:#4f46e5}.employee-allowance-status-badge{display:inline-block;padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.employee-allowance-status-badge.active{background:#d1fae5;color:#065f46}.employee-allowance-status-badge.inactive{background:#fee2e2;color:#991b1b}.employee-allowance-table-actions{width:120px;text-align:center}.employee-allowance-actions-group{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}.employee-allowance-action-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:none;border-radius:4px;cursor:pointer;transition:all .3s ease;background:#f8f9fa;border:1px solid #dee2e6}.employee-allowance-action-btn:hover{transform:translateY(-2px);box-shadow:0 2px 6px #0000001a}.employee-allowance-action-btn.edit{color:#0d6efd}.employee-allowance-action-btn.edit:hover{background:#e7f1ff}.employee-allowance-action-btn.delete{color:#dc3545}.employee-allowance-action-btn.delete:hover{background:#f8d7da}.employee-allowance-pagination-section{background:#fff;border-radius:8px;padding:12px 16px;box-shadow:0 2px 6px #0000000f;margin-bottom:16px}.employee-allowance-pagination-controls{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}.employee-allowance-pagination-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;background:#fff;border:2px solid #e9ecef;border-radius:4px;cursor:pointer;transition:all .3s ease;color:#495057;font-weight:600;font-size:14px;white-space:nowrap}.employee-allowance-pagination-btn:hover:not(:disabled){background:#2d3748;border-color:#2d3748;color:#fff;transform:translateY(-2px)}.employee-allowance-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.employee-allowance-pagination-goto{display:flex;align-items:center;gap:8px;font-size:13px;color:#495057;font-weight:600}.employee-allowance-pagination-input{width:60px;padding:6px 8px;border:2px solid #e9ecef;border-radius:4px;text-align:center;font-size:13px;font-weight:600;color:#1a1a1a}.employee-allowance-pagination-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 3px #4950571a}.employee-allowance-pagination-info{font-size:13px;color:#495057;font-weight:600;min-width:200px;text-align:center}.employee-allowance-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;color:#6b7280}.employee-allowance-no-data-image{max-width:150px;margin-bottom:12px;opacity:.5}.employee-allowance-no-data-container p{font-size:14px;margin:0}.employee-allowance-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;background:#fff;border-radius:8px;margin:40px auto;max-width:500px}.employee-allowance-spinner{width:40px;height:40px;border:4px solid #e9ecef;border-top-color:#2d3748;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.employee-allowance-loading-panel p{font-size:14px;color:#495057;margin:0}.employee-allowance-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.employee-allowance-modal-content{background:#fff;border-radius:8px;box-shadow:0 10px 40px #0003;max-width:900px;width:90%;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease}.employee-allowance-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:2px solid #e9ecef;background:#f8f9fa}.employee-allowance-modal-header h2{margin:0;font-size:18px;font-weight:700;color:#1a1a1a;display:flex;align-items:center;gap:10px}.employee-allowance-modal-close{background:none;border:none;cursor:pointer;color:#6b7280;transition:all .3s ease;padding:4px}.employee-allowance-modal-close:hover{color:#1a1a1a;transform:rotate(90deg)}.employee-allowance-form{padding:20px}.employee-allowance-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}.employee-allowance-form-column{display:flex;flex-direction:column;gap:16px}.employee-allowance-form-group{display:flex;flex-direction:column;gap:6px}.employee-allowance-form-label{font-size:13px;font-weight:600;color:#1a1a1a}.employee-allowance-form-input,.employee-allowance-form-textarea{padding:10px 12px;border:2px solid #e9ecef;border-radius:6px;font-size:13px;color:#2d3748;background:#fff;font-family:inherit;transition:all .3s ease}.employee-allowance-form-input:focus,.employee-allowance-form-textarea:focus{outline:none;border-color:#495057;box-shadow:0 0 0 3px #4950571a}.employee-allowance-form-input.error,.employee-allowance-form-textarea.error{border-color:#ef4444;background:#fef2f2}.employee-allowance-form-input.disabled{background:#f8f9fa;color:#6b7280;cursor:not-allowed}.employee-allowance-form-textarea{resize:vertical;min-height:80px}.employee-allowance-form-error{font-size:12px;color:#ef4444;font-weight:500}.employee-allowance-dropdown-wrapper{position:relative}.employee-allowance-input-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#6b7280;padding:4px;transition:all .3s ease}.employee-allowance-input-clear:hover{color:#1a1a1a}.employee-allowance-dropdown-menu{position:absolute;top:100%;left:0;right:0;background:#fff;border:2px solid #e9ecef;border-top:none;border-radius:0 0 6px 6px;max-height:200px;overflow-y:auto;z-index:1001;box-shadow:0 4px 12px #0000001a}.employee-allowance-dropdown-item{padding:10px 12px;cursor:pointer;border-bottom:1px solid #f3f4f6;transition:all .2s ease}.employee-allowance-dropdown-item:hover{background:#f8f9fa}.employee-allowance-dropdown-item:last-child{border-bottom:none}.employee-allowance-dropdown-name{font-weight:600;color:#1a1a1a;font-size:13px}.employee-allowance-dropdown-id{color:#6b7280;font-size:11px}.employee-allowance-form-buttons{display:flex;justify-content:flex-end;gap:12px;padding-top:16px;border-top:2px solid #e9ecef}.employee-allowance-btn-cancel,.employee-allowance-btn-submit{padding:10px 20px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.5px}.employee-allowance-btn-cancel{background:#e9ecef;color:#495057}.employee-allowance-btn-cancel:hover{background:#dee2e6;transform:translateY(-2px)}.employee-allowance-btn-submit{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33}.employee-allowance-btn-submit:hover{background:#2d2d2d;transform:translateY(-2px);box-shadow:0 4px 12px #1a1a1a4d}.employee-allowance-error-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;background:#fff;border-radius:8px;margin:40px auto;max-width:500px;border-left:4px solid #ef4444}.employee-allowance-error-panel p{font-size:14px;color:#ef4444;margin:0 0 16px;font-weight:600}@media(max-width:768px){.panel-container-employee-allowance{padding:12px}.employee-allowance-dashboard-header{flex-direction:column;align-items:flex-start}.employee-allowance-header-right{width:100%;justify-content:flex-start}.employee-allowance-stats-grid{grid-template-columns:repeat(2,1fr)}.employee-allowance-controls-section{flex-direction:column}.employee-allowance-search-box,.employee-allowance-filter-box{width:100%}.employee-allowance-table-wrapper{max-height:400px}.employee-allowance-form-grid{grid-template-columns:1fr;gap:16px}.employee-allowance-modal-content{width:95%;max-height:95vh}}@media(max-width:480px){.employee-allowance-dashboard-title{font-size:18px}.employee-allowance-stats-grid{grid-template-columns:1fr}.employee-allowance-stat-card{padding:12px}.employee-allowance-stat-number{font-size:18px}.employee-allowance-stat-label,.employee-allowance-data-table{font-size:11px}.employee-allowance-data-table thead th,.employee-allowance-data-table tbody td{padding:6px 8px}.employee-allowance-pagination-controls{gap:8px}.employee-allowance-pagination-btn{padding:6px 10px;font-size:12px}.employee-allowance-form{padding:16px}.employee-allowance-form-grid{gap:12px}.employee-allowance-modal-header h2{font-size:16px}.employee-allowance-form-buttons{flex-direction:column}.employee-allowance-btn-cancel,.employee-allowance-btn-submit{width:100%}}.employee-allowance-filter-section{background:#fff;border-radius:8px;padding:12px 16px;box-shadow:0 2px 6px #0000000f;margin-bottom:16px}.employee-allowance-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.employee-allowance-filter-item{display:flex;flex-direction:column;gap:6px}.employee-allowance-filter-label{font-weight:600;color:#2d3748;font-size:12px;text-transform:uppercase;letter-spacing:.3px}.employee-allowance-filter-input{padding:8px 10px;border:1px solid #d1d8df;border-radius:4px;font-size:12px;color:#2d3748;background:#fff;transition:all .3s ease}.employee-allowance-filter-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 2px #4950571a}.employee-allowance-filter-clear-btn{background:#dc3545;color:#fff;border:none;padding:8px 12px;border-radius:4px;cursor:pointer;font-weight:600;font-size:11px;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px;height:36px}.employee-allowance-filter-clear-btn:hover{background:#c82333;transform:translateY(-1px)}.employee-allowance-active-filters{background:#edf2f7;border-left:4px solid #4299e1;border-radius:6px;padding:10px 12px;margin-top:12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.employee-allowance-active-filters-label{font-weight:600;color:#2d3748;font-size:12px;text-transform:uppercase;letter-spacing:.3px}.employee-allowance-filter-badge{display:inline-flex;align-items:center;gap:6px;background:#4299e1;color:#fff;padding:6px 10px;border-radius:16px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease}.employee-allowance-filter-badge:hover{background:#3182ce}.employee-allowance-filter-badge svg{width:14px;height:14px;cursor:pointer}@media(max-width:768px){.employee-allowance-filter-grid{grid-template-columns:repeat(2,1fr)}.employee-allowance-active-filters{flex-direction:column;align-items:flex-start}}@media(max-width:480px){.employee-allowance-filter-grid{grid-template-columns:1fr}}.am-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.am-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#10b981,#059669);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.am-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.am-header-icon{font-size:18px}.am-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.am-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.am-buttons-row::-webkit-scrollbar{height:4px}.am-buttons-row::-webkit-scrollbar-track{background:transparent}.am-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.am-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.am-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.am-btn-with-label.active{border-color:#10b981;background:#ecfdf5;color:#10b981}.am-btn-icon{font-size:14px}.am-btn-text{display:inline-block}.am-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.am-close-all-compact:hover{background:#fecaca;color:#dc2626}.am-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.am-tab-content{animation:slideIn .2s ease-out}.am-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.am-empty-icon{font-size:64px;opacity:.4}.am-empty p{font-size:14px;margin:0;color:#9ca3af}.am-content::-webkit-scrollbar{width:8px}.am-content::-webkit-scrollbar-track{background:transparent}.am-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.am-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.am-button-bar{height:52px;gap:8px}.am-btn-with-label{padding:6px 10px;font-size:11px}.am-btn-icon{font-size:13px}.am-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.am-header-compact{height:44px;padding:0 12px}.am-header-title{font-size:14px;gap:8px}.am-header-icon{font-size:16px}.am-button-bar{height:48px;padding:0 8px;gap:6px}.am-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.am-btn-icon{font-size:12px}.am-close-all-compact{padding:6px 8px;font-size:10px}.am-content{padding:16px}}@media(max-width:480px){.am-header-compact{height:40px;padding:0 8px}.am-header-title{font-size:12px;gap:6px}.am-header-icon{font-size:14px}.am-button-bar{height:44px;padding:0 6px;gap:4px}.am-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.am-btn-icon{font-size:11px}.am-btn-text{display:none}.am-close-all-compact{padding:4px 6px;font-size:9px}.am-close-all-compact span{display:none}.am-content{padding:12px}}:root{--primary: #4F46E5;--primary-dark: #4338CA;--primary-light: #EEF2FF;--secondary: #10B981;--secondary-light: #ECFDF5;--danger: #EF4444;--danger-light: #FEF2F2;--warning: #F59E0B;--warning-light: #FFFBEB;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-900: #111827;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1)}.coin-bf-panel-container{padding:12px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh;font-family:Segoe UI,Roboto,-apple-system,sans-serif}.coin-bf-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;background:#fff;padding:10px 12px;border-radius:6px;box-shadow:var(--shadow-md);gap:10px;flex-wrap:wrap}.coin-bf-header-left{flex:1;min-width:150px}.coin-bf-title{font-size:14px;font-weight:700;color:var(--gray-900);margin:0;display:flex;align-items:center;gap:6px}.coin-bf-icon{color:var(--primary);width:18px;height:18px}.coin-bf-header-right{display:flex;gap:6px}.coin-bf-btn-add,.coin-bf-btn-refresh{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.coin-bf-btn-add{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:var(--shadow-md)}.coin-bf-btn-add:hover{transform:translateY(-1px)}.coin-bf-btn-refresh{background:#fff;color:var(--gray-700);border:1px solid var(--gray-300);width:36px;padding:6px}.coin-bf-btn-refresh:hover{background:var(--gray-50);border-color:var(--primary);color:var(--primary)}.coin-bf-stats-compact{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin-bottom:10px}.coin-bf-stat-item{background:#fff;padding:10px;border-radius:6px;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:8px;border-left:3px solid var(--primary)}.coin-bf-stat-icon{width:36px;height:36px;border-radius:6px;display:flex;align-items:center;justify-content:center;background:var(--primary-light);color:var(--primary);flex-shrink:0}.coin-bf-stat-content{flex:1}.coin-bf-stat-value{font-size:14px;font-weight:700;color:var(--gray-900);line-height:1}.coin-bf-stat-label{font-size:10px;color:var(--gray-500);margin-top:2px;font-weight:500}.coin-bf-search-box{background:#fff;border-radius:6px;padding:8px;box-shadow:var(--shadow-md);margin-bottom:10px}.coin-bf-search-input{width:100%;padding:8px 10px;border:1px solid var(--gray-300);border-radius:4px;font-size:12px;color:var(--gray-900);background:#fff}.coin-bf-search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.coin-bf-cards-wrapper{background:#fff;border-radius:6px;padding:8px;box-shadow:var(--shadow-md);margin-bottom:10px;min-height:150px}.coin-bf-compact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}.coin-bf-compact-card{background:#fff;border:1px solid var(--gray-200);border-radius:4px;overflow:hidden;transition:all .2s ease;display:flex;flex-direction:column;box-shadow:var(--shadow-sm)}.coin-bf-compact-card:hover{border-color:var(--primary);box-shadow:var(--shadow-md);transform:translateY(-1px)}.coin-bf-card-top{display:flex;justify-content:space-between;align-items:flex-start;padding:8px;border-bottom:1px solid var(--gray-100);background:linear-gradient(135deg,var(--gray-50) 0%,white 100%)}.coin-bf-card-name{font-size:11px;font-weight:600;color:var(--gray-900);margin:0;flex:1;word-break:break-word;line-height:1.2}.coin-bf-card-btns{display:flex;gap:3px;margin-left:4px;flex-shrink:0}.coin-bf-card-btn{width:22px;height:22px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);border-radius:3px;cursor:pointer;transition:all .2s ease;background:#fff;padding:0}.coin-bf-card-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.coin-bf-card-btn.edit:hover{background:var(--warning-light);border-color:var(--warning)}.coin-bf-card-btn.delete:hover{background:var(--danger-light);border-color:var(--danger)}.coin-bf-card-btn img{width:10px;height:10px}.coin-bf-card-body{padding:8px;flex:1}.coin-bf-field{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin-bottom:5px;gap:4px}.coin-bf-field:last-child{margin-bottom:0}.coin-bf-field-label{color:var(--gray-600);font-weight:500;flex-shrink:0}.coin-bf-field-value{color:var(--gray-900);font-weight:600;text-align:right;flex:1}.coin-bf-field-value.highlight{color:var(--secondary);font-weight:700;font-size:11px}.coin-bf-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.coin-bf-empty-state img{width:60px;height:auto;opacity:.3;margin-bottom:10px}.coin-bf-empty-state p{font-size:12px;color:var(--gray-500);margin:0}.coin-bf-pagination{background:#fff;border-radius:6px;padding:8px 10px;box-shadow:var(--shadow-md);display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}.coin-bf-page-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:#fff;border:1px solid var(--gray-300);border-radius:4px;cursor:pointer;transition:all .2s ease;color:var(--gray-700);padding:0}.coin-bf-page-btn:hover:not(:disabled){background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-color:var(--primary);color:#fff;transform:translateY(-1px)}.coin-bf-page-btn:disabled{opacity:.4;cursor:not-allowed}.coin-bf-page-info{display:flex;align-items:center;gap:4px;font-size:11px;color:var(--gray-700);font-weight:600}.coin-bf-page-input{width:40px;padding:6px 8px;border:1px solid var(--gray-300);border-radius:4px;text-align:center;font-size:11px;font-weight:600;color:var(--gray-900)}.coin-bf-page-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.coin-bf-export-box{background:#fff;border-radius:6px;padding:8px;box-shadow:var(--shadow-md);display:flex;gap:6px;flex-wrap:wrap}.coin-bf-export-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;color:#fff;flex:1;min-width:80px}.coin-bf-export-btn.excel{background:linear-gradient(135deg,#10b981,#059669)}.coin-bf-export-btn.csv{background:linear-gradient(135deg,#f59e0b,#d97706)}.coin-bf-export-btn.pdf{background:linear-gradient(135deg,#ef4444,#dc2626)}.coin-bf-export-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.coin-bf-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px}.coin-bf-modal{background:#fff;border-radius:8px;box-shadow:0 20px 25px #00000026;width:100%;max-width:450px;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease-out}.coin-bf-modal-header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--gray-200);background:linear-gradient(135deg,var(--primary-light) 0%,white 100%)}.coin-bf-modal-header h2{font-size:14px;font-weight:700;color:var(--gray-900);margin:0}.coin-bf-modal-header button{background:none;border:none;color:var(--gray-500);cursor:pointer;padding:2px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.coin-bf-modal-header button:hover{color:var(--danger);background:var(--danger-light);border-radius:4px}.coin-bf-modal-form{padding:16px;display:flex;flex-direction:column;gap:12px}.coin-bf-form-group{display:flex;flex-direction:column;gap:4px}.coin-bf-form-group label{font-size:11px;font-weight:600;color:var(--gray-700);text-transform:uppercase;letter-spacing:.2px}.coin-bf-input,.coin-bf-form-group textarea{padding:8px 10px;border:1px solid var(--gray-300);border-radius:4px;font-size:12px;color:var(--gray-900);background:#fff;transition:all .2s ease;font-family:inherit}.coin-bf-input:focus,.coin-bf-form-group textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.coin-bf-input.error{border-color:var(--danger);background:var(--danger-light)}.coin-bf-input.disabled{background:var(--gray-100);cursor:not-allowed;opacity:.6}.coin-bf-error{font-size:10px;color:var(--danger);font-weight:600}.coin-bf-dropdown{position:relative}.coin-bf-clear-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--gray-400);cursor:pointer;padding:2px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.coin-bf-clear-btn:hover{color:var(--danger)}.coin-bf-dropdown-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid var(--gray-300);border-top:none;border-radius:0 0 4px 4px;box-shadow:0 8px 12px #0000001a;z-index:1001;max-height:250px;overflow-y:auto;margin-top:-1px}.coin-bf-dropdown-item{padding:8px 10px;cursor:pointer;transition:all .2s ease;border-bottom:1px solid var(--gray-100);font-size:11px}.coin-bf-dropdown-item:last-child{border-bottom:none}.coin-bf-dropdown-item:hover{background:var(--primary-light)}.coin-bf-dropdown-item div{font-weight:600;color:var(--gray-900)}.coin-bf-dropdown-item small{font-size:10px;color:var(--gray-500);display:block;margin-top:1px}.coin-bf-form-buttons{display:flex;gap:8px;margin-top:6px;padding-top:12px;border-top:1px solid var(--gray-200)}.coin-bf-btn-cancel,.coin-bf-btn-submit{flex:1;padding:8px 12px;border:none;border-radius:4px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.coin-bf-btn-cancel{background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-300)}.coin-bf-btn-cancel:hover{background:var(--gray-200)}.coin-bf-btn-submit{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:var(--shadow-md)}.coin-bf-btn-submit:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.coin-bf-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center;background:#fff;border-radius:6px;margin:20px auto;max-width:250px;box-shadow:var(--shadow-md)}.coin-bf-spinner{width:32px;height:32px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:10px}.coin-bf-loading-panel p{font-size:12px;color:var(--gray-600);margin:0}@media(max-width:768px){.coin-bf-panel-container{padding:8px}.coin-bf-header{padding:8px 10px;margin-bottom:8px}.coin-bf-title{font-size:12px}.coin-bf-compact-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:5px}.coin-bf-modal{max-width:100%}}@media(max-width:480px){.coin-bf-panel-container{padding:6px}.coin-bf-header{padding:6px 8px;margin-bottom:6px}.coin-bf-title{font-size:11px}.coin-bf-stats-compact{gap:6px;margin-bottom:8px}.coin-bf-stat-item{padding:8px}.coin-bf-stat-value{font-size:12px}.coin-bf-compact-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:4px}.coin-bf-cards-wrapper{padding:6px;margin-bottom:8px}.coin-bf-export-box{padding:6px;gap:4px}.coin-bf-export-btn{padding:5px 8px;font-size:10px;min-width:70px}.coin-bf-modal-form{padding:12px;gap:10px}}.coin-bf-filters{background:#fff;border-radius:6px;padding:8px;box-shadow:var(--shadow-md);margin-bottom:10px;display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}.coin-bf-filter-item{display:flex;flex-direction:column;gap:4px;flex:1;min-width:150px}.coin-bf-filter-item label{font-size:10px;font-weight:600;color:var(--gray-700);text-transform:uppercase;letter-spacing:.2px}.coin-bf-filter-input{padding:6px 8px;border:1px solid var(--gray-300);border-radius:4px;font-size:11px;color:var(--gray-900);background:#fff;transition:all .2s ease}.coin-bf-filter-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.coin-bf-filter-clear{padding:6px 10px;background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-300);border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.coin-bf-filter-clear:hover{background:var(--gray-200);border-color:var(--gray-400)}@media(max-width:768px){.coin-bf-filters{flex-direction:column}.coin-bf-filter-item{width:100%;min-width:unset}.coin-bf-filter-clear{width:100%}}@media(max-width:480px){.coin-bf-filters{padding:6px;gap:6px;margin-bottom:8px}.coin-bf-filter-item{gap:3px}.coin-bf-filter-input{padding:5px 6px;font-size:10px}.coin-bf-filter-clear{padding:5px 8px;font-size:10px}}.cb-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.cb-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#06b6d4,#0891b2);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.cb-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.cb-header-icon{font-size:18px}.cb-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.cb-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.cb-buttons-row::-webkit-scrollbar{height:4px}.cb-buttons-row::-webkit-scrollbar-track{background:transparent}.cb-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.cb-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.cb-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.cb-btn-with-label.active{border-color:#06b6d4;background:#ecf8fa;color:#06b6d4}.cb-btn-icon{font-size:14px}.cb-btn-text{display:inline-block}.cb-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.cb-close-all-compact:hover{background:#fecaca;color:#dc2626}.cb-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.cb-tab-content{animation:slideIn .2s ease-out}.cb-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.cb-empty-icon{font-size:64px;opacity:.4}.cb-empty p{font-size:14px;margin:0;color:#9ca3af}.cb-content::-webkit-scrollbar{width:8px}.cb-content::-webkit-scrollbar-track{background:transparent}.cb-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.cb-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.cb-button-bar{height:52px;gap:8px}.cb-btn-with-label{padding:6px 10px;font-size:11px}.cb-btn-icon{font-size:13px}.cb-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.cb-header-compact{height:44px;padding:0 12px}.cb-header-title{font-size:14px;gap:8px}.cb-header-icon{font-size:16px}.cb-button-bar{height:48px;padding:0 8px;gap:6px}.cb-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.cb-btn-icon{font-size:12px}.cb-close-all-compact{padding:6px 8px;font-size:10px}.cb-content{padding:16px}}@media(max-width:480px){.cb-header-compact{height:40px;padding:0 8px}.cb-header-title{font-size:12px;gap:6px}.cb-header-icon{font-size:14px}.cb-button-bar{height:44px;padding:0 6px;gap:4px}.cb-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.cb-btn-icon{font-size:11px}.cb-btn-text{display:none}.cb-close-all-compact{padding:4px 6px;font-size:9px}.cb-close-all-compact span{display:none}.cb-content{padding:12px}}:root{--primary-black: #1a1a1a;--secondary-black: #2d3748;--light-gray: #f5f5f5;--border-gray: #e0e0e0;--text-dark: #1a1a1a;--text-gray: #666666;--text-light-gray: #999999;--white: #ffffff;--success-green: #10b981;--error-red: #ef4444;--warning-yellow: #fbbf24}.attendance-import-dashboard{min-height:100vh;background:linear-gradient(135deg,#f5f5f5,#e8e8e8);padding:24px;display:flex;flex-direction:column;gap:24px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.attendance-import-header{background:var(--white);border-radius:8px;padding:24px;box-shadow:0 2px 8px #00000014;display:flex;align-items:center;justify-content:space-between;border-left:4px solid var(--primary-black)}.attendance-import-header-left{display:flex;align-items:center;gap:16px}.attendance-import-header-icon{color:var(--primary-black);width:32px;height:32px}.attendance-import-header-text{display:flex;flex-direction:column;gap:4px}.attendance-import-header-title{font-size:28px;font-weight:700;color:var(--primary-black);margin:0;letter-spacing:-.5px}.attendance-import-header-subtitle{font-size:14px;color:var(--text-gray);margin:0;font-weight:500}.attendance-import-container{display:grid;grid-template-columns:1fr 1fr;gap:24px}.attendance-import-left-panel,.attendance-import-right-panel{display:flex;flex-direction:column;gap:24px}.attendance-import-card{background:var(--white);border-radius:8px;box-shadow:0 2px 8px #00000014;overflow:hidden;animation:slideUp .3s ease-out;border:1px solid var(--border-gray)}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.attendance-import-card-header{display:flex;align-items:center;gap:12px;padding:16px 20px;background:var(--primary-black);color:var(--white);border-bottom:1px solid var(--border-gray)}.attendance-import-card-header h2{font-size:15px;font-weight:700;margin:0;flex:1;text-transform:uppercase;letter-spacing:.5px}.attendance-import-card-body{padding:20px;display:flex;flex-direction:column;gap:16px}.attendance-import-file-input-wrapper{position:relative}.attendance-import-file-input{display:none}.attendance-import-file-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 24px;border:2px dashed var(--border-gray);border-radius:8px;background:var(--light-gray);cursor:pointer;transition:all .3s ease;color:var(--text-gray)}.attendance-import-file-label:hover{background:#efefef;border-color:var(--primary-black);color:var(--primary-black)}.attendance-import-file-label span{font-weight:600;font-size:15px}.attendance-import-file-label small{font-size:12px;opacity:.7}.attendance-import-file-selected{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#f0f9ff;border:1px solid #bfdbfe;border-radius:6px;color:#1e40af}.attendance-import-file-info{flex:1;display:flex;flex-direction:column;gap:2px}.attendance-import-file-name{font-weight:600;font-size:13px}.attendance-import-file-size{font-size:12px;opacity:.7}.attendance-import-file-clear{margin-left:auto;background:transparent;border:none;color:#1e40af;cursor:pointer;font-size:18px;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.attendance-import-file-clear:hover{opacity:.7}.attendance-import-button-group{display:flex;gap:12px}.attendance-import-template-btn,.attendance-import-preview-btn,.attendance-import-import-btn{padding:12px 16px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px;text-transform:uppercase;letter-spacing:.3px}.attendance-import-template-btn{background:var(--light-gray);color:var(--text-dark);border:1px solid var(--border-gray);flex:1}.attendance-import-template-btn:hover:not(:disabled){background:#e8e8e8;border-color:var(--primary-black);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.attendance-import-preview-btn{background:var(--primary-black);color:var(--white);flex:1}.attendance-import-preview-btn:hover:not(:disabled){background:var(--secondary-black);transform:translateY(-2px);box-shadow:0 4px 12px #0003}.attendance-import-import-btn{background:var(--success-green);color:var(--white);width:100%;padding:14px 16px;font-size:15px}.attendance-import-import-btn:hover:not(:disabled){background:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.attendance-import-template-btn:disabled,.attendance-import-preview-btn:disabled,.attendance-import-import-btn:disabled{opacity:.5;cursor:not-allowed}.attendance-import-clear-history-btn{background:transparent;border:none;color:var(--white);cursor:pointer;padding:4px 8px;display:flex;align-items:center;justify-content:center;margin-left:auto;transition:all .3s ease;opacity:.8}.attendance-import-clear-history-btn:hover{opacity:1;transform:scale(1.1)}.attendance-import-info-box{display:flex;gap:12px;padding:12px 16px;background:#f3f4f6;border:1px solid #d1d5db;border-radius:6px;color:var(--text-dark);font-size:13px}.attendance-import-info-box strong{display:block;margin-bottom:4px;font-weight:700}.attendance-import-info-box p{margin:0;font-weight:500}.attendance-import-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.attendance-import-summary-item{display:flex;align-items:center;gap:12px;padding:16px;border-radius:8px;background:var(--light-gray);border:1px solid var(--border-gray)}.attendance-import-summary-item.valid{background:#f0fdf4;border-color:#bbf7d0}.attendance-import-summary-item.valid svg{color:var(--success-green)}.attendance-import-summary-item.invalid{background:#fef2f2;border-color:#fecaca}.attendance-import-summary-item.invalid svg{color:var(--error-red)}.attendance-import-summary-item.total{background:#f3f4f6;border-color:#d1d5db}.attendance-import-summary-item.total svg{color:var(--text-dark)}.attendance-import-summary-label{font-size:12px;opacity:.8;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.attendance-import-summary-value{font-size:24px;font-weight:700}.attendance-import-table-wrapper{display:flex;flex-direction:column;gap:8px}.attendance-import-table-title{font-size:13px;font-weight:700;color:var(--text-dark);margin:0;text-transform:uppercase;letter-spacing:.3px}.attendance-import-table-scroll{overflow-x:auto;border:1px solid var(--border-gray);border-radius:6px;background:var(--white)}.attendance-import-table{width:100%;border-collapse:collapse;font-size:13px}.attendance-import-table thead{background:var(--light-gray);border-bottom:2px solid var(--border-gray)}.attendance-import-table th{padding:12px;text-align:left;font-weight:700;color:var(--text-dark);text-transform:uppercase;font-size:11px;letter-spacing:.5px}.attendance-import-table td{padding:12px;border-bottom:1px solid var(--border-gray);color:var(--text-gray)}.attendance-import-table tbody tr:hover{background:var(--light-gray)}.attendance-import-status{display:inline-block;padding:4px 10px;border-radius:4px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.attendance-import-status.present{background:#d1fae5;color:#065f46}.attendance-import-status.absent{background:#fee2e2;color:#991b1b}.attendance-import-more-records{font-size:12px;color:var(--text-light-gray);margin:8px 0 0;text-align:center;font-weight:500}.attendance-import-errors-wrapper{display:flex;flex-direction:column;gap:8px}.attendance-import-errors-title{font-size:13px;font-weight:700;color:var(--error-red);margin:0;text-transform:uppercase;letter-spacing:.3px}.attendance-import-errors-list{display:flex;flex-direction:column;gap:8px}.attendance-import-error-item{border:1px solid #fecaca;border-radius:6px;background:#fef2f2;overflow:hidden}.attendance-import-error-header{padding:12px;cursor:pointer;display:flex;align-items:center;gap:8px;color:var(--error-red);transition:all .3s ease}.attendance-import-error-header:hover{background:#fee2e2}.attendance-import-error-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.attendance-import-error-details{padding:12px;background:var(--white);border-top:1px solid #fecaca}.attendance-import-error-details pre{margin:0;font-size:11px;overflow-x:auto;color:var(--text-gray);font-family:Courier New,monospace}.attendance-import-more-errors{font-size:12px;color:var(--text-light-gray);margin:8px 0 0;text-align:center;font-weight:500}.attendance-import-history-list{display:flex;flex-direction:column;gap:8px}.attendance-import-history-item{display:flex;align-items:center;gap:12px;padding:12px;background:var(--light-gray);border:1px solid var(--border-gray);border-radius:6px;transition:all .3s ease}.attendance-import-history-item:hover{background:#efefef;border-color:var(--primary-black)}.attendance-import-history-index{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--primary-black);color:var(--white);border-radius:50%;font-weight:700;font-size:12px;flex-shrink:0}.attendance-import-history-content{flex:1;display:flex;flex-direction:column;gap:4px}.attendance-import-history-title{font-weight:700;font-size:13px;color:var(--text-dark)}.attendance-import-history-details{display:flex;gap:12px;font-size:12px;color:var(--text-gray)}.attendance-import-history-time{display:flex;align-items:center;gap:4px;font-weight:500}.attendance-import-history-count{display:flex;align-items:center;gap:4px;color:var(--success-green);font-weight:700}.attendance-import-history-status{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;font-weight:700;font-size:16px;flex-shrink:0}.attendance-import-history-status.success{background:#d1fae5;color:var(--success-green)}.attendance-import-history-status.failed{background:#fee2e2;color:var(--error-red)}.attendance-import-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px 24px;color:var(--text-light-gray)}.attendance-import-empty-state p{font-size:16px;font-weight:600;margin:0;color:var(--text-gray)}.attendance-import-empty-state small{font-size:12px;margin:0}.attendance-import-spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@media(max-width:1024px){.attendance-import-container{grid-template-columns:1fr}.attendance-import-summary{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.attendance-import-dashboard{padding:12px;gap:16px}.attendance-import-header{padding:16px;flex-direction:column;align-items:flex-start}.attendance-import-header-title{font-size:22px}.attendance-import-card-body{padding:16px}.attendance-import-file-label{padding:24px 16px}.attendance-import-button-group{flex-direction:column}.attendance-import-summary{grid-template-columns:1fr}.attendance-import-table{font-size:12px}.attendance-import-table th,.attendance-import-table td{padding:8px}}.attendance-import-preview-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:900;padding:20px;overflow-y:auto}.attendance-import-preview-modal{background:var(--white);border-radius:8px;width:100%;min-width:1200px;min-height:800px;max-height:800px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 10px 40px #00000026;animation:slideUp .3s ease-out}.attendance-import-preview-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px;background:var(--primary-black);color:var(--white);border-bottom:1px solid var(--border-gray)}.attendance-import-preview-modal-title{display:flex;align-items:center;gap:12px}.attendance-import-preview-modal-title h2{font-size:18px;font-weight:700;margin:0;text-transform:uppercase;letter-spacing:.5px}.attendance-import-preview-modal-close{background:transparent;border:none;color:var(--white);cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;opacity:.8}.attendance-import-preview-modal-close:hover{opacity:1;transform:scale(1.1)}.attendance-import-preview-modal-body{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:20px}.attendance-import-preview-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.attendance-import-preview-summary-item{display:flex;align-items:center;gap:12px;padding:16px;border-radius:8px;background:var(--light-gray);border:1px solid var(--border-gray)}.attendance-import-preview-summary-item.valid{background:#f0fdf4;border-color:#bbf7d0}.attendance-import-preview-summary-item.valid svg{color:var(--success-green)}.attendance-import-preview-summary-item.invalid{background:#fef2f2;border-color:#fecaca}.attendance-import-preview-summary-item.invalid svg{color:var(--error-red)}.attendance-import-preview-summary-item.total{background:#f3f4f6;border-color:#d1d5db}.attendance-import-preview-summary-item.total svg{color:var(--text-dark)}.attendance-import-preview-summary-label{font-size:12px;opacity:.8;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.attendance-import-preview-summary-value{font-size:24px;font-weight:700}.attendance-import-preview-section{display:flex;flex-direction:column;gap:12px}.attendance-import-preview-section-title{font-size:14px;font-weight:700;color:var(--text-dark);margin:0;text-transform:uppercase;letter-spacing:.3px}.attendance-import-preview-table-wrapper{overflow-x:auto;border:1px solid var(--border-gray);border-radius:6px;background:var(--white)}.attendance-import-preview-table{width:100%;border-collapse:collapse;font-size:13px}.attendance-import-preview-table thead{background:var(--light-gray);border-bottom:2px solid var(--border-gray)}.attendance-import-preview-table th{padding:12px;text-align:left;font-weight:700;color:var(--text-dark);text-transform:uppercase;font-size:11px;letter-spacing:.5px;white-space:nowrap}.attendance-import-preview-table td{padding:12px;border-bottom:1px solid var(--border-gray);color:var(--text-gray)}.attendance-import-preview-table tbody tr:hover{background:var(--light-gray)}.attendance-import-preview-name{font-weight:600;color:var(--text-dark)}.attendance-import-preview-datetime{font-size:12px;color:var(--text-light-gray)}.attendance-import-preview-status{display:inline-block;padding:4px 10px;border-radius:4px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}.attendance-import-preview-status.present{background:#d1fae5;color:#065f46}.attendance-import-preview-status.absent{background:#fee2e2;color:#991b1b}.attendance-import-preview-action,.attendance-import-preview-apb,.attendance-import-preview-jobcode{text-align:center;font-weight:500}.attendance-import-preview-pagination{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;padding:12px;background:var(--light-gray);border-radius:6px;border:1px solid var(--border-gray)}.attendance-import-preview-pagination-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;background:var(--white);border:1px solid var(--border-gray);border-radius:4px;cursor:pointer;transition:all .3s ease;color:var(--text-dark);font-weight:600;font-size:13px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.attendance-import-preview-pagination-btn:hover:not(:disabled){background:var(--primary-black);border-color:var(--primary-black);color:var(--white);transform:translateY(-2px)}.attendance-import-preview-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.attendance-import-preview-pagination-goto{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-dark);font-weight:600}.attendance-import-preview-pagination-input{width:60px;padding:6px 8px;border:1px solid var(--border-gray);border-radius:4px;text-align:center;font-size:13px;font-weight:600;color:var(--text-dark)}.attendance-import-preview-pagination-input:focus{outline:none;border-color:var(--primary-black);box-shadow:0 0 0 3px #1a1a1a1a}.attendance-import-preview-pagination-info{font-size:13px;color:var(--text-gray);font-weight:600;min-width:200px;text-align:center}.attendance-import-preview-errors-list{display:flex;flex-direction:column;gap:8px}.attendance-import-preview-error-item{border:1px solid #fecaca;border-radius:6px;background:#fef2f2;overflow:hidden}.attendance-import-preview-error-header{padding:12px;cursor:pointer;display:flex;align-items:center;gap:8px;color:var(--error-red);transition:all .3s ease}.attendance-import-preview-error-header:hover{background:#fee2e2}.attendance-import-preview-error-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.attendance-import-preview-error-details{padding:12px;background:var(--white);border-top:1px solid #fecaca}.attendance-import-preview-error-details pre{margin:0;font-size:11px;overflow-x:auto;color:var(--text-gray);font-family:Courier New,monospace}.attendance-import-preview-more-errors{font-size:12px;color:var(--text-light-gray);margin:8px 0 0;text-align:center;font-weight:500}.attendance-import-preview-modal-footer{display:flex;gap:12px;justify-content:flex-end;padding:16px 20px;background:var(--light-gray);border-top:1px solid var(--border-gray)}.attendance-import-preview-modal-cancel-btn,.attendance-import-preview-modal-import-btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px;text-transform:uppercase;letter-spacing:.3px}.attendance-import-preview-modal-cancel-btn{background:var(--light-gray);color:var(--text-dark);border:1px solid var(--border-gray)}.attendance-import-preview-modal-cancel-btn:hover:not(:disabled){background:#e8e8e8;border-color:var(--primary-black);transform:translateY(-2px)}.attendance-import-preview-modal-import-btn{background:var(--success-green);color:var(--white);min-width:200px}.attendance-import-preview-modal-import-btn:hover:not(:disabled){background:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.attendance-import-preview-modal-cancel-btn:disabled,.attendance-import-preview-modal-import-btn:disabled{opacity:.5;cursor:not-allowed}@media(max-width:768px){.attendance-import-preview-modal{max-width:95%;max-height:95vh}.attendance-import-preview-modal-body{padding:16px}.attendance-import-preview-summary{grid-template-columns:repeat(2,1fr)}.attendance-import-preview-table{font-size:12px}.attendance-import-preview-table th,.attendance-import-preview-table td{padding:8px}.attendance-import-preview-pagination{flex-direction:column}.attendance-import-preview-pagination-info{width:100%;min-width:auto}.attendance-import-preview-modal-footer{flex-direction:column}.attendance-import-preview-modal-cancel-btn,.attendance-import-preview-modal-import-btn{width:100%}}@media(max-width:480px){.attendance-import-preview-modal{max-width:100%;border-radius:0;max-height:100vh}.attendance-import-preview-modal-header{padding:16px}.attendance-import-preview-modal-title h2{font-size:16px}.attendance-import-preview-summary{grid-template-columns:1fr}.attendance-import-preview-table{font-size:11px}.attendance-import-preview-table th,.attendance-import-preview-table td{padding:6px}.attendance-import-preview-pagination-btn{padding:6px 10px;font-size:12px}.attendance-import-preview-pagination-input{width:50px}}.calc-preview-modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.calc-preview-modal-content{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;max-width:1400px;width:98%;max-height:900px;overflow:hidden;display:flex;flex-direction:column}.calc-preview-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:2px solid #f0f0f0;background:linear-gradient(135deg,#667eea,#764ba2);flex-shrink:0}.calc-preview-modal-title{display:flex;align-items:center;gap:12px;color:#fff}.calc-preview-modal-title h2{margin:0;font-size:18px;font-weight:600}.calc-preview-period{background:#fff3;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500}.calc-preview-modal-close{background:#fff3;border:none;color:#fff;cursor:pointer;padding:8px;border-radius:6px;transition:all .3s ease}.calc-preview-modal-close:hover{background:#ffffff4d}.calc-preview-modal-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}.calc-preview-table-wrapper{flex:1;overflow:auto;border:1px solid #e0e0e0;border-radius:8px;background:#fff;display:flex;flex-direction:column}.calc-preview-table-wrapper h3{margin:12px;font-size:14px;color:#333;font-weight:600;flex-shrink:0}.calc-preview-table{width:100%;border-collapse:collapse;font-size:13px;min-width:1400px;flex:1}.calc-preview-table thead{background:#f5f5f5;position:sticky;top:0;z-index:10}.calc-preview-table th{padding:12px 10px;text-align:left;font-weight:600;color:#333;border-bottom:2px solid #ddd;white-space:nowrap;background:#f5f5f5;font-size:13px}.calc-preview-table td{padding:12px 10px;border-bottom:1px solid #f0f0f0;font-size:13px}.calc-preview-row:hover{background:#f9f9f9}.calc-preview-table .emp-id{font-weight:600;color:#667eea;min-width:80px;font-size:13px}.calc-preview-table .emp-name{color:#333;font-weight:500;min-width:150px;font-size:13px}.calc-preview-table .badge{display:inline-block;padding:6px 10px;border-radius:4px;font-weight:500;text-align:center;min-width:50px;font-size:13px}.calc-preview-table .badge.full{background:#e8f5e9;color:#2e7d32}.calc-preview-table .badge.half{background:#fff3e0;color:#e65100}.calc-preview-table .badge.total{background:#e3f2fd;color:#1565c0}.calc-preview-table .badge.value{background:#f0f0f0;color:#333}.calc-preview-table .badge.empty{background:#fafafa;color:#ccc}.calc-preview-table .badge.no-pay{background:#ffebee;color:#c62828}.calc-preview-table .badge.annual-leave{background:#e0f2f1;color:#00695c}.calc-preview-info{background:#e3f2fd;border-left:4px solid #2196f3;padding:12px;border-radius:6px;font-size:13px;color:#1565c0;font-weight:500;flex-shrink:0}.calc-preview-info p{margin:0}.calc-preview-pagination{display:flex;justify-content:center;align-items:center;gap:12px;padding:12px 16px;background:#f9f9f9;border-top:1px solid #e0e0e0;flex-shrink:0}.calc-preview-pagination-btn{padding:8px 12px;border:1px solid #ddd;background:#fff;color:#333;border-radius:4px;font-size:12px;font-weight:500;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:4px}.calc-preview-pagination-btn:hover:not(:disabled){background:#667eea;color:#fff;border-color:#667eea}.calc-preview-modal-footer{display:flex;gap:12px;padding:16px 20px;border-top:1px solid #f0f0f0;background:#f9f9f9;justify-content:flex-end;flex-shrink:0}.calc-preview-btn{padding:10px 20px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .3s ease}.calc-preview-btn.cancel{background:#f0f0f0;color:#333}.calc-preview-btn.cancel:hover:not(:disabled){background:#e0e0e0}.calc-preview-btn.save{background:#28a745;color:#fff}.calc-preview-btn.save:hover:not(:disabled){background:#218838;box-shadow:0 4px 12px #28a7454d}@media(max-width:1024px){.calc-preview-modal-content{max-width:95%}.calc-preview-table{font-size:12px}.calc-preview-table th,.calc-preview-table td{padding:10px 8px}}@media(max-width:768px){.calc-preview-modal-content{max-width:98%;max-height:90vh}.calc-preview-table{font-size:11px}.calc-preview-table th,.calc-preview-table td{padding:8px 6px}.calc-preview-modal-footer{flex-direction:column-reverse}.calc-preview-btn{width:100%;justify-content:center}}@media(max-width:600px){.calc-preview-modal-content{max-width:99%}.calc-preview-table{font-size:10px}.calc-preview-pagination{flex-wrap:wrap;gap:8px}}.calc-preview-search-section{margin-bottom:20px;padding:12px;background:#f9f9f9;border-radius:6px;border:1px solid #e0e0e0}.calc-preview-search-wrapper{position:relative;display:flex;align-items:center;gap:8px}.calc-preview-search-icon{position:absolute;left:12px;color:#999;pointer-events:none}.calc-preview-search-input{flex:1;padding:10px 12px 10px 40px;border:1px solid #ddd;border-radius:6px;font-size:13px;transition:all .3s ease;background:#fff}.calc-preview-search-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.calc-preview-search-input::placeholder{color:#999}.calc-preview-search-clear{position:absolute;right:12px;background:none;border:none;color:#999;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.calc-preview-search-clear:hover{color:#333;transform:scale(1.2)}.calc-preview-search-results{margin-top:8px;font-size:12px;color:#666;padding:0 4px;font-weight:500}.calc-preview-table-wrapper{margin-top:16px}.calc-preview-table-wrapper h3{margin:0 0 12px;font-size:14px;font-weight:600;color:#333}.calc-preview-table-wrapper{overflow-x:auto;border-radius:6px;border:1px solid #e0e0e0}.calc-preview-table{width:100%;border-collapse:collapse;background:#fff}.calc-preview-table thead{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;position:sticky;top:0}.calc-preview-table th{padding:12px;font-size:12px;font-weight:600;text-align:center;white-space:nowrap}.calc-preview-table td{padding:10px;text-align:center;border-bottom:1px solid #f0f0f0;font-size:12px}.calc-preview-table tbody tr:hover{background-color:#f9f9f9}.calc-preview-table .emp-id,.calc-preview-table .emp-name{text-align:left;font-weight:500}.calc-preview-table .emp-id{color:#667eea;font-weight:600}.calc-preview-pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px;padding:12px;background:#f9f9f9;border-radius:6px}.calc-preview-pagination-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fff;border:1px solid #ddd;border-radius:4px;font-size:12px;font-weight:600;color:#333;cursor:pointer;transition:all .3s ease}.calc-preview-pagination-btn:hover:not(:disabled){background:#667eea;color:#fff;border-color:#667eea;transform:translateY(-1px)}.calc-preview-pagination-btn:disabled{opacity:.5;cursor:not-allowed}.calc-preview-pagination-info{font-size:12px;color:#666;font-weight:500;min-width:200px;text-align:center}.calc-preview-modal-footer{display:flex;gap:12px;padding:16px;background:#f9f9f9;border-top:1px solid #e0e0e0;justify-content:flex-end}.calc-preview-btn{display:flex;align-items:center;gap:8px;padding:10px 20px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease}.calc-preview-btn.cancel{background:#f0f0f0;color:#333;border:1px solid #ddd}.calc-preview-btn.cancel:hover:not(:disabled){background:#e0e0e0;border-color:#999}.calc-preview-btn.save{background:linear-gradient(135deg,#28a745,#20c997);color:#fff;box-shadow:0 2px 8px #28a7454d}.calc-preview-btn.save:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #28a74566}.calc-preview-btn:disabled{opacity:.6;cursor:not-allowed}.spinner-icon{animation:spin 1s linear infinite}.add-attendance-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.add-attendance-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:500px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid var(--border-gray)}.add-attendance-header{background:var(--primary-black);color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--secondary-black)}.add-attendance-header-content{display:flex;align-items:center;gap:12px;flex:1}.add-attendance-header-icon{flex-shrink:0;opacity:.9}.add-attendance-header-text{flex:1}.add-attendance-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.add-attendance-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.add-attendance-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0;position:relative;overflow:hidden}.add-attendance-close-btn:hover:not(:disabled){background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d,inset 0 0 10px #ffffff1a}.add-attendance-close-btn:active:not(:disabled){transform:scale(.95) rotate(90deg)}.add-attendance-close-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.add-attendance-close-btn:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.add-attendance-close-btn svg{width:18px;height:18px;stroke-width:2.5}.add-attendance-body{flex:1;overflow-y:auto;padding:0}.add-attendance-form{padding:20px}.add-attendance-form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.add-attendance-form-group:last-of-type{margin-bottom:0}.add-attendance-label{font-size:12px;font-weight:600;color:var(--text-dark);text-transform:uppercase;letter-spacing:.3px;display:flex;align-items:center;gap:4px}.add-attendance-label svg{flex-shrink:0;color:var(--primary-black)}.add-attendance-required{color:var(--error-red);font-size:14px;font-weight:700}.add-attendance-input,.add-attendance-select{width:100%;padding:10px 12px;border:1px solid var(--border-gray);border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:var(--text-dark);transition:all .3s ease;outline:none}.add-attendance-input::placeholder{color:#d1d5db}.add-attendance-input:focus,.add-attendance-select:focus{border-color:var(--primary-black);box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.add-attendance-input:disabled,.add-attendance-select:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed;opacity:.6}.add-attendance-input.error{border-color:var(--error-red);box-shadow:0 0 0 3px #ef44441a}.add-attendance-input.error:focus{border-color:var(--error-red);box-shadow:0 0 0 3px #ef444426}.add-attendance-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.add-attendance-select option{color:var(--text-dark);background:#fff;padding:8px}.add-attendance-hint{font-size:11px;color:var(--text-gray);font-weight:500;display:block}.add-attendance-error{font-size:11px;color:var(--error-red);font-weight:600;display:flex;align-items:center;gap:4px}.add-attendance-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border-gray)}.add-attendance-cancel-btn,.add-attendance-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.add-attendance-cancel-btn{background:var(--light-gray);color:var(--text-gray);border:1px solid var(--border-gray)}.add-attendance-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.add-attendance-submit-btn{background:var(--primary-black);color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.add-attendance-submit-btn:hover:not(:disabled){background:var(--secondary-black);transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.add-attendance-submit-btn:active:not(:disabled){transform:translateY(0)}.add-attendance-submit-btn:disabled,.add-attendance-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.add-attendance-spinner{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.add-attendance-body::-webkit-scrollbar{width:6px}.add-attendance-body::-webkit-scrollbar-track{background:#f9fafb}.add-attendance-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-attendance-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.add-attendance-modal{max-width:95%;max-height:90vh}.add-attendance-header{padding:12px}.add-attendance-title{font-size:16px}.add-attendance-subtitle{font-size:11px}.add-attendance-form{padding:16px}.add-attendance-form-group{margin-bottom:14px}.add-attendance-input,.add-attendance-select{padding:8px 10px;font-size:12px}.add-attendance-cancel-btn,.add-attendance-submit-btn{padding:8px 12px;font-size:11px;min-height:36px}.add-attendance-actions{gap:8px;margin-top:16px;padding-top:12px}}@media(max-width:480px){.add-attendance-overlay{padding:8px}.add-attendance-modal{max-width:100%;border-radius:6px}.add-attendance-header{padding:10px;gap:8px}.add-attendance-header-content{gap:8px}.add-attendance-title{font-size:14px}.add-attendance-subtitle{font-size:10px}.add-attendance-close-btn{width:28px;height:28px}.add-attendance-form{padding:12px}.add-attendance-label{font-size:11px}.add-attendance-form-group{margin-bottom:12px;gap:4px}.add-attendance-input,.add-attendance-select{padding:8px 10px;font-size:12px}.add-attendance-hint,.add-attendance-error{font-size:10px}.add-attendance-cancel-btn,.add-attendance-submit-btn{padding:8px 12px;font-size:10px;min-height:34px;flex:1}.add-attendance-submit-btn{min-width:auto}.add-attendance-actions{flex-direction:column-reverse;gap:6px;margin-top:14px;padding-top:10px}}.add-attendance-autocomplete-wrapper{position:relative;width:100%}.add-attendance-autocomplete-input-group{position:relative;display:flex;align-items:center}.add-attendance-autocomplete-input{width:100%;padding-right:32px!important}.add-attendance-autocomplete-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--text-gray);pointer-events:none;transition:transform .3s ease;flex-shrink:0}.add-attendance-autocomplete-icon.active{transform:translateY(-50%) rotate(180deg);color:var(--primary-black)}.add-attendance-autocomplete-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1px solid var(--border-gray);border-radius:6px;box-shadow:0 4px 12px #00000026;z-index:1001;max-height:280px;overflow-y:auto;animation:slideDown .2s ease-out}.add-attendance-autocomplete-list{list-style:none;margin:0;padding:4px 0}.add-attendance-autocomplete-item{padding:10px 12px;cursor:pointer;transition:all .2s ease;border-bottom:1px solid #f3f4f6}.add-attendance-autocomplete-item:last-child{border-bottom:none}.add-attendance-autocomplete-item:hover{background:#f9fafb;padding-left:14px}.add-attendance-autocomplete-item:active{background:#f3f4f6}.add-attendance-autocomplete-item-content{display:flex;flex-direction:column;gap:2px}.add-attendance-autocomplete-item-name{font-size:13px;font-weight:600;color:var(--text-dark)}.add-attendance-autocomplete-item-meta{font-size:11px;color:var(--text-gray);font-weight:500}.add-attendance-autocomplete-empty{padding:16px 12px;text-align:center;color:var(--text-gray);font-size:12px;font-weight:500}.add-attendance-autocomplete-dropdown::-webkit-scrollbar{width:6px}.add-attendance-autocomplete-dropdown::-webkit-scrollbar-track{background:#f9fafb;border-radius:3px}.add-attendance-autocomplete-dropdown::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-attendance-autocomplete-dropdown::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:480px){.add-attendance-autocomplete-dropdown{max-height:240px}.add-attendance-autocomplete-item{padding:8px 10px}.add-attendance-autocomplete-item:hover{padding-left:12px}.add-attendance-autocomplete-item-name{font-size:12px}.add-attendance-autocomplete-item-meta{font-size:10px}.add-attendance-autocomplete-empty{padding:12px 10px;font-size:11px}}.panel-container-attendance{padding:12px;background:linear-gradient(135deg,#abaeb1,#d1d8df 50%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh}.attendance-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding:10px 14px;background:#fff;border-radius:6px;box-shadow:0 1px 3px #0000000f;gap:10px}.attendance-header-left{display:flex;align-items:center;gap:8px;flex:1;min-width:0}.attendance-dashboard-title{font-size:16px;font-weight:700;color:#1a1a1a;margin:0;display:flex;align-items:center;gap:6px;white-space:nowrap}.attendance-title-icon{font-size:18px;color:#2d3748;flex-shrink:0}.attendance-header-right{display:flex;gap:6px;flex-shrink:0}.common-refresh-btn-attendance{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;height:32px;background:#6c757d;color:#fff;box-shadow:0 1px 3px #6c757d26}.common-refresh-btn-attendance:hover{background:#5a6268;transform:translateY(-1px);box-shadow:0 2px 6px #6c757d40}.attendance-filter-section{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:0 1px 3px #0000000f;margin-bottom:12px;position:relative;z-index:100}.filter-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:8px}.filter-row:last-child{margin-bottom:0}.filter-item{display:flex;flex-direction:column;gap:4px}.filter-item label{font-weight:600;font-size:10px;color:#2d3748;text-transform:uppercase;letter-spacing:.2px}.filter-input{padding:6px 8px;border:1px solid #d1d8df;border-radius:4px;font-size:11px;color:#2d3748;background:#fff;transition:all .3s ease}.filter-clear-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#6b7280;padding:2px;display:flex;align-items:center;justify-content:center}.filter-clear-btn:hover{color:#1f2937}.filter-suggestions{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d1d8df;border-top:none;border-radius:0 0 4px 4px;max-height:150px;overflow-y:auto;z-index:10;box-shadow:0 2px 4px #0000001a}.filter-suggestion-item{padding:6px 8px;cursor:pointer;font-size:11px;color:#2d3748;transition:background .2s ease}.filter-calculate-btn,.filter-stats-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:6px 10px;border-radius:4px;font-weight:600;font-size:10px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.2px;display:flex;align-items:center;gap:4px;justify-content:center;height:32px;white-space:nowrap}.filter-stats-btn{background:linear-gradient(135deg,#667eea,#764ba2)}.filter-calculate-btn:hover:not(:disabled),.filter-stats-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 2px 6px #667eea66}.filter-calculate-btn:disabled,.filter-stats-btn:disabled{opacity:.5;cursor:not-allowed}.attendance-table-section{background:#fff;border-radius:6px;box-shadow:0 1px 3px #0000000f;overflow:hidden;margin-bottom:12px}.attendance-table-wrapper{overflow-x:auto;max-height:500px;position:relative}.attendance-data-table{width:100%;border-collapse:collapse;font-size:11px;background:#fff}.attendance-data-table thead{background:#2d3748;position:sticky;top:0;z-index:10}.attendance-data-table thead th{padding:8px 10px;text-align:left;font-weight:700;text-transform:uppercase;letter-spacing:.3px;font-size:10px;color:#fff;border-bottom:1px solid #1a1a1a;white-space:nowrap}.attendance-data-table tbody tr{border-bottom:1px solid #e9ecef;transition:all .2s ease}.attendance-data-table tbody tr:hover{background:#f8f9fa}.attendance-data-table tbody td{padding:8px 10px;color:#2d3748;vertical-align:middle;font-size:11px}.attendance-emp-id{font-weight:700;color:#1a1a1a}.attendance-emp-name{font-weight:600;color:#1a1a1a}.attendance-date{font-size:10px;color:#495057}.attendance-time{text-align:center}.time-badge{display:inline-block;padding:4px 6px;border-radius:3px;font-size:10px;font-weight:700;font-family:Courier New,monospace}.time-badge.in{background-color:#d1f2eb;color:#0f5132;border:1px solid #0f5132}.time-badge.out{background-color:#fff3cd;color:#664d03;border:1px solid #664d03}.badge-half-day{display:inline-block;padding:3px 6px;color:#fff;border-radius:3px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}.badge-half-day.by-late{background:linear-gradient(135deg,#f97316,#ea580c)}.badge-half-day.by-early{background:linear-gradient(135deg,#a855f7,#9333ea)}.badge-half-day.by-total{background:linear-gradient(135deg,#3b82f6,#2563eb)}.badge-late{background:#fee2e2;color:#991b1b;padding:3px 6px;border-radius:3px;font-size:10px;font-weight:700}.badge-early{background:#fef3c7;color:#92400e;padding:3px 6px;border-radius:3px;font-size:10px;font-weight:700}.badge-ot{background:#dcfce7;color:#166534;padding:3px 6px;border-radius:3px;font-size:10px;font-weight:700}.badge-ok{color:#6b7280;font-size:10px}.attendance-pagination-section{background:#fff;border-radius:6px;padding:8px 10px;box-shadow:0 1px 3px #0000000f;margin-bottom:12px}.attendance-pagination-controls{display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap}.attendance-pagination-btn{display:flex;align-items:center;justify-content:center;gap:3px;padding:5px 8px;background:#fff;border:1px solid #d1d8df;border-radius:3px;cursor:pointer;transition:all .3s ease;color:#495057;font-weight:600;font-size:10px;white-space:nowrap;height:30px}.attendance-pagination-btn:hover:not(:disabled){background:#2d3748;border-color:#2d3748;color:#fff;transform:translateY(-1px)}.attendance-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.attendance-pagination-goto{display:flex;align-items:center;gap:4px;font-size:10px;color:#495057;font-weight:600}.attendance-pagination-input{width:45px;padding:5px 6px;border:1px solid #d1d8df;border-radius:3px;text-align:center;font-size:10px;font-weight:600;color:#1a1a1a;height:30px}.attendance-pagination-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 2px #4950571a}.attendance-pagination-info{font-size:10px;color:#495057;font-weight:600;min-width:150px;text-align:center}.attendance-export-section{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:0 1px 3px #0000000f;margin-bottom:12px}.attendance-export-header{margin-bottom:8px}.attendance-export-header h3{font-size:11px;font-weight:700;color:#1a1a1a;margin:0;text-transform:uppercase;letter-spacing:.3px}.attendance-export-buttons{display:flex;gap:6px;flex-wrap:wrap}.attendance-export-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:1px solid #d1d8df;border-radius:4px;background:#fff;color:#495057;font-size:10px;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.2px;height:32px;min-width:110px}.attendance-export-btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.attendance-export-btn.excel{border-color:#28a745;color:#28a745}.attendance-export-btn.excel:hover{background:#28a745;color:#fff}.attendance-export-btn.csv{border-color:#17a2b8;color:#17a2b8}.attendance-export-btn.csv:hover{background:#17a2b8;color:#fff}.attendance-export-btn.pdf{border-color:#dc3545;color:#dc3545}.attendance-export-btn.pdf:hover{background:#dc3545;color:#fff}.attendance-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;text-align:center}.attendance-no-data-image{width:80px;height:auto;opacity:.5;margin-bottom:10px}.attendance-no-data-container p{font-size:11px;color:#6c757d;margin:0}.attendance-loading-panel,.attendance-error-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 20px;text-align:center;background:#fff;border-radius:6px;margin:40px auto;max-width:400px}.attendance-spinner{width:36px;height:36px;border:3px solid #e9ecef;border-top-color:#2d3748;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:12px}.attendance-loading-panel p,.attendance-error-panel p{font-size:12px;color:#495057;margin:0}.attendance-stats-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.attendance-stats-modal-content{background:#fff;border-radius:8px;box-shadow:0 10px 40px #0003;max-width:600px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.attendance-stats-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:2px solid #e9ecef;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.attendance-stats-modal-title{display:flex;align-items:center;gap:10px;margin:0}.attendance-stats-modal-title h2{margin:0;font-size:16px;font-weight:700}.attendance-stats-modal-close{background:none;border:none;cursor:pointer;color:#fff;transition:all .3s ease;padding:4px;display:flex;align-items:center;justify-content:center}.attendance-stats-modal-close:hover{transform:rotate(90deg)}.attendance-stats-modal-body{padding:16px;display:flex;flex-direction:column;gap:16px}.stats-section{display:flex;flex-direction:column;gap:10px}.stats-section h3{margin:0;font-size:13px;font-weight:700;color:#1a1a1a;text-transform:uppercase;letter-spacing:.3px;padding-bottom:8px;border-bottom:2px solid #e9ecef}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.stat-box{display:flex;flex-direction:column;gap:6px;padding:12px;background:#f8f9fa;border-radius:6px;border-left:3px solid #667eea}.stat-box.highlight{background:#eef2ff;border-left-color:#667eea}.stat-label{font-size:11px;font-weight:600;color:#495057;text-transform:uppercase;letter-spacing:.2px}.stat-value{font-size:16px;font-weight:700;color:#1a1a1a}.stat-value.late{color:#dc3545}.stat-value.early{color:#fd7e14}.stat-value.ot{color:#28a745}.stat-value.sunday-ot{color:#6f42c1}.stat-value.total,.stat-value.total-ot{color:#0d6efd}.stats-modal-actions{display:flex;gap:10px;padding-top:12px;border-top:2px solid #e9ecef;flex-wrap:wrap}.stats-modal-btn{flex:1;min-width:150px;padding:10px 14px;border:none;border-radius:6px;font-weight:600;font-size:11px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px;display:flex;align-items:center;justify-content:center;gap:6px}.stats-modal-btn.calculate{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 2px 6px #667eea4d}.stats-modal-btn.calculate:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.stats-modal-btn.calculate:disabled{opacity:.6;cursor:not-allowed}.stats-modal-btn.close{background:#e9ecef;color:#495057}.stats-modal-btn.close:hover{background:#dee2e6;transform:translateY(-1px)}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto}.modal-content{background:#fff;border-radius:8px;width:100%;max-width:500px;max-height:85vh;overflow-y:auto;margin:auto;position:relative}@media(max-width:1200px){.filter-row{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}}@media(max-width:992px){.attendance-dashboard-title{font-size:14px}.filter-row{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}.attendance-data-table{font-size:10px}.attendance-data-table thead th,.attendance-data-table tbody td{padding:6px 8px}}@media(max-width:768px){.panel-container-attendance{padding:8px}.attendance-dashboard-header{padding:8px 10px;flex-direction:column;align-items:stretch}.attendance-header-left{width:100%}.attendance-header-right{width:100%;justify-content:flex-end}.attendance-dashboard-title{font-size:13px}.filter-row{grid-template-columns:repeat(2,1fr);gap:6px}.attendance-table-wrapper{max-height:350px}.attendance-data-table{font-size:9px}.attendance-data-table thead th,.attendance-data-table tbody td{padding:5px 6px}.time-badge{padding:3px 5px;font-size:9px}.attendance-pagination-info{min-width:120px;font-size:9px}.attendance-export-btn{min-width:90px;font-size:9px;padding:5px 8px}.stats-grid{grid-template-columns:1fr}.attendance-stats-modal-content{max-width:95%}}@media(max-width:480px){.attendance-dashboard-title{font-size:12px}.attendance-title-icon{font-size:16px}.filter-row{grid-template-columns:1fr;gap:6px}.filter-item label{font-size:9px}.filter-input{font-size:10px;padding:5px 6px}.filter-calculate-btn,.filter-stats-btn{font-size:9px;padding:5px 8px;height:30px}.attendance-data-table{font-size:8px}.attendance-data-table thead th,.attendance-data-table tbody td{padding:4px 5px}.time-badge{padding:2px 4px;font-size:8px}.badge-half-day,.badge-late,.badge-early,.badge-ot{font-size:8px;padding:2px 4px}.attendance-pagination-btn{padding:4px 6px;font-size:9px;height:28px}.attendance-pagination-input{width:40px;height:28px;font-size:9px}.attendance-pagination-goto{font-size:9px}.attendance-pagination-info{font-size:8px;min-width:100px}.attendance-export-btn{min-width:80px;font-size:8px;padding:4px 6px;height:28px}.common-refresh-btn-attendance{font-size:9px;padding:5px 8px;height:30px}.attendance-stats-modal-header{padding:12px}.attendance-stats-modal-title h2{font-size:14px}.attendance-stats-modal-body{padding:12px;gap:12px}.stats-section h3{font-size:12px}.stat-box{padding:10px}.stat-label{font-size:10px}.stat-value{font-size:14px}.stats-modal-btn{min-width:120px;padding:8px 10px;font-size:10px}.modal-content{max-width:95%;max-height:90vh}}.attendance-table-wrapper::-webkit-scrollbar,.attendance-stats-modal-content::-webkit-scrollbar{width:6px;height:6px}.attendance-table-wrapper::-webkit-scrollbar-track,.attendance-stats-modal-content::-webkit-scrollbar-track{background:#f3f4f6;border-radius:3px}.attendance-table-wrapper::-webkit-scrollbar-thumb,.attendance-stats-modal-content::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.attendance-table-wrapper::-webkit-scrollbar-thumb:hover,.attendance-stats-modal-content::-webkit-scrollbar-thumb:hover{background:#9ca3af}.attendance-month-view-modal{max-width:1400px!important;max-height:90vh!important;width:95%!important}.month-view-container{padding:20px;max-height:calc(90vh - 120px);overflow-y:auto;background:#f8f9fa}.month-view-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;padding:10px}.day-card{border:2px solid #e0e0e0;border-radius:8px;padding:12px;min-height:200px;display:flex;flex-direction:column;gap:8px;transition:all .3s ease;background:#fff;box-shadow:0 1px 3px #0000000d}.day-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.day-card.day-present{border-color:#10b981;background:#f0fdf4}.day-card.day-present:hover{border-color:#059669}.day-card.day-absent{border-color:#ef4444;background:#fef2f2}.day-card.day-absent:hover{border-color:#dc2626}.day-card.day-leave{border-color:#f59e0b;background:#fffbeb}.day-card.day-leave:hover{border-color:#d97706}.day-card.day-weekend{border-color:#9ca3af;background:#f3f4f6}.day-card.day-weekend:hover{border-color:#6b7280}.day-card.day-public_holiday{border-color:#8b5cf6;background:#faf5ff}.day-card.day-public_holiday:hover{border-color:#7c3aed}.day-card.day-unknown{border-color:#d1d5db;background:#fff}.day-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:2px solid #e5e7eb;margin-bottom:4px}.day-date{font-size:20px;font-weight:800;color:#1f2937;line-height:1}.day-name{font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.5px}.status-badge{display:inline-block;padding:6px 10px;border-radius:4px;font-size:11px;font-weight:700;text-align:center;width:100%;text-transform:uppercase;letter-spacing:.3px}.status-badge.present{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7}.status-badge.absent{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.status-badge.leave{background:#fef3c7;color:#92400e;border:1px solid #fcd34d}.status-badge.weekend{background:#e5e7eb;color:#374151;border:1px solid #d1d5db}.status-badge.public_holiday{background:#ede9fe;color:#5b21b6;border:1px solid #ddd6fe}.status-badge.unknown{background:#f3f4f6;color:#4b5563;border:1px solid #d1d5db}.day-content{flex:1;display:flex;flex-direction:column;gap:6px;font-size:11px;overflow-y:auto;max-height:140px}.day-content::-webkit-scrollbar{width:4px}.day-content::-webkit-scrollbar-track{background:#f0f0f0;border-radius:2px}.day-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}.day-content::-webkit-scrollbar-thumb:hover{background:#94a3b8}.day-attendance,.day-leaves{display:flex;flex-direction:column;gap:4px}.attendance-item,.leave-item{padding:6px;background:#00000008;border-radius:4px;border-left:3px solid #667eea}.leave-item{border-left-color:#f59e0b}.emp-name{font-weight:700;color:#1f2937;font-size:10px;margin-bottom:2px;word-break:break-word}.times{display:flex;gap:3px;flex-wrap:wrap;margin-top:2px}.time{background:#dbeafe;color:#1e40af;padding:2px 5px;border-radius:2px;font-size:9px;font-weight:700;font-family:Courier New,monospace;white-space:nowrap}.leave-type{color:#92400e;font-size:9px;margin-top:2px;font-weight:600}.day-special{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px;padding-top:6px;border-top:1px solid #e5e7eb}.badge{display:inline-block;padding:2px 6px;border-radius:3px;font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}.badge.poya{background:#fcd34d;color:#78350f;border:1px solid #f59e0b}.badge.ot{background:#86efac;color:#15803d;border:1px solid #4ade80}.filter-calendar-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:6px 10px;border-radius:4px;font-weight:600;font-size:10px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.2px;display:flex;align-items:center;gap:4px;justify-content:center;height:32px;white-space:nowrap;box-shadow:0 2px 4px #667eea33}.filter-calendar-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 8px #667eea66}.filter-calendar-btn:disabled{opacity:.5;cursor:not-allowed}@media(max-width:1200px){.month-view-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.day-card{min-height:180px;padding:10px}.day-date{font-size:18px}.day-content{max-height:120px}}@media(max-width:768px){.attendance-month-view-modal{max-width:98%!important}.month-view-container{padding:10px}.month-view-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}.day-card{min-height:160px;padding:8px}.day-date{font-size:16px}.day-header{padding-bottom:6px}.day-content{max-height:100px;font-size:10px}.status-badge{font-size:10px;padding:4px 8px}.time{font-size:8px;padding:1px 4px}.emp-name{font-size:9px}.leave-type{font-size:8px}}@media(max-width:480px){.month-view-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.day-card{min-height:140px;padding:6px}.day-date{font-size:14px}.day-name{font-size:9px}.day-content{max-height:80px;font-size:9px;gap:3px}.status-badge{font-size:9px;padding:3px 6px}.attendance-item,.leave-item{padding:4px}.emp-name{font-size:8px}.time{font-size:7px;padding:1px 3px}.badge{font-size:7px;padding:1px 4px}}.month-view-container::-webkit-scrollbar{width:8px}.month-view-container::-webkit-scrollbar-track{background:#f0f4f8;border-radius:4px}.month-view-container::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.month-view-container::-webkit-scrollbar-thumb:hover{background:#94a3b8}.filter-item input[type=date]{padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:13px;background-color:#fff;cursor:pointer;transition:all .3s ease}.filter-item input[type=date]:hover{border-color:#999;background-color:#f9f9f9}.filter-item input[type=date]:focus{outline:none;border-color:#0d6efd;box-shadow:0 0 0 3px #0d6efd1a}.filter-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;padding:12px;background-color:#f8f9fa;border-radius:6px;margin-bottom:12px}.filter-item{display:flex;flex-direction:column;gap:4px;min-width:150px}.filter-item label{font-size:12px;font-weight:600;color:#333}.attendance-controls-section{padding:6px 8px;background:#f8f9fa;border-bottom:1px solid #dee2e6;display:flex;gap:6px;flex-wrap:wrap;align-items:flex-end}.attendance-controls-left{display:flex;gap:6px;flex-wrap:wrap;align-items:flex-end;width:100%}.attendance-filter-item{display:flex;flex-direction:column;gap:2px;min-width:140px;flex:1}.attendance-filter-label{font-size:11px;font-weight:600;color:#495057;text-transform:uppercase;letter-spacing:.3px}.attendance-search-wrapper{position:relative;width:100%}.attendance-search-input{width:100%;padding:6px 8px;border:1px solid #dee2e6;border-radius:3px;font-size:12px;background:#fff;transition:all .3s ease;box-sizing:border-box;height:32px}.attendance-search-input:hover{border-color:#adb5bd;box-shadow:0 1px 3px #0000000d}.attendance-search-input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px #007bff1a;background:#fff}.attendance-search-input::placeholder{color:#adb5bd;font-size:12px}.attendance-clear-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#adb5bd;padding:2px;display:flex;align-items:center;justify-content:center;transition:color .2s ease}.attendance-clear-btn:hover{color:#495057}.attendance-suggestions-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #dee2e6;border-top:none;border-radius:0 0 3px 3px;box-shadow:0 2px 8px #0000001a;z-index:1000;margin-top:-1px}.attendance-suggestion-item{padding:6px 8px;cursor:pointer;border-bottom:1px solid #e9ecef;transition:background .2s ease;font-size:12px}.attendance-suggestion-item:last-child{border-bottom:none}.attendance-suggestion-item:hover{background:#f8f9fa}.attendance-suggestion-item:active{background:#e9ecef}.attendance-filter-buttons{display:flex;gap:6px;align-items:flex-end}.attendance-filter-clear-btn{padding:6px 12px;background:#dc3545;color:#fff;border:none;border-radius:3px;font-size:12px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:4px;white-space:nowrap;height:32px;min-width:100px}.attendance-filter-clear-btn:hover{background:#c82333;box-shadow:0 2px 6px #dc354533}.attendance-filter-clear-btn:active{transform:scale(.98)}.attendance-active-filters{padding:6px 8px;background:#e7f3ff;border-bottom:1px solid #b3d9ff;display:flex;align-items:center;gap:6px}.attendance-active-filters-list{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.attendance-filter-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:#fff;border:1px solid #b3d9ff;border-radius:16px;font-size:11px;color:#0056b3;font-weight:600}.attendance-filter-badge:before{content:"✓";color:#28a745;font-weight:700;font-size:12px}@media(max-width:1024px){.attendance-controls-section{padding:6px 8px;gap:6px}.attendance-filter-item{min-width:130px;flex:1 1 calc(50% - 3px)}.attendance-filter-buttons{width:100%}.attendance-filter-clear-btn{flex:1;min-width:auto}}@media(max-width:768px){.attendance-controls-section{padding:6px;gap:6px}.attendance-controls-left{gap:6px}.attendance-filter-item{min-width:100%;flex:1 1 100%}.attendance-search-input{padding:5px 7px;font-size:12px;height:30px}.attendance-filter-label{font-size:10px}.attendance-active-filters{padding:5px 8px}.attendance-filter-badge{font-size:10px;padding:3px 8px}.attendance-filter-clear-btn{padding:5px 10px;font-size:11px;height:30px;min-width:90px}}@media(max-width:480px){.attendance-controls-section{flex-direction:column;padding:5px 6px}.attendance-controls-left{flex-direction:column;gap:5px}.attendance-filter-item{min-width:100%}.attendance-search-input{width:100%;height:28px;font-size:11px;padding:4px 6px}.attendance-active-filters-list{flex-direction:column;align-items:flex-start}.attendance-filter-badge{width:100%;justify-content:flex-start;font-size:10px}.attendance-filter-clear-btn{width:100%;height:28px;font-size:11px}}.attendance-search-input:disabled{background:#e9ecef;cursor:not-allowed;color:#6c757d}.attendance-filter-clear-btn:disabled{background:#6c757d;cursor:not-allowed;opacity:.6}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.attendance-suggestions-dropdown{animation:slideDown .2s ease}.attendance-search-input:focus-visible{outline:1px solid #007bff;outline-offset:1px}.attendance-filter-clear-btn:focus-visible{outline:1px solid #dc3545;outline-offset:1px}.header-sync-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background-color:#ff6b6b;color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);white-space:nowrap;box-shadow:0 2px 8px #ff6b6b4d;position:relative;overflow:hidden}.header-sync-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:#fff3;transition:left .3s ease;z-index:0}.header-sync-btn:hover:not(:disabled):before{left:100%}.header-sync-btn:hover:not(:disabled){background-color:#ff5252;box-shadow:0 4px 12px #ff6b6b66;transform:translateY(-2px)}.header-sync-btn:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 4px #ff6b6b4d}.header-sync-btn:disabled{background-color:#ccc;cursor:not-allowed;opacity:.6;box-shadow:none}.header-sync-btn span{position:relative;z-index:1}.header-sync-btn svg{width:16px;height:16px;position:relative;z-index:1}.header-sync-btn:not(:disabled) svg{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.attendance-header-half-day{display:flex;align-items:center;margin-right:10px}.header-half-day-btn{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#ffc107;color:#333;border:none;border-radius:4px;cursor:pointer;font-weight:500;font-size:14px;transition:all .3s ease}.header-half-day-btn:hover:not(:disabled){background:#ffb300;transform:translateY(-2px);box-shadow:0 2px 8px #ffc1074d}.header-half-day-btn:disabled{background:#ccc;cursor:not-allowed;opacity:.6}.attendance-half-day-modal-content{background:#fff;border-radius:8px;padding:24px;max-width:700px;max-height:80vh;overflow-y:auto;box-shadow:0 4px 16px #00000026}.attendance-half-day-modal-overlay{background:#00000080;display:flex;align-items:center;justify-content:center;position:fixed;inset:0;z-index:1000}.attendance-half-day-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:2px solid #ffc107;padding-bottom:12px}.attendance-half-day-modal-header h2{display:flex;align-items:center;gap:10px;margin:0;color:#333;font-size:18px}.attendance-half-day-modal-close{background:none;border:none;cursor:pointer;color:#666;padding:4px;transition:color .2s}.attendance-half-day-modal-close:hover{color:#333}.half-day-info{background:#fff3e0;padding:12px;border-radius:4px;margin-bottom:20px;border-left:4px solid #ffc107}.half-day-info p{margin:5px 0;font-size:14px}.half-day-info ul{margin:5px 0;padding-left:20px}.half-day-info li{margin:3px 0;font-size:13px}.half-day-records-list{margin-bottom:20px}.half-day-records-list h3{margin:0 0 12px;font-size:14px;color:#333;font-weight:600}.half-day-table{width:100%;border-collapse:collapse;font-size:13px}.half-day-table thead{background:#f5f5f5}.half-day-table th,.half-day-table td{padding:10px;text-align:left;border-bottom:1px solid #ddd}.half-day-table th{font-weight:600;color:#333}.half-day-table tbody tr:hover{background:#fafafa}.half-day-table .late-col{color:#dc3545;font-weight:500}.half-day-table .early-col{color:#fd7e14;font-weight:500}.half-day-modal-actions{display:flex;gap:10px;justify-content:flex-end;padding-top:12px;border-top:1px solid #ddd}.half-day-btn-cancel,.half-day-btn-sync{padding:10px 16px;border:none;border-radius:4px;cursor:pointer;font-weight:500;font-size:14px;transition:all .3s ease}.half-day-btn-cancel{background:#e0e0e0;color:#333}.half-day-btn-cancel:hover{background:#d0d0d0}.half-day-btn-sync{background:#ffc107;color:#333}.half-day-btn-sync:hover:not(:disabled){background:#ffb300;box-shadow:0 2px 8px #ffc1074d}.half-day-btn-sync:disabled{background:#ccc;cursor:not-allowed;opacity:.6}:root{--primary-black: #1a1a1a;--secondary-black: #2d3748;--light-gray: #f8f9fa;--border-gray: #e9ecef;--text-dark: #1f2937;--text-gray: #6b7280;--error-red: #ef4444;--success-green: #10b981}.edit-attendance-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.edit-attendance-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:600px;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid var(--border-gray)}.edit-attendance-header{background:var(--primary-black);color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--secondary-black);gap:12px}.edit-attendance-header-content{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.edit-attendance-header-icon{flex-shrink:0;opacity:.9;width:20px;height:20px}.edit-attendance-header-text{flex:1;min-width:0}.edit-attendance-title{font-size:18px;font-weight:700;margin:0;line-height:1.2;color:#fff}.edit-attendance-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500;color:#ffffffd9}.edit-attendance-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0;position:relative;overflow:hidden}.edit-attendance-close-btn:hover:not(:disabled){background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d,inset 0 0 10px #ffffff1a}.edit-attendance-close-btn:active:not(:disabled){transform:scale(.95) rotate(90deg)}.edit-attendance-close-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.edit-attendance-close-btn:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.edit-attendance-close-btn svg{width:18px;height:18px;stroke-width:2.5}.edit-attendance-body{flex:1;overflow-y:auto;padding:0}.edit-attendance-form{padding:20px}.edit-attendance-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.edit-attendance-form-column{display:flex;flex-direction:column;gap:16px}.edit-attendance-form-full{grid-column:1 / -1}.edit-attendance-form-group{display:flex;flex-direction:column;gap:6px}.edit-attendance-label{font-size:12px;font-weight:600;color:var(--text-dark);text-transform:uppercase;letter-spacing:.3px;display:flex;align-items:center;gap:4px}.edit-attendance-label svg{flex-shrink:0;color:var(--primary-black);width:14px;height:14px}.edit-attendance-required{color:var(--error-red);font-weight:700;font-size:14px}.edit-attendance-hint{font-size:11px;color:var(--text-gray);margin-top:4px;font-style:italic;line-height:1.3}.edit-attendance-input,.edit-attendance-select{width:100%;padding:10px 12px;border:1.5px solid var(--border-gray);border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:var(--text-dark);transition:all .3s ease;outline:none}.edit-attendance-input::placeholder{color:#d1d5db}.edit-attendance-input:focus,.edit-attendance-select:focus{border-color:var(--primary-black);box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.edit-attendance-input:disabled,.edit-attendance-select:disabled{background:#f3f4f6;color:#9ca3af;cursor:not-allowed;opacity:.6}.edit-attendance-input.error,.edit-attendance-select.error{border-color:var(--error-red);background:#ef44440d}.edit-attendance-input.error:focus,.edit-attendance-select.error:focus{border-color:var(--error-red);box-shadow:0 0 0 3px #ef44441a}.edit-attendance-error{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--error-red);font-weight:500;margin-top:2px;animation:slideDown .2s ease-out}.edit-attendance-error svg{flex-shrink:0;width:14px;height:14px}@keyframes slideDown{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.edit-attendance-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.edit-attendance-select option{color:var(--text-dark);background:#fff;padding:8px}.edit-attendance-select option:checked{background:linear-gradient(var(--primary-black),var(--primary-black));color:#fff}.edit-attendance-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border-gray);grid-column:1 / -1}.edit-attendance-cancel-btn,.edit-attendance-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.edit-attendance-cancel-btn{background:var(--light-gray);color:var(--text-gray);border:1px solid var(--border-gray)}.edit-attendance-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px);box-shadow:0 2px 4px #0000000d}.edit-attendance-cancel-btn:active:not(:disabled){transform:translateY(0)}.edit-attendance-submit-btn{background:var(--primary-black);color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.edit-attendance-submit-btn:hover:not(:disabled){background:var(--secondary-black);transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.edit-attendance-submit-btn:active:not(:disabled){transform:translateY(0)}.edit-attendance-submit-btn:disabled,.edit-attendance-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.edit-attendance-spinner{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.edit-attendance-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.edit-attendance-loading-panel .edit-attendance-spinner{width:40px;height:40px;border:4px solid #e9ecef;border-top-color:var(--secondary-black);margin-bottom:16px}.edit-attendance-loading-panel p{font-size:14px;color:var(--text-gray);margin:0;font-weight:500}.edit-attendance-body::-webkit-scrollbar{width:6px}.edit-attendance-body::-webkit-scrollbar-track{background:#f9fafb}.edit-attendance-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.edit-attendance-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.edit-attendance-modal{max-width:95%;max-height:90vh}.edit-attendance-header{padding:12px;gap:10px}.edit-attendance-header-icon{width:18px;height:18px}.edit-attendance-title{font-size:16px}.edit-attendance-subtitle{font-size:11px}.edit-attendance-close-btn{width:36px;height:36px}.edit-attendance-close-btn svg{width:16px;height:16px}.edit-attendance-form{padding:16px}.edit-attendance-form-grid{grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.edit-attendance-form-column{gap:14px}.edit-attendance-form-group{gap:5px}.edit-attendance-label{font-size:11px}.edit-attendance-input,.edit-attendance-select{padding:8px 10px;font-size:12px}.edit-attendance-hint{font-size:10px}.edit-attendance-cancel-btn,.edit-attendance-submit-btn{padding:8px 12px;font-size:11px;min-height:36px}.edit-attendance-submit-btn{min-width:120px}.edit-attendance-actions{gap:8px;margin-top:16px;padding-top:12px}}@media(max-width:480px){.edit-attendance-overlay{padding:8px}.edit-attendance-modal{max-width:100%;border-radius:6px;max-height:95vh}.edit-attendance-header{padding:10px;gap:8px}.edit-attendance-header-icon{width:16px;height:16px}.edit-attendance-title{font-size:14px}.edit-attendance-subtitle{font-size:10px}.edit-attendance-close-btn{width:32px;height:32px}.edit-attendance-close-btn svg{width:14px;height:14px}.edit-attendance-form{padding:12px}.edit-attendance-form-grid{grid-template-columns:1fr;gap:12px;margin-bottom:12px}.edit-attendance-form-column{gap:12px}.edit-attendance-form-full{grid-column:1}.edit-attendance-form-group{gap:5px}.edit-attendance-label{font-size:10px}.edit-attendance-label svg{width:12px;height:12px}.edit-attendance-input,.edit-attendance-select{padding:8px 10px;font-size:12px}.edit-attendance-hint{font-size:10px}.edit-attendance-error{font-size:11px}.edit-attendance-cancel-btn,.edit-attendance-submit-btn{padding:8px 12px;font-size:10px;min-height:34px;flex:1}.edit-attendance-submit-btn{min-width:auto}.edit-attendance-actions{flex-direction:column-reverse;gap:6px;margin-top:14px;padding-top:10px}.edit-attendance-loading-panel{padding:40px 15px}.edit-attendance-loading-panel .edit-attendance-spinner{width:36px;height:36px;border:3px solid #e9ecef}.edit-attendance-loading-panel p{font-size:12px}}@media(max-width:360px){.edit-attendance-modal{max-width:100%}.edit-attendance-header{padding:8px}.edit-attendance-title{font-size:13px}.edit-attendance-subtitle{font-size:9px}.edit-attendance-form{padding:10px}.edit-attendance-form-grid,.edit-attendance-form-column{gap:10px}.edit-attendance-label{font-size:9px}.edit-attendance-input,.edit-attendance-select{padding:7px 8px;font-size:11px}.edit-attendance-cancel-btn,.edit-attendance-submit-btn{padding:6px 10px;font-size:9px;min-height:32px}.edit-attendance-hint{font-size:9px}}@media(prefers-color-scheme:dark){.edit-attendance-modal{background:#1f2937;border-color:#374151}.edit-attendance-header{background:#111827;border-color:#1f2937}.edit-attendance-title,.edit-attendance-label{color:#f3f4f6}.edit-attendance-subtitle{color:#f3f4f6b3}.edit-attendance-input,.edit-attendance-select{background:#374151;color:#f3f4f6;border-color:#4b5563}.edit-attendance-input::placeholder{color:#9ca3af}.edit-attendance-input:focus,.edit-attendance-select:focus{background:#1f2937;border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa1a}.edit-attendance-input:disabled,.edit-attendance-select:disabled{background:#1f2937;color:#6b7280}.edit-attendance-hint{color:#9ca3af}.edit-attendance-cancel-btn{background:#374151;color:#d1d5db;border-color:#4b5563}.edit-attendance-cancel-btn:hover:not(:disabled){background:#4b5563;border-color:#6b7280}.edit-attendance-body::-webkit-scrollbar-track{background:#1f2937}.edit-attendance-body::-webkit-scrollbar-thumb{background:#4b5563}.edit-attendance-body::-webkit-scrollbar-thumb:hover{background:#6b7280}}.employee-leave-container{width:100%;max-width:1600px;margin:0 auto;padding:16px;background:#f8f9fa;border-radius:8px}.employee-leave-filter-section{background:#fff;padding:12px;border-radius:6px;box-shadow:0 2px 4px #0000000d;margin-bottom:12px}.employee-leave-filter-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.employee-leave-filter-item{display:flex;flex-direction:column;gap:4px;min-width:140px;max-width:150px}.employee-leave-filter-item label{font-size:10px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.3px}.employee-leave-filter-input{padding:6px 8px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;background-color:#fff;cursor:pointer;color:#2d3748;height:30px;width:100%}.employee-leave-filter-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.employee-leave-filter-actions{display:flex;gap:6px;flex-wrap:nowrap;align-items:center;margin-left:auto}.employee-leave-refresh-btn,.employee-leave-add-btn,.employee-leave-sync-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;transition:all .3s ease;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;flex-shrink:0}.employee-leave-refresh-btn{background-color:#e5e7eb;color:#374151}.employee-leave-refresh-btn:hover{background-color:#d1d5db;transform:translateY(-1px)}.employee-leave-add-btn{background-color:#3b82f6;color:#fff}.employee-leave-add-btn:hover{background-color:#2563eb;transform:translateY(-1px)}.employee-leave-sync-btn{background-color:#10b981;color:#fff}.employee-leave-sync-btn:hover:not(:disabled){background-color:#059669;transform:translateY(-1px)}.employee-leave-sync-btn:disabled{opacity:.5;cursor:not-allowed}.employee-leave-dropdown-wrapper{position:relative}.employee-leave-dropdown-menu{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d1d5db;border-top:none;border-radius:0 0 4px 4px;max-height:150px;overflow-y:auto;z-index:1000;box-shadow:0 4px 6px #0000001a}.employee-leave-dropdown-item{padding:8px 10px;cursor:pointer;border-bottom:1px solid #f0f0f0;font-size:11px;transition:all .2s}.employee-leave-dropdown-item:hover{background:#f9fafb;padding-left:12px}.employee-leave-dropdown-name{font-weight:600;color:#1f2937;margin-bottom:2px}.employee-leave-dropdown-id{color:#6b7280;font-size:10px}.employee-leave-table-section{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d;overflow:hidden;margin-bottom:12px}.employee-leave-table{width:100%;border-collapse:collapse;font-size:11px}.employee-leave-table thead{background-color:#2d3748;border-bottom:2px solid #1a202c;position:sticky;top:0;z-index:10}.employee-leave-table th{padding:10px 8px;text-align:left;font-size:10px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.employee-leave-table tbody tr{border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.employee-leave-table tbody tr:hover{background-color:#f9fafb}.employee-leave-table td{padding:10px 8px;font-size:11px;color:#374151;vertical-align:middle}.employee-leave-id-cell{font-weight:600;color:#1f2937}.employee-leave-name-cell{font-weight:500}.employee-leave-type-badge{display:inline-block;padding:4px 8px;background:#dbeafe;color:#0284c7;border-radius:3px;font-size:10px;font-weight:600;border:1px solid #0284c7}.employee-leave-no-data{text-align:center}.employee-leave-no-data-container{display:flex;flex-direction:column;align-items:center;gap:12px;padding:60px 20px}.employee-leave-no-data-image{width:100px;height:auto;opacity:.4}.employee-leave-no-data-container p{font-size:14px;color:#9ca3af;font-weight:500}.employee-leave-actions{display:flex;gap:6px;justify-content:center;flex-wrap:nowrap;min-width:120px}.employee-leave-action-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:1.5px solid transparent;border-radius:4px;cursor:pointer;transition:all .2s ease;padding:0;flex-shrink:0}.employee-leave-action-btn:hover{transform:translateY(-2px);box-shadow:0 2px 8px #00000026}.employee-leave-action-btn.sync{background-color:#dbeafe;color:#0284c7;border-color:#0284c7}.employee-leave-action-btn.sync:hover{background-color:#bfdbfe}.employee-leave-action-btn.edit{background-color:#fef3c7;color:#f59e0b;border-color:#f59e0b}.employee-leave-action-btn.edit:hover{background-color:#fcd34d}.employee-leave-action-btn.delete{background-color:#fee2e2;color:#dc2626;border-color:#dc2626}.employee-leave-action-btn.delete:hover{background-color:#fecaca}.employee-leave-pagination{background:#fff;border-radius:6px;padding:12px;box-shadow:0 2px 4px #0000000d;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.employee-leave-pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 12px;background:#fff;border:1px solid #d1d8df;border-radius:4px;cursor:pointer;font-size:11px;font-weight:600;transition:all .2s;color:#495057;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.employee-leave-pagination-btn:hover:not(:disabled){background:#2d3748;border-color:#2d3748;color:#fff;transform:translateY(-1px)}.employee-leave-pagination-btn:disabled{background:#e9ecef;cursor:not-allowed;opacity:.5}.employee-leave-pagination-goto{display:flex;align-items:center;gap:6px;font-size:11px;color:#495057;font-weight:600}.employee-leave-pagination-goto label{margin:0;text-transform:uppercase;letter-spacing:.3px}.employee-leave-pagination-input{width:45px;padding:6px 8px;border:1px solid #d1d8df;border-radius:4px;font-size:11px;text-align:center;font-weight:600;color:#1a1a1a;height:30px}.employee-leave-pagination-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.employee-leave-pagination-info{font-size:11px;color:#495057;font-weight:600;min-width:180px;text-align:center;text-transform:uppercase;letter-spacing:.3px}.employee-leave-loading,.employee-leave-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:20px;background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d}.employee-leave-spinner{width:50px;height:50px;border:4px solid #e9ecef;border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite}.employee-leave-loading p,.employee-leave-error p{font-size:14px;color:#6b7280;font-weight:500}.employee-leave-retry-btn{padding:8px 20px;background:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:600;transition:all .3s;text-transform:uppercase;letter-spacing:.3px}.employee-leave-retry-btn:hover{background:#2563eb;transform:translateY(-1px)}.employee-leave-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.employee-leave-modal-content{background:#fff;border-radius:6px;box-shadow:0 10px 40px #0000004d;max-width:600px;width:90%;max-height:90vh;overflow-y:auto;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.employee-leave-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #e5e7eb;background:#2d3748;color:#fff}.employee-leave-modal-header h2{margin:0;font-size:16px;display:flex;align-items:center;gap:8px;font-weight:600}.employee-leave-modal-close{background:transparent;border:none;color:#fff;cursor:pointer;font-size:20px;transition:all .3s ease;padding:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center}.employee-leave-modal-close:hover{transform:rotate(90deg)}.employee-leave-form{padding:16px}.employee-leave-form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.employee-leave-form-label{font-weight:600;color:#1f2937;font-size:12px;text-transform:uppercase;letter-spacing:.3px}.employee-leave-form-input{padding:8px 10px;border:1px solid #d1d5db;border-radius:4px;font-size:12px;font-family:inherit;transition:all .3s ease;height:30px}.employee-leave-form-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.employee-leave-form-input.error{border-color:#dc2626;background:#fee2e2}.employee-leave-form-input.disabled{background:#f3f4f6;cursor:not-allowed;color:#6b7280}.employee-leave-form-error{font-size:11px;color:#dc2626;font-weight:600}.employee-leave-input-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:transparent;border:none;color:#6b7280;cursor:pointer;padding:4px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.employee-leave-input-clear:hover{color:#1f2937}.employee-leave-form-buttons{display:flex;gap:10px;justify-content:flex-end;padding-top:12px;border-top:1px solid #e5e7eb;margin-top:12px}.employee-leave-btn-cancel,.employee-leave-btn-submit{padding:8px 16px;border:none;border-radius:4px;font-weight:600;cursor:pointer;transition:all .3s ease;font-size:12px;text-transform:uppercase;letter-spacing:.3px}.employee-leave-btn-cancel{background:#f3f4f6;color:#495057;border:1px solid #d1d5db}.employee-leave-btn-cancel:hover{background:#e5e7eb}.employee-leave-btn-submit{background:#3b82f6;color:#fff}.employee-leave-btn-submit:hover{background:#2563eb;transform:translateY(-1px)}@media(max-width:1400px){.employee-leave-filter-item{min-width:130px;max-width:140px}.employee-leave-filter-actions{gap:4px}.employee-leave-filter-actions button{padding:6px 8px;font-size:9px}.employee-leave-actions{min-width:110px}}@media(max-width:1200px){.employee-leave-container{padding:12px}.employee-leave-filter-row{gap:8px}.employee-leave-filter-item{min-width:120px;max-width:130px}.employee-leave-filter-input{font-size:10px;padding:5px 6px}.employee-leave-table{font-size:10px}.employee-leave-table th,.employee-leave-table td{padding:8px 6px}.employee-leave-action-btn{width:28px;height:28px}.employee-leave-actions{gap:4px;min-width:100px}}@media(max-width:1024px){.employee-leave-filter-row{flex-wrap:wrap}.employee-leave-filter-actions{margin-left:0;width:100%;justify-content:flex-start}.employee-leave-table{font-size:9px}.employee-leave-table th,.employee-leave-table td{padding:6px 5px}.employee-leave-action-btn{width:26px;height:26px}.employee-leave-actions{gap:3px;min-width:auto}.employee-leave-pagination-info{min-width:150px}}@media(max-width:768px){.employee-leave-container{padding:10px}.employee-leave-filter-section{padding:10px;margin-bottom:10px}.employee-leave-filter-row{flex-direction:column;gap:8px}.employee-leave-filter-item{min-width:100%;max-width:100%}.employee-leave-filter-actions{width:100%;flex-wrap:wrap}.employee-leave-refresh-btn,.employee-leave-add-btn,.employee-leave-sync-btn{flex:1;min-width:100px;font-size:9px;padding:6px 8px}.employee-leave-table{font-size:8px}.employee-leave-table th,.employee-leave-table td{padding:5px 4px}.employee-leave-action-btn{width:24px;height:24px}.employee-leave-actions{gap:2px}.employee-leave-pagination-btn{padding:5px 8px;font-size:9px;height:28px}.employee-leave-pagination-input{width:40px;height:28px;font-size:10px}.employee-leave-pagination-info{font-size:9px;min-width:120px}.employee-leave-modal-content{width:95%}.employee-leave-form{padding:12px}.employee-leave-form-input{font-size:11px;padding:6px 8px;height:28px}.employee-leave-btn-cancel,.employee-leave-btn-submit{padding:6px 12px;font-size:11px}}@media(max-width:480px){.employee-leave-container{padding:8px}.employee-leave-filter-section{padding:8px;margin-bottom:8px}.employee-leave-filter-item{min-width:100%}.employee-leave-filter-input{font-size:9px;height:28px}.employee-leave-refresh-btn,.employee-leave-add-btn,.employee-leave-sync-btn{width:100%;font-size:8px;padding:5px 6px;height:28px}.employee-leave-table{font-size:7px}.employee-leave-table th,.employee-leave-table td{padding:4px 3px}.employee-leave-table th{font-size:8px}.employee-leave-action-btn{width:22px;height:22px}.employee-leave-actions{gap:2px;min-width:auto}.employee-leave-pagination-btn{padding:4px 6px;font-size:8px;height:26px}.employee-leave-pagination-input{width:35px;height:26px;font-size:9px}.employee-leave-pagination-goto{font-size:9px}.employee-leave-pagination-info{font-size:8px;min-width:100px}.employee-leave-modal-content{width:95%}.employee-leave-modal-header{padding:12px}.employee-leave-modal-header h2{font-size:14px}.employee-leave-form{padding:10px}.employee-leave-form-group{margin-bottom:10px}.employee-leave-form-input{font-size:10px;padding:6px;height:26px}.employee-leave-form-label{font-size:10px}.employee-leave-btn-cancel,.employee-leave-btn-submit{padding:6px 10px;font-size:10px;flex:1}.employee-leave-form-buttons{gap:8px}.employee-leave-loading,.employee-leave-error{min-height:300px}.employee-leave-no-data-image{width:80px}}@media print{.employee-leave-filter-section,.employee-leave-pagination{display:none}.employee-leave-table-section{box-shadow:none}.employee-leave-table{font-size:10px}.employee-leave-table th,.employee-leave-table td{padding:8px}}.employee-leave-table-section::-webkit-scrollbar{width:8px;height:8px}.employee-leave-table-section::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}.employee-leave-table-section::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.employee-leave-table-section::-webkit-scrollbar-thumb:hover{background:#94a3b8}.employee-leave-dropdown-menu::-webkit-scrollbar{width:6px}.employee-leave-dropdown-menu::-webkit-scrollbar-track{background:#f1f5f9}.employee-leave-dropdown-menu::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.employee-leave-dropdown-menu::-webkit-scrollbar-thumb:hover{background:#94a3b8}.employee-leave-action-btn:focus,.employee-leave-pagination-btn:focus,.employee-leave-refresh-btn:focus,.employee-leave-add-btn:focus,.employee-leave-sync-btn:focus{outline:2px solid #3b82f6;outline-offset:2px}.employee-leave-filter-input:focus,.employee-leave-form-input:focus{outline:2px solid #3b82f6;outline-offset:2px}.employee-leave-table tbody tr{animation:fadeIn .3s ease-in-out}.employee-leave-dropdown-menu{animation:slideDown .2s ease-in-out}.employee-leave-table tbody tr{cursor:pointer}.employee-leave-table tbody tr:hover{background-color:#f0f9ff}.employee-leave-type-badge{display:inline-block;padding:4px 8px;background:#dbeafe;color:#0284c7;border-radius:3px;font-size:10px;font-weight:600;border:1px solid #0284c7;white-space:nowrap}.employee-leave-filter-input,.employee-leave-form-input,.employee-leave-action-btn,.employee-leave-pagination-btn,.employee-leave-refresh-btn,.employee-leave-add-btn,.employee-leave-sync-btn{transition:all .3s cubic-bezier(.4,0,.2,1)}.employee-leave-action-btn:focus-visible,.employee-leave-pagination-btn:focus-visible,.employee-leave-filter-input:focus-visible,.employee-leave-form-input:focus-visible{outline:2px solid #3b82f6;outline-offset:2px}@media(prefers-color-scheme:dark){.employee-leave-container{background:#1f2937}.employee-leave-filter-section,.employee-leave-table-section,.employee-leave-pagination,.employee-leave-modal-content{background:#111827;color:#f3f4f6}.employee-leave-filter-input,.employee-leave-form-input{background:#1f2937;color:#f3f4f6;border-color:#374151}.employee-leave-table th{background-color:#1f2937}.employee-leave-table td{color:#d1d5db}.employee-leave-table tbody tr:hover{background-color:#1f2937}.employee-leave-dropdown-menu{background:#111827;border-color:#374151}.employee-leave-dropdown-item:hover{background:#1f2937}}@media(prefers-reduced-motion:reduce){.employee-leave-filter-input,.employee-leave-form-input,.employee-leave-action-btn,.employee-leave-pagination-btn,.employee-leave-refresh-btn,.employee-leave-add-btn,.employee-leave-sync-btn,.employee-leave-modal-content{transition:none;animation:none}}:root{--primary-black: #1a1a1a;--secondary-black: #2d3748;--light-gray: #f8f9fa;--border-gray: #e9ecef;--text-dark: #1f2937;--text-gray: #6b7280;--error-red: #ef4444;--success-green: #10b981;--warning-yellow: #fbbf24}.panel-container-workdays{padding:16px;background:linear-gradient(135deg,#abaeb1,#d1d8df 50%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;min-height:100vh}.workdays-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding:12px 16px;background:#fff;border-radius:8px;box-shadow:0 2px 6px #0000000f;gap:12px}.workdays-header-left{display:flex;align-items:center;gap:10px;flex:1;min-width:0}.workdays-dashboard-title{font-size:18px;font-weight:700;color:var(--primary-black);margin:0;display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.workdays-title-icon{font-size:22px;color:var(--secondary-black);flex-shrink:0}.workdays-header-right{display:flex;gap:6px;flex-shrink:0}.common-refresh-btn-workdays{display:flex;align-items:center;justify-content:center;gap:4px;padding:8px 12px;border:none;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;height:36px;background:#6c757d;color:#fff;box-shadow:0 2px 6px #6c757d26}.common-refresh-btn-workdays:hover{background:#5a6268;transform:translateY(-1px);box-shadow:0 3px 8px #6c757d40}.workdays-filter-section{background:#fff;border-radius:8px;padding:16px;box-shadow:0 2px 6px #0000000f;margin-bottom:16px}.filter-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.filter-item{display:flex;flex-direction:column;gap:6px}.filter-item label{font-weight:600;font-size:11px;color:var(--secondary-black);text-transform:uppercase;letter-spacing:.3px}.filter-input{padding:8px 10px;border:1px solid #d1d8df;border-radius:4px;font-size:12px;color:var(--secondary-black);background:#fff;transition:all .3s ease}.filter-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 2px #4950571a}.filter-input.disabled{background:#f0f4f8;cursor:not-allowed}.filter-search-wrapper{position:relative}.filter-clear-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--text-gray);padding:4px;display:flex;align-items:center;justify-content:center}.filter-clear-btn:hover{color:var(--text-dark)}.filter-suggestions{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d1d8df;border-top:none;border-radius:0 0 4px 4px;max-height:150px;overflow-y:auto;z-index:10;box-shadow:0 4px 6px #0000001a}.filter-suggestion-item{padding:8px 10px;cursor:pointer;font-size:12px;color:var(--secondary-black);transition:background .2s ease}.filter-suggestion-item:hover{background:#f0f4f8}.filter-buttons{display:flex;gap:8px}.filter-apply-btn{flex:1;padding:8px 12px;background:#4299e1;color:#fff;border:none;border-radius:4px;font-weight:600;font-size:11px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px;height:36px}.filter-apply-btn:hover{background:#3182ce;transform:translateY(-1px);box-shadow:0 3px 8px #4299e14d}.filter-clear-btn-btn{flex:1;padding:8px 12px;background:#fc8181;color:#fff;border:none;border-radius:4px;font-weight:600;font-size:11px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px;height:36px}.filter-clear-btn-btn:hover{background:#f56565;transform:translateY(-1px);box-shadow:0 3px 8px #f565654d}.workdays-table-section{background:#fff;border-radius:8px;box-shadow:0 2px 6px #0000000f;overflow:hidden;margin-bottom:16px}.workdays-table-wrapper{overflow-x:auto;max-height:600px;position:relative}.workdays-data-table{width:100%;border-collapse:collapse;font-size:12px;background:#fff}.workdays-data-table thead{background:var(--secondary-black);position:sticky;top:0;z-index:10}.workdays-data-table thead th{padding:10px 12px;text-align:left;font-weight:700;text-transform:uppercase;letter-spacing:.4px;font-size:11px;color:#fff;border-bottom:2px solid var(--primary-black);white-space:nowrap}.workdays-data-table tbody tr{border-bottom:1px solid var(--border-gray);transition:all .2s ease}.workdays-data-table tbody tr:hover{background:var(--light-gray)}.workdays-data-table tbody td{padding:10px 12px;color:var(--secondary-black);vertical-align:middle}.workdays-emp-id{font-weight:700;color:var(--primary-black)}.workdays-emp-name{font-weight:600;color:var(--primary-black)}.workdays-year,.workdays-month{text-align:center}.badge-full{display:inline-block;background:#d1fae5;color:#065f46;padding:4px 8px;border-radius:3px;font-weight:600;font-size:11px}.badge-half{display:inline-block;background:#fee2e2;color:#991b1b;padding:4px 8px;border-radius:3px;font-weight:600;font-size:11px}.badge-total{display:inline-block;background:#dbeafe;color:#1e40af;padding:4px 8px;border-radius:3px;font-weight:600;font-size:11px}.workdays-late,.workdays-early,.workdays-ot{text-align:center;font-size:11px}.workdays-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.workdays-no-data-image{width:120px;height:auto;opacity:.6;margin-bottom:12px}.workdays-no-data-container p{font-size:12px;color:#6c757d;margin:0}.workdays-loading-panel,.workdays-error-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;background:#fff;border-radius:8px;margin:40px auto;max-width:500px}.workdays-spinner{width:40px;height:40px;border:4px solid var(--border-gray);border-top-color:var(--secondary-black);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}.workdays-loading-panel p,.workdays-error-panel p{font-size:13px;color:#495057;margin:0}.workdays-actions-group{display:flex;gap:8px;justify-content:center}.workdays-action-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:3px;cursor:pointer;transition:all .3s ease;background:var(--light-gray);border:1px solid #dee2e6;padding:0}.workdays-action-btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.workdays-action-btn.edit{color:#ffc107}.workdays-action-btn.edit:hover{background:#fff3cd}.workdays-action-btn.delete{color:#dc3545}.workdays-action-btn.delete:hover{background:#f8d7da}.workdays-pagination-section{background:#fff;border-radius:8px;padding:10px 12px;box-shadow:0 2px 6px #0000000f;margin-bottom:16px}.workdays-pagination-controls{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap}.workdays-pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;background:#fff;border:1px solid #d1d8df;border-radius:3px;cursor:pointer;transition:all .3s ease;color:#495057;font-weight:600;font-size:12px;white-space:nowrap;height:32px}.workdays-pagination-btn:hover:not(:disabled){background:var(--secondary-black);border-color:var(--secondary-black);color:#fff;transform:translateY(-1px)}.workdays-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.workdays-pagination-goto{display:flex;align-items:center;gap:6px;font-size:12px;color:#495057;font-weight:600}.workdays-pagination-input{width:50px;padding:6px 8px;border:1px solid #d1d8df;border-radius:3px;text-align:center;font-size:12px;font-weight:600;color:var(--primary-black);height:32px}.workdays-pagination-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 2px #4950571a}.workdays-pagination-info{font-size:12px;color:#495057;font-weight:600;min-width:180px;text-align:center}.workdays-export-section{background:#fff;border-radius:8px;padding:12px 14px;box-shadow:0 2px 6px #0000000f;margin-bottom:16px}.workdays-export-header{margin-bottom:10px}.workdays-export-header h3{font-size:12px;font-weight:700;color:var(--primary-black);margin:0;text-transform:uppercase;letter-spacing:.4px}.workdays-export-buttons{display:flex;gap:8px;flex-wrap:wrap}.workdays-export-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;border:1px solid #d1d8df;border-radius:4px;background:#fff;color:#495057;font-size:11px;font-weight:600;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px;height:36px;min-width:130px}.workdays-export-btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.workdays-export-btn.excel{border-color:#28a745;color:#28a745}.workdays-export-btn.excel:hover{background:#28a745;color:#fff}.workdays-export-btn.csv{border-color:#17a2b8;color:#17a2b8}.workdays-export-btn.csv:hover{background:#17a2b8;color:#fff}.workdays-export-btn.pdf{border-color:#dc3545;color:#dc3545}.workdays-export-btn.pdf:hover{background:#dc3545;color:#fff}.workdays-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;overflow-y:auto}.workdays-modal-content{background:#fff;border-radius:8px;width:100%;max-width:500px;max-height:85vh;overflow-y:auto;margin:auto;position:relative}.workdays-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--border-gray)}.workdays-modal-header h2{display:flex;align-items:center;gap:8px;margin:0;font-size:16px;font-weight:700;color:var(--secondary-black)}.workdays-modal-close{background:none;border:none;cursor:pointer;color:var(--text-gray);padding:4px}.workdays-modal-close:hover{color:var(--text-dark)}.workdays-modal-body{padding:20px}.workdays-modal-info{background:#f0f4f8;padding:12px;border-radius:4px;margin-bottom:16px;font-size:12px}.workdays-modal-info p{margin:6px 0;color:var(--secondary-black)}.workdays-form-group{margin-bottom:16px}.workdays-form-group label{display:block;font-weight:600;font-size:12px;color:var(--secondary-black);margin-bottom:6px;text-transform:uppercase;letter-spacing:.3px}.workdays-form-input{width:100%;padding:8px 10px;border:1px solid #d1d8df;border-radius:4px;font-size:12px;color:var(--secondary-black);box-sizing:border-box}.workdays-form-input:focus{outline:none;border-color:#4299e1;box-shadow:0 0 0 2px #4299e11a}.workdays-form-group small{display:block;margin-top:4px;color:var(--text-gray);font-size:11px}.workdays-modal-footer{display:flex;gap:12px;padding:16px;border-top:1px solid var(--border-gray)}.workdays-btn-cancel{flex:1;padding:8px 14px;background:#e2e8f0;color:var(--secondary-black);border:none;border-radius:4px;font-weight:600;font-size:12px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px}.workdays-btn-cancel:hover{background:#cbd5e0}.workdays-btn-submit{flex:1;padding:8px 14px;background:#4299e1;color:#fff;border:none;border-radius:4px;font-weight:600;font-size:12px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.3px}.workdays-btn-submit:hover{background:#3182ce;transform:translateY(-1px);box-shadow:0 3px 8px #4299e14d}@media(max-width:1200px){.filter-row{grid-template-columns:repeat(3,1fr)}}@media(max-width:992px){.filter-row{grid-template-columns:repeat(2,1fr)}.workdays-dashboard-title{font-size:16px}}@media(max-width:768px){.panel-container-workdays{padding:10px}.workdays-dashboard-header{padding:10px 12px;flex-direction:column;align-items:stretch}.workdays-header-left{width:100%}.workdays-header-right{width:100%;justify-content:space-between}.workdays-dashboard-title{font-size:14px}.filter-row{grid-template-columns:repeat(2,1fr)}.workdays-data-table{font-size:11px}.workdays-data-table thead th,.workdays-data-table tbody td{padding:8px 10px}.workdays-table-wrapper{max-height:400px}.workdays-action-btn{width:28px;height:28px}.workdays-export-buttons{gap:6px}.workdays-export-btn{flex:1;min-width:100px;font-size:10px;padding:6px 10px}.workdays-pagination-btn{padding:5px 8px;font-size:11px;height:30px}.workdays-pagination-info{font-size:11px;min-width:150px}.workdays-modal-content{max-width:90%}}@media(max-width:480px){.workdays-dashboard-title{font-size:13px}.workdays-title-icon{font-size:18px}.filter-row{grid-template-columns:1fr}.filter-input{font-size:11px;padding:6px 8px}.filter-apply-btn,.filter-clear-btn-btn{font-size:10px;padding:6px 10px;height:32px}.workdays-data-table{font-size:10px}.workdays-data-table thead th,.workdays-data-table tbody td{padding:6px 8px}.workdays-action-btn{width:26px;height:26px}.workdays-export-btn{font-size:9px;padding:5px 8px;height:30px;min-width:90px}.workdays-pagination-btn{padding:4px 6px;font-size:10px;height:28px}.workdays-pagination-input{width:45px;height:28px;font-size:11px}.workdays-pagination-info{font-size:10px;min-width:130px}.workdays-modal-content{max-width:95%;max-height:90vh}.workdays-modal-header{padding:12px}.workdays-modal-header h2{font-size:14px}.workdays-modal-body{padding:15px}.workdays-modal-footer{padding:12px;gap:8px}.workdays-btn-cancel,.workdays-btn-submit{font-size:11px;padding:6px 10px}}.ap-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.ap-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#8b5cf6,#7c3aed);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.ap-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.ap-header-icon{font-size:18px}.ap-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.ap-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.ap-buttons-row::-webkit-scrollbar{height:4px}.ap-buttons-row::-webkit-scrollbar-track{background:transparent}.ap-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.ap-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.ap-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.ap-btn-with-label.active{border-color:#8b5cf6;background:#f5f3ff;color:#8b5cf6}.ap-btn-icon{font-size:14px}.ap-btn-text{display:inline-block}.ap-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.ap-close-all-compact:hover{background:#fecaca;color:#dc2626}.ap-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.ap-tab-content{animation:slideIn .2s ease-out}.ap-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.ap-empty-icon{font-size:64px;opacity:.4}.ap-empty p{font-size:14px;margin:0;color:#9ca3af}.ap-content::-webkit-scrollbar{width:8px}.ap-content::-webkit-scrollbar-track{background:transparent}.ap-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.ap-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.ap-button-bar{height:52px;gap:8px}.ap-btn-with-label{padding:6px 10px;font-size:11px}.ap-btn-icon{font-size:13px}.ap-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.ap-header-compact{height:44px;padding:0 12px}.ap-header-title{font-size:14px;gap:8px}.ap-header-icon{font-size:16px}.ap-button-bar{height:48px;padding:0 8px;gap:6px}.ap-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.ap-btn-icon{font-size:12px}.ap-close-all-compact{padding:6px 8px;font-size:10px}.ap-content{padding:16px}}@media(max-width:480px){.ap-header-compact{height:40px;padding:0 8px}.ap-header-title{font-size:12px;gap:6px}.ap-header-icon{font-size:14px}.ap-button-bar{height:44px;padding:0 6px;gap:4px}.ap-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.ap-btn-icon{font-size:11px}.ap-btn-text{display:none}.ap-close-all-compact{padding:4px 6px;font-size:9px}.ap-close-all-compact span{display:none}.ap-content{padding:12px}}.add-user-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.add-user-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:700px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.add-user-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.add-user-header-content{display:flex;align-items:center;gap:12px;flex:1}.add-user-header-icon{flex-shrink:0;opacity:.9}.add-user-header-text{flex:1}.add-user-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.add-user-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.add-user-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.add-user-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.add-user-body{flex:1;overflow-y:auto;padding:20px}.add-user-form{display:flex;flex-direction:column;gap:16px}.add-user-section-title{font-size:12px;font-weight:700;color:#1f2937;text-transform:uppercase;letter-spacing:.5px;margin-top:8px;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid #e9ecef}.add-user-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.add-user-form-group{display:flex;flex-direction:column;gap:6px}.add-user-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.add-user-input,.add-user-select,.add-user-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.add-user-input::placeholder,.add-user-textarea::placeholder{color:#d1d5db}.add-user-input:focus,.add-user-select:focus,.add-user-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.add-user-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.add-user-textarea{resize:vertical;min-height:70px}.add-user-password-wrapper{position:relative;display:flex;align-items:center}.add-user-password-wrapper .add-user-input{padding-right:40px}.add-user-password-toggle{position:absolute;right:10px;background:none;border:none;cursor:pointer;color:#6b7280;display:flex;align-items:center;justify-content:center;transition:all .3s ease;padding:4px}.add-user-password-toggle:hover{color:#1a1a1a}.add-user-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.add-user-cancel-btn,.add-user-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.add-user-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.add-user-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.add-user-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.add-user-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.add-user-submit-btn:active:not(:disabled){transform:translateY(0)}.add-user-submit-btn:disabled,.add-user-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.add-user-spinner-small{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.add-user-body::-webkit-scrollbar{width:6px}.add-user-body::-webkit-scrollbar-track{background:#f9fafb}.add-user-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.add-user-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.add-user-modal{max-width:95%}.add-user-form-row{grid-template-columns:1fr}}@media(max-width:480px){.add-user-modal{max-width:100%;border-radius:6px}.add-user-header{padding:12px}.add-user-title{font-size:16px}.add-user-body{padding:16px}.add-user-form-actions{flex-direction:column-reverse;gap:8px}.add-user-cancel-btn,.add-user-submit-btn{width:100%}}.edit-user-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}.edit-user-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:700px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.edit-user-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.edit-user-header-content{display:flex;align-items:center;gap:12px;flex:1}.edit-user-header-icon{flex-shrink:0;opacity:.9}.edit-user-header-text{flex:1}.edit-user-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.edit-user-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.edit-user-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.edit-user-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.edit-user-body{flex:1;overflow-y:auto;padding:20px}.edit-user-form{display:flex;flex-direction:column;gap:16px}.edit-user-section-title{font-size:12px;font-weight:700;color:#1f2937;text-transform:uppercase;letter-spacing:.5px;margin-top:8px;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid #e9ecef}.edit-user-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.edit-user-form-group{display:flex;flex-direction:column;gap:6px}.edit-user-label{font-size:12px;font-weight:600;color:#1f2937;text-transform:uppercase;letter-spacing:.3px}.edit-user-input,.edit-user-select,.edit-user-textarea{width:100%;padding:10px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:13px;font-family:inherit;background:#fff;color:#1f2937;transition:all .3s ease;outline:none}.edit-user-input::placeholder,.edit-user-textarea::placeholder{color:#d1d5db}.edit-user-input:focus,.edit-user-select:focus,.edit-user-textarea:focus{border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a;background:#1a1a1a05}.edit-user-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%231a1a1a' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}.edit-user-textarea{resize:vertical;min-height:70px}.edit-user-password-wrapper{position:relative;display:flex;align-items:center}.edit-user-password-wrapper .edit-user-input{padding-right:40px}.edit-user-password-toggle{position:absolute;right:10px;background:none;border:none;cursor:pointer;color:#6b7280;display:flex;align-items:center;justify-content:center;transition:all .3s ease;padding:4px}.edit-user-password-toggle:hover{color:#1a1a1a}.edit-user-reset-password-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:#fef3c7;color:#92400e;border:1px solid #fcd34d;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;margin-bottom:12px}.edit-user-reset-password-btn:hover{background:#fde68a;border-color:#fbbf24;transform:translateY(-1px)}.edit-user-reset-password-section{background:#fef3c7;border:1px solid #fcd34d;border-radius:6px;padding:12px;margin-bottom:12px}.edit-user-reset-password-section .edit-user-form-group{margin-bottom:12px}.edit-user-reset-actions{display:flex;gap:10px;justify-content:flex-end}.edit-user-cancel-reset-btn,.edit-user-confirm-reset-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.2px;cursor:pointer;transition:all .3s ease;border:none}.edit-user-cancel-reset-btn{background:#e5e7eb;color:#6b7280}.edit-user-cancel-reset-btn:hover{background:#d1d5db}.edit-user-confirm-reset-btn{background:#dc3545;color:#fff}.edit-user-confirm-reset-btn:hover:not(:disabled){background:#c82333}.edit-user-confirm-reset-btn:disabled{opacity:.6;cursor:not-allowed}.edit-user-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:16px;border-top:1px solid #e9ecef}.edit-user-cancel-btn,.edit-user-submit-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;border:none;min-height:40px}.edit-user-cancel-btn{background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}.edit-user-cancel-btn:hover:not(:disabled){background:#e5e7eb;border-color:#d1d5db;transform:translateY(-1px)}.edit-user-submit-btn{background:#1a1a1a;color:#fff;box-shadow:0 2px 8px #1a1a1a33;min-width:140px}.edit-user-submit-btn:hover:not(:disabled){background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.edit-user-submit-btn:active:not(:disabled){transform:translateY(0)}.edit-user-submit-btn:disabled,.edit-user-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.edit-user-spinner-small{display:inline-block;width:12px;height:12px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.edit-user-body::-webkit-scrollbar{width:6px}.edit-user-body::-webkit-scrollbar-track{background:#f9fafb}.edit-user-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.edit-user-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.edit-user-modal{max-width:95%}.edit-user-form-row{grid-template-columns:1fr}}@media(max-width:480px){.edit-user-modal{max-width:100%;border-radius:6px}.edit-user-header{padding:12px}.edit-user-title{font-size:16px}.edit-user-body{padding:16px}.edit-user-form-actions{flex-direction:column-reverse;gap:8px}.edit-user-cancel-btn,.edit-user-submit-btn{width:100%}.edit-user-reset-actions{flex-direction:column}.edit-user-cancel-reset-btn,.edit-user-confirm-reset-btn{width:100%}}.view-user-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:12px;overflow-y:auto;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.view-user-modal{background:#fff;border-radius:8px;box-shadow:0 20px 50px #00000026;width:100%;max-width:700px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease-out;border:1px solid #e9ecef}.view-user-header{background:#1a1a1a;color:#fff;padding:16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #2d3748}.view-user-header-content{display:flex;align-items:center;gap:12px;flex:1}.view-user-header-icon{flex-shrink:0;opacity:.9}.view-user-header-text{flex:1}.view-user-title{font-size:18px;font-weight:700;margin:0;line-height:1.2}.view-user-subtitle{font-size:12px;margin:2px 0 0;opacity:.85;font-weight:500}.view-user-close-btn{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%;background:#ffffff26;border:2px solid rgba(255,255,255,.25);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);flex-shrink:0;color:#fff;padding:0}.view-user-close-btn:hover{background:#ffffff40;border-color:#fff6;transform:scale(1.15) rotate(90deg);box-shadow:0 0 20px #ffffff4d}.view-user-body{flex:1;overflow-y:auto;padding:20px}.view-user-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-bottom:20px}.view-user-card{background:#fff;border:1px solid #e9ecef;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px #0000000d;transition:all .3s ease}.view-user-card:hover{box-shadow:0 4px 12px #0000001a;border-color:#1a1a1a}.view-user-card-header{display:flex;align-items:center;gap:10px;padding:12px;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-bottom:2px solid #e9ecef}.view-user-card-header svg{color:#1a1a1a;flex-shrink:0}.view-user-card-header h4{font-size:12px;font-weight:700;color:#1f2937;margin:0;text-transform:uppercase;letter-spacing:.3px}.view-user-card-content{padding:12px;display:flex;flex-direction:column;gap:10px}.view-user-info-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #e9ecef}.view-user-info-row:last-child{border-bottom:none;padding-bottom:0}.view-user-label{font-size:11px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.2px;flex-shrink:0}.view-user-value{font-size:13px;color:#1f2937;font-weight:500;text-align:right;flex:1;word-break:break-word}.view-user-type-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.view-user-type-badge.manager{background:#a855f726;color:#a855f7}.view-user-type-badge.user{background:#3b82f626;color:#3b82f6}.view-user-status-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600;text-transform:capitalize}.view-user-status-badge.active{background:#dcfce7;color:#16a34a}.view-user-status-badge.inactive{background:#fee2e2;color:#dc2626}.view-user-password-row{display:flex;flex-direction:column;gap:6px;padding:8px 0;border-bottom:1px solid #e9ecef}.view-user-password-row:last-child{border-bottom:none;padding-bottom:0}.view-user-password-display{position:relative;display:flex;align-items:center;gap:8px}.view-user-password-input{flex:1;padding:8px 12px;border:1px solid #e9ecef;border-radius:4px;font-size:12px;font-family:Courier New,monospace;background:#f9fafb;color:#1f2937;outline:none;cursor:default}.view-user-password-toggle{background:none;border:none;cursor:pointer;color:#6b7280;display:flex;align-items:center;justify-content:center;transition:all .3s ease;padding:4px;flex-shrink:0}.view-user-password-toggle:hover{color:#1a1a1a}.view-user-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:12px;border-top:1px solid #e9ecef}.view-user-close-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;background:#1a1a1a;color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #1a1a1a33}.view-user-close-action-btn:hover{background:#2d2d2d;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a1a4d}.view-user-close-action-btn:active{transform:translateY(0)}.view-user-body::-webkit-scrollbar{width:6px}.view-user-body::-webkit-scrollbar-track{background:#f9fafb}.view-user-body::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.view-user-body::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media(max-width:768px){.view-user-modal{max-width:95%}.view-user-grid{grid-template-columns:1fr}}@media(max-width:480px){.view-user-modal{max-width:100%;border-radius:6px}.view-user-header{padding:12px}.view-user-title{font-size:16px}.view-user-body{padding:16px}.view-user-info-row{flex-direction:column;align-items:flex-start}.view-user-value{text-align:left}.view-user-actions{flex-direction:column;gap:8px}.view-user-close-action-btn{width:100%}}:root{--primary: #4F46E5;--primary-dark: #4338CA;--primary-light: #EEF2FF;--secondary: #10B981;--secondary-light: #ECFDF5;--danger: #EF4444;--danger-light: #FEF2F2;--warning: #F59E0B;--warning-light: #FFFBEB;--info: #3B82F6;--info-light: #EFF6FF;--gray-50: #F9FAFB;--gray-100: #F3F4F6;--gray-200: #E5E7EB;--gray-300: #D1D5DB;--gray-400: #9CA3AF;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--transition: all .2s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box}.panel-container-user{padding:12px;background:linear-gradient(135deg,#969696,gray);min-height:100vh;font-family:Segoe UI,Roboto,sans-serif}.user-dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;background:#fff;padding:10px 12px;border-radius:8px;box-shadow:var(--shadow-sm);gap:10px;flex-wrap:wrap}.user-header-left{display:flex;align-items:center;gap:8px}.user-dashboard-title{font-size:16px;font-weight:700;color:var(--gray-900);margin:0;display:flex;align-items:center;gap:8px}.user-title-icon{color:var(--primary)}.user-header-right{display:flex;gap:6px;flex-wrap:wrap}.common-add-btn-user,.common-refresh-btn-user{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 12px;border:none;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.common-add-btn-user{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}.common-add-btn-user:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}.common-refresh-btn-user{background:var(--gray-100);color:var(--gray-700);border:1px solid var(--gray-200)}.common-refresh-btn-user:hover{background:var(--gray-200);transform:translateY(-1px)}.user-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:12px}.user-stat-card{background:#fff;padding:10px;border-radius:6px;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:10px;transition:var(--transition);border-left:3px solid var(--gray-200)}.user-stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.user-stat-card.total{border-left-color:var(--info)}.user-stat-card.active{border-left-color:var(--secondary)}.user-stat-card.inactive{border-left-color:var(--danger)}.user-stat-card.managers{border-left-color:var(--warning)}.user-stat-card.regular{border-left-color:#06b6d4}.user-stat-icon{width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}.user-stat-icon.total{background:var(--info-light);color:var(--info)}.user-stat-icon.active{background:var(--secondary-light);color:var(--secondary)}.user-stat-icon.inactive{background:var(--danger-light);color:var(--danger)}.user-stat-icon.managers{background:var(--warning-light);color:var(--warning)}.user-stat-icon.regular{background:#cffafe;color:#06b6d4}.user-stat-icon svg{width:16px;height:16px}.user-stat-content{flex:1;min-width:0}.user-stat-number{font-size:16px;font-weight:700;color:var(--gray-900)}.user-stat-label{font-size:10px;color:var(--gray-500);margin-top:2px;font-weight:500}.user-controls-section{background:#fff;border-radius:6px;padding:10px;box-shadow:var(--shadow-sm);margin-bottom:12px}.user-controls-left{display:flex;flex-direction:column;gap:8px}.user-filter-item{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.user-select-input{padding:6px 8px;border:1px solid var(--gray-300);border-radius:4px;font-size:11px;font-weight:500;cursor:pointer;background:#fff;color:var(--gray-900);transition:var(--transition);min-width:120px}.user-select-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.user-search-box{position:relative;flex:1;min-width:200px}.user-search-input{width:100%;padding:6px 8px;border:1px solid var(--gray-300);border-radius:4px;font-size:11px;color:var(--gray-900);background:#fff;transition:var(--transition)}.user-search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.user-search-input::placeholder{color:var(--gray-400)}.user-table-section{background:#fff;border-radius:6px;box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:12px}.user-table-wrapper{overflow-x:auto;max-height:450px;position:relative}.user-data-table{width:100%;border-collapse:collapse;font-size:11px}.user-data-table thead{background:linear-gradient(135deg,var(--gray-800) 0%,var(--gray-700) 100%);position:sticky;top:0;z-index:10}.user-data-table thead th{padding:8px 10px;text-align:left;font-weight:600;text-transform:uppercase;letter-spacing:.3px;font-size:10px;color:#fff;border-bottom:1px solid var(--gray-600);white-space:nowrap;height:32px;vertical-align:middle}.user-data-table tbody tr{border-bottom:1px solid var(--gray-100);transition:var(--transition);height:32px}.user-data-table tbody tr:hover{background:var(--gray-50)}.user-data-table tbody td{padding:6px 10px;color:var(--gray-700);vertical-align:middle;font-size:10px;height:32px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-username-cell{font-weight:500;color:var(--gray-900)}.user-email-cell,.user-mobile-cell{color:var(--gray-600)}.user-date-cell{color:var(--gray-600);font-size:10px}.user-type-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:10px;font-weight:600;text-align:center}.user-type-badge.manager{background:#a855f726;color:#a855f7}.user-type-badge.user{background:#3b82f626;color:#3b82f6}.user-status-badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:10px;font-weight:600;text-align:center}.user-status-badge.active{background:var(--secondary-light);color:#065f46}.user-status-badge.inactive{background:var(--danger-light);color:#7f1d1d}.user-table-actions{width:100px;text-align:center;padding:4px}.user-actions-group{display:flex;gap:4px;justify-content:center;flex-wrap:wrap}.user-action-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);border-radius:4px;cursor:pointer;transition:var(--transition);background:#fff;padding:0}.user-action-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.user-action-btn.view{color:var(--info)}.user-action-btn.view:hover{background:var(--info-light)}.user-action-btn.edit{color:var(--warning)}.user-action-btn.edit:hover{background:var(--warning-light)}.user-action-btn.delete{color:var(--danger)}.user-action-btn.delete:hover{background:var(--danger-light)}.user-action-btn img{width:14px;height:14px}.user-table-no-data{background:#fff}.user-no-data-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 15px;text-align:center}.user-no-data-image{width:60px;height:auto;opacity:.5;margin-bottom:8px}.user-no-data-container p{font-size:12px;color:var(--gray-500);margin:0}.user-loading-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px;text-align:center;background:#fff;border-radius:6px;margin:20px auto;max-width:300px;box-shadow:var(--shadow-sm)}.user-spinner{width:28px;height:28px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:10px}.user-loading-panel p{font-size:11px;color:var(--gray-600);margin:0}.user-error-panel{background:var(--danger-light);border:1px solid var(--danger);color:#7f1d1d;padding:12px;border-radius:6px;margin:12px;font-size:12px;font-weight:500}.user-export-section{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:var(--shadow-sm);margin-bottom:12px}.user-export-header{margin-bottom:8px}.user-export-header h3{font-size:12px;font-weight:700;color:var(--gray-900);margin:0;text-transform:uppercase;letter-spacing:.3px}.user-export-buttons{display:flex;gap:8px;flex-wrap:wrap}.user-export-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 12px;border:1px solid var(--gray-300);border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;transition:var(--transition);background:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.user-export-btn svg{width:14px;height:14px}.user-export-btn.excel{color:#1f7e34;border-color:#1f7e34}.user-export-btn.excel:hover{background:#e8f5e9}.user-export-btn.csv{color:#06c;border-color:#06c}.user-export-btn.csv:hover{background:#e3f2fd}.user-export-btn.pdf{color:#d32f2f;border-color:#d32f2f}.user-export-btn.pdf:hover{background:#ffebee}.user-pagination-section{background:#fff;border-radius:6px;padding:8px 10px;box-shadow:var(--shadow-sm);display:flex;justify-content:center;align-items:center;margin-bottom:12px}.user-pagination-controls{display:flex;justify-content:center;align-items:center;gap:6px;flex-wrap:wrap;width:100%}.user-pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:5px 10px;background:#fff;border:1px solid var(--gray-200);border-radius:4px;cursor:pointer;transition:var(--transition);color:var(--gray-700);font-weight:600;font-size:10px;white-space:nowrap}.user-pagination-btn svg{width:12px;height:12px}.user-pagination-btn:hover:not(:disabled){background:var(--primary);border-color:var(--primary);color:#fff;transform:translateY(-1px)}.user-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.user-pagination-goto{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--gray-700);font-weight:600}.user-pagination-input{width:45px;padding:5px 6px;border:1px solid var(--gray-200);border-radius:4px;text-align:center;font-size:10px;font-weight:600;color:var(--gray-900);transition:var(--transition)}.user-pagination-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.user-pagination-input:disabled{background:var(--gray-100);cursor:not-allowed}.user-pagination-info{font-size:10px;color:var(--gray-600);font-weight:600;min-width:150px;text-align:center}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:#fff;border-radius:8px;box-shadow:var(--shadow-lg);max-width:500px;width:100%;max-height:85vh;overflow-y:auto;animation:slideUp .3s ease-out}.modal-content.large{max-width:600px}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.user-table-wrapper::-webkit-scrollbar,.modal-content::-webkit-scrollbar{width:4px;height:4px}.user-table-wrapper::-webkit-scrollbar-track,.modal-content::-webkit-scrollbar-track{background:var(--gray-100);border-radius:2px}.user-table-wrapper::-webkit-scrollbar-thumb,.modal-content::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:2px}.user-table-wrapper::-webkit-scrollbar-thumb:hover,.modal-content::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}@media(max-width:1024px){.user-stats-grid{grid-template-columns:repeat(2,1fr)}.modal-content,.modal-content.large{max-width:90%}}@media(max-width:768px){.panel-container-user{padding:8px}.user-dashboard-header{padding:8px 10px;margin-bottom:10px;flex-direction:column;align-items:flex-start}.user-header-right{width:100%}.user-dashboard-title{font-size:14px}.user-stats-grid{grid-template-columns:repeat(2,1fr);gap:6px;margin-bottom:10px}.user-stat-card{padding:8px}.user-stat-number{font-size:14px}.user-stat-label{font-size:9px}.user-controls-section{padding:8px;margin-bottom:10px}.user-filter-item{gap:6px}.user-select-input{padding:5px 6px;font-size:10px;min-width:100px}.user-search-input{padding:5px 6px;font-size:10px}.user-table-wrapper{max-height:350px}.user-data-table{font-size:10px}.user-data-table thead th{padding:6px 8px;font-size:9px;height:28px}.user-data-table tbody td{padding:4px 8px;font-size:9px;height:28px}.user-action-btn{width:24px;height:24px}.user-action-btn img{width:12px;height:12px}.user-export-section{padding:8px 10px;margin-bottom:10px}.user-export-header h3{font-size:11px;margin-bottom:6px}.user-export-btn{padding:5px 10px;font-size:9px}.user-export-btn svg{width:12px;height:12px}.user-pagination-section{padding:6px 8px;margin-bottom:10px}.user-pagination-btn{padding:4px 8px;font-size:9px}.user-pagination-goto{font-size:9px;gap:3px}.user-pagination-input{width:40px;padding:4px 5px;font-size:9px}.user-pagination-info{font-size:9px;min-width:120px}.modal-content,.modal-content.large{max-width:85%}}@media(max-width:480px){.panel-container-user{padding:6px}.user-dashboard-header{padding:6px 8px;margin-bottom:8px;flex-direction:column;align-items:flex-start}.user-header-left{width:100%}.user-header-right{width:100%;flex-direction:column}.common-add-btn-user,.common-refresh-btn-user{width:100%;padding:5px 8px;font-size:10px}.user-dashboard-title{font-size:12px}.user-stats-grid{grid-template-columns:1fr;gap:6px;margin-bottom:8px}.user-stat-card{padding:6px}.user-stat-icon{width:28px;height:28px}.user-stat-icon svg{width:14px;height:14px}.user-stat-number{font-size:12px}.user-stat-label{font-size:8px}.user-controls-section{padding:6px 8px;margin-bottom:8px}.user-filter-item{flex-direction:column;gap:6px}.user-select-input{width:100%;padding:5px 6px;font-size:10px}.user-search-box{width:100%;min-width:auto}.user-search-input{width:100%;padding:5px 6px;font-size:10px}.user-table-wrapper{max-height:250px}.user-data-table{font-size:9px}.user-data-table thead th{padding:4px 6px;font-size:8px;height:24px}.user-data-table tbody td{padding:3px 6px;font-size:8px;height:24px}.user-table-actions{width:80px;padding:2px}.user-action-btn{width:20px;height:20px}.user-action-btn img{width:10px;height:10px}.user-export-section{padding:6px 8px;margin-bottom:8px}.user-export-header h3{font-size:10px;margin-bottom:6px}.user-export-buttons{flex-direction:column;gap:6px}.user-export-btn{width:100%;padding:5px 8px;font-size:9px;justify-content:center}.user-export-btn svg{width:12px;height:12px}.user-pagination-section{padding:6px 8px;margin-bottom:8px}.user-pagination-controls{flex-direction:column;gap:6px}.user-pagination-btn{width:100%;padding:5px 8px;font-size:9px}.user-pagination-goto{width:100%;justify-content:space-between;font-size:9px}.user-pagination-input{width:50px;padding:4px 5px;font-size:9px}.user-pagination-info{width:100%;font-size:8px;min-width:auto}.modal-content{max-width:95%;max-height:80vh}.modal-content.large{max-width:95%}}@media(min-width:1440px){.user-stats-grid{grid-template-columns:repeat(5,1fr)}.user-table-wrapper{max-height:550px}.modal-content{max-width:550px}.modal-content.large{max-width:650px}}@media(min-width:1920px){.panel-container-user{padding:16px}.user-dashboard-header{padding:12px 14px;margin-bottom:14px}.user-dashboard-title{font-size:18px}.user-stats-grid{gap:10px;margin-bottom:14px}.user-stat-card{padding:12px}.user-stat-number{font-size:18px}.user-stat-label{font-size:11px}.user-controls-section{padding:12px;margin-bottom:14px}.user-table-wrapper{max-height:600px}.user-data-table{font-size:12px}.user-data-table thead th{padding:10px 12px;font-size:11px;height:36px}.user-data-table tbody td{padding:8px 12px;font-size:11px;height:36px}.user-export-section{padding:12px 14px;margin-bottom:14px}.user-pagination-section{padding:10px 12px;margin-bottom:14px}.modal-content{max-width:600px}.modal-content.large{max-width:700px}}@media(prefers-color-scheme:dark){:root{--gray-50: #1F2937;--gray-100: #2D3748;--gray-200: #374151;--gray-300: #4B5563;--gray-400: #6B7280;--gray-500: #9CA3AF;--gray-600: #D1D5DB;--gray-700: #E5E7EB;--gray-800: #F3F4F6;--gray-900: #F9FAFB}.panel-container-user{background:linear-gradient(135deg,#1f2937,#111827)}.user-dashboard-header,.user-controls-section,.user-table-section,.user-export-section,.user-pagination-section,.modal-content{background:#2d3748;color:#f9fafb}.user-data-table thead{background:linear-gradient(135deg,#111827,#1f2937)}.user-data-table tbody tr:hover{background:#374151}.user-data-table tbody td{color:#e5e7eb}.user-select-input,.user-search-input{background:#374151;color:#f9fafb;border-color:#4b5563}.user-select-input:focus,.user-search-input:focus{border-color:var(--primary)}.user-dashboard-title,.user-stat-number{color:#f9fafb}.user-stat-label{color:#9ca3af}.user-pagination-btn{background:#374151;border-color:#4b5563;color:#e5e7eb}.user-pagination-btn:hover:not(:disabled){background:var(--primary);border-color:var(--primary)}.user-pagination-input{background:#374151;color:#f9fafb;border-color:#4b5563}.user-export-btn{background:#374151;border-color:#4b5563}.common-add-btn-user:hover,.common-refresh-btn-user:hover{background:#4b5563}.user-error-panel{background:#5f2f2f;border-color:#7f1d1d;color:#fca5a5}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.common-add-btn-user:focus-visible,.common-refresh-btn-user:focus-visible,.user-select-input:focus-visible,.user-search-input:focus-visible,.user-pagination-btn:focus-visible,.user-action-btn:focus-visible{outline:2px solid var(--primary);outline-offset:1px}@media print{.user-dashboard-header,.user-controls-section,.user-export-section,.user-pagination-section,.user-action-btn,.common-add-btn-user,.common-refresh-btn-user{display:none}.user-table-wrapper{max-height:none;overflow:visible}.modal-overlay{display:none}.panel-container-user{background:#fff;padding:0}}.um-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.um-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#f59e0b,#d97706);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.um-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.um-header-icon{font-size:18px}.um-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.um-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.um-buttons-row::-webkit-scrollbar{height:4px}.um-buttons-row::-webkit-scrollbar-track{background:transparent}.um-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.um-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.um-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.um-btn-with-label.active{border-color:#f59e0b;background:#fffbeb;color:#f59e0b}.um-btn-icon{font-size:14px}.um-btn-text{display:inline-block}.um-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.um-close-all-compact:hover{background:#fecaca;color:#dc2626}.um-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.um-tab-content{animation:slideIn .2s ease-out}.um-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.um-empty-icon{font-size:64px;opacity:.4}.um-empty p{font-size:14px;margin:0;color:#9ca3af}.um-content::-webkit-scrollbar{width:8px}.um-content::-webkit-scrollbar-track{background:transparent}.um-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.um-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.um-button-bar{height:52px;gap:8px}.um-btn-with-label{padding:6px 10px;font-size:11px}.um-btn-icon{font-size:13px}.um-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.um-header-compact{height:44px;padding:0 12px}.um-header-title{font-size:14px;gap:8px}.um-header-icon{font-size:16px}.um-button-bar{height:48px;padding:0 8px;gap:6px}.um-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.um-btn-icon{font-size:12px}.um-close-all-compact{padding:6px 8px;font-size:10px}.um-content{padding:16px}}@media(max-width:480px){.um-header-compact{height:40px;padding:0 8px}.um-header-title{font-size:12px;gap:6px}.um-header-icon{font-size:14px}.um-button-bar{height:44px;padding:0 6px;gap:4px}.um-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.um-btn-icon{font-size:11px}.um-btn-text{display:none}.um-close-all-compact{padding:4px 6px;font-size:9px}.um-close-all-compact span{display:none}.um-content{padding:12px}}.paysheet-container{width:100%;padding:20px;background:#f8f9fa;min-height:100vh}.paysheet-header{margin-bottom:20px}.paysheet-title{font-size:24px;font-weight:700;color:#2d3748;margin:0}.paysheet-filter-section{background:#fff;padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 4px #0000001a}.filter-row{display:flex;gap:15px;flex-wrap:wrap;align-items:flex-end}.filter-item{display:flex;flex-direction:column;gap:5px}.filter-item label{font-size:12px;font-weight:600;color:#4a5568;text-transform:uppercase}.filter-input{padding:8px 12px;border:1px solid #cbd5e0;border-radius:4px;font-size:14px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#fff;cursor:pointer;transition:all .3s ease}.filter-input:hover{border-color:#a0aec0}.filter-input:focus{outline:none;border-color:#4299e1;box-shadow:0 0 0 3px #4299e11a}.paysheet-add-btn{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#48bb78;color:#fff;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease}.paysheet-add-btn:hover{background:#38a169;transform:translateY(-2px);box-shadow:0 4px 8px #48bb784d}.paysheet-forms-section{margin-bottom:20px}.paysheet-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;background:#fff;border-radius:8px;gap:15px}.paysheet-empty-icon{font-size:64px;opacity:.4}.paysheet-empty-state p{font-size:14px;color:#718096;margin:0}.paysheet-forms-grid{display:grid;grid-template-columns:1fr;gap:20px}.paysheet-form-card{background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;overflow:hidden;border-left:4px solid #3b82f6}.paysheet-form-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#f7fafc;border-bottom:1px solid #e2e8f0}.paysheet-form-title{display:flex;flex-direction:column;gap:4px}.paysheet-form-title span:first-child{font-size:16px;font-weight:700;color:#2d3748}.paysheet-form-period{font-size:12px;color:#718096;font-weight:500}.paysheet-form-delete{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:#fc8181;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:all .2s ease}.paysheet-form-delete:hover{background:#f56565;transform:scale(1.05)}.paysheet-form-body{padding:20px;display:flex;flex-direction:column;gap:24px}.paysheet-form-section{display:flex;flex-direction:column;gap:12px}.paysheet-section-title{font-size:13px;font-weight:700;color:#2d3748;text-transform:uppercase;letter-spacing:.5px;margin:0;padding-bottom:8px;border-bottom:2px solid #e2e8f0}.paysheet-form-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.paysheet-form-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.paysheet-form-group label{font-size:12px;font-weight:600;color:#4a5568}.paysheet-form-input{padding:8px 12px;border:1px solid #cbd5e0;border-radius:4px;font-size:13px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#fff;transition:all .2s ease}.paysheet-form-input:focus{outline:none;border-color:#4299e1;box-shadow:0 0 0 2px #4299e11a;background:#ebf8ff}.paysheet-form-input::placeholder{color:#cbd5e0}.paysheet-form-footer{padding:16px 20px;background:#f7fafc;border-top:1px solid #e2e8f0;display:flex;justify-content:flex-end;gap:10px}.paysheet-form-save-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#3b82f6;color:#fff;border:none;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.paysheet-form-save-btn:hover{background:#2563eb;transform:translateY(-2px);box-shadow:0 4px 8px #3b82f64d}.paysheet-export-section{background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.paysheet-export-header{margin-bottom:15px}.paysheet-export-header h3{font-size:16px;font-weight:600;color:#2d3748;margin:0}.paysheet-export-buttons{display:flex;gap:10px;flex-wrap:wrap}.paysheet-export-btn{display:flex;align-items:center;gap:8px;padding:10px 16px;border:none;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;color:#fff}.paysheet-export-btn.excel{background:#10b981}.paysheet-export-btn.excel:hover{background:#059669}.paysheet-export-btn.csv{background:#f59e0b}.paysheet-export-btn.csv:hover{background:#d97706}.paysheet-export-btn.pdf{background:#ef4444}.paysheet-export-btn.pdf:hover{background:#dc2626}@media(max-width:1200px){.paysheet-form-grid-4{grid-template-columns:repeat(3,1fr)}}@media(max-width:768px){.paysheet-container{padding:15px}.filter-row{flex-direction:column}.filter-item,.filter-input,.paysheet-add-btn{width:100%}.paysheet-form-grid-3,.paysheet-form-grid-4{grid-template-columns:repeat(2,1fr)}.paysheet-form-header{flex-direction:column;align-items:flex-start;gap:12px}.paysheet-form-delete{align-self:flex-end}.paysheet-export-buttons{flex-direction:column}.paysheet-export-btn{width:100%;justify-content:center}}@media(max-width:480px){.paysheet-form-grid-3,.paysheet-form-grid-4{grid-template-columns:1fr}.paysheet-form-body{padding:15px}.paysheet-form-section{gap:10px}.paysheet-form-group{gap:4px}.paysheet-form-input{padding:6px 10px;font-size:12px}.paysheet-form-save-btn{width:100%;justify-content:center}}.paysheet-calc-section{background:#f0f9ff;padding:16px;border-radius:6px;border-left:4px solid #0ea5e9;margin:0}.paysheet-calc-section .paysheet-section-title{color:#0369a1;border-bottom-color:#7dd3fc}.paysheet-input-calc{background:#fff;border:2px solid #0ea5e9;color:#0369a1;font-weight:600}.paysheet-input-calc:focus{background:#ecf7ff;border-color:#0284c7;box-shadow:0 0 0 3px #0ea5e933}.paysheet-input-readonly{background:#e0f2fe!important;border:2px solid #7dd3fc!important;color:#0369a1!important;cursor:not-allowed!important;font-weight:700}.auto-badge{display:inline-block;background:#06b6d4;color:#fff;padding:2px 6px;border-radius:3px;font-size:10px;font-weight:700;margin-left:4px;text-transform:uppercase}.paysheet-calc-section-2{background:#f0fdf4;padding:16px;border-radius:6px;border-left:4px solid #10b981;margin:0}.paysheet-calc-section-2 .paysheet-section-title{color:#065f46;border-bottom-color:#a7f3d0}.paysheet-input-calc-2{background:#fff;border:2px solid #10b981;color:#065f46;font-weight:600}.paysheet-input-calc-2:focus{background:#f0fdf4;border-color:#059669;box-shadow:0 0 0 3px #10b98133}.paysheet-input-calc-2.paysheet-input-readonly{background:#dcfce7!important;border:2px solid #86efac!important;color:#15803d!important;cursor:not-allowed!important;font-weight:700}.paysheet-calc-section-3{background:#fff7ed;padding:16px;border-radius:6px;border-left:4px solid #ea580c;margin:0}.paysheet-calc-section-3 .paysheet-section-title{color:#7c2d12;border-bottom-color:#fed7aa}.paysheet-input-calc-3{background:#fff;border:2px solid #ea580c;color:#7c2d12;font-weight:600}.paysheet-input-calc-3:focus{background:#fff7ed;border-color:#d97706;box-shadow:0 0 0 3px #ea580c33}.paysheet-input-calc-3.paysheet-input-readonly{background:#fed7aa!important;border:2px solid #fdba74!important;color:#92400e!important;cursor:not-allowed!important;font-weight:700}.paysheet-calc-section-4{background:#fee2e2;padding:16px;border-radius:6px;border-left:4px solid #dc2626;margin:0}.paysheet-calc-section-4 .paysheet-section-title{color:#7f1d1d;border-bottom-color:#fca5a5}.paysheet-input-calc-4{background:#fff;border:2px solid #dc2626;color:#7f1d1d;font-weight:600}.paysheet-input-calc-4:focus{background:#fee2e2;border-color:#b91c1c;box-shadow:0 0 0 3px #dc262633}.paysheet-input-calc-4.paysheet-input-readonly{background:#fecaca!important;border:2px solid #fca5a5!important;color:#991b1b!important;cursor:not-allowed!important;font-weight:700}.paysheet-calc-section-5{background:#f3e8ff;padding:16px;border-radius:6px;border-left:4px solid #a855f7;margin:0}.paysheet-calc-section-5 .paysheet-section-title{color:#581c87;border-bottom-color:#e9d5ff}.paysheet-input-calc-5{background:#fff;border:2px solid #a855f7;color:#581c87;font-weight:600}.paysheet-input-calc-5:focus{background:#f3e8ff;border-color:#9333ea;box-shadow:0 0 0 3px #a855f733}.paysheet-input-calc-5.paysheet-input-readonly{background:#ede9fe!important;border:2px solid #ddd6fe!important;color:#6b21a8!important;cursor:not-allowed!important;font-weight:700}.paysheet-employee-section{background:linear-gradient(135deg,#667eea,#764ba2);padding:24px;border-radius:8px;margin-bottom:24px;box-shadow:0 4px 15px #667eea33}.employee-selection-container{max-width:1200px;margin:0 auto}.employee-select-group{margin-bottom:16px}.employee-label{display:block;color:#fff;font-weight:600;margin-bottom:8px;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.employee-select-wrapper{position:relative;display:flex;align-items:center}.employee-select{width:100%;padding:12px 40px 12px 16px;border:2px solid rgba(255,255,255,.3);border-radius:6px;background:#fff;color:#333;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;appearance:none}.employee-select:hover{border-color:#fff9;box-shadow:0 2px 8px #0000001a}.employee-select:focus{outline:none;border-color:#fff;box-shadow:0 0 0 3px #fff3}.employee-select:disabled{opacity:.6;cursor:not-allowed}.select-icon{position:absolute;right:12px;color:#667eea;pointer-events:none}.employee-info-display{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-top:20px;padding-top:20px;border-top:2px solid rgba(255,255,255,.2)}.info-item{display:flex;justify-content:space-between;align-items:center;background:#ffffff1a;padding:12px 16px;border-radius:6px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.info-label{color:#fffc;font-weight:500;font-size:13px}.info-value{color:#fff;font-weight:700;font-size:14px;margin-left:12px}.employee-type-badge{display:inline-block;background:#10b981;color:#fff;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;margin-left:12px;text-transform:uppercase;letter-spacing:.5px}.paysheet-form-actions{display:flex;gap:8px}.paysheet-form-save-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;background:#10b981;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:600;font-size:13px;transition:all .3s ease}.paysheet-form-save-btn:active{transform:translateY(0)}@media(max-width:768px){.employee-info-display{grid-template-columns:1fr}.employee-select{font-size:13px;padding:10px 14px}.info-item{flex-direction:column;align-items:flex-start;gap:6px}.info-value{margin-left:0}}.paysheet-compact-section{background:#fff;padding:16px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 4px #0000001a}.compact-controls{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}.employee-search-container{flex:1;min-width:250px;position:relative}.search-input-wrapper{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:12px;color:#a0aec0;pointer-events:none}.employee-search-input{width:100%;padding:10px 12px 10px 36px;border:2px solid #e2e8f0;border-radius:6px;font-size:13px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:#fff;transition:all .2s ease}.employee-search-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.employee-search-input::placeholder{color:#cbd5e0}.clear-btn{position:absolute;right:10px;background:none;border:none;color:#a0aec0;cursor:pointer;font-size:16px;padding:4px 8px;transition:color .2s ease}.clear-btn:hover{color:#4a5568}.suggestions-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 6px 6px;max-height:300px;overflow-y:auto;z-index:1000;box-shadow:0 4px 12px #0000001a}.suggestion-item{padding:12px;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:all .2s ease;display:flex;justify-content:space-between;align-items:center}.suggestion-item:hover{background:#f7fafc}.suggestion-item.selected{background:#ebf8ff;border-left:3px solid #667eea}.suggestion-name{font-weight:600;color:#2d3748;font-size:13px}.suggestion-id{font-size:12px;color:#718096;margin:0 8px}.suggestion-type{font-size:11px;background:#edf2f7;color:#4a5568;padding:2px 8px;border-radius:3px;text-transform:uppercase;font-weight:600}.filter-controls{display:flex;gap:12px;align-items:flex-end}.filter-item-compact{display:flex;flex-direction:column;gap:4px}.filter-item-compact label{font-size:12px;font-weight:600;color:#4a5568;text-transform:uppercase}.filter-input-compact{padding:8px 10px;border:2px solid #e2e8f0;border-radius:4px;font-size:13px;background:#fff;cursor:pointer;transition:all .2s ease;min-width:100px}.filter-input-compact:hover{border-color:#cbd5e0}.filter-input-compact:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 2px #667eea1a}.paysheet-add-btn-compact{display:flex;align-items:center;gap:6px;padding:8px 14px;background:#48bb78;color:#fff;border:none;border-radius:4px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.paysheet-add-btn-compact:hover:not(:disabled){background:#38a169;transform:translateY(-2px);box-shadow:0 4px 8px #48bb784d}.paysheet-add-btn-compact:disabled{background:#cbd5e0;cursor:not-allowed;opacity:.6}.selected-emp-info{display:flex;gap:12px;align-items:center;padding:12px;background:#f0f9ff;border-radius:6px;margin-top:12px;border-left:3px solid #667eea}.emp-info-badge{font-size:13px;font-weight:600;color:#2d3748;flex:1}.emp-type-small{font-size:11px;background:#10b981;color:#fff;padding:3px 8px;border-radius:3px;text-transform:uppercase;font-weight:600}.emp-epf-status{font-size:12px;font-weight:600;color:#4a5568;padding:3px 8px;background:#fff;border-radius:3px}@media(max-width:1024px){.compact-controls{flex-direction:column}.employee-search-container{width:100%}.filter-controls{width:100%;flex-direction:row}.filter-input-compact,.paysheet-add-btn-compact{flex:1}}@media(max-width:768px){.compact-controls,.filter-controls{flex-direction:column}.filter-item-compact,.filter-input-compact,.paysheet-add-btn-compact{width:100%}.selected-emp-info{flex-direction:column;gap:8px}.emp-info-badge{width:100%}.suggestions-dropdown{max-height:200px}}.editing-badge{background-color:#fbbf24;color:#78350f;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:700;margin-left:8px}.paysheet-form-update-btn{background-color:#10b981;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all .3s ease;display:flex;align-items:center;gap:6px}.paysheet-form-update-btn:hover{background-color:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.paysheet-form-save-btn{background-color:#3b82f6;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all .3s ease;display:flex;align-items:center;gap:6px}.paysheet-form-save-btn:hover{background-color:#2563eb;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f666}.paysheet-input-autofilled{background-color:#f0f9ff;border-left:3px solid #667eea}.workdays-linked-indicator{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ecfdf5;border:1px solid #86efac;border-radius:6px;color:#166534;font-size:12px;margin-bottom:12px}.workdays-linked-indicator:before{content:"✅";font-size:14px}.workdays-linked-indicator{display:flex;align-items:center;gap:12px;padding:12px 16px;background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1px solid #6ee7b7;border-radius:8px;color:#065f46;font-size:13px;font-weight:600;margin-bottom:16px;animation:slideInDown .3s ease-out}.workdays-linked-indicator:before{content:"✅";font-size:16px}.refresh-workdays-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:#10b981;color:#fff;border-radius:6px;cursor:pointer;transition:all .2s ease;margin-left:auto}.refresh-workdays-btn:hover{background:#059669;transform:rotate(180deg)}.refresh-workdays-btn:active{transform:scale(.95) rotate(180deg)}.auto-fill-badge{display:inline-block;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;margin-left:6px;animation:slideIn .3s ease-out}.workdays-badge{display:inline-block;background:#10b981;color:#fff;padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600;margin-left:8px}.paysheet-input-autofilled{background-color:#f0fdf4!important;border-left:3px solid #10b981!important;transition:all .2s ease}.paysheet-input-autofilled:focus{background-color:#ecfdf5!important;border-left-color:#059669!important;box-shadow:0 0 0 3px #10b9811a}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}@keyframes slideInDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.paysheet-form-section{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:16px;margin-bottom:16px;transition:all .2s ease}.paysheet-form-section:hover{border-color:#d1d5db;box-shadow:0 1px 3px #0000000d}.paysheet-section-title{font-size:14px;font-weight:600;color:#1f2937;margin:0 0 12px;display:flex;align-items:center;gap:8px}.paysheet-form-grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}.paysheet-form-grid-4{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.paysheet-form-group{display:flex;flex-direction:column;gap:6px}.paysheet-form-group label{font-size:12px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:4px}.paysheet-form-input{padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:13px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;transition:all .2s ease;background:#fff}.paysheet-form-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a;background:#f0f9ff}.paysheet-form-input:hover{border-color:#9ca3af}.paysheet-form-input-readonly{background-color:#f3f4f6!important;cursor:not-allowed;color:#6b7280}.paysheet-form-save-btn,.paysheet-form-update-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.paysheet-form-save-btn{background:#10b981;color:#fff}.paysheet-form-save-btn:hover{background:#059669;transform:translateY(-2px);box-shadow:0 4px 12px #10b9814d}.paysheet-form-update-btn{background:#3b82f6;color:#fff}.paysheet-form-update-btn:hover{background:#2563eb;transform:translateY(-2px);box-shadow:0 4px 12px #3b82f64d}.paysheet-form-delete{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;background:#ef4444;color:#fff;border-radius:6px;cursor:pointer;transition:all .2s ease}.paysheet-form-delete:hover{background:#dc2626;transform:scale(1.05)}@media(max-width:1024px){.paysheet-form-grid-4{grid-template-columns:repeat(2,1fr)}.paysheet-form-grid-3{grid-template-columns:1fr}}@media(max-width:768px){.paysheet-form-grid-4,.paysheet-form-grid-3{grid-template-columns:1fr}.workdays-linked-indicator{flex-direction:column;align-items:flex-start}.refresh-workdays-btn{margin-left:0;align-self:flex-end}}.viewpaysheet-container{width:100%;max-width:1600px;margin:0 auto;padding:16px;background:#f8f9fa;border-radius:8px}.viewpaysheet-filter-section{background:#fff;padding:12px;border-radius:6px;box-shadow:0 2px 4px #0000000d;margin-bottom:12px}.filter-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.filter-item{display:flex;flex-direction:column;gap:4px;min-width:140px;max-width:150px}.filter-item label{font-size:10px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.3px}.filter-input{padding:6px 8px;border:1px solid #d1d5db;border-radius:4px;font-size:11px;background-color:#fff;cursor:pointer;color:#2d3748;height:30px;width:100%}.filter-item-actions{display:flex;gap:6px;flex-wrap:nowrap;align-items:center;margin-left:auto}.viewpaysheet-refresh-btn,.viewpaysheet-selection-toggle,.viewpaysheet-export-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;transition:all .3s ease;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;flex-shrink:0}.viewpaysheet-refresh-btn{background-color:#e5e7eb;color:#374151}.viewpaysheet-refresh-btn:hover{background-color:#d1d5db;transform:translateY(-1px)}.viewpaysheet-refresh-btn:disabled{opacity:.5;cursor:not-allowed}.viewpaysheet-selection-toggle{background-color:#f3f4f6;color:#374151;border:1px solid #d1d5db}.viewpaysheet-selection-toggle.active{background-color:#10b981;color:#fff;border-color:#10b981}.viewpaysheet-selection-toggle:hover{transform:translateY(-1px)}.viewpaysheet-export-btn{background-color:#3b82f6;color:#fff;padding:6px 12px}.viewpaysheet-export-btn.payslip{background-color:#3b82f6}.viewpaysheet-export-btn.payslip:hover{background-color:#2563eb}.viewpaysheet-export-btn.paysheet{background-color:#8b5cf6}.viewpaysheet-export-btn.paysheet:hover{background-color:#7c3aed}.viewpaysheet-export-btn.excel{background-color:#10b981}.viewpaysheet-export-btn.excel:hover{background-color:#059669}.viewpaysheet-export-btn:hover:not(:disabled){transform:translateY(-1px);opacity:.95}.viewpaysheet-export-btn:disabled{opacity:.5;cursor:not-allowed}.selection-info-bar{background:#fff;padding:10px 12px;border-radius:6px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:600;box-shadow:0 2px 4px #0000000d;border-left:4px solid #3b82f6}.clear-selection-btn{padding:6px 12px;background:#dc2626;color:#fff;border:none;border-radius:3px;font-size:10px;font-weight:600;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:.3px}.clear-selection-btn:hover{background:#b91c1c;transform:translateY(-1px)}.viewpaysheet-table-section{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d;overflow:hidden;margin-bottom:12px}.viewpaysheet-table{width:100%;border-collapse:collapse;font-size:11px}.viewpaysheet-table thead{background-color:#2d3748;border-bottom:2px solid #1a202c;position:sticky;top:0;z-index:10}.viewpaysheet-table th{padding:10px 8px;text-align:left;font-size:10px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.viewpaysheet-table tbody tr{border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.viewpaysheet-table tbody tr:hover{background-color:#f9fafb}.viewpaysheet-table tbody tr.selected{background-color:#dbeafe}.viewpaysheet-table td{padding:10px 8px;font-size:11px;color:#374151;vertical-align:middle}.checkbox-col{width:40px;text-align:center}.checkbox-col input{cursor:pointer;width:16px;height:16px}.amount{font-weight:600;color:#059669;text-align:right;white-space:nowrap}.actions{display:flex;gap:6px;justify-content:center;flex-wrap:nowrap;min-width:180px}.action-btn{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:1.5px solid transparent;border-radius:4px;cursor:pointer;transition:all .2s ease;padding:0;flex-shrink:0}.action-btn:hover{transform:translateY(-2px);box-shadow:0 2px 8px #00000026}.action-btn.view{background-color:#dbeafe;color:#0284c7;border-color:#0284c7}.action-btn.view:hover{background-color:#bfdbfe}.action-btn.edit{background-color:#fef3c7;color:#f59e0b;border-color:#f59e0b}.action-btn.edit:hover{background-color:#fcd34d}.action-btn.delete{background-color:#fee2e2;color:#dc2626;border-color:#dc2626}.action-btn.delete:hover{background-color:#fecaca}.action-btn.download-pdf{background-color:#d0e5cf;color:#1b7a08;border-color:#125328}.action-btn.download-pdf:hover{background-color:#d6feca}.no-data-container{display:flex;flex-direction:column;align-items:center;gap:12px;padding:60px 20px}.no-data-image{width:100px;height:auto;opacity:.4}.no-data-container p{font-size:14px;color:#9ca3af;font-weight:500}.viewpaysheet-pagination{background:#fff;border-radius:6px;padding:12px;box-shadow:0 2px 4px #0000000d;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 12px;background:#fff;border:1px solid #d1d8df;border-radius:4px;cursor:pointer;font-size:11px;font-weight:600;transition:all .2s;color:#495057;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.pagination-goto label{margin:0;text-transform:uppercase;letter-spacing:.3px}.pagination-input{width:45px;padding:6px 8px;border:1px solid #d1d8df;border-radius:4px;font-size:11px;text-align:center;font-weight:600;color:#1a1a1a;height:30px}.pagination-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.pagination-info{font-size:11px;color:#495057;font-weight:600;min-width:180px;text-align:center;text-transform:uppercase;letter-spacing:.3px}.viewpaysheet-loading,.viewpaysheet-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:20px;background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d}.spinner{width:50px;height:50px;border:4px solid #e9ecef;border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite}.viewpaysheet-loading p,.viewpaysheet-error p{font-size:14px;color:#6b7280;font-weight:500}.retry-btn{padding:8px 20px;background:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:600;transition:all .3s;text-transform:uppercase;letter-spacing:.3px}@media(max-width:1400px){.filter-item{min-width:130px;max-width:140px}.viewpaysheet-export-btn{padding:6px 8px;font-size:9px}.actions{min-width:160px}}@media(max-width:1200px){.viewpaysheet-container{padding:12px}.filter-row{gap:8px}.filter-item{min-width:120px;max-width:130px}.filter-input{font-size:10px;padding:5px 6px}.viewpaysheet-table{font-size:10px}.viewpaysheet-table th,.viewpaysheet-table td{padding:8px 6px}.action-btn{width:28px;height:28px}.actions{gap:4px;min-width:150px}}@media(max-width:1024px){.filter-row{flex-wrap:wrap}.filter-item-actions{margin-left:0;width:100%;justify-content:flex-start}.viewpaysheet-table{font-size:9px}.viewpaysheet-table th,.viewpaysheet-table td{padding:6px 5px}.action-btn{width:26px;height:26px}.actions{gap:3px;min-width:auto}.pagination-info{min-width:150px}}@media(max-width:768px){.viewpaysheet-container{padding:10px}.viewpaysheet-filter-section{padding:10px;margin-bottom:10px}.filter-row{flex-direction:column;gap:8px}.filter-item{min-width:100%;max-width:100%}.filter-item-actions{width:100%;flex-wrap:wrap}.viewpaysheet-refresh-btn,.viewpaysheet-selection-toggle,.viewpaysheet-export-btn{flex:1;min-width:100px;font-size:9px;padding:6px 8px}.viewpaysheet-table{font-size:8px}.viewpaysheet-table th,.viewpaysheet-table td{padding:5px 4px}.action-btn{width:24px;height:24px}.actions{gap:2px}.amount{font-size:10px}.pagination-btn{padding:5px 8px;font-size:9px;height:28px}.pagination-input{width:40px;height:28px;font-size:10px}.pagination-info{font-size:9px;min-width:120px}.selection-info-bar{font-size:11px;padding:8px 10px}.clear-selection-btn{padding:4px 8px;font-size:9px}}@media(max-width:480px){.viewpaysheet-container{padding:8px}.viewpaysheet-filter-section{padding:8px;margin-bottom:8px}.filter-item{min-width:100%}.filter-input{font-size:9px;height:28px}.viewpaysheet-refresh-btn,.viewpaysheet-selection-toggle,.viewpaysheet-export-btn{width:100%;font-size:8px;padding:5px 6px;height:28px}.viewpaysheet-table{font-size:7px}.viewpaysheet-table th,.viewpaysheet-table td{padding:4px 3px}.viewpaysheet-table th{font-size:8px}.action-btn{width:22px;height:22px}.actions{gap:2px;min-width:auto}.amount{font-size:9px}.pagination-btn{padding:4px 6px;font-size:8px;height:26px}.pagination-input{width:35px;height:26px;font-size:9px}.pagination-goto{font-size:9px}.pagination-info{font-size:8px;min-width:100px}.selection-info-bar{font-size:10px;padding:6px 8px;flex-direction:column;gap:8px;align-items:flex-start}.clear-selection-btn{width:100%;padding:6px}.no-data-container{padding:40px 15px}.no-data-image{width:80px}.viewpaysheet-loading,.viewpaysheet-error{min-height:300px}}@media print{.viewpaysheet-filter-section,.viewpaysheet-pagination,.selection-info-bar{display:none}.viewpaysheet-table-section{box-shadow:none}.viewpaysheet-table{font-size:10px}.viewpaysheet-table th,.viewpaysheet-table td{padding:8px}}.text-center{text-align:center}.text-right{text-align:right}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-sm{font-size:12px}.text-xs{font-size:10px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.p-2{padding:8px}.p-3{padding:12px}.p-4{padding:16px}.m-0{margin:0}.mb-2{margin-bottom:8px}.mb-3{margin-bottom:12px}.mb-4{margin-bottom:16px}.viewpaysheet-table-section::-webkit-scrollbar{width:8px;height:8px}.viewpaysheet-table-section::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}.viewpaysheet-table-section::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.viewpaysheet-table-section::-webkit-scrollbar-thumb:hover{background:#94a3b8}.action-btn:focus,.pagination-btn:focus,.viewpaysheet-refresh-btn:focus,.viewpaysheet-selection-toggle:focus,.viewpaysheet-export-btn:focus{outline:2px solid #3b82f6;outline-offset:2px}input[type=checkbox]:focus{outline:2px solid #3b82f6;outline-offset:2px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.viewpaysheet-table tbody tr{animation:fadeIn .3s ease-in-out}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:100px}}.selection-info-bar{animation:slideDown .3s ease-in-out}.paysheet-status-container{width:100%;max-width:1600px;margin:0 auto;padding:16px;background:#f8f9fa;border-radius:8px}.status-filters-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:12px;background:#fff;padding:12px;border-radius:6px;box-shadow:0 2px 4px #0000000d}.status-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:12px}.status-table-container{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d;overflow:hidden;margin-bottom:12px}.loading-state,.empty-state{padding:40px 20px;text-align:center;color:#9ca3af;font-size:12px}.status-table{width:100%;border-collapse:collapse;font-size:11px}.status-table thead{background-color:#2d3748;border-bottom:1px solid #1a202c;position:sticky;top:0;z-index:10}.status-table th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.status-table tbody tr{border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.status-table tbody tr:hover{background-color:#f9fafb}.status-table td{padding:8px 10px;font-size:11px;color:#374151;vertical-align:middle}.bank-name,.account-number{color:#6b7280;font-size:10px;min-width:120px}.period{color:#6b7280;font-size:10px;width:100px}.status-cell{text-align:center;width:100px}.payment-date{color:#6b7280;font-size:10px;width:90px}.paid-btn{background-color:#d1fae5;color:#059669;border-color:#a7f3d0}.paid-btn:hover{background-color:#a7f3d0;transform:translateY(-1px)}.paysheet-pagination{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:0 2px 4px #0000000d;margin-bottom:12px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.status-export-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;background:#fff;padding:12px;border-radius:6px;box-shadow:0 2px 4px #0000000d}.csv-btn{background-color:#3b82f6;color:#fff}.csv-btn:hover{background-color:#2563eb;transform:translateY(-1px)}@media(max-width:1024px){.status-filters-top{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.status-table{font-size:10px}.status-table th,.status-table td{padding:6px 8px}.summary-card{padding:10px}.summary-value{font-size:16px}}@media(max-width:768px){.paysheet-status-container{padding:10px}.status-filters-top{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px;padding:10px;margin-bottom:10px}.filter-input,.refresh-btn{height:28px;font-size:10px}.status-table{font-size:9px}.status-table th,.status-table td{padding:5px 6px}.emp-id{width:60px}.emp-name{min-width:120px}.bank-name,.account-number{font-size:9px;min-width:100px}.paysheet-pagination{gap:6px;padding:8px 10px;margin-bottom:10px}.pagination-btn{padding:5px 8px;font-size:10px;height:26px}.pagination-input{width:35px;height:26px;font-size:10px}.pagination-info{font-size:10px;min-width:130px}.status-summary{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.summary-card{padding:10px}.summary-card h4{font-size:9px;margin-bottom:4px}.summary-value{font-size:16px}.status-export-buttons{gap:8px;padding:10px}.export-btn{padding:6px 12px;font-size:10px;height:30px}}@media(max-width:480px){.status-filters-top{grid-template-columns:1fr;gap:6px;padding:8px}.filter-input,.refresh-btn{height:26px;font-size:9px}.status-table{font-size:8px}.status-table th,.status-table td{padding:4px 5px}.paysheet-pagination{gap:4px;padding:6px 8px}.pagination-btn{padding:4px 6px;font-size:9px;height:24px}.pagination-input{width:30px;height:24px;font-size:9px}.pagination-info{font-size:9px;min-width:110px}.status-summary{grid-template-columns:1fr;gap:6px}.status-export-buttons{gap:6px;padding:8px;flex-direction:column}.export-btn{padding:6px 10px;font-size:9px;height:28px;width:100%}}.epfetf-container{width:100%;max-width:1600px;margin:0 auto;padding:16px;background:#f8f9fa;border-radius:8px}.epfetf-filters-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:12px;background:#fff;padding:12px;border-radius:6px;box-shadow:0 2px 4px #0000000d}.filter-group{display:flex;flex-direction:column;gap:4px}.filter-group label{font-size:11px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.3px}.filter-input{padding:6px 10px;border:1px solid #d1d5db;border-radius:4px;font-size:12px;background-color:#fff;cursor:pointer;color:#2d3748;height:30px}.filter-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.refresh-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;border:none;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .3s ease;height:30px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px;background-color:#e5e7eb;color:#374151;align-self:flex-end}.refresh-btn:hover:not(:disabled){background-color:#d1d5db;transform:translateY(-1px)}.refresh-btn:disabled{opacity:.5;cursor:not-allowed}.epfetf-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:12px}.summary-card{background:#fff;padding:10px;border-radius:6px;box-shadow:0 2px 4px #0000000d;text-align:center;border-left:3px solid #3b82f6;border-top:1px solid #e5e7eb}.summary-card.grand-total{border-left-color:#10b981;background:linear-gradient(135deg,#f0fdf4,#fff)}.summary-card h4{margin:0 0 5px;font-size:9px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.3px}.summary-value{margin:0;font-size:16px;font-weight:700;color:#1f2937}.summary-card.grand-total .summary-value{color:#10b981;font-size:18px}.epfetf-table-container{background:#fff;border-radius:6px;box-shadow:0 2px 4px #0000000d;overflow:hidden;margin-bottom:12px}.loading-state,.empty-state,.error-state{padding:40px 20px;text-align:center;color:#9ca3af;font-size:12px}.error-state{display:flex;flex-direction:column;align-items:center;gap:15px}.retry-btn{padding:8px 16px;background:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:600;transition:all .3s;text-transform:uppercase;letter-spacing:.3px}.retry-btn:hover{background:#2563eb;transform:translateY(-1px)}.epfetf-table{width:100%;border-collapse:collapse;font-size:11px}.epfetf-table thead{background-color:#2d3748;border-bottom:1px solid #1a202c;position:sticky;top:0;z-index:10}.epfetf-table th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}.epfetf-table tbody tr{border-bottom:1px solid #e5e7eb;transition:background-color .2s ease}.epfetf-table tbody tr:hover{background-color:#f9fafb}.epfetf-table td{padding:8px 10px;font-size:11px;color:#374151;vertical-align:middle}.emp-id{font-weight:600;color:#1f2937;width:70px}.emp-name{font-weight:500;min-width:140px}.epf-number{color:#6b7280;font-size:10px;width:100px}.salary{font-weight:600;color:#059669;text-align:right;width:90px}.amount{font-weight:600;text-align:right;width:90px}.amount.epf8{color:#3b82f6}.amount.epf12{color:#8b5cf6}.amount.etf3{color:#10b981}.amount.total{color:#dc2626;font-weight:700}.actions{display:flex;gap:6px;justify-content:center;width:70px}.action-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid #dee2e6;border-radius:3px;cursor:pointer;transition:all .2s ease;font-size:0;padding:0}.view-btn{background-color:#dbeafe;color:#0284c7;border-color:#bfdbfe}.view-btn:hover{background-color:#bfdbfe;transform:translateY(-1px)}.delete-btn{background-color:#fee2e2;color:#dc2626;border-color:#fecaca}.delete-btn:hover{background-color:#fecaca;transform:translateY(-1px)}.epfetf-pagination{background:#fff;border-radius:6px;padding:10px 12px;box-shadow:0 2px 4px #0000000d;margin-bottom:12px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.pagination-btn{display:flex;align-items:center;justify-content:center;gap:4px;padding:6px 10px;background:#fff;border:1px solid #d1d8df;border-radius:3px;cursor:pointer;font-size:11px;font-weight:600;transition:all .2s;color:#495057;height:28px;white-space:nowrap}.pagination-btn:hover:not(:disabled){background:#2d3748;border-color:#2d3748;color:#fff;transform:translateY(-1px)}.pagination-btn:disabled{background:#e9ecef;cursor:not-allowed;opacity:.5}.pagination-goto{display:flex;align-items:center;gap:6px;font-size:11px;color:#495057;font-weight:600}.pagination-goto label{margin:0}.pagination-input{width:40px;padding:5px 8px;border:1px solid #d1d8df;border-radius:3px;font-size:11px;text-align:center;font-weight:600;color:#1a1a1a;height:28px}.pagination-input:focus{outline:none;border-color:#495057;box-shadow:0 0 0 2px #4950571a}.pagination-info{font-size:11px;color:#495057;font-weight:600;min-width:150px;text-align:center}.epfetf-export-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;background:#fff;padding:12px;border-radius:6px;box-shadow:0 2px 4px #0000000d}.export-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border:none;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;transition:all .3s ease;height:32px;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}.pdf-btn{background-color:#dc2626;color:#fff}.pdf-btn:hover{background-color:#b91c1c;transform:translateY(-1px)}.excel-btn{background-color:#10b981;color:#fff}.excel-btn:hover{background-color:#059669;transform:translateY(-1px)}@media(max-width:1024px){.epfetf-filters-top{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.epfetf-table{font-size:10px}.epfetf-table th,.epfetf-table td{padding:6px 8px}.summary-card{padding:10px}.summary-value{font-size:16px}}@media(max-width:768px){.epfetf-container{padding:10px}.epfetf-filters-top{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px;padding:10px;margin-bottom:10px}.filter-input,.refresh-btn{height:28px;font-size:10px}.epfetf-table{font-size:9px}.epfetf-table th,.epfetf-table td{padding:5px 6px}.emp-id{width:60px}.emp-name{min-width:120px}.epf-number{font-size:9px;width:90px}.epfetf-pagination{gap:6px;padding:8px 10px;margin-bottom:10px}.pagination-btn{padding:5px 8px;font-size:10px;height:26px}.pagination-input{width:35px;height:26px;font-size:10px}.pagination-info{font-size:10px;min-width:130px}.epfetf-summary{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.summary-card{padding:10px}.summary-card h4{font-size:9px;margin-bottom:4px}.summary-value{font-size:16px}.epfetf-export-buttons{gap:8px;padding:10px}.export-btn{padding:6px 12px;font-size:10px;height:30px}}@media(max-width:480px){.epfetf-filters-top{grid-template-columns:1fr;gap:6px;padding:8px}.filter-input,.refresh-btn{height:26px;font-size:9px}.epfetf-table{font-size:8px}.epfetf-table th,.epfetf-table td{padding:4px 5px}.epfetf-pagination{gap:4px;padding:6px 8px}.pagination-btn{padding:4px 6px;font-size:9px;height:24px}.pagination-input{width:30px;height:24px;font-size:9px}.pagination-info{font-size:9px;min-width:110px}.epfetf-summary{grid-template-columns:1fr;gap:6px}.epfetf-export-buttons{gap:6px;padding:8px;flex-direction:column}.export-btn{padding:6px 10px;font-size:9px;height:28px;width:100%}}.ps-container{display:flex;flex-direction:column;height:100%;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden}.ps-header-compact{display:flex;align-items:center;height:48px;padding:0 16px;background:linear-gradient(135deg,#3b82f6,#1e40af);border-bottom:1px solid #e5e5e5;flex-shrink:0;box-shadow:0 2px 4px #00000014}.ps-header-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:#fff}.ps-header-icon{font-size:18px}.ps-button-bar{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;gap:12px;overflow-x:auto}.ps-buttons-row{display:flex;gap:6px;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin}.ps-buttons-row::-webkit-scrollbar{height:4px}.ps-buttons-row::-webkit-scrollbar-track{background:transparent}.ps-buttons-row::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:2px}.ps-btn-with-label{display:flex;align-items:center;gap:8px;padding:8px 12px;background:transparent;border:2px solid transparent;border-left:3px solid transparent;cursor:pointer;border-radius:6px;transition:all .2s ease;font-size:12px;font-weight:600;color:#4a5568;white-space:nowrap;flex-shrink:0}.ps-btn-with-label:hover{background:#f7fafc;border-color:#e2e8f0}.ps-btn-with-label.active{border-color:#3b82f6;background:#eff6ff;color:#3b82f6}.ps-btn-icon{font-size:14px}.ps-btn-text{display:inline-block}.ps-close-all-compact{display:flex;align-items:center;gap:6px;padding:8px 12px;background:#fee2e2;border:none;cursor:pointer;color:#ef4444;font-size:12px;font-weight:600;transition:all .2s ease;border-radius:6px;white-space:nowrap;flex-shrink:0}.ps-close-all-compact:hover{background:#fecaca;color:#dc2626}.ps-content{flex:1;overflow-y:auto;background:#fff;padding:20px}.ps-tab-content{animation:slideIn .2s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.ps-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;color:#9ca3af}.ps-empty-icon{font-size:64px;opacity:.4}.ps-empty p{font-size:14px;margin:0;color:#9ca3af}.ps-placeholder{display:flex;align-items:center;justify-content:center;height:100%;font-size:18px;color:#9ca3af;font-weight:500}.ps-content::-webkit-scrollbar{width:8px}.ps-content::-webkit-scrollbar-track{background:transparent}.ps-content::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.ps-content::-webkit-scrollbar-thumb:hover{background:#a0aec0}@media(max-width:1024px){.ps-button-bar{height:52px;gap:8px}.ps-btn-with-label{padding:6px 10px;font-size:11px}.ps-btn-icon{font-size:13px}.ps-close-all-compact{padding:6px 10px;font-size:11px}}@media(max-width:768px){.ps-header-compact{height:44px;padding:0 12px}.ps-header-title{font-size:14px;gap:8px}.ps-header-icon{font-size:16px}.ps-button-bar{height:48px;padding:0 8px;gap:6px}.ps-btn-with-label{padding:6px 8px;font-size:10px;gap:6px}.ps-btn-icon{font-size:12px}.ps-close-all-compact{padding:6px 8px;font-size:10px}.ps-content{padding:16px}}@media(max-width:480px){.ps-header-compact{height:40px;padding:0 8px}.ps-header-title{font-size:12px;gap:6px}.ps-header-icon{font-size:14px}.ps-button-bar{height:44px;padding:0 6px;gap:4px}.ps-btn-with-label{padding:4px 6px;font-size:9px;gap:4px}.ps-btn-icon{font-size:11px}.ps-btn-text{display:none}.ps-close-all-compact{padding:4px 6px;font-size:9px}.ps-close-all-compact span{display:none}.ps-content{padding:12px}}.system-panel{flex:1;overflow:auto;background-color:#f9fafb;min-height:100%}.panel-content{padding:24px;width:100%;max-width:none}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;padding-bottom:16px;border-bottom:1px solid #e5e7eb}.panel-title{font-size:28px;font-weight:700;color:#111827;margin:0;line-height:1.2}.panel-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.placeholder-content{background-color:#fff;padding:48px 32px;border-radius:12px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;text-align:center;max-width:600px;margin:0 auto}.placeholder-icon{font-size:64px;margin-bottom:16px;opacity:.8}.placeholder-title{font-size:24px;font-weight:600;color:#374151;margin-bottom:8px}.placeholder-text{color:#6b7280;margin-bottom:32px;font-size:16px;line-height:1.5}.loading-skeleton{max-width:400px;margin:0 auto}.loading-bar{height:12px;background-color:#e5e7eb;border-radius:6px;margin-bottom:12px;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite;width:100%}.loading-bar.w-75{width:75%;margin-left:auto;margin-right:auto}.loading-bar.w-50{width:50%;margin-left:auto;margin-right:auto}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.content-card{background-color:#fff;padding:24px;border-radius:12px;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;margin-bottom:24px;transition:box-shadow .2s ease}.content-card:hover{box-shadow:0 4px 6px -1px #0000001a}.content-card h3{font-size:20px;font-weight:600;color:#111827;margin-bottom:16px;border-bottom:2px solid #f3f4f6;padding-bottom:8px}.content-grid{display:grid;gap:24px;margin-bottom:32px}.content-grid.two-column{grid-template-columns:repeat(auto-fit,minmax(400px,1fr))}.content-grid.three-column{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.content-grid.four-column{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}@media(max-width:768px){.panel-content{padding:16px}.panel-header{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:24px}.panel-title{font-size:24px}.panel-actions{width:100%;justify-content:flex-start}.placeholder-content{padding:32px 24px}.placeholder-icon{font-size:48px}.placeholder-title{font-size:20px}.content-grid{grid-template-columns:1fr}}@media(max-width:480px){.panel-content{padding:12px}.panel-header{margin-bottom:20px}.panel-title{font-size:20px}.panel-actions{flex-direction:column;width:100%}.panel-actions .btn-primary,.panel-actions .btn-secondary{width:100%;justify-content:center}.placeholder-content{padding:24px 16px}}.login-page{display:flex;height:100vh;background:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.login-left{flex:1;background:linear-gradient(135deg,#1a1a1a,#2d2d2d);color:#fff;display:flex;align-items:center;justify-content:center;padding:40px;position:relative;overflow:hidden}.login-left:before{content:"";position:absolute;top:-50%;right:-50%;width:500px;height:500px;background:radial-gradient(circle,rgba(255,255,255,.05) 0%,transparent 70%);border-radius:50%;pointer-events:none}.login-left-content{position:relative;z-index:2;max-width:500px;width:100%}.login-logo-section{display:flex;align-items:center;gap:16px;margin-bottom:60px}.logo-icon{width:60px;height:60px;background:#ffffff1a;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;border:2px solid rgba(255,255,255,.2)}.logo-icon svg{width:36px;height:36px}.logo-text{font-size:32px;font-weight:700;letter-spacing:-1px}.login-info{margin-bottom:60px}.login-info h2{font-size:28px;font-weight:600;margin-bottom:12px;line-height:1.3}.login-info p{font-size:16px;color:#ffffffb3;line-height:1.6}.login-features{display:flex;flex-direction:column;gap:24px;margin-bottom:60px}.feature-item{display:flex;gap:16px;align-items:flex-start}.feature-icon{width:48px;height:48px;background:#ffffff1a;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;border:1px solid rgba(255,255,255,.1)}.feature-icon svg{width:24px;height:24px}.feature-text h4{font-size:16px;font-weight:600;margin-bottom:4px}.feature-text p{font-size:14px;color:#fff9}.login-footer-left{text-align:center;padding-top:40px;border-top:1px solid rgba(255,255,255,.1)}.login-footer-left p{font-size:13px;color:#ffffff80}.login-right{flex:1;display:flex;align-items:center;justify-content:center;padding:40px;background:#fff}.login-container{width:100%;max-width:420px}.login-box{width:100%}.login-header{margin-bottom:40px;text-align:center}.login-header h1{font-size:28px;font-weight:700;color:#1a1a1a;margin-bottom:8px}.login-header p{font-size:14px;color:#666}.login-form{display:flex;flex-direction:column;gap:20px}.alert{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:8px;font-size:14px;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.alert-error{background:#fee;color:#c33;border:1px solid #fcc}.alert-error svg{flex-shrink:0}.alert-success{background:#efe;color:#3c3;border:1px solid #cfc}.alert-success svg{flex-shrink:0}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:600;color:#1a1a1a}.input-wrapper{position:relative;display:flex;align-items:center}.form-input{width:100%;padding:12px 16px 12px 44px;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;transition:all .3s ease;background:#fff;color:#1a1a1a}.form-input:focus{outline:none;border-color:#1a1a1a;box-shadow:0 0 0 3px #1a1a1a1a}.form-input:disabled{background:#f5f5f5;color:#999;cursor:not-allowed}.form-input::placeholder{color:#999}.input-icon{position:absolute;left:14px;color:#999;pointer-events:none}.password-toggle{position:absolute;right:12px;background:none;border:none;color:#666;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:color .2s ease}.password-toggle:hover:not(:disabled){color:#1a1a1a}.password-toggle:disabled{cursor:not-allowed;opacity:.5}.form-options{display:flex;justify-content:space-between;align-items:center;font-size:14px}.remember-me{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none}.remember-me input{width:18px;height:18px;cursor:pointer;accent-color:#1a1a1a}.remember-me span{color:#666}.forgot-password{color:#1a1a1a;text-decoration:none;font-weight:600;transition:color .2s ease}.forgot-password:hover{color:#666;text-decoration:underline}.login-btn{padding:12px 16px;background:#1a1a1a;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px}.login-btn:hover:not(:disabled){background:#333;box-shadow:0 4px 12px #1a1a1a26;transform:translateY(-2px)}.login-btn:active:not(:disabled){transform:translateY(0)}.login-btn:disabled{background:#ccc;cursor:not-allowed;opacity:.7}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.demo-section{margin-top:24px;padding-top:24px;border-top:1px solid #e0e0e0;text-align:center}.demo-section p{font-size:13px;color:#666;margin-bottom:12px}.demo-btn{padding:10px 16px;background:#f5f5f5;color:#1a1a1a;border:1px solid #e0e0e0;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;width:100%}.demo-btn:hover:not(:disabled){background:#efefef;border-color:#d0d0d0}.demo-btn:disabled{opacity:.5;cursor:not-allowed}.login-footer-right{margin-top:24px;text-align:center}.login-footer-right p{font-size:13px;color:#666}.login-footer-right a{color:#1a1a1a;text-decoration:none;font-weight:600;transition:color .2s ease}.login-footer-right a:hover{color:#666;text-decoration:underline}@media(max-width:1024px){.login-left{padding:30px}.login-left-content{max-width:400px}.login-info h2{font-size:24px}.login-features{gap:20px;margin-bottom:40px}}@media(max-width:768px){.login-page{flex-direction:column}.login-left{flex:0;min-height:300px;padding:40px 20px 30px;justify-content:flex-start}.login-left-content{max-width:100%}.login-logo-section{margin-bottom:30px}.logo-icon{width:50px;height:50px}.logo-text{font-size:28px}.login-info{margin-bottom:30px}.login-info h2{font-size:22px}.login-features{gap:16px;margin-bottom:30px}.login-footer-left{padding-top:30px}.login-right{flex:1;padding:40px 20px 30px;justify-content:flex-start}.login-container{max-width:100%}.login-header h1{font-size:24px}}@media(max-width:480px){.login-page{height:auto;min-height:100vh}.login-left{min-height:250px;padding:30px 20px 20px}.login-left-content{max-width:100%}.logo-icon{width:44px;height:44px}.logo-text{font-size:24px}.login-info h2{font-size:20px}.login-info p{font-size:14px}.login-features{gap:12px;margin-bottom:20px}.feature-item{gap:12px}.feature-icon{width:40px;height:40px}.feature-text h4{font-size:14px}.feature-text p{font-size:12px}.login-footer-left{padding-top:20px}.login-right{padding:30px 20px 20px}.login-header h1{font-size:22px}.login-header p{font-size:13px}.login-form{gap:16px}.form-input{padding:11px 14px 11px 40px;font-size:16px}.form-options{flex-direction:column;align-items:flex-start;gap:12px}.login-btn{padding:11px 14px;font-size:14px}.demo-section{margin-top:16px;padding-top:16px}}@media(prefers-color-scheme:dark){.login-page,.login-right{background:#1a1a1a}.login-header h1{color:#fff}.login-header p{color:#aaa}.form-group label{color:#fff}.form-input{background:#2d2d2d;color:#fff;border-color:#444}.form-input:focus{border-color:#fff;box-shadow:0 0 0 3px #ffffff1a}.form-input::placeholder{color:#666}.login-btn{background:#fff;color:#1a1a1a}.login-btn:hover:not(:disabled){background:#e0e0e0}.demo-btn{background:#2d2d2d;color:#fff;border-color:#444}.demo-btn:hover:not(:disabled){background:#333;border-color:#555}.forgot-password{color:#fff}.remember-me span,.login-footer-right p,.demo-section p{color:#aaa}}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f9fafb}.app{display:flex;flex-direction:column;width:100%;height:100vh;overflow:hidden}.app-container{display:flex;flex:1;overflow:hidden;position:relative}.main-content{flex:1;overflow-y:auto;overflow-x:hidden;background-color:#f9fafb;padding:24px}@media(max-width:1024px){.main-content{padding:16px}}@media(max-width:768px){.main-content{padding:12px}}@media(max-width:640px){.main-content{padding:8px}}.main-content::-webkit-scrollbar{width:8px}.main-content::-webkit-scrollbar-track{background:transparent}.main-content::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:4px}.main-content::-webkit-scrollbar-thumb:hover{background:#9ca3af}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}