.e-dialog .e-dlg-header-content {
    background-color: var(--ProconomRed) !important;
    padding: 8px 15px !important;
}

.e-dialog .e-dlg-header-content>button>span {
    color: var(--ProconomWhite) !important;
}

.e-dialog .e-dlg-header-content>button:hover span {
    color: var(--ProconomDarkGray) !important;
}

.e-dialog .e-dlg-header-content>button {
    background-color: transparent !important;
}

.e-dialog .e-dlg-header-content>div {
    color: var(--ProconomWhite) !important;
}

.e-dialog .e-dlg-content {
    padding: 10px 15px 15px 15px !important;
}

#ProconomLoader {
    position: absolute;
    top: calc(50% - 110px);
    left: calc(50% - 50px);
    margin-top: 0 !important;
}

#ProconomLoader>img {
    width: 100%;
    height: 100%;
}

#ProconomLoader>span {
    text-align: center;
}

.ProcOpenLoader {
    width: 100px;
    height: 100px;
    text-align: center;
    margin-top: calc(50% - 40px);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ProcOpenLoader>span {
    font-size: 20px;
    white-space: nowrap;
}

.viewPointDot {
    width: 4%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--ProconomRed);
    pointer-events: all;
    cursor: pointer;
}

.viewPointImg {
    width: 100%;
    height: 100%;
    padding: 2%;
    border-radius: 50%;
    object-fit: cover;
}

.proc-ver-splitter-container {
    display: flex;
    height: 100%;
    flex: 1 1 auto;
}

.proc-hor-splitter-container {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.proc-left-pane,
.proc-right-pane {
    height: 100%;
    overflow: auto;
}

.proc-top-pane,
.proc-bottom-pane {
    width: 100%;
    overflow: auto;
}

.proc-ver-split-bar {
    width: 5px;
    margin: 0px 6px;
    height: 100%;
    background-color: #ddd;
    cursor: col-resize;
    position: relative;
}

.proc-ver-split-bar-dot {
    position: absolute;
    width: 4px;
    height: 4px;
    top: 50%;
    border-radius: 50%;
    background-color: #ddd;
}

.proc-ver-split-bar-dot:first-child {
    left: -5px;
}

.proc-ver-split-bar-dot:last-child {
    right: -5px;
}

.proc-hor-split-bar {
    height: 5px;
    margin: 6px 0px;
    width: 100%;
    background-color: #ddd;
    cursor: row-resize;
    position: relative;
}

.proc-hor-split-bar-dot {
    position: absolute;
    width: 4px;
    height: 4px;
    left: 50%;
    border-radius: 50%;
    background-color: #ddd;
}

.proc-hor-split-bar-dot:first-child {
    top: -5px;
}

.proc-hor-split-bar-dot:last-child {
    bottom: -5px;
}

.smallLoader {
    background-image: url('../img/loader.gif') !important;
}

.DocSelectorIcon {
    background: url('../img/IconDoc.svg');
    background-size: 32px;
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

.PerpedincularIcon {
    background: url(../img/section.png) !important;
    background-size: 29px !important;
    background-position: center center !important;
    background-color: white !important;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
}

#PerpendicularCutDialog {
    min-width: 160px;
}

#UpHelperDialog {
    top: 20px !important;
    max-width: 60%;
    width: fit-content;
    height: fit-content;
    left: 50% !important;
    transform: translate(-50%, 0%);
}

.upHelperButton {
    height: fit-content;
    width: fit-content;
}

.upHelperButton:focus {
    outline: none
}