/* Setzt die Höhe der gesamten Seite auf 100% */
html, body {
    height: 100%;
    margin: 0;
    font-family: Arial, sans-serif;
}

/* Stellt sicher, dass die linke Seite weiß bleibt */
.bg-white {
    background-color: #ffffff !important;
}

/* Hintergrundbild für die rechte Seite (wird auf Mobile ausgeblendet) */
.login-bg {
    background: url('../img/login-background.jpg') no-repeat center center;
    background-size: cover;
}

/* Blendet das Bild auf Mobile aus */
@media (max-width: 768px) {
    .login-bg {
        display: none;
    }
}

/* Zentriert das Logo über dem Formular */
.logo {
    width: 100px;
    height: 100px;
    display: block;
    margin-bottom: 20px;
}

/* Zentriert das Formular und setzt die Breite */
form {
    max-width: 350px;
    width: 100%;
    text-align: left;
}

/* Fügt Abstände für das Formular hinzu */
.mb-3 {
    margin-bottom: 1rem;
}

/* Stil für Input-Felder */
.form-control {
    padding: 10px;
    font-size: 14px;
}

/* Placeholder-Text in Grau */
::placeholder {
    color: grey;
    opacity: 1;
}

/* Stil für den Login-Button */
.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
}

.btn-primary:hover {
    background-color: #0056b3;
    border-color: #004085;
}

/* Stil für den "Passwort vergessen"-Link */
.forgot-password {
    color: grey;
    text-decoration: none;
}

.forgot-password:hover {
    text-decoration: underline;
}

/* Labels linksbündig über den Feldern */
.form-label {
    margin-bottom: 5px;
    display: block;
}

h2 {
    font-weight: bold;
}