.sidebar {
    direction: ltr;
    max-width: 270px;
    min-width: 270px;
    background-color: #22303c !important;
}

.sidebar,
.sidebar-content {
    transition: margin-left 0.35s ease-in-out, left 0.35s ease-in-out,
    margin-right 0.35s ease-in-out, right 0.35s ease-in-out;
}

.sidebar-content {
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow-y: auto;
    position: sticky;
}

.sidebar-nav {
    flex-grow: 1;
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

.sidebar-link,
a.sidebar-link {
    border-left: 3px solid transparent;
    display: block;
    font-weight: 400;
    padding: 0.425rem 1.625rem;
    text-decoration: none;
    transition: background 0.1s ease-in-out;
    color: rgba(255, 255, 255, 0.70);
}

.sidebar-link i,
.sidebar-link svg,
a.sidebar-link i,
a.sidebar-link svg {
    margin-right: 0.75rem;
}


.sidebar-link:hover,
.sidebar-link:hover i,
.sidebar-link:hover svg {
    color: rgba(233, 236, 239, 0.90);
}

.sidebar-item.active .sidebar-link:hover,
.sidebar-item.active > .sidebar-link {
    background: linear-gradient(90deg, var(--azul-normal) -100%, #22303c 100%) !important;
    border-left-color: var(--verde-normal);
    color: rgb(255, 255, 255);
    font-weight: 600;
}

.sidebar.collapsed {
    margin-left: -270px;
}

#content {
    margin-left: 270px;
    transition: margin-left 0.35s ease-in-out, left 0.35s ease-in-out,
    margin-right 0.35s ease-in-out, right 0.35s ease-in-out;
}

#content.collapsed {
    margin-left: 0;
}

@media (min-width: 1px) and (max-width: 991.98px) {
    .sidebar {
        margin-left: -270px;
    }

    .sidebar.collapsed {
        margin-left: 0;
    }

    #content {
        margin-left: 0;
    }

    #content.collapsed {
        margin-left: 270px;
    }
}


.py-15{
    padding-top: 0.7rem !important;
    padding-bottom: 0.7rem !important;
}