.context-menu {
    box-shadow: 0 0 20px rgba(37, 40, 42, 0.22);
    color: #1f194c;
    width: 200px;
    padding-top: 10px;
    padding-bottom: 10px; 
    /* 0.8em 0.6em; */
    font-size: small;
    position: fixed;
    border-radius: 10px;
    background-color: white;
    border-color: gray;
}
   
 .cm-item {
    user-select: none;
    padding: 0.3em 1.2em;
    background-color: white;
    /* обрезание текста если очень длинный */
    overflow-y: clip;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #222222 ;
 }


 .cm-item-hr {
    user-select: none;
    margin: 0 auto;
    margin-top: 3pt;
    margin-bottom: 3pt;
    border: 1px solid lightgray;
    width: 90%;
 }
 
 .cm-item-enabled:hover {
    background-color: rgba(173, 175, 176, 0.2);
    cursor: pointer;
 }

.cm-item-group {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%0A%20%20%20%20%20%20%20%20%3Cg%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M7.5%2C10L13.5%2C15M7.5%2C20L13.5%2C15%22%20stroke%3D%22currentColor%22%20fill%3D%22currentColor%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fsvg%3E");
    background-size: 26px;
    background-repeat: no-repeat;
    background-position: right top -3px;
}

.cm-item-disabled {
   user-select: none;
   color: #cccccc;
   stroke: #cccccc;
}

.main-menu-item {
    margin-right: 2px;
    color: #cccccc;
}

.main-menu-item-active{
    cursor: pointer;
    color: black;
}

.main-menu-separator {
    margin-right: 2px;
    color: #cccccc;
}

/* .main-menu-item:nth-of-type(n + 2)::before {
    content: ' | ';
} */

.main-menu-item-active:hover{
    text-decoration: underline;
}

/* .cm-item-filtered {
    background-color: red;
} */

.cm-panel { 
    white-space: nowrap;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    /* align-items: center; */
    flex-wrap: nowrap;
    padding: 0.3em 1.2em 0.3em 1.2em;
    /* background-color: red; */
}

/* Элемент - панель, составной элемент */
.cm-panel > div, .cm-panel > input {
    float: right;
    display: flex;
    /* flex-shrink: 0; */
}

.cm-panel-input {
    flex: 1; 
     /* 1 auto; */
    min-width: 10;
    width: 0;
    /* background-color: green; */
}

.cm-panel-button {
    flex: 0;
     /* 0 auto; */
    margin-left: 2px;
    min-width: 16px;
    padding: 0.3em;
    cursor: default;
    justify-content:center;
    align-items:center;
    text-align: center;
    border-radius: 5px;
    border: 1px solid #ccc;
}

/* 
⌘ is command (or Cmd. Like the Control key on Windows/PC)
⌥ is option (like Alt on Windows/PC)
⌃ is control (Control-click=Right-click)
⇧ is shift
⇪ is caps lock
← is left arrow
→ is right arrow
↑ is up arrow
↓ is down arrow
⇥ is tab
⇤ is backtab
↩ is return (or Enter)
⌫ is delete (like Backspace on Windows/PC)
⌦ is forward delete (fn+Delete. Also called Forward Delete)
⇞ is page up (fn+Up Arrow on compact keyboards)
⇟ is page down (fn+Down Arrow on compact keyboards)
↖ is home (fn+Left Arrow on compact keyboards)
↘ is end (fn+Right Arrow on compact keyboards)
⎋ is escape (or esc)
*/