@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-dark: #0f1115;--bg-panel: #16181d;--bg-hover: #1c1f26;--text-main: #e2e8f0;--text-muted: #94a3b8;--accent: #8b5cf6;--accent-hover: #a78bfa;--accent-bg: rgba(139, 92, 246, .1);--accent-border: rgba(139, 92, 246, .25);--red: #ef4444;--green: #10b981;--yellow: #f59e0b;--border: #272a31;--radius-sm: 6px;--radius-md: 10px}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}body{background:var(--bg-dark);color:var(--text-main);overflow:hidden}.vp-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:12px;color:var(--text-muted)}.spinner{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.vp-container{display:flex;height:100vh}.vp-sidebar{width:260px;background:var(--bg-panel);border-right:1px solid var(--border);display:flex;flex-direction:column}.vp-sidebar-header{height:64px;padding:0 20px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--border)}.vp-logo-ring{width:24px;height:24px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px #8b5cf666}.vp-sidebar-header h2{font-size:16px;font-weight:700}.vp-vendor-info{padding:20px;border-bottom:1px solid var(--border)}.vp-vendor-info h3{font-size:15px;margin-bottom:6px}.vp-badge{font-size:11px;padding:2px 8px;border-radius:100px;font-weight:600;background:var(--accent-bg);color:var(--accent-hover);border:1px solid var(--accent-border)}.vp-nav{flex:1;padding:16px;display:flex;flex-direction:column;gap:4px}.vp-nav-item{background:none;border:none;width:100%;text-align:left;padding:10px 12px;border-radius:var(--radius-sm);color:var(--text-muted);font-size:14px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .2s}.vp-nav-item:hover{background:var(--bg-hover);color:var(--text-main)}.vp-nav-item.active{background:var(--accent-bg);color:var(--accent-hover)}.vp-sidebar-stats{padding:16px;border-top:1px solid var(--border);display:flex;gap:8px}.vp-stat{flex:1;text-align:center;padding:12px 8px;background:var(--bg-hover);border-radius:var(--radius-sm)}.vp-stat span{display:block;font-size:11px;color:var(--text-muted);margin-bottom:4px}.vp-stat strong{font-size:18px}.vp-main{flex:1;display:flex;flex-direction:column;min-width:0}.vp-topbar{border-bottom:1px solid var(--border);padding:16px 32px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.vp-topbar h1{font-size:20px;font-weight:600}.vp-subtitle{font-size:13px;color:var(--text-muted);margin-top:4px}.vp-content{flex:1;overflow-y:auto;padding:24px 32px}.vp-btn{border:none;padding:8px 16px;border-radius:var(--radius-sm);font-weight:500;cursor:pointer;font-size:13px;display:inline-flex;align-items:center;gap:6px;transition:all .2s}.vp-btn.primary{background:var(--accent);color:#fff}.vp-btn.primary:hover:not(:disabled){background:var(--accent-hover)}.vp-btn.primary:disabled{opacity:.5;cursor:not-allowed}.vp-toast{margin:12px 32px 0;padding:10px 16px;background:#10b9811a;border:1px solid rgba(16,185,129,.3);border-radius:var(--radius-sm);color:#34d399;font-size:13px;font-weight:500;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translateY(-8px);opacity:0}}.vp-alert{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:var(--radius-sm);margin:16px 32px 0;font-size:13px}.vp-alert.warning{background:#f59e0b1a;border:1px solid rgba(245,158,11,.25);color:#fbbf24}.vp-toggle{padding:4px 12px;border-radius:100px;font-size:12px;font-weight:600;cursor:pointer;border:none}.vp-toggle.on{background:#10b98126;color:#34d399}.vp-toggle.off{background:#ef444426;color:#f87171}.vp-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 24px;text-align:center;color:var(--text-muted)}.vp-empty h3{color:var(--text-main);margin:12px 0 4px}.vp-empty p{max-width:340px;font-size:14px}.vp-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:24px}.vp-stat-card{padding:20px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center}.vp-stat-card span{display:block;font-size:12px;color:var(--text-muted);margin-bottom:8px}.vp-stat-card strong{font-size:24px}.vp-stock-table{border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.vp-table-header{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr 100px;padding:12px 16px;background:var(--bg-panel);font-size:12px;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border)}.vp-stock-row{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr 100px;padding:14px 16px;align-items:center;border-bottom:1px solid var(--border);transition:background .15s}.vp-stock-row:last-child{border-bottom:none}.vp-stock-row:hover{background:var(--bg-hover)}.vp-stock-row.edited{background:#8b5cf60d;border-left:3px solid var(--accent)}.vp-stock-row.low-stock{border-left:3px solid var(--yellow)}.vp-col-name strong{display:block;font-size:14px}.vp-item-desc{display:block;font-size:12px;color:var(--text-muted);margin-top:2px}.vp-col-cat{font-size:13px;color:var(--text-muted)}.vp-col-price{font-size:13px}.vp-col-qty{display:flex;align-items:center;gap:8px}.vp-qty-controls{display:inline-flex;align-items:center;gap:0;background:var(--bg-hover);border:1px solid var(--border);border-radius:var(--radius-sm)}.vp-qty-controls button{background:none;border:none;color:var(--text-main);cursor:pointer;padding:6px 10px;display:flex;align-items:center}.vp-qty-controls button:hover{background:var(--accent-bg);color:var(--accent-hover)}.vp-qty-controls button:disabled{opacity:.3;cursor:not-allowed}.vp-qty-controls input{width:50px;text-align:center;background:transparent;border:none;color:#fff;font-size:14px;font-weight:600;border-left:1px solid var(--border);border-right:1px solid var(--border);padding:6px 0}.vp-qty-controls input:focus{outline:none}.vp-low-badge{font-size:10px;padding:2px 6px;border-radius:100px;background:#f59e0b26;color:var(--yellow);font-weight:600}
