.sidebar-multilevel {
    width: 100%;
}

/* =========================================================
                               MENU ITEM
                            ========================================================= */

.sidebar-multilevel-item {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* =========================================================
                               PARENT MENU
                            ========================================================= */

.sidebar-multilevel-parent {
    display: flex !important;

    justify-content: space-between;

    align-items: center;

    width: 100%;

    min-height: 38px;

    padding: 5px 15px;

    margin-bottom: 3px;

    border-radius: 5px;

    color: rgb(83, 79, 79);

    cursor: pointer;

    user-select: none;

    transition: background-color 0.2s ease, color 0.2s ease;
}

/* =========================================================
                               PARENT TITLE
                            ========================================================= */

.sidebar-multilevel-title {
    display: flex;

    align-items: center;

    gap: 8px;

    min-width: 0;
}

.sidebar-multilevel-title i {
    flex-shrink: 0;
}

/* =========================================================
   ACTIVE DIRECT MENU LINK
========================================================= */

.sidebar-multilevel-parent.active {
    background-color: #982121 !important;
    color: #fff !important;
}

.sidebar-multilevel-parent.active i {
    color: #fff !important;
}

/* =========================================================
                               PARENT HOVER
                            ========================================================= */

.sidebar-multilevel-parent:hover {
    background-color: #757575;

    color: #fff;
}

.sidebar-multilevel-parent:hover i {
    color: #fff;
}

/* =========================================================
                               ARROW
                            ========================================================= */

.sidebar-multilevel-arrow {
    font-size: 11px;

    margin-left: auto;

    flex-shrink: 0;

    transition: transform 0.2s ease;
}

/* =========================================================
                               OPEN PARENT
                            ========================================================= */

.sidebar-multilevel-parent.sidebar-parent-open {
    background-color: #982121;

    color: #fff;
}

.sidebar-multilevel-parent.sidebar-parent-open i {
    color: #fff;
}

/* =========================================================
                               OPEN ARROW
                            ========================================================= */

.sidebar-multilevel-parent.sidebar-parent-open .sidebar-multilevel-arrow {
    transform: rotate(90deg);
}

/* =========================================================
                               SUB MENUS
                            ========================================================= */

.sidebar-multilevel-children {
    display: none;

    width: 100%;

    padding-left: 10px;

    margin: 0;

    overflow: hidden;
    background-color: #f1f1f1;
}

/* =========================================================
                               SUBMENU LINKS
                            ========================================================= */

.sidebar-multilevel-link {
    display: flex;

    align-items: center;

    width: 100%;

    min-height: 35px;

    padding: 5px 15px;

    margin-bottom: 3px;

    border-radius: 5px;

    color: rgb(83, 79, 79) !important;

    background: transparent;

    text-decoration: none !important;

    transition: background-color 0.2s ease, color 0.2s ease;
}

/* =========================================================
                               SUBMENU LINK HOVER
                            ========================================================= */

.sidebar-multilevel-link:hover {
    background-color: #757575;

    color: #fff !important;

    text-decoration: none;
}

/* =========================================================
                               ACTIVE SUBMENU
                            ========================================================= */

.sidebar-multilevel-link.active {
    position: relative;
    color: #982121 !important;
}
.sidebar-multilevel-link.active:hover {
    color: white !important;
}

.sidebar-multilevel-link.active::before {
    content: "";

    position: absolute;
    left: -4px;
    top: 4px;
    bottom: 4px;

    width: 4px;

    background-color: #982121;

    border-radius: 4px 0 0 4px;
}

/* =========================================================
                               NESTED MENU
                            ========================================================= */

.sidebar-multilevel-children .sidebar-multilevel-children {
    padding-left: 10px;
}

/* =========================================================
                               NESTED PARENT
                            ========================================================= */

.sidebar-multilevel-children .sidebar-multilevel-parent {
    min-height: 36px;

    padding-left: 15px;
}

/* =========================================================
                               NESTED OPEN PARENT
                            ========================================================= */

.sidebar-multilevel-children .sidebar-multilevel-parent.sidebar-parent-open {
    background-color: #982121;

    color: #fff;
}

/* =========================================================
                               SIDEBAR COLLAPSED
                            ========================================================= */

.sidebar.close .sidebar-multilevel-children {
    display: none !important;
}

.sidebar.close .sidebar-multilevel-parent {
    justify-content: center;
}

.sidebar.close .sidebar-multilevel-title span {
    display: none;
}

.sidebar.close .sidebar-multilevel-arrow {
    display: none;
}

/* =========================================================
                               MOBILE
                            ========================================================= */

@media screen and (max-width: 768px) {
    .sidebar-multilevel-children {
        padding-left: 7px;
    }

    .sidebar-multilevel-link {
        padding-left: 15px;
    }
}

/* =========================================================
                               SCROLLBAR
                            ========================================================= */

.sidebar::-webkit-scrollbar {
    display: none;
}

.sidebar {
    -ms-overflow-style: none;

    scrollbar-width: none;
}

/* =========================================================
                               DARK MODE
                            ========================================================= */