@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";
:root{--brand-navy:#132d76;--brand-navy-dark:#0b1d4f;--brand-navy-light:#1e3f99;--brand-green:#39b54a;--brand-green-dark:#2d9a3c;--brand-gold:#f4b223;--brand-gold-dark:#d99e1e;--bg-primary:#f0f2f5;--bg-secondary:#fff;--bg-card:#fff;--text-primary:#1a1a2e;--text-secondary:#6b7280;--text-muted:#9ca3af;--border-color:#e5e7eb;--border-hover:#d1d5db;--status-active:#10b981;--status-inactive:#ef4444;--status-pending:#f59e0b;--status-info:#3b82f6;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:20px;--radius-full:9999px;--shadow-sm:0 1px 3px #0000000f;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 8px 30px #0000001a;--shadow-xl:0 20px 60px #00000026;--sidebar-width:260px;--sidebar-collapsed:72px;--topbar-height:64px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.35s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px;line-height:1.6}body{min-height:100vh}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:inherit;font-size:inherit;border:none}input,select,textarea{font-family:inherit;font-size:inherit}img{max-width:100%;display:block}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-md);transition:all var(--transition-fast);white-space:nowrap;padding:10px 20px;font-size:.875rem;font-weight:600;display:inline-flex}.btn-primary{background:linear-gradient(135deg,var(--brand-navy),var(--brand-navy-light));color:#fff;box-shadow:0 2px 8px #132d764d}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 16px #132d7666}.btn-success{background:linear-gradient(135deg,var(--brand-green),var(--brand-green-dark));color:#fff}.btn-success:hover{transform:translateY(-1px);box-shadow:0 4px 16px #39b54a4d}.btn-outline{color:var(--brand-navy);border:1.5px solid var(--border-color);background:0 0}.btn-outline:hover{border-color:var(--brand-navy);background:#132d760a}.btn-danger{color:#fff;background:linear-gradient(135deg,#ef4444,#dc2626)}.btn-sm{padding:6px 14px;font-size:.8rem}.btn-lg{padding:14px 28px;font-size:1rem}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.card{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);padding:var(--space-lg);transition:box-shadow var(--transition-normal)}.card:hover{box-shadow:var(--shadow-md)}.card-header{margin-bottom:var(--space-lg);justify-content:space-between;align-items:center;display:flex}.card-title{color:var(--text-primary);font-size:1.1rem;font-weight:700}.stat-card{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-color);padding:var(--space-md);align-items:center;gap:var(--space-sm);transition:all var(--transition-normal);min-width:0;display:flex;overflow:hidden}.stat-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.stat-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.stat-icon.navy{background:linear-gradient(135deg,var(--brand-navy),var(--brand-navy-light));color:#fff}.stat-icon.green{background:linear-gradient(135deg,var(--brand-green),#6dd688);color:#fff}.stat-icon.gold{background:linear-gradient(135deg,var(--brand-gold),#f7c94c);color:#fff}.stat-icon.blue{color:#fff;background:linear-gradient(135deg,#3b82f6,#60a5fa)}.stat-info{min-width:0;overflow:hidden}.stat-value{color:var(--text-primary);font-size:1.5rem;font-weight:800;line-height:1.2}.stat-label{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:.7rem;font-weight:500;overflow:hidden}.badge{border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:.03em;align-items:center;gap:4px;padding:3px 10px;font-size:.75rem;font-weight:600;display:inline-flex}.badge-active{color:#065f46;background:#d1fae5}.badge-inactive{color:#991b1b;background:#fee2e2}.badge-pending{color:#92400e;background:#fef3c7}.badge-info{color:#1e40af;background:#dbeafe}.badge-admin{color:#5b21b6;background:#ede9fe}.table-container{border-radius:var(--radius-lg);border:1px solid var(--border-color);background:var(--bg-card);overflow-x:auto}.data-table{border-collapse:collapse;width:100%}.data-table thead{background:var(--bg-primary);border-bottom:2px solid var(--border-color)}.data-table th{text-align:left;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;padding:12px 16px;font-size:.75rem;font-weight:700}.data-table td{border-bottom:1px solid var(--border-color);padding:14px 16px;font-size:.875rem}.data-table tbody tr{transition:background var(--transition-fast)}.data-table tbody tr:hover{background:#132d7605}.data-table tbody tr:last-child td{border-bottom:none}.pagination{padding:var(--space-md)var(--space-lg);color:var(--text-secondary);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-size:.85rem;display:flex}.pagination-buttons{gap:var(--space-sm);display:flex}.pagination-controls{gap:4px;display:flex}.pagination-perpage{color:var(--text-muted);align-items:center;gap:8px;font-size:12px;display:inline-flex}.pagination-perpage select{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-primary);padding:4px 8px;font-family:inherit;font-size:12px}.pagination-goto{color:var(--text-muted);align-items:center;gap:6px;font-size:12px;display:inline-flex}.pagination-goto input{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:var(--radius-sm);width:64px;color:var(--text-primary);padding:4px 8px;font-family:inherit;font-size:12px}.pagination-compact{padding:10px 14px}.pagination-btn{border-radius:var(--radius-sm);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;padding:6px 12px;font-size:13px}.pagination-btn:hover:not(:disabled){background:#132d760a;border-color:#132d7629}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.pagination-btn.active{color:var(--brand-navy);background:#132d761a;border-color:#132d7629}.input-group{flex-direction:column;gap:6px;display:flex}.input-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.03em;font-size:.8rem;font-weight:600}.input-field{border:1.5px solid var(--border-color);border-radius:var(--radius-md);transition:all var(--transition-fast);background:var(--bg-secondary);color:var(--text-primary);outline:none;padding:11px 14px;font-size:.9rem}.input-field:focus{border-color:var(--brand-navy);box-shadow:0 0 0 3px #132d761a}.input-field::placeholder{color:var(--text-muted)}.input-with-icon{position:relative}.input-with-icon .input-icon{color:var(--text-muted);pointer-events:none;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.input-with-icon .input-field{padding-left:42px}.search-bar{align-items:center;gap:var(--space-sm);width:100%;max-width:360px;display:flex}.page-header{margin-bottom:var(--space-lg);justify-content:space-between;align-items:center;gap:var(--space-md);flex-wrap:wrap;display:flex}.page-title{color:var(--text-primary);font-size:1.5rem;font-weight:800}.page-subtitle{color:var(--text-secondary);margin-top:2px;font-size:.9rem}.stats-grid{gap:var(--space-md);margin-bottom:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));display:grid}.spinner{border:3px solid var(--border-color);border-top-color:var(--brand-navy);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-center{justify-content:center;align-items:center;min-height:300px;display:flex}.empty-state{padding:var(--space-2xl);color:var(--text-muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:200px;display:flex}.empty-state svg{margin-bottom:var(--space-md);opacity:.4}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#00000026;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#00000040}