/* =========================================
   Booking / Anfrageformular
   ========================================= */


.booking-form {
    max-width: 720px;
    margin-top: 45px;
}



/* -----------------------------------------
   Einzelne Formularfelder
   ----------------------------------------- */

.booking-form .form-field {
    margin-bottom: 1em;
}



/* -----------------------------------------
   Alle Beschriftungen
   ----------------------------------------- */

.booking-form label,
.booking-form legend {

    display: block;

    margin-bottom: 0.5em;

    font-size: 0.8em;
    line-height: 1.4;

}



/* -----------------------------------------
   Normale Eingabefelder
   ----------------------------------------- */

.booking-form input[type="text"],
.booking-form input[type="email"] {

   width: 50%;
    box-sizing: border-box;

    padding: 7px 12px;

    border: 1px solid #d2d2d2;
    border-radius: 5px;

    background: #fff;
    color: #333;

    font-family: inherit;
    font-size: 1em;
    line-height: 1.4;

}



/* -----------------------------------------
   Projektbeschreibung
   ----------------------------------------- */

.booking-form textarea {

     width: 100%;
    box-sizing: border-box;

    min-height: 105px;

    padding: 7px 12px;

    border: 1px solid #d2d2d2;
    border-radius: 5px;

    background: #fff;
    color: #333;

    font-family: inherit;
    font-size: 1em;
    line-height: 1.4;

    resize: vertical;

}



/* -----------------------------------------
   Fokus
   ----------------------------------------- */

.booking-form input[type="text"]:focus,
.booking-form input[type="email"]:focus,
.booking-form textarea:focus {

    border-color: #999;

}



/* -----------------------------------------
   Verwendung Illustration
   ----------------------------------------- */

.booking-form fieldset {

    border: 0;

    padding: 0;

    margin: 0;

}


.booking-form fieldset legend {

    padding: 0;

}



/* Checkbox-Bereich */

.booking-checkboxes {

    display: flex;

    flex-wrap: wrap;

    gap: 12px 25px;

}


.booking-checkboxes label {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    margin: 0;

    font-size: 0.8em;

}


.booking-checkboxes input[type="checkbox"] {

    margin: 0;

}



/* -----------------------------------------
   Datenschutz
   ----------------------------------------- */

.booking-privacy {

    display: flex !important;

    align-items: flex-start;

    gap: 8px;

    font-size: 0.8em !important;

    line-height: 1.5;

}


.booking-privacy input[type="checkbox"] {

    margin-top: 4px;

    flex: 0 0 auto;

}



/* -----------------------------------------
   Button
   -----------------------------------------

   Kein Styling:
   wird über deine bestehende Button-Vorlage
   gesteuert.

*/


/* -----------------------------------------
   Mobile Darstellung
   ----------------------------------------- */

@media (max-width: 700px) {


    .booking-form {

        width: 100%;

        margin-top: 30px;

    }


    .booking-form input[type="text"],
    .booking-form input[type="email"] {

        width: 100%;

    }


    .booking-form textarea {

        width: 100%;

    }


    .booking-checkboxes {

        display: block;

    }


    .booking-checkboxes label {

        margin-bottom: 10px;

    }


}