/* rightMenu */

[data-theme='light'] #rightMenu {
    display: none;
    position: fixed;
    width: 160px;
    height: fit-content;
    top: 10%;
    left: 10%;
    background-color: var(--card-bg);
    border: 1px solid rgb(210, 210, 210);
    ;
    border-radius: 8px;
    z-index: 100;
    box-shadow: 3px 3px 5px #88888894;
    background-color: var(--lyx-white-acrylic1);
    backdrop-filter: blur(30px);
}

[data-theme='dark'] #rightMenu {
    display: none;
    position: fixed;
    width: 160px;
    height: fit-content;
    top: 10%;
    left: 10%;
    background-color: var(--card-bg);
    border: 1px solid rgb(210, 210, 210);
    ;
    border-radius: 8px;
    z-index: 100;
    box-shadow: 3px 3px 5px #88888894;
    background-color: var(--lyx-black-acrylic1);
    backdrop-filter: blur(30px);
}

#rightMenu .rightMenu-group {
    padding: 7px 6px;
}

#rightMenu .rightMenu-group:not(:nth-last-child(1)) {
    border-bottom: 1px solid rgb(180, 180, 180);
}

#rightMenu .rightMenu-group.rightMenu-small {
    display: flex;
    justify-content: space-between;
}

#rightMenu .rightMenu-group .rightMenu-item {
    height: 30px;
    line-height: 30px;
    border-radius: 8px;
    transition: 0.3s;
    color: var(--font-color);
}

#rightMenu .rightMenu-group.rightMenu-line .rightMenu-item {
    display: flex;
    height: 40px;
    line-height: 40px;
    padding: 0 4px;
}

#rightMenu .rightMenu-group .rightMenu-item:hover {
    background-color: var(--text-bg-hover);
    box-shadow: 0px 0px 5px var(--lyx-border);
}

#rightMenu .rightMenu-group .rightMenu-item i {
    display: inline-block;
    text-align: center;
    line-height: 30px;
    width: 30px;
    height: 30px;
    padding: 0 5px;
}

#rightMenu .rightMenu-group .rightMenu-item span {
    line-height: 30px;
}

#rightMenu:hover {
    border: 1px solid var(--lyx-blue);
    /* box-shadow:0 0 3px var(--lyx-blue)!important; */
}

#rightMenu .rightMenu-group.rightMenu-line .rightMenu-item * {
    height: 40px;
    line-height: 40px;
}

.rightMenu-group.hide {
    display: none;
}

.rightMenu-item:hover {
    color: white!important;
    background-color: var(--lyx-blue)!important;
}

:root {
    --lyx-border: #c9c9c9;
    --lyx-blue: #6cf;
    --lyx-gray: #e2e2e2;
    --lyx-theme: #6cf;
    --lyx-green: #39c5bb;
    --lyx-black-acrylic1: #0008;
    --lyx-black-acrylic2: #000a;
    --lyx-black-acrylic3: #00000099;
    --lyx-black: black;
    --lyx-white: white;
    --lyx-white-acrylic1: #fffd;
    --lyx-white-acrylic2: #fffa;
    --lyx-blackgray: #797979;
    --lyx-0: #0000;
    --lyx-scrollbar: #acacacDD;
}