#header-title {
    display: block !important;
    font-size: 2rem;
    font-weight: bold;
}

/* Zwingt die gesamte Widget-Leiste, den Platz maximal zu verteilen */
.widgets-container, div[class*="widgets_"] {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
}

/* Schiebt speziell das Ressourcen-Widget an den rechten Rand */
div[class*="resources_"], #resources-widget {
    margin-left: auto !important;
}

/* Obere Widgets in einer gemeinsamen Zeile */
header .flex.flex-wrap {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2rem !important;
}

/* CustomAPI */
header .flex.flex-wrap > div:nth-child(1) {
    flex: 0 0 auto !important;
}

/* Begrüßung */
header .flex.flex-wrap > div:nth-child(2) {
    flex: 1 1 auto !important;
    text-align: center !important;
}

/* Datum/Uhrzeit */
header .flex.flex-wrap > div:nth-child(3) {
    flex: 0 0 auto !important;
}

ul.services-list {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

@media (max-width: 1200px) {
    ul.services-list {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    ul.services-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 500px) {
    ul.services-list {
        grid-template-columns: 1fr !important;
    }
}

/* Docker-Statuspunkt wie Server-Status darstellen */
.service-container-stats .docker-status-running > div {
    width: 12px !important;
    height: 12px !important;
    border-radius: 9999px !important;
}

/* Statusbereich kompakter */
.service-container-stats {
    padding: 0 !important;
}

.service-container-stats > div {
    padding: 12px !important;
}