body {
    font-family: DejaVu Sans Mono, Noto Sans Mono, Hack, monospace;
    width: min(720px, 90%);
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.headerDiv {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.serviceContainer {
    margin-top: 2rem;
    list-style-type: none;
    padding: 0;
}

.service {
    display: flex;
    text-align: left;
    justify-content: space-between;

    margin: auto;
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
    padding: 0.5rem;

    border-radius: 0.5rem;
}

/* .serviceMain {
    
} */

.serviceStatusText {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.serviceName {
    font-weight: bold;
}

.serviceUp {
    background-color: rgba(31, 164, 93, 0.3);
    color: rgb(9, 49, 28);
}

.serviceUp a {
    color: rgb(9, 49, 28);
}

.serviceDown {
    background-color: rgba(255, 0, 0, 0.3);
    color: rgb(77, 0, 0);
}

.serviceDown a {
    color: rgb(77, 0, 0);
}

.tooltip {
    position: relative;
    display: inline-block;
    max-width: 50%;
}

.tooltip .tooltipText {
    visibility: hidden;
    width: min-content;
    background-color: rgba(0, 0, 0, 0.9);
    color: #cccccc;
    text-align: center;
    border-radius: 0.5rem;
    padding: 0.5rem;
    position: absolute;
    bottom: 125%;
    left: 0;
    opacity: 0;
    transition: opacity 0.2s;
}

.tooltip:hover .tooltipText {
    visibility: visible;
    opacity: 1;
}

.footer {
    justify-content: center;
    margin-top: 2rem;
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: #111111;
        color: #cccccc;
    }

    .serviceUp {
        background-color: rgba(31, 164, 93, 0.2);
        color: rgb(192, 230, 210);
    }

    .serviceUp a {
        color: rgb(192, 230, 210);
    }

    .serviceDown {
        background-color: rgba(255, 0, 0, 0.2);
        color: rgb(255, 214, 214);
    }

    .serviceDown a {
        color: rgb(255, 214, 214);
    }

    .tooltip .tooltipText {
        background-color: #cccccc;
        color: #000;
    }
}