/* ==========================================
   GoalVanta Sidebar CSS v2.0
========================================== */

.sidebar{
    position:fixed;
    top:70px;
    left:0;
    width:260px;
    height:calc(100vh - 70px);
    background:var(--card);
    border-right:1px solid var(--border);
    overflow-y:auto;
    transition:all .3s ease;
    z-index:999;
}

/* Scrollbar */

.sidebar::-webkit-scrollbar{
    width:6px;
}

.sidebar::-webkit-scrollbar-thumb{
    background:#cbd5e1;
    border-radius:20px;
}

/* Menu */

.sidebar-menu{
    list-style:none;
    padding:20px 0;
    margin:0;
}

.sidebar-menu li{
    margin:6px 15px;
}

/* Links */

.sidebar-menu a{
    display:flex;
    align-items:center;
    gap:15px;

    padding:14px 16px;

    border-radius:14px;

    text-decoration:none;

    color:var(--text);

    font-weight:600;

    transition:.3s;
}

/* Hover */

.sidebar-menu a:hover{

    background:rgba(37,99,235,.08);

    color:var(--primary);

}

/* Active */

.sidebar-menu a.active{

    background:var(--primary);

    color:#fff;

}

/* Icon */

.sidebar-menu i{

    width:22px;

    text-align:center;

    font-size:18px;

}

/* Text */

.sidebar-menu span{

    flex:1;

}

/* Main Content */

.main-content{

    margin-left:260px;

    padding:25px;

    transition:.3s;

}

/* Collapse */

.sidebar.collapsed{

    width:80px;

}

.sidebar.collapsed .sidebar-menu span{

    display:none;

}

.sidebar.collapsed + .main-content{

    margin-left:80px;

}

/* Tablet */

@media(max-width:992px){

.sidebar{

width:220px;

}

.main-content{

margin-left:220px;

}

}

/* Mobile */

@media(max-width:768px){

.sidebar{

left:-260px;

width:260px;

box-shadow:0 10px 30px rgba(0,0,0,.15);

}

.sidebar.show{

left:0;

}

.main-content{

margin-left:0;

padding:18px;

}

}

/* Small Mobile */

@media(max-width:480px){

.sidebar{

width:240px;

}

.main-content{

padding:15px;

}

}