/* ============================================================
   HOMEPAGE – CUSTOM CSS
   Minimalistisch, clean, professionell
   ============================================================ */

/* ─── HEADER ──────────────────────────────────────────────────────────────── */
header {
    backdrop-filter: blur(12px) !important;
    background: rgba(15, 23, 42, 0.7) !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1) !important;
}

/* ─── SERVICE-KARTEN ──────────────────────────────────────────────────────── */
.service-card {
    border-radius: 12px !important;
    border: 1px solid rgba(148, 163, 184, 0.15) !important;
    background: rgba(30, 41, 59, 0.6) !important;
    backdrop-filter: blur(8px) !important;
    transition: all 0.2s ease !important;
}

.service-card:hover {
    border-color: rgba(148, 163, 184, 0.4) !important;
    background: rgba(30, 41, 59, 0.85) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

/* ─── WIDGET-BEREICH ──────────────────────────────────────────────────────── */
.widget {
    background: rgba(30, 41, 59, 0.5) !important;
    border: 1px solid rgba(148, 163, 184, 0.1) !important;
    border-radius: 12px !important;
    backdrop-filter: blur(6px) !important;
}

/* ─── DATUM / UHR ─────────────────────────────────────────────────────────── */
#datetime {
    font-weight: 400 !important;
    letter-spacing: 0.02em !important;
}

/* ─── SUCHLEISTE ──────────────────────────────────────────────────────────── */
.search-bar {
    border-radius: 10px !important;
    background: rgba(30, 41, 59, 0.5) !important;
    border: 1px solid rgba(148, 163, 184, 0.15) !important;
    backdrop-filter: blur(6px) !important;
}

.search-bar:focus-within {
    border-color: rgba(148, 163, 184, 0.4) !important;
    box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.1) !important;
}

/* ─── GRUPPEN-ÜBERSCHRIFTEN ──────────────────────────────────────────────── */
.group-heading {
    color: #94a3b8 !important;
    font-weight: 500 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    font-size: 0.75rem !important;
    opacity: 0.8 !important;
}

/* ─── STATUS-PUNKTE ───────────────────────────────────────────────────────── */
.status-dot {
    opacity: 0.8 !important;
}

/* ─── SCROLLBAR ───────────────────────────────────────────────────────────── */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.2);
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(148, 163, 184, 0.4);
}