/*
* Wichtig: Stellen Sie sicher, dass der Pfad zu Ihrem Logobild korrekt ist.
* Ich habe hier "logo.png" als Beispiel verwendet.
*/

.container_custom {
    /*
     * Wir fügen hier das Firmenlogo und einen linearen Farbverlauf als Hintergrundbilder hinzu.
     * Der Farbverlauf beginnt oben rechts mit einem transparenten Weiß und geht in ein dunkles Blau über.
     * Das Logo liegt über dem Farbverlauf.
     */
    background-image: url("./../img/Design ohne Titel.png"), linear-gradient(to bottom left, rgba(255, 255, 255, 0.8) 0%, #007bff 100%);
    
    /*
     * Hier definieren wir die Positionen für beide Bilder.
     * Das Logo wird 20px vom oberen und rechten Rand platziert.
     */
    background-position: top 20px right 20px, center;
    
    /*
     * Hier geben wir an, dass beide Bilder nicht wiederholt werden sollen.
     */
    background-repeat: no-repeat, no-repeat;
    
    /*
     * Die Größe wird ebenfalls für beide Bilder separat festgelegt.
     * Wir geben dem Logo eine feste Breite von 150px und lassen den Farbverlauf den Container ausfüllen.
     */
    background-size: 150px, cover;
    
    /* Die Höhe wird auf die volle Bildschirmhöhe gesetzt */
    height: 100vh;
}

.row_custom {
    height: 100vh;
    justify-content: center;
    align-items: center;
}

.custom_card {
    background-color: transparent;
    border-radius: 1rem !important;
    backdrop-filter: blur(20px);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
}
.card-header-custom{
    background-color: #f9c800 !important;
}
.form-control-borderless {
    border: none;
}

.form-control-borderless:hover, .form-control-borderless:active, .form-control-borderless:focus {
    border: none;
    outline: none;
    box-shadow: none;
}