.context-menu {
    position: fixed;

    width: 150px;
    z-index: 50;

    padding: 5px;
    border-radius: 10px;
    display: none;
}

body.dark > .context-menu {
    background-color: #202020;
}

body.light > .context-menu {
    background-color: #ffffff;
    border: solid 1px #c5c5c5;
    color: #000000;
}

.context-menu-show {
    display: block;
}

.context-menu > .item,
.context-menu > .item-subdivision > .item {
    padding: 8px 10px;
    font-size: 15px;

    cursor: pointer;
    border-radius: inherit;

    transition: background-color 100ms ease-in;
    user-select: none;
}

body.dark > .context-menu > .item:hover,
body.dark > .context-menu > .item-subdivision > .item:hover {
    background-color: #131313
}

body.light > .context-menu > .item:hover,
body.light > .context-menu > .item-subdivision > .item:hover {
    background-color: #e5e5e5
}

.context-menu > .item-subdivision {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}

.context-menu > .item-subdivision > .item {
    border-radius: 10px;
}
