.sidebar{

    background:var(--sidebar);

    color:white;

    display:flex;

    flex-direction:column;

}

.logo{

    padding:30px;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.logo img{

    width:170px;

}

.nav{

    padding:24px 12px;

}

.nav-title{

    font-size:.75rem;

    opacity:.5;

    text-transform:uppercase;

    margin:24px 16px 10px;

    letter-spacing:1px;

}

.nav a{

    display:flex;

    align-items:center;

    gap:14px;

    padding:14px 16px;

    border-radius:12px;

    margin-bottom:6px;

    transition:var(--transition);

}

.nav a:hover{

    background:var(--sidebar-hover);

}

.nav a.active{

    background:var(--primary);

}
.sidebar{
    position:sticky;
    top:0;
    height:100vh;
    overflow-y:auto;
}

.nav a{
    width:100%;
}