.no-selection-banner {
    padding: 30px;
    fill: var(--text-color);
    height: 200px;
    width: 200px;
}

.overview-chart {
    width: 100%;
    min-height: 40vh;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.tree-chart {
    width: 100%;
    min-height: 40vh;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.chart-tooltip-title {
    font-weight: bold;
}

/* Bar graph in table */
.bar-graph {
    float: left;
    color: transparent;
}

.missed {
    background-color: #EF9A9A;
}

.missed:hover {
    background-color: #FFCDD2;
}

.covered {
    background-color: #A5D6A7;
}

.covered--hover:hover {
    background-color: #C8E6C9;
}

/* View selection buttons */
.btn {
    outline: none !important;
    box-shadow: none !important;
}
.btn-outline-secondary {
    color: #b4b4b4;
    border-color: #b4b4b4;
}
.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active,
.btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {
    color: #fff;
    background-color: #b4b4b4;
    border-color: #b4b4b4;
}

/* Coverage map switch */
.form-switch .form-check-input {
    box-shadow: none;
    background-color: #b4b4b4;
    border-color: #b4b4b4;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='white'/%3e%3c/svg%3e");
}

.form-switch .form-check-input:focus {
    box-shadow: none;
    background-color: #b4b4b4;
    border-color: #b4b4b4;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='white'/%3e%3c/svg%3e");
}

.coverage-column-outer {
    border: 1px solid var(--medium-grey);
    border-radius: 10px;
    width: 5em;
}

.coverage-column-inner {
    padding: 1px 7px;
    border-radius: 10px;
    color:var(--text-color);
}

#coverage-table td {
    vertical-align: middle;
}

table.source {
    border-spacing: 0;
    border-collapse: collapse;
    border: 1px solid #bbb;
    width: 100%;
}

table.source td {
    border-spacing: 0;
    border-collapse: collapse;
    border: 0 solid #bbb;
    padding-left: 0.2em;
    padding-right: 0.2em;
    font-family: monospace;
}

table.source .text {
    margin-top: -1px;
}

table.source td.line {
    text-align: right;
    border-width: 0 1px 0 0;
}

table.source td.hits {
    text-align: right;
    border-width: 0px 1px 0px 0px;
}

table.source th {
    padding-left: 0.5em;
    font-weight: bold;
    font-family: serif;
    background-color: #f0f0f0;
    border-width: 1px 1px 1px 1px;
    text-align: left;
}

/* --- Reset: all rows use the default background and text color --- */
/* This overrides the old solid green/red/orange backgrounds */
table.source tr {
    position: relative;
    background-color: var(--background-color) !important;
    color: var(--text-color) !important;
    font-weight: normal !important;
}

table.source tr td {
    font-weight: normal !important;
}

/*
 * Sentinel row emitted by MutationSourcePrinter.getColumnHeader(). It is invisible to the user but lets :has(tr.mutation) * CSS selectors identify mutation coverage tables and override block label text.
 */
table.source tr.mutation {
    display: none;
}

/*
 * "New Code" label appears above the FIRST row of a modified block.
 * It is always visible (not hover-dependent) so users immediately know
 * which lines are new/changed since the reference build.
 */
table.source tr:not(.modified) + tr.modified:after {
    content: "New Code";
    display: flex;
    position: absolute;
    right: 5px;
    top: -23px;
    background-color: rgba(159, 169, 237, 0.15);
    color: rgb(93, 108, 208);
    padding: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 23px;
    align-items: center;
    font-family: monospace;
    z-index: 2;
}

/*
 * Blue overlay on every modified line's code cell.
 * position:absolute fills the entire code cell without affecting layout.
 */
table.source tr.modified td.code:before {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(159, 169, 237, 0.15) !important;
}

/*
 * "Uncovered code" label appears above the FIRST row of an uncovered block when any row in that block is hovered.
 * Uses :has() to detect hover anywhere in the block and propagate upward.
 */
table.source tr:has(~ tr.coverNone:hover) ~ tr:not(.coverNone) + tr.coverNone:after {
    content: "Uncovered code";
    display: flex;
    position: absolute;
    right: 5px;
    top: -23px;
    background: rgba(240, 68, 56, 0.15);
    color: rgb(217, 45, 32);
    padding: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 23px;
    align-items: center;
    font-family: monospace;
    z-index: 2;
}

/*
 * Mutation coverage override: for tables that contain the .mutation sentinel row,
 * replace "Uncovered code" with "Mutations survived" — the correct mutation context label.
 */
table.source:has(tr.mutation) tr:has(~ tr.coverNone:hover) ~ tr:not(.coverNone) + tr.coverNone:after {
    content: "Mutations survived";
}

/* Highlight subsequent uncovered lines after the hovered uncovered line. */
table.source tr.coverNone:hover ~ tr.coverNone td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(240, 68, 56, 0.15) !important;
}

/* Highlight preceding uncovered lines before the hovered uncovered line. */
table.source tr.coverNone:has(~ tr.coverNone:hover) td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(240, 68, 56, 0.15) !important;
}

/* Highlight the hovered uncovered line itself. */
table.source tr.coverNone:hover td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(240, 68, 56, 0.15) !important;
}

/* Don't highlight uncovered lines before the currently hovered uncovered block. */
table.source tr.coverNone:has(~ tr.noCover ~ tr.coverNone:hover) td.code:after {
    display: none !important;
}

/* Don't label uncovered lines before the currently hovered uncovered block. */
table.source tr.coverNone:has(~ tr.noCover ~ tr.coverNone:hover):after {
    display: none !important;
}

/* Don't highlight uncovered lines after the currently hovered uncovered block. */
table.source tr.coverNone:hover ~ tr.noCover ~ tr.coverNone td.code:after {
    display: none !important;
}

/* Don't label uncovered lines after the currently hovered uncovered block. */
table.source tr.coverNone:hover ~ tr.noCover ~ tr.coverNone:after {
    display: none !important;
}

/*
 * "Covered code" label appears above the FIRST row of a covered block when any row in that block is hovered.
 */
table.source tr:has(~ tr.coverFull:hover) ~ tr:not(.coverFull) + tr.coverFull:after {
    content: "Covered code";
    display: flex;
    position: absolute;
    right: 5px;
    top: -23px;
    background: rgba(18, 183, 106, 0.15);
    color: rgb(118, 175, 141);
    padding: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 23px;
    align-items: center;
    font-family: monospace;
    z-index: 2;
}

/*
 * Mutation coverage override: replace "Covered code" with "All mutations killed".
 */
table.source:has(tr.mutation) tr:has(~ tr.coverFull:hover) ~ tr:not(.coverFull) + tr.coverFull:after {
    content: "All mutations killed";
}

/* Highlight subsequent covered lines after the hovered covered line. */
table.source tr.coverFull:hover ~ tr.coverFull td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(18, 183, 106, 0.15) !important;
}

/* Highlight preceding covered lines before the hovered covered line. */
table.source tr.coverFull:has(~ tr.coverFull:hover) td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(18, 183, 106, 0.15) !important;
}

/* Highlight the hovered covered line itself. */
table.source tr.coverFull:hover td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(18, 183, 106, 0.15) !important;
}

/* Don't highlight covered lines before the currently hovered covered block. */
table.source tr.coverFull:has(~ tr.noCover ~ tr.coverFull:hover) td.code:after {
    display: none !important;
}

/* Don't label covered lines before the currently hovered covered block. */
table.source tr.coverFull:has(~ tr.noCover ~ tr.coverFull:hover):after {
    display: none !important;
}

/* Don't highlight covered lines after the currently hovered covered block. */
table.source tr.coverFull:hover ~ tr.noCover ~ tr.coverFull td.code:after {
    display: none !important;
}

/* Don't label covered lines after the currently hovered covered block. */
table.source tr.coverFull:hover ~ tr.noCover ~ tr.coverFull:after {
    display: none !important;
}

/*
 * "Partially covered code" label appears above the FIRST row of a 
 * partially-covered block when any row in that block is hovered.
 */
table.source tr:has(~ tr.coverPart:hover) ~ tr:not(.coverPart) + tr.coverPart:after {
    content: "Partially covered code";
    display: flex;
    position: absolute;
    right: 5px;
    top: -23px;
    background-color: rgba(255, 165, 0, 0.15);
    color: rgb(255, 165, 0);
    padding: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 23px;
    align-items: center;
    font-family: monospace;
    z-index: 2;
}

/*
 * Mutation coverage override: replace "Partially covered code" with "Some mutations survived".
 */
table.source:has(tr.mutation) tr:has(~ tr.coverPart:hover) ~ tr:not(.coverPart) + tr.coverPart:after {
    content: "Some mutations survived";
}

/* Highlight subsequent partially covered lines after the hovered line. */
table.source tr.coverPart:hover ~ tr.coverPart td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(255, 165, 0, 0.15) !important;
}

/* Highlight preceding partially covered lines before the hovered line. */
table.source tr.coverPart:has(~ tr.coverPart:hover) td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(255, 165, 0, 0.15) !important;
}

/* Highlight the hovered partially covered line itself. */
table.source tr.coverPart:hover td.code:after {
    content: "";
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(255, 165, 0, 0.15) !important;
}

/* Don't highlight partially covered lines before the currently hovered block. */
table.source tr.coverPart:has(~ tr.noCover ~ tr.coverPart:hover) td.code:after {
    display: none !important;
}

/* Don't label partially covered lines before the currently hovered block. */
table.source tr.coverPart:has(~ tr.noCover ~ tr.coverPart:hover):after {
    display: none !important;
}

/* Don't highlight partially covered lines after the currently hovered block. */
table.source tr.coverPart:hover ~ tr.noCover ~ tr.coverPart td.code:after {
    display: none !important;
}

/* Don't label partially covered lines after the currently hovered block. */
table.source tr.coverPart:hover ~ tr.noCover ~ tr.coverPart:after {
    display: none !important;
}

/* --- General row hover: light blue-grey background --- */
table.source tr:hover td.line,
table.source tr:hover td.hits,
table.source tr:hover td.code {
    background: rgb(239, 242, 249);
}

/* Override hover for coverage-typed rows to use same neutral grey */
table.source tr.coverNone:hover td.line,
table.source tr.coverNone:hover td.hits,
table.source tr.coverNone:hover td.code {
    background: rgb(239, 242, 249) !important;
}

table.source tr.coverFull:hover td.line,
table.source tr.coverFull:hover td.hits,
table.source tr.coverFull:hover td.code {
    background: rgb(239, 242, 249) !important;
}

table.source tr.coverPart:hover td.line,
table.source tr.coverPart:hover td.hits,
table.source tr.coverPart:hover td.code {
    background: rgb(239, 242, 249) !important;
}

/* --- Hits column: position:relative so ::after stripe is positioned correctly --- */
table.source tr td.hits {
    position: relative;
    padding-right: 6px;
    display: flex;
    align-items: center;
    justify-content: right;
    min-height: 23px;
}

/* td.code needs position:relative for the ::after overlay pseudo-element */
table.source tr td.code {
    position: relative;
}

/* --- 5px colored stripe on the right edge of the hits column --- */
table.source tr td.hits:after {
    content: "";
    position: absolute;
    right: -1px;
    display: inline-block;
    width: 5px;
    height: 23px;
}

/* Green stripe for fully covered lines */
table.source tr.coverFull td.hits:after {
    background-color: rgb(166, 244, 197);
}

/* Red stripe for uncovered lines */
table.source tr.coverNone td.hits:after {
    background-color: rgb(217, 45, 32);
}

/* Orange stripe for partially covered lines */
table.source tr.coverPart td.hits:after {
    background-color: rgb(255, 165, 0);
}

/* Ensure line/hits columns for uncovered rows keep default background */
table.source tr.coverNone td.line {
    background-color: var(--background-color) !important;
}

table.source tr.coverNone td.hits {
    background-color: var(--background-color) !important;
}

/* --- Skipped lines --- */
table.source tr.coverSkip {
    background-color: #b4b4b4 !important;
}