.reportSectionHeader {
    background-color: black;
    color: white;
}

.reportExplanation {
    font-style: italic;
}

.ReportFilterPlaceholder {
    width: 100%;
    height: 182px;
}

.ExportButtons {
    margin-bottom: 10px;
    padding: 2px;
    display: flex;
    align-items: center;
    gap: 1rem;
}


.ReportTitleBar, .reportParameterOptions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ReportTitleBar {    
    margin-bottom: 4px;
}

.ReportContainer {
    height: calc(100% - 41px);
    overflow: auto;
}

.reportFullHeight {
    height: 100%;
}

/* Tabs */
.ReportContainer .e-tab .e-content {
    background-color: white;
    overflow-y: auto;
    overflow-x: hidden;
    box-shadow: -2px -2px 2px #EEEEEE, 2px 2px 2px #EEEEEE !important;
}

.ReportContainer .e-tab .e-tab-header {
    margin-bottom: 0px;
    z-index: 1;
}

.ReportContainer .e-tab .e-tab-header .e-toolbar-item:not(.e-active) .e-tab-wrap:hover {
    background: white !important;
    color: black !important;
}

.ReportContainer .e-tab .e-tab-header .e-toolbar-item:not(.e-active) .e-tab-wrap {
    background: #EEEEEE;
    color: black !important;
}

.ReportContainer .e-tab .e-tab-header .e-toolbar-item:not(.e-active) .e-tab-text {
    color: black !important;
}

.ReportContainer .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
    background: white !important;
    color: black !important;
}

.ReportContainer .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-text {
    color: black !important;
}

.ReportContainer .e-tab .e-content .e-item {
    height: 100% !important;
    box-shadow: none !important;
}

/* Bold Headers */
.ReportContainer .rz-column-title-content {
    font-weight: bold !important;
}

/* Selected Row / Cell Styling */
.ReportContainer .rz-state-highlight {
    background-color: darkgrey !important;
    color: white !important;
}

.ReportContainer .rz-selectable tbody tr.rz-data-row.rz-state-highlight > td, 
.ReportContainer .rz-selectable tbody tr.rz-data-row.rz-state-highlight > td.rz-frozen-cell.rz-frozen-cell-left:before, 
.ReportContainer .rz-selectable tbody tr.rz-data-row.rz-state-highlight > td.rz-frozen-cell.rz-frozen-cell-left-inner:before {
    background-color: darkgrey !important;
}

.ReportContainer .rz-selectable tbody tr.rz-data-row.rz-state-highlight .rz-cell-data {
    color: white !important;
}

.ReportContainer .rz-pager-page.rz-state-active {
    background-color: darkgrey !important;
    color: white !important;
}

.ReportContainer .rz-pager-page.rz-state-active {
    background-color: darkgrey !important;
    color: white;
}

/* Sort Icon Always Visible + Right arrow */
.ReportContainer .rz-sortable-column .rzi-sort {
    color: var(--rz-grid-sort-icon-color);
}

.ReportContainer .rz-sortable-column .rzi-sort::before {
    content: "arrow_right";
}

.ReportContainer .rz-sortable-column .rzi-sort-asc::before {
    content: "arrow_drop_up";
}

.ReportContainer .rz-sortable-column .rzi-sort-desc::before {
    content: "arrow_drop_down";
}

.BlankCell {
    --rz-grid-stripe-background-color: #D9D9D9;
    --rz-grid-stripe-odd-background-color: #D9D9D9;
}

.RAGFail {
    --rz-grid-stripe-background-color: #FFC7CE;
    --rz-grid-stripe-odd-background-color: #FFC7CE;
    --rz-grid-cell-color: #9B0006;
}

.RAGAmber {
    --rz-grid-stripe-background-color: #FFEB9B;
    --rz-grid-stripe-odd-background-color: #FFEB9B;
    --rz-grid-cell-color: #9B5700;
}

.RAGPass {
    --rz-grid-stripe-background-color: #C6EFCE;
    --rz-grid-stripe-odd-background-color: #C6EFCE;
    --rz-grid-cell-color: #006100;
}

@media (max-width: 816px) {
    .reportThumbnail, .reportThumbnailDefault {
        display: inline-block;
        width: 50px;
    }

        .reportThumbnail img, .reportThumbnailDefault img {
            width: 50px;
        }

    .roverlay {
        display: none;
    }

    .reportDescriptionBox {
        display: inline-block;
        vertical-align: top;
    }

        .reportDescriptionBox p {
            margin-bottom: 2px;
        }

    .reportDescriptionText {
        display: none;
    }

    .reportBox, .selectedReport {
        margin: 5px;
        padding: 5px;
        border-radius: 9px;
        cursor: pointer;
        width: 95%;
        font-size: 1.3em;
    }

        .reportBox:hover {
            border: 2px solid #258cfb;
        }

    .reportBox {
        border: 2px solid #D9D9D9;
    }

    #ReportParameters .col {
        flex: none;
        margin-bottom: 8px;
        padding: 2px;
    }
}

.exportImage, .chartButtonImage {
    height: 42px;
    width: 42px;
    background-size: 40px;
    cursor: pointer;
    border: 1px solid rgb(189, 189, 189);
    background-color: #fff;
    border-radius: 4px;
}

.exportImage {
    background-image: url(/images/reportexport.png);
}

.chartButtonImage {
    background-image: url(/images/graph-icon.png);
}

    .exportImage:hover, .chartButtonImage:hover {
        border: 1px solid #212121;
    }

.exportImageDisabled {
    opacity: 0.5;
    cursor: progress !important;
    pointer-events: none;
}

@media (min-width: 816px) {
    .reportThumbnail, .reportThumbnailDefault {
        display: inline-block;
        width: 125px;
    }

        .reportThumbnail img, .reportThumbnailDefault img {
            width: 120px;
        }

/*            .reportThumbnail img:hover {
                position: absolute;
                border: 1px solid #000;
                width: 600px;
                z-index: 99;
            }*/

    .roverlay, .roverlay img {
        position: absolute;
    }

        .roverlay img {
            height: 25px;
            width: 25px;
            top: 90px;
            left: 90px;
        }

    .reportDescriptionBox {
        display: inline-block;
        vertical-align: top;
        width: 300px;
    }

        .reportDescriptionBox p {
            margin-bottom: 2px;
        }

    .reportBox, .selectedReport {
        margin: 5px;
        padding: 5px;
        border-radius: 9px;
        cursor: pointer;
        width: 450px;
    }

        .reportBox:hover {
            border: 2px solid #258cfb;
        }

    .reportBox {
        border: 2px solid #D9D9D9;
    }
}