@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{--primary:#0284c7;--primary-dark:#0369a1;--primary-light:#0ea5e9;--accent:#38bdf8;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--bg:#f8fafc;--surface:#fff;--surface2:#f1f5f9;--border:#e2e8f0;--text:#0f172a;--text-muted:#64748b;--gradient:linear-gradient(135deg, #38bdf8 0%, #0284c7 100%);--card-glow:0 8px 30px #0ea5e914;--radius:12px;--sidebar-w:260px}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Inter,sans-serif;overflow-x:hidden}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.app-shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-w);background:var(--surface);border-right:1px solid var(--border);z-index:100;flex-direction:column;height:100vh;transition:transform .3s,width .3s;display:flex;position:fixed;top:0;left:0}.main-content{margin-left:var(--sidebar-w);background:var(--bg);flex:1;min-height:100vh;transition:margin-left .3s}.app-shell.sidebar-collapsed .main-content{margin-left:72px}.sidebar-logo{border-bottom:1px solid var(--border);align-items:center;height:70px;padding:0 20px;display:flex}.logo-badge{align-items:center;gap:10px;display:flex}.logo-icon{background:var(--gradient);border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:flex;box-shadow:0 4px 15px #0284c740}.logo-text{flex-direction:column;justify-content:center;display:flex}.logo-text h2{color:var(--text);font-size:15px;font-weight:700;line-height:1.2}.logo-text span{color:var(--primary-light);margin-top:2px;font-size:11px;font-weight:500;line-height:1.2}.sidebar-nav{flex:1;padding:16px 12px;overflow-y:auto}.nav-section-title{color:var(--text-muted);letter-spacing:1.2px;text-transform:uppercase;padding:12px 8px 6px;font-size:10px;font-weight:600}.nav-item{cursor:pointer;color:var(--text-muted);border-radius:10px;align-items:center;gap:10px;margin-bottom:2px;padding:10px 12px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.nav-item:hover{color:var(--text);background:#0284c70f}.nav-item.active{color:var(--primary);background:#0284c714;border:1px solid #0284c71f}.nav-item .icon{text-align:center;width:20px;font-size:17px}.sidebar-footer{border-top:1px solid var(--border);padding:16px 12px}.sidebar.collapsed{width:72px}.sidebar.collapsed .sidebar-logo{flex-direction:column!important;justify-content:center!important;gap:10px!important;height:100px!important;padding:15px 0!important}.sidebar.collapsed .logo-badge{gap:0!important}.sidebar.collapsed .logo-text,.sidebar.collapsed .nav-section-title,.sidebar.collapsed .nav-item-text,.sidebar.collapsed .user-details,.sidebar.collapsed .logout-text{display:none!important}.sidebar.collapsed .nav-item{justify-content:center!important;padding:10px 0!important}.sidebar.collapsed .sidebar-footer{padding:16px 6px!important}.sidebar.collapsed .sidebar-footer>div{justify-content:center!important;gap:0!important}.sidebar.collapsed .sidebar-footer button{justify-content:center!important;gap:0!important;padding:10px 0!important}.topbar{background:var(--surface);border-bottom:1px solid var(--border);z-index:50;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);justify-content:space-between;align-items:center;height:70px;padding:0 28px;display:flex;position:sticky;top:0}.topbar-left h1{font-size:20px;font-weight:700}.topbar-left p{color:var(--text-muted);margin-top:2px;font-size:13px}.topbar-right{align-items:center;gap:12px;display:flex}.avatar-btn{background:var(--gradient);cursor:pointer;color:#fff;border:none;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;font-size:14px;font-weight:700;display:flex}.page-body{padding:24px 28px}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-bottom:28px;display:grid}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #00000005,0 2px 4px -1px #00000005,0 0 0 1px #00000003}.stat-card:hover{box-shadow:var(--card-glow);transform:translateY(-3px)}.stat-card:before{content:"";opacity:.08;border-radius:50%;width:80px;height:80px;position:absolute;top:0;right:0}.stat-card.indigo:before{background:var(--primary)}.stat-card.cyan:before{background:var(--accent)}.stat-card.green:before{background:var(--success)}.stat-card.amber:before{background:var(--warning)}.stat-card.red:before{background:var(--danger)}.stat-icon{border-radius:12px;justify-content:center;align-items:center;width:44px;height:44px;margin-bottom:14px;font-size:20px;display:flex}.stat-card.indigo .stat-icon{background:#6366f126}.stat-card.cyan .stat-icon{background:#06b6d426}.stat-card.green .stat-icon{background:#10b98126}.stat-card.amber .stat-icon{background:#f59e0b26}.stat-card.red .stat-icon{background:#ef444426}.stat-value{font-size:32px;font-weight:800;line-height:1}.stat-label{color:var(--text-muted);margin-top:4px;font-size:13px}.stat-change{margin-top:8px;font-size:12px}.stat-change.up{color:var(--success)}.stat-change.down{color:var(--danger)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:0 4px 6px -1px #00000005,0 2px 4px -1px #00000005,0 0 0 1px #00000003}.card-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.card-header h3{font-size:15px;font-weight:600}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%}th{text-align:left;color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;border-bottom:1px solid var(--border);background:var(--surface2);padding:12px 16px;font-size:11px;font-weight:600}td{border-bottom:1px solid var(--border);vertical-align:middle;padding:14px 16px;font-size:14px}tr:hover td{background:#0284c708}.badge{text-transform:uppercase;letter-spacing:.5px;border-radius:20px;align-items:center;padding:3px 10px;font-size:11px;font-weight:600;display:inline-flex}.badge-success{color:#047857;background:#10b9811f}.badge-warning{color:#b45309;background:#f59e0b1f}.badge-danger{color:#b91c1c;background:#ef44441f}.badge-primary{color:#0369a1;background:#0284c71f}.badge-cyan{color:#0f766e;background:#06b6d41f}.btn{cursor:pointer;border:none;border-radius:10px;align-items:center;gap:6px;padding:9px 18px;font-size:13px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--gradient);color:#fff;box-shadow:0 4px 15px #0284c740}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #0284c759}.btn-ghost{color:var(--text-muted);border:1px solid var(--border);background:0 0}.btn-ghost:hover{background:var(--surface2);color:var(--text)}.btn-danger-outline{color:var(--danger);background:0 0;border:1px solid #ef44444d}.btn-danger-outline:hover{background:#ef44441a}.btn-success-outline{color:var(--success);background:0 0;border:1px solid #10b9814d}.btn-success-outline:hover{background:#10b9811a}.btn-sm{padding:6px 12px;font-size:12px}.form-group{margin-bottom:18px}label{color:var(--text-muted);margin-bottom:6px;font-size:13px;font-weight:500;display:block}input,select,textarea{background:var(--surface);border:1px solid var(--border);width:100%;color:var(--text);border-radius:10px;outline:none;padding:10px 14px;font-family:inherit;font-size:14px;transition:all .2s}input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #0284c726}select option{background:var(--surface2)}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0f172a66;justify-content:center;align-items:center;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border);-ms-overflow-style:none;scrollbar-width:none;border-radius:18px;width:100%;max-width:520px;max-height:90vh;padding:28px;animation:.2s slideUp;overflow-y:auto;box-shadow:0 20px 25px -5px #0000000d,0 10px 10px -5px #00000005}.modal::-webkit-scrollbar{display:none}.modal h2{margin-bottom:20px;font-size:18px;font-weight:700}.modal-footer{justify-content:flex-end;gap:10px;margin-top:24px;display:flex}.search-bar{background:var(--surface2);border:1px solid var(--border);border-radius:10px;align-items:center;gap:10px;min-width:240px;padding:8px 14px;display:flex}.search-bar input{color:var(--text);background:0 0;border:none;padding:0;font-size:14px}.search-bar input:focus{box-shadow:none}.login-page{background:var(--bg);justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:hidden}.login-page:before{content:"";background:radial-gradient(circle,#0284c71a 0%,#0000 70%);border-radius:50%;width:600px;height:600px;position:absolute;top:-200px;left:-200px}.login-page:after{content:"";background:radial-gradient(circle,#0ea5e90d 0%,#0000 70%);border-radius:50%;width:500px;height:500px;position:absolute;bottom:-200px;right:-200px}.login-card{background:var(--surface);border:1px solid var(--border);z-index:1;border-radius:22px;width:420px;padding:44px 40px;position:relative;box-shadow:0 20px 40px #0f172a0f}.login-logo{text-align:center;margin-bottom:30px}.login-logo .icon{background:var(--gradient);border-radius:16px;justify-content:center;align-items:center;width:60px;height:60px;margin:0 auto 12px;font-size:26px;display:flex;box-shadow:0 8px 30px #0284c733}.login-logo h1{font-size:22px;font-weight:800}.login-logo p{color:var(--text-muted);margin-top:4px;font-size:13px}.login-btn{background:var(--gradient);color:#fff;cursor:pointer;border:none;border-radius:12px;width:100%;margin-top:8px;padding:13px;font-size:15px;font-weight:700;transition:all .2s;box-shadow:0 4px 20px #0284c733}.login-btn:hover{transform:translateY(-2px);box-shadow:0 8px 30px #0284c74d}.login-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.error-msg{color:#dc2626;background:#ef44440f;border:1px solid #ef444433;border-radius:10px;margin-bottom:16px;padding:10px 14px;font-size:13px}.alert{border-radius:10px;margin-bottom:16px;padding:12px 16px;font-size:13px}.alert-success{color:#047857;background:#10b9810f;border:1px solid #10b98133}.alert-error{color:#dc2626;background:#ef44440f;border:1px solid #ef444433}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}.loader-center{justify-content:center;align-items:center;padding:80px;display:flex}.charts-grid{grid-template-columns:1fr 1fr;gap:18px;margin-bottom:24px;display:grid}.mobile-menu-btn{display:none}@media (width<=900px){.charts-grid{grid-template-columns:1fr}.sidebar{transition:transform .3s cubic-bezier(.4,0,.2,1);transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:95;background:#0f172a66;animation:.2s ease-out fadeIn;position:fixed;inset:0}.main-content{margin-left:0;overflow-x:hidden}.topbar{padding-left:70px}.mobile-menu-btn{background:var(--surface);border:1px solid var(--border);width:38px;height:38px;color:var(--text);cursor:pointer;z-index:90;border-radius:10px;justify-content:center;align-items:center;font-size:20px;transition:all .2s;display:flex;position:fixed;top:18px;left:18px;box-shadow:0 2px 8px #0000000d}.mobile-menu-btn:hover{background:var(--surface2)}.sidebar.collapsed{width:var(--sidebar-w)!important}.sidebar.collapsed .sidebar-logo{flex-direction:row!important;justify-content:space-between!important;gap:0!important;height:70px!important;padding:0 20px!important}.sidebar.collapsed .logo-badge{gap:10px!important}.sidebar.collapsed .logo-text,.sidebar.collapsed .nav-section-title,.sidebar.collapsed .nav-item-text,.sidebar.collapsed .user-details,.sidebar.collapsed .logout-text{display:block!important}.sidebar.collapsed .nav-item{justify-content:flex-start!important;padding:10px 12px!important}.sidebar.collapsed .sidebar-footer{padding:16px 12px!important}.sidebar.collapsed .sidebar-footer>div{justify-content:flex-start!important;gap:10px!important}.sidebar.collapsed .sidebar-footer button{justify-content:center!important;gap:6px!important;padding:10px 12px!important}.sidebar-toggle-btn{display:none!important}}@media (width<=600px){.topbar{flex-direction:column;align-items:flex-start;gap:12px;padding:16px 16px 16px 70px}.topbar-right{width:100%}.topbar-right .btn{justify-content:center;width:100%}.page-body{padding:16px}.stat-grid{grid-template-columns:1fr}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse{animation:2s infinite pulse}.empty-state{text-align:center;color:var(--text-muted);padding:60px 20px}.empty-state .icon{margin-bottom:16px;font-size:48px}.empty-state h3{margin-bottom:6px;font-size:16px;font-weight:600}.empty-state p{font-size:14px}.pagination{border-top:1px solid var(--border);align-items:center;gap:6px;padding:16px 20px;display:flex}.pagination button{border:1px solid var(--border);width:34px;height:34px;color:var(--text);cursor:pointer;background:0 0;border-radius:8px;font-size:13px;transition:all .2s}.pagination button.active{background:var(--primary);border-color:var(--primary)}.pagination button:hover:not(.active){background:var(--surface2)}.divider{background:var(--border);height:1px;margin:20px 0}.grid-2{grid-template-columns:1fr 1fr;gap:16px;display:grid}.flex{display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.flex-center{justify-content:center;align-items:center;display:flex}.gap-2{gap:8px}.gap-3{gap:12px}.mt-4{margin-top:16px}.mb-4{margin-bottom:16px}.text-muted{color:var(--text-muted);font-size:13px}body.dark-theme{--primary:#6366f1;--primary-dark:#4f46e5;--primary-light:#818cf8;--accent:#06b6d4;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--bg:#0f0f1a;--surface:#1a1a2e;--surface2:#232340;--border:#6366f12e;--text:#f0f0ff;--text-muted:#8b8baa;--gradient:linear-gradient(135deg, #6366f1 0%, #06b6d4 100%);--card-glow:0 0 40px #6366f11f}body.dark-theme ::-webkit-scrollbar-track{background:var(--surface)}body.dark-theme ::-webkit-scrollbar-thumb{background:var(--primary)}body.dark-theme .logo-icon{box-shadow:0 4px 15px #6366f166}body.dark-theme .nav-item:hover{color:var(--text);background:#6366f11f}body.dark-theme .nav-item.active{color:var(--primary-light);background:linear-gradient(135deg,#6366f140,#06b6d426);border:1px solid #6366f140}body.dark-theme .stat-card,body.dark-theme .card{box-shadow:none}body.dark-theme td{border-bottom:1px solid #6366f114}body.dark-theme tr:hover td{background:#6366f10a}body.dark-theme .badge-success{color:#10b981;background:#10b98126}body.dark-theme .badge-warning{color:#f59e0b;background:#f59e0b26}body.dark-theme .badge-danger{color:#ef4444;background:#ef444426}body.dark-theme .badge-primary{color:#818cf8;background:#6366f126}body.dark-theme .badge-cyan{color:#06b6d4;background:#06b6d426}body.dark-theme .btn-primary{box-shadow:0 4px 15px #6366f14d}body.dark-theme .btn-primary:hover{box-shadow:0 6px 20px #6366f166}body.dark-theme input,body.dark-theme select,body.dark-theme textarea{background:var(--surface2)}body.dark-theme input:focus,body.dark-theme select:focus,body.dark-theme textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #6366f11a}body.dark-theme .modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000b3}body.dark-theme .modal{box-shadow:none}body.dark-theme .login-page:before{background:radial-gradient(circle,#6366f126 0%,#0000 70%)}body.dark-theme .login-page:after{background:radial-gradient(circle,#06b6d41a 0%,#0000 70%)}body.dark-theme .login-card{box-shadow:0 20px 60px #00000080}body.dark-theme .login-logo .icon{box-shadow:0 8px 30px #6366f166}body.dark-theme .login-btn{box-shadow:0 4px 20px #6366f159}body.dark-theme .login-btn:hover{box-shadow:0 8px 30px #6366f173}body.dark-theme .error-msg{color:#fca5a5;background:#ef44441f;border:1px solid #ef44444d}body.dark-theme .alert-success{color:#6ee7b7;background:#10b9811f;border:1px solid #10b9814d}body.dark-theme .alert-error{color:#fca5a5;background:#ef44441f;border:1px solid #ef44444d}.page-header{margin-bottom:24px}.page-header h1{color:var(--text);letter-spacing:-.025em;font-size:24px;font-weight:800}.page-header p{color:var(--text-muted);margin-top:4px;font-size:13px}