uix-menu {
    & {
        --bgImg: url("");
    }
    
    .sidemenu {
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        height: 100%;
        top: 0;
        padding: 10px;
        gap: 20px;
        background-image: var(--bgImg);
        background-color: rgb(53, 53, 53);
        background-repeat: no-repeat;
        background-size: cover;
        flex-direction: column;
        uix-cat-links {
            flex-direction: column;
        }
    }
    
    .center {
        display: flex;
        justify-content: start;
        align-items: center;
        width: 100%;
        height: 100%;
    }
    
    .top, .bottom {
        max-height: 70px;
        width: 100%;
        display: flex;
        align-items: center;
        height: 100%;
        gap: 10px;
    }
    
    .top {
        justify-content: start;
        & > button {
            position: relative;
            top: 0;
            color: white;
            background-color: rgb(53, 53, 53);
            border: transparent;
            margin: 0;
            padding: 0;
            width: 50px;
            height: 50px;
        }
    }
    
    .bottom {
        justify-content: center;
    }
    
    .additional {
        width: 100%;
        background-color: transparent;
        color: white;
    }
    
    ::slotted(.menulinks) {
        display: flex;
        justify-content: start;
        align-items: center;
        gap: 10px;
        width: 100%;
        height: 100%;
        flex-direction: column;
    }
    
}

