/*!*---------------------------------------*/
/*   SIDEBAR STYLES              */
/*-----------------------------------------*!*/

    .sidebar-toggler-btn {
        background: transparent;
        border: none;
        padding: 0 24px;
    }

    .sidebar-toggle {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        padding-top: 40px;
        max-width: 88px;
        min-width: 88px;
        height: 100vh;
        background-color: #F2F6FA;
    }

    .sidebar-toggle .sidebar-item-title {
        display: none;
    }

    .sidebar-toggle .sidebar-user-info {
        display: none;
    }

    .sidebar-logo {
        margin-bottom: 32px;
    }

    .sidebar-logo-text {
        display: none;
    }

    .sidebar-nav {
        width: 100%;
    }

    .sidebar-item {
        list-style: none;
        margin: 16px 0;
        padding: 12px 34px;
    }

    .sidebar-item.active {
        background: #2F2F32;
        color: #FFFFFF;
        border-top-right-radius: 40px;
        border-bottom-right-radius: 40px;
    }

    .sidebar-user-info-item {
        padding: 12px 24px;
    }

    .sidebar-icon {
        filter: brightness(0) invert(0.45);
    }

    .sidebar-item.active .sidebar-icon{
        filter: brightness(0) invert(1);
    }

    .sidebar-link {
        padding: 12px 0;
        display: flex;
        text-decoration: none;
    }

    .offcanvas.offcanvas-start {
        transform: translateX(-50%) !important;
        width: 128px;
        visibility: visible;
    }

    .offcanvas.show:not(.hiding), .offcanvas.showing {
        transform: none !important;
        width: 240px;
    }

    .offcanvas-ontainer {
        width: 128px;
    }

    .sidebar-user-name {
        font-weight: 600;
        font-size: 16px;
        color: #2F2F32;
    }

    .sidebar-user-email {
        font-size: 14px;
        font-weight: 400;
    }

    @media screen and (min-width: 768px) {
        .sidebar-toggle.expand {
            max-width: 240px;
            min-width: 240px;
        }

        .sidebar-toggle.expand .sidebar-item-title {
            display: block;
            font-size: 16px;
            font-weight: 500;
            line-height: 120%;
            color: #2F2F3299;
            margin-left: 12px;
        }

        .sidebar-toggle.expand .sidebar-item.active .sidebar-item-title {
            color: #FFFFFF;
        }

        .sidebar-toggle.expand .sidebar-user-info {
            display: block;
            font-size: 16px;
            font-weight: 500;
            line-height: 120%;
            color: #2F2F3299;
            margin-left: 16px;
        }

        .sidebar-toggle.expand .sidebar-logo {
            display: none;
        }

        .sidebar-toggle.expand .sidebar-logo-text {
            display: block;
            margin-bottom: 32px;
        }
    }

    @media screen and (max-width: 767.9px) {

        .sidebar-toggle {
            max-width: 55px;
            min-width: 55px;
            padding-top: 16px;
        }

        .sidebar-toggler-btn {
            padding: 0 12px;
        }

        .sidebar-item {
            margin: 8px 0;
            padding: 4px 23px;
        }

        .sidebar-user-info-item {
            padding: 4px 13px;
        }
    }