html {
    --overlay-width: clamp(300px, 90vw, 500px);
    --overlay-width-wide: clamp(300px, 90vw, 800px);
    --overlay-width-wide-m: clamp(500px, 90vw, 1200px);
    --label-height: 17px;
    --grid-min-height: 210px;
    --grid-min-height-with-filter: 250px;
}

.body-frame {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 1px);
    max-height: 100vh;
    overflow: hidden;
    max-width: 100vw;
    background-color: var(--wpcard-background);
}

.main-frame {
    /*за вычетом высот header + footer*/
    flex: 1 1 calc(100vh - 97px);
    height: 100%;
    min-height: 0;
}

.container-box {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: -webkit-fill-available;
    width: -moz-available;
    background-color: var(--wpcard-background);
}

.tree-view {
    display: block;
    max-width: 25%;
    flex-grow: 0;
    flex-shrink: 0;
    min-width: 0;
}

.workspace {
    padding: var(--tripple-offset);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--n600) var(--n500);
}

.workspace .col-card {
    height: 100%;
}

.workspace .col-card .text-hint-for-selection {
    margin: 0 auto;
    font-size: 1.4286rem;
    color: var(--n700);
    width: fit-content;
    padding-top: calc(50vh - 70px);
    text-align: center;
}

.i-input-group.input-select {
    flex-wrap: unset;
    min-width: unset;
}

.rotate {
    -webkit-animation: rotate-center 1s ease-in-out infinite both;
    animation: rotate-center 1s ease-in-out infinite both;
}

@-webkit-keyframes rotate-center {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotate-center {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.rotate + .loading-text {
    margin-left: var(--min-offset);
}

indusoft-ui {
    height: 100%;
    width: 100%;
}

.dark-theme {
    --grid-icon-status-ok: #40BF55;
    --grid-icon-status-bad: #F64030;
}

.light-theme {
    --grid-icon-status-ok: green;
    --grid-icon-status-bad: red;
}