/* =========================================================
   MeinBetrieb – Splash Screen (Dark, Clean & Custom)
   Passend zur Struktur in MeinSplash.razor
   ========================================================= */

/* 1) Den absoluten Hintergrund zwingen (Vollbild, dunkel, zentriert) */
.mb-splash {
    background: radial-gradient(1200px 700px at 35% 20%, #1b2024 0%, #0f1113 55%, #0b0d0f 100%) !important;
    background-color: #0b0d0f !important;
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 99999 !important;
}

/* 2) Die innere Box sauber formatieren */
.mb-splash-box {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3) Dein Logo groß, responsive und mit geilem Schatten */
.mb-splash-logo {
    width: clamp(160px, 22vw, 360px) !important;
    height: auto !important;
    background-color: transparent !important;
    filter: drop-shadow(0 10px 28px rgba(0,0,0,.55)) !important;
    margin-bottom: 24px !important;
}

/* 4) Ladetext ("Lädt...") dezent und sauber */
.mb-splash-sub {
    color: rgba(232, 234, 237, 0.8) !important;
    font-size: 16px !important;
    font-family: inherit !important;
    letter-spacing: 1px !important;
}

/* 5) Bonus: Die drei Punkte (...) sanft blinken lassen */
.mb-dots {
    animation: mb-blink 1.5s infinite;
}

@keyframes mb-blink {
    0% {
        opacity: 0.2;
    }

    20% {
        opacity: 1;
    }

    100% {
        opacity: 0.2;
    }
}