/* Overall bracket area */

.brackets-viewer {
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-body-color) !important;
}

.brackets-viewer h3 {
    background: none;
}

/* Stage and round headings */

.brackets-viewer .stage-title,
.brackets-viewer .round-title {
    color: var(--bs-body-color) !important;
}


/* Participant rows */

.brackets-viewer .participant {
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-body-color) !important;
}


/* Participant names and scores */

.brackets-viewer .participant .name,
.brackets-viewer .participant .result {
    color: var(--bs-body-color) !important;
}

.brackets-viewer .participant .name > span {
    color: var(--bs-body-color) !important;
}


/* Winner */

.brackets-viewer .participant.win,
.brackets-viewer .participant.winner {
    background-color: rgba(
        var(--bs-success-rgb),
        0.2
    ) !important;

    font-weight: 700;
}

.participant.win .name, .participant.win .result, .participant.win .name > span {
    color: var(--bs-success) !important;
}

/* Hover */

.brackets-viewer .match:hover {
    border-color: var(--bs-primary) !important;
    box-shadow: var(--bs-box-shadow-sm);
}

.brackets-viewer .result {
    min-width: 3rem;
    width: 3rem;
    text-align: center;
    white-space: nowrap;
}

.brackets-viewer .match {
    width: 220px;
}

/* Consolation Matches section */

.consolation-sector-name {
    overflow-wrap: anywhere;
}

.consolation-matchup-card {
    border-color: var(--bs-border-color);
}

/* Consolation matchups */

.consolation-matchup-card {
    border:
        1px solid
        var(--bs-border-color);

    border-radius:
        0.65rem;

    overflow:
        hidden;

    transition:
        transform 0.15s ease,
        box-shadow 0.15s ease,
        border-color 0.15s ease;
}


.consolation-matchup-card:hover {
    transform:
        translateY(-2px);

    box-shadow:
        var(--bs-box-shadow-sm);
}


.consolation-completed-card {
    border-top:
        3px solid
        var(--bs-success);
}


.consolation-matchup-grid {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);

    align-items:
        center;

    gap:
        1rem;

    min-height:
        5.75rem;
}


.consolation-sector {
    min-width:
        0;

    text-align:
        center;

    transition:
        opacity 0.15s ease;
}


.consolation-sector-heading {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        0.4rem;

    min-height:
        2.5rem;
}


.consolation-sector-name {
    font-size:
        1rem;

    line-height:
        1.2;

    overflow-wrap:
        anywhere;
}


.consolation-score {
    margin-top:
        0.45rem;

    font-size:
        1.45rem;

    line-height:
        1;

    font-weight:
        500;

    font-variant-numeric:
        tabular-nums;
}


.consolation-winner
.consolation-sector-name,
.consolation-winner
.consolation-score {
    font-weight:
        700;
}


.consolation-winner
.consolation-score {
    color:
        var(--bs-success);
}


.consolation-loser {
    opacity:
        0.62;
}


.consolation-trophy {
    flex:
        0 0 auto;

    color:
        var(--bs-warning);

    font-size:
        0.95rem;
}


.consolation-vs {
    color:
        var(--bs-secondary-color);

    font-size:
        0.85rem;

    font-weight:
        700;

    letter-spacing:
        0.05em;
}


.consolation-matchup-footer {
    margin-top:
        1rem;

    padding-top:
        0.85rem;

    border-top:
        1px solid
        var(--bs-border-color);

    text-align:
        center;
}


.consolation-status-label {
    color:
        var(--bs-secondary-color);

    font-size:
        0.75rem;

    font-weight:
        700;

    letter-spacing:
        0.12em;
}


.consolation-bye-card {
    background:
        var(--bs-tertiary-bg);
}


.consolation-bye-sector {
    font-size:
        1.15rem;

    font-weight:
        700;
}


.consolation-score-empty {
    color:
        var(--bs-secondary-color);
}


/* Dark mode */

[data-bs-theme="dark"]
.consolation-matchup-card {
    background:
        var(--bs-body-bg);
}


[data-bs-theme="dark"]
.consolation-completed-card {
    border-top-color:
        var(--bs-success);
}


[data-bs-theme="dark"]
.consolation-winner
.consolation-score {
    color:
        var(--bs-success-text-emphasis);
}


/* Mobile */

@media (max-width: 575.98px) {

    .consolation-matchup-grid {
        gap:
            0.65rem;
    }


    .consolation-sector-name {
        font-size:
            0.9rem;
    }


    .consolation-score {
        font-size:
            1.25rem;
    }

}