/* Gestaltung des Kontaktformulars (lokales PHP-Formular). */

.contact-form .form-group {
    position: relative;
    margin-bottom: 25px;
}

.contact-form textarea.form-control {
    height: auto;
}

.contact-form .mandatory {
    margin-left: 2px;
    color: #c33b3b;
}

/* Fehlerzustand: rote Umrandung, Text und Symbol (nicht nur Farbe) */
.contact-form .form-control.is-invalid {
    border: 2px solid #c33b3b;
    background-color: #ffffff;
    box-shadow: none;
}

.contact-form .field-error {
    display: block;
    margin-top: 4px;
    color: #c33b3b;
    font-size: 90%;
}

.contact-form .field-error::before {
    content: "\26A0\00a0";
}

.form-error-summary ul {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
}

.form-error-summary a {
    color: inherit;
    text-decoration: underline;
}

.form-error-summary:focus,
.alert:focus {
    outline: 2px solid #c33b3b;
    outline-offset: 2px;
}

#form-success:focus {
    outline-color: #3c763d;
}

/* Honeypot: für Besucher unsichtbar, nicht per Tastatur erreichbar */
.hp-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ALTCHA-Widget */
altcha-widget {
    display: block;
    max-width: 24rem;
    --altcha-max-width: 100%;
}

#field-altcha.has-danger altcha-widget {
    outline: 2px solid #c33b3b;
    outline-offset: 2px;
}

@media (max-width: 575px) {
    .contact-form .btn-primary {
        width: 100%;
        padding: 0.75rem 1rem;
    }
}