*{margin:0;padding:0;box-sizing:border-box}:root{--font-sans: "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--primary: #4F46E5;--primary-hover: #4338CA;--primary-light: #EEF2FF;--primary-gradient: linear-gradient(135deg, #4F46E5 0%, #6366F1 50%, #7C3AED 100%);--success: #10B981;--success-light: #ECFDF5;--warning: #F59E0B;--warning-light: #FFFBEB;--danger: #EF4444;--danger-light: #FEF2F2;--info: #06B6D4;--info-light: #ECFEFF;--purple: #8B5CF6;--purple-light: #F5F3FF;--bg: #F4F6FA;--card: #FFFFFF;--border: #E2E8F0;--border-light: #F1F5F9;--text: #0F172A;--text-muted: #64748B;--text-sub: #94A3B8;--sidebar-w: 260px;--shadow-sm: 0 2px 8px rgba(15, 23, 42, .03);--shadow-md: 0 8px 24px -4px rgba(15, 23, 42, .05);--shadow-lg: 0 20px 40px -8px rgba(15, 23, 42, .08)}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#94a3b8}.layout{display:flex;height:100vh;overflow:hidden;background:var(--bg)}.main{flex:1;display:flex;flex-direction:column;overflow:hidden}.content{flex:1;overflow-y:auto;padding:24px 32px 40px}.sidebar{width:var(--sidebar-w);background:var(--card);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:24px 18px;gap:6px;flex-shrink:0;z-index:50;box-shadow:var(--shadow-sm)}.sidebar-brand{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 20px;border-bottom:1px solid var(--border-light);margin-bottom:16px}.brand-icon{width:42px;height:42px;background:var(--primary-gradient);border-radius:14px;display:grid;place-items:center;color:#fff;box-shadow:0 4px 14px #4f46e559}.brand-title{font-size:17px;font-weight:800;color:var(--text);letter-spacing:-.4px}.brand-sub{font-size:10px;font-weight:700;color:var(--text-muted);letter-spacing:.6px;text-transform:uppercase}.nav-section-title{font-size:10px;font-weight:800;color:var(--text-sub);text-transform:uppercase;letter-spacing:.8px;padding:12px 14px 6px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);border:none;background:none;width:100%;text-align:left;font-size:13.5px;font-weight:600;color:var(--text-muted);font-family:var(--font-sans)}.nav-item:hover{background:#f8fafc;color:var(--text);transform:translate(2px)}.nav-item.active{background:var(--primary);color:#fff;font-weight:700;box-shadow:0 6px 18px #4f46e547}.nav-item.active svg{stroke:#fff}.sidebar-footer{margin-top:auto;padding-top:16px;border-top:1px solid var(--border-light);display:flex;flex-direction:column;gap:12px}.admin-card{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bg);border-radius:14px;border:1px solid var(--border)}.admin-info{display:flex;align-items:center;gap:10px}.avatar-img{width:36px;height:36px;border-radius:50%;background:var(--primary-light);color:var(--primary);display:grid;place-items:center;font-weight:800;font-size:14px;border:2px solid #FFFFFF;box-shadow:var(--shadow-sm);flex-shrink:0}.admin-name{font-size:13px;font-weight:800;color:var(--text)}.admin-role{font-size:10px;color:var(--primary);font-weight:700;text-transform:uppercase;letter-spacing:.5px}.topbar{height:72px;background:var(--card);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 32px;flex-shrink:0;box-shadow:var(--shadow-sm)}.topbar-left{display:flex;align-items:center;gap:16px}.greeting-title{font-size:18px;font-weight:800;letter-spacing:-.4px;color:var(--text)}.greeting-sub{font-size:12px;color:var(--text-muted);font-weight:500}.topbar-center{flex:1;max-width:420px;margin:0 24px}.search-pill-bar{display:flex;align-items:center;gap:10px;padding:0 16px;height:42px;border:1px solid var(--border);border-radius:9999px;background:var(--bg);transition:all .2s}.search-pill-bar:focus-within{border-color:var(--primary);background:#fff;box-shadow:0 0 0 3px #4f46e51f}.search-pill-bar input{border:none;background:none;outline:none;font-size:13px;font-weight:500;width:100%;color:var(--text);font-family:var(--font-sans)}.search-pill-bar input::placeholder{color:var(--text-sub)}.topbar-actions{display:flex;align-items:center;gap:12px}.date-pill-badge{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:9999px;background:#eff6ff;border:1px solid #DBEAFE;font-size:12px;font-weight:700;color:#1d4ed8}.sync-status-badge{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:9999px;background:#10b9811a;border:1px solid rgba(16,185,129,.25);font-size:11px;font-weight:700;color:var(--success)}.sync-dot{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 8px var(--success)}.topbar-icon-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--border);background:var(--card);cursor:pointer;display:grid;place-items:center;transition:all .2s;color:var(--text-muted);position:relative}.topbar-icon-btn:hover{background:var(--bg);color:var(--text);border-color:#cbd5e1}.notification-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--danger);border:2px solid #FFFFFF}.compact-kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:20px}.kpi-card-compact{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:14px 16px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow-sm);transition:all .2s}.kpi-card-compact:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:#cbd5e1}.kpi-compact-icon-box{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex-shrink:0}.kpi-compact-label{font-size:10px;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.kpi-compact-val{font-size:16px;font-weight:800;color:var(--text);letter-spacing:-.4px;margin-top:1px}.kpi-compact-sub{font-size:10px;color:var(--text-sub);margin-top:1px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:1400px){.compact-kpi-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:768px){.compact-kpi-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.compact-kpi-grid{grid-template-columns:1fr}}.hero-card-primary{background:var(--primary-gradient);border-radius:24px;padding:24px;color:#fff;position:relative;overflow:hidden;box-shadow:0 12px 30px -5px #4f46e559;display:flex;flex-direction:column;justify-content:space-between}.hero-card-primary:after{content:"";position:absolute;top:-40px;right:-40px;width:160px;height:160px;border-radius:50%;background:#ffffff1a;pointer-events:none}.hero-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.hero-card-label{font-size:13px;font-weight:700;color:#fffc;text-transform:uppercase;letter-spacing:.5px}.hero-card-action-btn{width:36px;height:36px;border-radius:50%;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.3);color:#fff;display:grid;place-items:center;cursor:pointer;transition:all .2s}.hero-card-action-btn:hover{background:#ffffff59;transform:scale(1.05)}.hero-card-val{font-size:28px;font-weight:800;letter-spacing:-.8px;margin-bottom:10px}.hero-card-footer{display:flex;align-items:center;gap:10px}.trend-badge-green{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:9999px;background:#22c55e40;color:#86efac;font-size:11px;font-weight:800}.trend-badge-red{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:9999px;background:#ef444433;color:#fca5a5;font-size:11px;font-weight:800}.hero-sub-text{font-size:12px;color:#ffffffbf;font-weight:500}.kpi-card-white{background:var(--card);border:1px solid var(--border);border-radius:24px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow-sm);transition:all .2s}.kpi-card-white:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:#cbd5e1}.kpi-card-white-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.kpi-card-white-title{font-size:13px;font-weight:700;color:var(--text-muted)}.kpi-card-white-val{font-size:24px;font-weight:800;color:var(--text);letter-spacing:-.5px;margin-bottom:8px}.kpi-card-white-footer{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-sub)}.badge-pill-green{background:var(--success-light);color:#059669;padding:3px 8px;border-radius:9999px;font-size:11px;font-weight:800;display:inline-flex;align-items:center;gap:3px}.badge-pill-red{background:var(--danger-light);color:#dc2626;padding:3px 8px;border-radius:9999px;font-size:11px;font-weight:800;display:inline-flex;align-items:center;gap:3px}.charts-grid{display:grid;grid-template-columns:1.8fr 1fr;gap:20px;margin-bottom:24px}.card-modern{background:var(--card);border:1px solid var(--border);border-radius:24px;padding:24px;box-shadow:var(--shadow-sm);margin-bottom:24px}.card-header-modern{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.card-title-modern{font-size:16px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:10px;letter-spacing:-.3px}.card-sub-modern{font-size:12px;color:var(--text-muted);font-weight:500;margin-top:2px}.dashboard-main-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:20px;align-items:start}.dashboard-col-main,.dashboard-col-side{display:flex;flex-direction:column;gap:20px}.health-list-compact{display:flex;flex-direction:column;gap:10px}.health-item-compact{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:16px;background:var(--bg);border:1px solid var(--border);cursor:pointer;transition:all .2s}.health-item-compact:hover{transform:translate(2px);background:#fff;box-shadow:var(--shadow-sm);border-color:#cbd5e1}.status-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.status-card{border-radius:20px;padding:20px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid transparent;transition:all .2s}.status-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.status-card-blue{background:#eef2ff;border-color:#c7d2fe;color:#3730a3}.status-card-orange{background:#fff7ed;border-color:#ffedd5;color:#9a3412}.status-card-yellow{background:#fefce8;border-color:#fef08a;color:#854d0e}.status-card-green{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.status-card-label{font-size:12px;font-weight:700;opacity:.9;margin-bottom:8px}.status-card-val-row{display:flex;align-items:baseline;justify-content:space-between}.status-card-val{font-size:26px;font-weight:800;letter-spacing:-.5px}.status-card-sub{font-size:11px;opacity:.8;font-weight:600;margin-top:6px}.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}.table-search-box{display:flex;align-items:center;gap:10px;padding:0 16px;height:42px;border:1px solid var(--border);border-radius:12px;background:var(--bg);flex:1;min-width:260px;transition:all .2s}.table-search-box:focus-within{border-color:var(--primary);background:#fff}.table-search-box input{border:none;background:none;outline:none;font-size:13px;font-weight:600;width:100%;color:var(--text);font-family:var(--font-sans)}.filter-chips-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.chip-btn{padding:6px 14px;border-radius:9999px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:12px;font-weight:700;color:var(--text-muted);transition:all .15s;font-family:var(--font-sans)}.chip-btn:hover{background:var(--bg);color:var(--text)}.chip-btn.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 4px 12px #4f46e540}.table-wrap-modern{overflow-x:auto;border:1px solid var(--border);border-radius:16px;background:var(--card)}.table-modern{width:100%;border-collapse:collapse;font-size:13px;text-align:left}.table-modern thead th{padding:14px 18px;font-size:11px;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px;background:#f8fafc;border-bottom:1px solid var(--border);white-space:nowrap}.table-modern tbody td{padding:14px 18px;border-bottom:1px solid var(--border-light);vertical-align:middle;color:var(--text)}.table-modern tbody tr:last-child td{border-bottom:none}.table-modern tbody tr:hover{background:#f8fafc}.user-cell{display:flex;align-items:center;gap:12px}.user-avatar-circle{width:36px;height:36px;border-radius:50%;background:var(--primary-light);color:var(--primary);display:grid;place-items:center;font-weight:800;font-size:13px;flex-shrink:0}.user-cell-name{font-weight:800;font-size:13px;color:var(--text)}.user-cell-sub{font-size:11px;color:var(--text-muted);font-weight:500}.status-pill-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:9999px;font-size:11px;font-weight:800;text-transform:capitalize}.status-pill-badge.active{background:#ecfdf5;color:#059669;border:1px solid #A7F3D0}.status-pill-badge.pending{background:#fffbeb;color:#d97706;border:1px solid #FDE68A}.status-pill-badge.inactive{background:#f1f5f9;color:#64748b;border:1px solid #CBD5E1}.status-pill-badge.rejected{background:#fef2f2;color:#dc2626;border:1px solid #FECACA}.btn-modern{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:12px;border:none;cursor:pointer;font-size:13px;font-weight:700;transition:all .2s;font-family:var(--font-sans)}.btn-primary-modern{background:var(--primary);color:#fff;box-shadow:0 4px 14px #4f46e54d}.btn-primary-modern:hover{background:var(--primary-hover);transform:translateY(-1px)}.btn-secondary-modern{background:var(--bg);border:1px solid var(--border);color:var(--text)}.btn-secondary-modern:hover{background:#e2e8f0}.btn-danger-modern{background:#fef2f2;border:1px solid #FECACA;color:var(--danger)}.btn-danger-modern:hover{background:#fee2e2}.btn-icon-modern{width:38px;height:38px;border-radius:10px;border:1px solid var(--border);background:var(--card);display:grid;place-items:center;cursor:pointer;color:var(--text-muted);transition:all .15s}.btn-icon-modern:hover{background:var(--bg);color:var(--text)}.health-metrics-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:24px}.health-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:18px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:14px}.health-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:#cbd5e1}.health-icon-box{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:20px;flex-shrink:0}.modal-backdrop-modern{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a80;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:200;padding:24px;animation:fadeIn .2s ease-out}.modal-modern{background:var(--card);border-radius:24px;width:100%;max-width:580px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-lg);border:1px solid var(--border);animation:slideUp .25s cubic-bezier(.16,1,.3,1)}.modal-header-modern{padding:20px 24px;background:var(--primary-gradient);color:#fff;font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:space-between}.modal-body-modern{padding:24px;display:flex;flex-direction:column;gap:18px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.sidebar-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a66;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:40}.burger-btn{display:none;background:none;border:1px solid var(--border);width:40px;height:40px;border-radius:10px;cursor:pointer;align-items:center;justify-content:center;color:var(--text)}.sidebar-close-btn{display:none;background:none;border:none;color:var(--text-muted);cursor:pointer}@media(max-width:1280px){.hero-kpi-grid{grid-template-columns:1fr 1fr}.charts-grid{grid-template-columns:1fr}.health-metrics-grid{grid-template-columns:repeat(3,1fr)}.status-summary-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:900px){.sidebar{position:fixed;top:0;left:0;bottom:0;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.sidebar.open{transform:translate(0)}.burger-btn,.sidebar-close-btn{display:flex}.topbar{padding:0 16px}.content{padding:16px}.topbar-center{display:none}}@media(max-width:640px){.hero-kpi-grid,.health-metrics-grid,.status-summary-grid{grid-template-columns:1fr}}