:root {
    --vz-primary: #1b6ec2;
    --vz-primary-dark: #155a9c;
    --vz-sidebar-bg: #0f1b2d;
    --vz-sidebar-fg: #c7d2e0;
    --vz-sidebar-active: #1b6ec2;
}

body { font-size: .925rem; }

/* ---------- Layout ---------- */
.vz-shell { display: flex; min-height: 100vh; }
.vz-sidebar {
    width: 250px; background: var(--vz-sidebar-bg); color: var(--vz-sidebar-fg);
    position: fixed; top: 0; bottom: 0; left: 0; overflow-y: auto; z-index: 1030;
    transition: transform .2s ease;
}
.vz-sidebar .brand {
    padding: 1rem 1.25rem; font-weight: 700; color: #fff; font-size: 1.15rem;
    display: flex; align-items: center; gap: .5rem; border-bottom: 1px solid rgba(255,255,255,.08);
}
.vz-sidebar .nav-link {
    color: var(--vz-sidebar-fg); padding: .6rem 1.25rem; display: flex; align-items: center; gap: .65rem;
    border-left: 3px solid transparent; font-size: .9rem;
}
.vz-sidebar .nav-link:hover { background: rgba(255,255,255,.06); color: #fff; }
.vz-sidebar .nav-link.active { background: rgba(27,110,194,.18); color: #fff; border-left-color: var(--vz-sidebar-active); }
.vz-sidebar .nav-section { padding: .85rem 1.25rem .3rem; font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; color: #6b7a90; }
.vz-main { flex: 1; margin-left: 250px; display: flex; flex-direction: column; min-width: 0; }
.vz-topbar {
    height: 58px; background: var(--bs-body-bg); border-bottom: 1px solid var(--bs-border-color);
    display: flex; align-items: center; gap: 1rem; padding: 0 1.25rem; position: sticky; top: 0; z-index: 1020;
}
.vz-content { padding: 1.25rem; flex: 1; }

@media (max-width: 991.98px) {
    .vz-sidebar { transform: translateX(-100%); }
    .vz-sidebar.show { transform: translateX(0); }
    .vz-main { margin-left: 0; }
}

/* ---------- Stat cards ---------- */
.stat-card { border: 1px solid var(--bs-border-color); border-radius: .6rem; }
.stat-card .icon { width: 46px; height: 46px; border-radius: .55rem; display: grid; place-items: center; font-size: 1.3rem; }
.stat-card .value { font-size: 1.5rem; font-weight: 700; }

/* ---------- Pipeline kanban ---------- */
.pipeline { display: flex; gap: .85rem; overflow-x: auto; padding-bottom: .5rem; }
.pipeline-col { min-width: 250px; flex: 0 0 250px; background: var(--bs-tertiary-bg); border-radius: .55rem; padding: .6rem; }
.pipeline-col h6 { font-size: .8rem; display: flex; justify-content: space-between; }
.opp-card { background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .45rem; padding: .6rem .7rem; margin-bottom: .55rem; cursor: grab; }
.opp-card .amount { font-weight: 700; color: var(--vz-primary); }

.badge-soft { background: rgba(27,110,194,.12); color: var(--vz-primary); }
.table thead th { font-size: .76rem; text-transform: uppercase; letter-spacing: .03em; color: var(--bs-secondary-color); }
.avatar-sm { width: 34px; height: 34px; border-radius: 50%; background: var(--vz-primary); color:#fff; display:grid; place-items:center; font-weight:600; }
.cursor-pointer { cursor: pointer; }