/*
 * Formigacrew SSP Design
 *
 * Primärblau:  #0b4f7c
 * Dunkelblau:  #082f4a
 * Hellblau:    #d9edf7
 * Akzentblau:  #1677a8
 */

/* Grunddarstellung */
html,
body {
    min-height: 100%;
}

body {
    color: #102f43;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-size: cover !important;
    background-attachment: fixed !important;
}

/* Hauptbereich ruhig und lesbar */
.card,
.main,
.main-container {
    background-color: rgba(244, 249, 252, 0.94);
    border-color: rgba(76, 133, 169, 0.55);
}

/* Überschriften */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #082f4a;
}

/* Kopfbereich und neutrale Informationsflächen */
.card-header,
.alert-info {
    color: #082f4a;
    background-color: rgba(217, 237, 247, 0.96);
    border-color: #86b7d2;
}

/* Erfolgsflächen in Blau statt SSP-Grün */
.alert-success {
    color: #073552;
    background-color: rgba(218, 237, 247, 0.96);
    border-color: #70a8c8;
}

/*
 * Warnungen und Fehler behalten ihre semantischen Farben,
 * werden aber etwas ruhiger dargestellt.
 */
.alert-warning {
    color: #654b00;
    background-color: rgba(255, 246, 213, 0.97);
    border-color: #d9b957;
}

.alert-danger {
    color: #76252d;
    background-color: rgba(251, 232, 234, 0.97);
    border-color: #ce7a83;
}

/* Formulare */
.form-control,
.form-select,
.input-group-text {
    border-color: #9dbfd3;
}

.form-control:focus,
.form-select:focus {
    border-color: #1677a8;
    box-shadow: 0 0 0 0.2rem rgba(22, 119, 168, 0.22);
}

.input-group-text {
    color: #082f4a;
    background-color: #edf6fa;
}

/* Formigacrew-Schaltflächen */
.btn-primary,
.btn-success {
    color: #ffffff;
    background-color: #0b4f7c;
    border-color: #0b4f7c;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-success:hover,
.btn-success:focus {
    color: #ffffff;
    background-color: #083b5e;
    border-color: #083b5e;
}

.btn-primary:active,
.btn-success:active {
    background-color: #062f4b !important;
    border-color: #062f4b !important;
}

/* Links */
a {
    color: #0b5f91;
}

a:hover,
a:focus {
    color: #073d60;
}

/* Fortschrittsanzeige */
.progress {
    background-color: #dbe8ef;
}

.progress-bar {
    background-color: #1677a8;
}

/* Logo klar, aber nicht überdimensioniert */
.logo,
.menu-logo {
    object-fit: contain;
}

/* Smartphone und Tablet hochkant */
@media (max-width: 991.98px) and (orientation: portrait) {
    body {
        background-image:
            url("/ssp-branding/fcbg_h.png") !important;
        background-position: center top !important;
        background-size: cover !important;
        background-attachment: scroll !important;
    }

    .container {
        width: 100%;
        max-width: 100%;
        padding-right: 0.75rem;
        padding-left: 0.75rem;
    }

    .card,
    .main,
    .main-container {
        background-color: rgba(244, 249, 252, 0.95);
    }

    h1 {
        font-size: 1.65rem;
    }

    .logo {
        max-height: 110px;
        width: auto;
    }
}

/* Kleine Smartphones */
@media (max-width: 575.98px) {
    body {
        font-size: 0.95rem;
    }

    h1 {
        font-size: 1.4rem;
    }

    .logo {
        max-height: 90px;
    }

    .btn {
        min-height: 42px;
    }
}

/*
 * Formigacrew Clean Background
 *
 * Desktop:
 * Ruhiger dunkelblauer Verlauf ohne konkurrierendes Hintergrundlogo.
 *
 * Smartphone und Tablet hochkant:
 * Hochkantmotiv mit starker blauer Abdunklung.
 */

/* Desktop und Tablet im Querformat */
body {
    background-color: #061522 !important;
    background-image:
        radial-gradient(
            circle at 18% 12%,
            rgba(22, 119, 168, 0.24) 0,
            rgba(22, 119, 168, 0.08) 28%,
            transparent 48%
        ),
        radial-gradient(
            circle at 82% 88%,
            rgba(11, 79, 124, 0.22) 0,
            transparent 42%
        ),
        linear-gradient(
            145deg,
            #05131f 0%,
            #08283e 48%,
            #0a3552 100%
        ) !important;

    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: cover !important;
    background-attachment: fixed !important;
}

/* Der Inhaltsbereich hebt sich ruhig vom Hintergrund ab */
.card,
.main,
.main-container {
    background-color: rgba(242, 248, 252, 0.96);
    border: 1px solid rgba(117, 165, 192, 0.58);
    box-shadow:
        0 1rem 2.5rem rgba(0, 12, 22, 0.30),
        0 0 0 1px rgba(255, 255, 255, 0.22);
}

/* Smartphone und Tablet im Hochformat */
@media (max-width: 991.98px) and (orientation: portrait) {
    body {
        background-color: #061522 !important;
        background-image:
            linear-gradient(
                rgba(4, 24, 39, 0.78),
                rgba(6, 34, 54, 0.84)
            ),
            url("/ssp-branding/fcbg_h.png") !important;

        background-repeat: no-repeat !important;
        background-position: center top !important;
        background-size: cover !important;
        background-attachment: scroll !important;
    }

    .card,
    .main,
    .main-container {
        background-color: rgba(242, 248, 252, 0.96);
        box-shadow: 0 0.75rem 2rem rgba(0, 12, 22, 0.32);
    }
}

/* Sehr kleine Smartphones: etwas stärkere Abdunklung */
@media (max-width: 575.98px) and (orientation: portrait) {
    body {
        background-image:
            linear-gradient(
                rgba(4, 24, 39, 0.84),
                rgba(6, 34, 54, 0.89)
            ),
            url("/ssp-branding/fcbg_h.png") !important;
    }
}

/*
 * Formigacrew Solid Background
 *
 * Bewusst ohne Hintergrundbild, Verlauf oder Dekoration.
 * Logo und Marke befinden sich ausschließlich im Inhaltsbereich.
 */
html,
body {
    background: #041522 !important;
    background-color: #041522 !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}

/*
 * SSP verwendet je nach Version Backstretch für das Hintergrundbild.
 * Der Container wird ausdrücklich deaktiviert.
 */
.backstretch,
#background_url {
    display: none !important;
    background-image: none !important;
}

/* Auch auf Smartphone und Tablet ausschließlich Dunkelblau */
@media (max-width: 991.98px) {
    html,
    body {
        background: #041522 !important;
        background-color: #041522 !important;
        background-image: none !important;
    }

    .backstretch,
    #background_url {
        display: none !important;
    }
}

/*
 * Formigacrew Logo Size
 *
 * Das Quellbild besitzt 150 × 150 Pixel und wird deshalb auf
 * Desktop nahezu in Originalgröße dargestellt.
 */
.logo {
    display: block !important;
    width: 188px !important;
    height: 188px !important;
    max-width: 188px !important;
    max-height: 188px !important;
    object-fit: contain !important;
    margin: 1.25rem auto !important;
}

/* Kleineres, aber weiterhin gut sichtbares Logo im Menü */
.menu-logo {
    width: 54px !important;
    height: 54px !important;
    max-width: 54px !important;
    max-height: 54px !important;
    object-fit: contain !important;
}

/* Smartphone und Tablet */
@media (max-width: 991.98px) {
    .logo {
        width: 140px !important;
        height: 140px !important;
        max-width: 140px !important;
        max-height: 140px !important;
        margin: 1rem auto !important;
    }

    .menu-logo {
        width: 46px !important;
        height: 46px !important;
        max-width: 46px !important;
        max-height: 46px !important;
    }
}
