@media (prefers-color-scheme: dark) {
    body {
        color: white;
        background-color: black;
    }

    tr:nth-child(odd) {
        background-color: #ffe4c433;
    }

    td:nth-child(odd) {
        background-color: #f5f5dc33;
    }

    .pass {
        color: greenyellow;
    }

    .fail {
        color: lightcoral;
    }

    .tooltip>span {
        color: white;
        background-color: black;
        border-color: white;
    }
}

@media (prefers-color-scheme: light) {
    body {
        color: black;
        background-color: white;
    }

    tr:nth-child(odd) {
        background-color: #ffe4c4aa;
    }

    td:nth-child(odd),
    th:nth-child(odd) {
        background-color: #f5f5dcaa;
    }

    .pass {
        color: green;
    }

    .fail {
        color: red;
    }

    .tooltip>span {
        color: black;
        background-color: white;
        border-color: black;
    }
}

tr td {
    padding: 1rem;
}

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

div.tooltip {
    width: 100%;
    height: 100%;
}

.tooltip>span {
    visibility: hidden;
    border-radius: 6px;
    border: 2px solid;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
}

.tooltip:hover>span {
    visibility: visible;
}