@font-family: -apple-system, blinkmacsystemfont, 'avenir next', avenir, 'segoe ui', 'helvetica neue', 'adwaita sans', cantarell, ubuntu, roboto, noto, helvetica, arial, sans-serif;
@warning: rgba(240, 173, 78, 1);
.dx-absolute-position-center() {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.dx-text-nowrap-ellipsis() {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}

.dx-svg-centered(@size: 100%) {
    width: @size;
    height: @size;
    .dx-absolute-position-center;
}

.dx-border-style() {
    border-width: 1px;
    border-style: solid;
}

.dx-border-none() {
    border-width: 0px;
    border-style: none;
}

.dx-search-control() {
    border-top: none;
    border-right: none;
    border-left: none;
    height: 36px;
    border-color: inherit;
    border-radius: 0;
    margin-bottom: 0;
}

.dx-border-top-style() {
    border-top-width: 1px;
    border-top-style: solid;
}

.dx-border-bottom-style() {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.dx-border-left-style() {
    border-left-width: 1px;
    border-left-style: solid;
}

.dx-border-right-style() {
    border-right-width: 1px;
    border-right-style: solid;
}

.dx-shadow-func(@xoffset: 0px, @yoffset: 0px) {
    -webkit-box-shadow: @xoffset @yoffset 20px -20px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: @xoffset @yoffset 20px -20px rgba(0, 0, 0, 0.15);
    box-shadow: @xoffset @yoffset 20px -20px rgba(0, 0, 0, 0.15);
}

.dx-opacity-style(@opacity) {
    opacity: (@opacity / 100);
    filter: ~"alpha(opacity=@{opacity})";
}

.dx-transition-style(@style: all, @duration: 0.3s, @easing: ease-in-out) {
    -webkit-transition: @duration @style @easing;
    -moz-transition: @duration @style @easing;
    -o-transition: @duration @style @easing;
    transition: @duration @style @easing;
}

.dx-bg-overlay-style(@outline: 0) {
    position: absolute;
    z-index: -1;
    top: @outline;
    bottom: @outline;
    left: @outline;
    right: @outline;
    pointer-events: none;
}

.dx-flex-center-align() {
    display: -ms-flexbox;
    -ms-flex-wrap: wrap;
    -ms-flex-align: center;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.dxrd-error-page {
    font-family: @font-family;
    background: #FFF0F0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 12px;
    height: 100%;

    &-icon {
        width: 64px;
        height: 64px;
    }
    &-title {
        font-size: 28px;
        font-weight: 700;
        text-align: center;
        color: #660000;
    }
    &-content {
        font-size: 16px;
        text-align: center;
        color: rgba(32, 32, 32, 0.87);
    }
}