.swpRiskMatrixControl {
    aaacolor: red;
}

/* Form Builder. Could not find a way to hold some generic fields on form builder so using CSS
*/

/* 'Placeholder' */
.swpRiskMatrix-field .placeholder-wrap {
    display: none !important;
}

/* 'Help Text' */
.swpRiskMatrix-field .description-wrap {
    display: none !important;
}
/* Controls (general hazard type) vs Safety Procedure dropdown (Job step type) */
.swpRiskMatrixHideRow
{
    display:none;
}


/* Actual control CSS */
/* ubold theme has some obnoxious box-sizing css that is hard to kill and makes popup look a bit mangled so put it everywhere to return to default css value 'content-box' */
.matrix-axis-desc-top {
    background-color: #137899;
    color: #FFF;
    box-sizing: content-box !important;
    max-height: 22px;

}
.matrix-axis-desc {
    background-color: #137899 !important;
    color: #FFF;
    width:40px; /* So doesnt take more column space than needed. Rotated on actual Likelihood cell */
    box-sizing: content-box !important;
    max-width: 22px;
}

.matrixClickable {
    padding: 0px !important;
    font-size:11pt;
    box-sizing: content-box !important;
    color: #1e1e1e;
}
.matrix-header-and-data-selection-cells {
    font-size:10pt;
    AddsLotsOfPaddingNowhite-space: break-spaces;
    padding: 0px !important;
    box-sizing: content-box !important;
}
.row-col-desc
{
    font-size:10pt;
    padding: 0px !important;

    width:16%;
    box-sizing: content-box !important;
}

.low-risk-grid, .moderate-risk-grid, .high-risk-grid, .catastrophic-risk-grid {
    cursor: pointer;
}

.low-risk-grid:hover, .moderate-risk-grid:hover, .high-risk-grid:hover, .catastrophic-risk-grid:hover {
    filter: brightness(65%);
}

.matrix-left-corner {
    background: #C0C0C0;
    box-sizing: content-box !important;
}
.matrix-top-left-corner
{
    box-sizing: content-box !important;
}

.low-risk-grid {
    background-color: rgba(147, 201, 57, 0.6);
}

.moderate-risk-grid {
    background-color: rgba(253, 251, 76, 0.6);
}

.high-risk-grid {
    background-color: rgba(254, 101, 34, 0.6);
}

.catastrophic-risk-grid {
    background-color: rgba(254, 10, 21, 0.6);
}