/*MENU*/

.menu-logo {
    display: flex;
    align-items: center;
    gap: 5px;
    height: 46px;
}

    .menu-logo .menu-l-svg {
        width : 30px;
    }

    .menu-logo .menu-l-text {
        color: var(--mud-palette-primary-lighten);
        font-size: 18px;
        font-style: normal;
        font-weight: bold;
        margin-top: -5px;
    }

.menu-disable {
    opacity: 0; 
    visibility: hidden;
    display: none !important;
}

.desktop-menu .left-side{
    display : flex;
    align-items : center;
}

.desktop-menu .left-side .dm-ls-menutoggle{
    display : none;
}

.desktop-menu .right-side {
    display: flex;
    align-items: center;
    gap : 10px;
}

.desktop-menu {
    border-bottom: 1px solid var(--mud-palette-lines-default);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    background-color: var(--mud-palette-surface);
}

    .desktop-menu .dtm-menu-bar {
        height: 64px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0px 10px;
        position: relative; 
    }

    .desktop-menu .dtm-menu-container {
        display: flex;
        position: relative;
    }

    .desktop-menu .dtm-menu-item {
        padding: 10px 20px;
        margin: 0 5px;
        cursor: pointer;
        font-weight: 500;
        position: relative;
        z-index: 1;
        transition: color 0.3s ease;
        min-width: 100px;
        text-align: center;
        display : flex;
        gap : 8px;
    }

        .desktop-menu .dtm-menu-item.active {
            color: var(--mud-palette-secondary-text);
            transition: color 0.3s ease;
        }

        .desktop-menu .dtm-menu-item.approve.active {
            color: var(--approve-color);
        }   

        .desktop-menu .dtm-menu-item.request.active {
            color: var(--request-color);
        }

        .desktop-menu .dtm-menu-item.reject.active {
            color: var(--reject-color);
        }

        .desktop-menu .dtm-menu-item.suspend.active {
            color: var(--suspend-color);
        }

    .desktop-menu .dtm-menu-highlight {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        background: var(--mud-palette-primary);
        border-radius: 25px;
        z-index: 0;
        transition: all 0.3s cubic-bezier(0.65, 0, 0.35, 1);
        background: linear-gradient(to right, var(--mud-palette-primary), var(--mud-palette-secondary));
    }

    .desktop-menu .dtm-logo {
        font-weight: bold;
        font-size: 25px;
        color: var(--mud-palette-primary);
    }

.mobile-menu {
    display: flex;
    align-items: center;
}

    .mobile-menu .m-menu-bar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
        width: 100%;
        border-radius: 15px;
        border-top: 1px solid var(--mud-palette-lines-default);
        background-color: var(--mud-palette-surface);
    }

    .mobile-menu .m-menu-container {
        display: flex;
        position: relative;
        width: 100%;
        height: 100%;
        justify-content: space-evenly;
        height: 60px;
        /*background: var(--mud-palette-primary);*/
    }

    .mobile-menu .m-menu-item {
        margin: 0 5px;
        cursor: pointer;
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        transition: color 0.3s ease;
        align-items: center;
       /* background-color: var(--mud-palette-background);*/
        padding: 5px 0px 5px 0px;
        min-width: 44px;
    }

    .mobile-menu .m-menu-i-text {
        font-weight: 500;
        transition: color 0.3s ease;
        font-size: 12px;
    }

    .mobile-menu .m-menu-i-icon {
        transition: color 0.4s ease;
    }

    .mobile-menu .m-menu-item.active :is(.m-menu-i-text, .m-menu-i-icon) {
        color: var(--mud-palette-primary-lighten);
        transition: color 0.4s ease;
    }

    .mobile-menu .m-menu-item.approve.active :is(.m-menu-i-text, .m-menu-i-icon) {
        color: var(--approve-color);
    }
    .mobile-menu .m-menu-item.request.active :is(.m-menu-i-text, .m-menu-i-icon) {
        color: var(--request-color);
    }

    .mobile-menu .m-menu-item.reject.active :is(.m-menu-i-text, .m-menu-i-icon) {
        color: var(--reject-color);
    }

    .mobile-menu .m-menu-item.suspend.active :is(.m-menu-i-text, .m-menu-i-icon) {
        color: var(--suspend-color);
    }


    .mobile-menu .m-menu-highlight {
        position: absolute;
        /*top: 50%;
        transform: translateY(-50%);*/
        /*left: 0;*/
        height: 2px;
        bottom : 8px;
        background: var(--mud-palette-primary);
        border-radius: 15px;
        z-index: 1;
        transition: all 0.4s cubic-bezier(0.7, 0, 0.25, 1);
    }


.menu-mob-top-bar {
    height: 50px;
    /*box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    margin-bottom: 3px;*/
    /*background: var(--mud-palette-primary);*/
}
    .menu-mob-top-bar .mmtb-wrap {
        display: flex;
        padding: 0px 10px;
        align-items: center;
        justify-content: space-between;
        height : 100%;
    }

    .menu-mob-top-bar .mmtb-w-1 {
        /*color: var(--mud-palette-primary-lighten);*/
        font-weight : bold;
        font-size : 20px;
        display : flex;
        align-items : center;

    }
    .menu-mob-top-bar .mmtb-w-2 {
    }


@media(max-width : 600px) {
    /*.menu-logo .menu-l-svg {
        width: 25px;
    }
    .menu-logo .menu-l-text {
        font-size: 15px;
    }*/

    .menu-logo {
        height: 33px;
    }

    .desktop-menu .dtm-menu-bar {
        height: 50px;
    }

    .desktop-menu .left-side .dm-ls-menutoggle {
        display: block;
    }
}

@media(min-width : 599px){

    .nestly-l-shrink .nestly-left {
        min-width: 85px;
        width: 85px
    }

    .nestly-l-shrink .nestly-right {
        width: calc(100% - 85px);
    }

    .nestly-l-shrink .nes-lmi-text {
        display: none;
    }
}
/*MENU*/