.dares-alarm-banner {
    border-top: 1px solid rgb(0 0 0 / 10%);
    font-size: 0.85rem;
    font-weight: 700;
    padding: 0.5rem 0;
    text-align: center;
    text-transform: uppercase;
}

.dares-alarm-banner .container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.6rem;
    justify-content: center;
}

.dares-alarm-banner__description {
    font-weight: 400;
    text-transform: none;
}

.dares-status-groen {
    background-color: #28a745;
    color: #fff;
}

.dares-status-geel {
    background-color: #ffc107;
    color: #212529;
}

.dares-status-oranje {
    background-color: #fd7e14;
    color: #fff;
}

.dares-status-rood {
    background-color: #dc3545;
    color: #fff;
}

.dares-status-onbekend {
    background-color: #6c757d;
    color: #fff;
}

.dares-alarm-card {
    border: 0;
    width: 100%;
}

.dares-alarm-card__title {
    align-items: center;
    background: var(--dares-yellow, #ffc107);
    border: 0;
    display: flex;
    font-size: 1rem;
    gap: 0.5rem;
    line-height: 1.25;
    margin-bottom: 0;
}

.dares-alarm-card__help {
    color: #6c757d;
    font-size: 0.9rem;
    line-height: 1.4;
}

.dares-alarm-table,
.dares-alarm-legend {
    font-size: 0.95rem;
    margin-bottom: 1rem;
}

.dares-alarm-table th {
    font-weight: 700;
}

.dares-alarm-table a {
    color: var(--dares-green, #2e7d32);
    text-decoration: none;
}

.dares-alarm-table a:hover {
    text-decoration: underline;
}

.dares-status-badge {
    border-radius: 999px;
    display: inline-block;
    min-width: 4.5rem;
    padding: 0.45rem 0.75rem;
    text-align: center;
}

.dares-alarm-legend .dares-status-badge {
    display: block;
    min-width: 0;
}

.dares-alarm-legend th {
    width: 30%;
}

.dares-alarm-unavailable {
    margin-bottom: 0;
}

@media (max-width: 575.98px) {
    .dares-alarm-banner {
        font-size: 0.75rem;
    }

    .dares-alarm-legend th {
        width: 35%;
    }
}