body {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    font-family: var(--bs-body-font-family);
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--bs-form-valid-border-color);
}

.invalid {
    outline: 1px solid var(--bs-form-invalid-border-color);
}

.validation-message {
    color: var(--bs-form-invalid-color);
}

#blazor-error-ui {
    background-color: var(--bs-warning-bg-subtle);
    border-top: 1px solid var(--bs-warning-border-subtle);
    bottom: 0;
    box-shadow: var(--bs-box-shadow-sm);
    color: var(--bs-warning-text-emphasis);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background-color: var(--bs-danger-bg-subtle);
    border: 1px solid var(--bs-danger-border-subtle);
    border-radius: var(--bs-border-radius);
    color: var(--bs-danger-text-emphasis);
    padding: 1rem;
}

    .blazor-error-boundary::after {
        content: "An error has occurred.";
    }

.loading-progress {
    display: block;
    height: 8rem;
    margin: 20vh auto 1rem;
    position: relative;
    width: 8rem;
}

    .loading-progress circle {
        fill: none;
        stroke: var(--bs-border-color);
        stroke-width: 0.6rem;
        transform: rotate(-90deg);
        transform-origin: 50% 50%;
    }

        .loading-progress circle:last-child {
            stroke: var(--bs-primary);
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    font-weight: 600;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
    position: absolute;
    text-align: center;
}

    .loading-progress-text::after {
        content: var(--blazor-load-percentage-text, "Loading");
    }

.e-btn.ti-custom-more {
    width: 23px;
}

    .e-btn.ti-custom-more .e-btn-icon {
        margin-left: -8px !important;
    }

.e-grid.grid-font-sm .e-headercelldiv,
.e-grid.grid-font-sm .e-rowcell {
    font-size: 12px !important;
}

.e-grid.grid-font-md .e-headercelldiv,
.e-grid.grid-font-md .e-rowcell {
    font-size: 14px !important;
}

.e-grid.grid-font-lg .e-headercelldiv,
.e-grid.grid-font-lg .e-rowcell {
    font-size: 18px !important;
}

.e-grid .e-dialog.e-ccdlg {
    max-height: var(--ti-column-chooser-dialog-max-height, 570px) !important;
}

    .e-grid .e-dialog.e-ccdlg .e-cc-contentdiv {
        height: var(--ti-column-chooser-content-height, 420px) !important;
    }