html, body {
    height: 100%;
}

app {
    display: block;
    height: 100%;
}

.header-logo {
    background-image: url(../images/Logo.svg);
    width: 300px;
    height: 40px;
    /* ... */
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}

:root {
    --grid-content-height: 700px;
    --tree-list-content-height: 700px;
    --group-row-background_color-light: #e6e6e6;
    --group-row-background_color-dark: rgb(53, 53, 53);
}

dxbl-grid.height-auto {
    max-height: var(--grid-content-height) !important;
    height: var(--grid-content-height) !important;
}

dxbl-tree-list.height-auto {
    max-height: var(--tree-list-content-height) !important;
    height: var(--tree-list-content-height) !important;
}

.grid-hide-vert-lines {
    /*border-left: 0px;*/
    /*border-right: 0px;*/
}

    .grid-hide-vert-lines.dxbl-grid .dxbl-grid-table > tbody > tr > td {
        border-left-width: 0px;
    }

    .grid-hide-vert-lines.dxbl-grid .dxbl-grid-table > thead > tr > th {
        border-left-width: 0px;
    }

.color-edit-template-container {
    display: flex;
    align-items: center;
    width: 100%
}

.icon-color {
    height: 16px;
    width: 16px;
    border-radius: 20%;
    margin-right: 0.375rem;
}

.dxbl-sm .icon-color {
    margin-right: 0.25rem;
}

.dxbl-lg .icon-color {
    margin-right: 0.5rem;
}

.static-text-bold {
    font-weight: 600;
}

.html-editor-full-height {
    height: 100%;
}

.layout-caption {
    display: flex;
    align-items: center;
}

.label-caption {
    padding-top: var(--dxbl-fl-caption-padding-top);
    user-select: none;
}

.info-icon {
    margin-left: .5em;
    width: 14px;
    height: 14px;
}

.group-row-column-value {
    /*color: #00a4e6;*/
    /*color: #6c757d;*/
    color: color-mix(in srgb, var(--dxbl-grid-header-color) 65%, transparent);
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
}

.group-row-group-value {
    /*padding-left: 7px;*/
    /*color: rgb(53, 53, 53);*/
    /*font-size: 1.1em;*/
    font-weight: 600;
    margin-left: 10px;
}

.group-row-summary-value {
    color: color-mix(in srgb, var(--dxbl-grid-header-color) 65%, transparent);
    font-size: 0.9em;
    margin-left: 10px;
}


.group-row-light {
    background: var(--group-row-background_color-light) !important;
}


.group-row-indent-cell-light > td.dxbl-grid-indent-cell {
    background: var(--group-row-background_color-light) !important;
}

.group-row-dark {
    background: var(--group-row-background_color-dark) !important;
}


.group-row-indent-cell-dark > td.dxbl-grid-indent-cell {
    background: var(--group-row-background_color-dark) !important;
}