@charset "UTF-8";

.context-menu-container {
	background: white;
    width: auto;
    height: auto;
    overflow: auto;
    border-radius: 4px;
}

.context-menu-icon {
    grid-area: context-menu-icon;
}

.context-menu-help {
    grid-area: context-menu-help;
    text-align: left;
    margin: 0px 8px;
    font-size: 14px;
}

.context-menu-title {
    grid-area: context-menu-title;
    text-align: left;
    font-size: 14px;
}

.context-menu-item-context {
	/*border-sizing: border-box;*/
    cursor: pointer;
    height: var(--menu-item-height);
    width: 100%;
    vertical-align: middle;
    line-height: var(--menu-item-height);
    display: grid;
    /*grid-template-columns: 0.3fr 1.3fr 0.6fr;*/
    grid-template-columns: 50px 280px 136px; /*auto; *//*80px;*/
    grid-template-rows: 1fr;
    grid-template-areas: "context-menu-icon context-menu-title context-menu-help";
}

.doc-list-context-menu-item-context {
    grid-template-columns: 0.3fr 1.3fr 0.6fr;
}

/*.context-menu-item-context:hover {*/
/*    background: var(--col-doc-list-hover);*/
/*}*/

/*.context-menu-item-context:active {*/
/*    background: var(--col-third);*/
/*}*/

.context-menu-item-context:last-child {
    border-bottom: 0;
}

.item-with-separator {
    border-bottom: 1px solid var(--col-third);
}

.blocked-element {
   cursor: not-allowed;
   color: var(--col-third); 
}

.custom-material-icons-context-menu{
    font-size: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100002;
    margin: 2px;
    flex-wrap: wrap;
    width: auto;
}

.custom-material-icons-context-menu__item {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.tag-panel__panel {
    display: flex;
    width: 400px;
    /*height: 62px;*/
    height: fit-content;
    z-index: 1000;
    background: white;
    border-radius: 4px;
    box-shadow: 0px 8px 16px 2px rgba(97, 97, 97, 0.1), 0px 16px 32px 2px rgba(97, 97, 97, 0.1);
    padding: 16px 16px 12px;
}

.cell-tag-panel__panel {
    display: flex;
    width: 264px;
    /*height: 62px;*/
    height: fit-content;
    z-index: 1000;
    background: white;
    border-radius: 4px;
    box-shadow: 0px 8px 16px 2px rgba(97, 97, 97, 0.1), 0px 16px 32px 2px rgba(97, 97, 97, 0.1);
    padding: 16px 16px 12px;
}

.tag-panel__panel__tag-name {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    width: 287px;
    height: 28px;
    border: 0px;
}

.tag-panel__panel__tag-name:focus {
    outline: none !important;
}

.tag-panel__panel__tag-save {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    color: white;
    width: 79px;
    height: 30px;
    background: #2B75FF;
    border: 1px solid white;
    border-radius: 4px;
}

.tag-item__panel {
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 4px;
    background: darkseagreen;
    box-shadow: 0px 2px 4px 2px rgba(97, 97, 97, 0.1);
}

.tag-item__panel__name {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 120%;
    max-width: 336px;
    overflow: hidden;
    margin:4px 8px 4px 8px;
}

.tag-item__panel__remove-button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 4px 8px 4px 0px;
}

.tag-panel__panel__horizontal-panel__tag-list {
    display: flex;
    overflow: auto;
    max-height: 186px;
    overflow-x: hidden;
}

.tag-panel__panel__horizontal-panel__tag-list tr {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 8px;
    padding-left: 2px;
    padding-right: 2px;
    padding-bottom: 4px;
}

.tag-panel__panel_hr {
    border: 1px solid #F6F6FA;
    margin-top: 8px;
    margin-bottom: 8px;
}