/* =========================================================
   DAS FINALE GEMINI-STYLE FORMULAR
   ========================================================= */

/* 1. Die weiße Kachel (breiter, luftiger, eleganter Schatten) */
.visforms-form, 
form[id^="visform"] {
    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 50px 40px !important; /* Viel Luft im Inneren */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    border: 1px solid #f1f5f9 !important;
    max-width: 850px !important; /* Schöne Breite am PC */
    margin: 40px auto !important;
    display: block !important;
    box-sizing: border-box !important;
}

/* 2. Container zwingend auf 100% Breite OHNE Rand-Überhang */
.visforms-form .row,
.visforms-form .visform-row,
.visforms-form .form-group,
.visforms-form div[class*="visform-row"],
.visforms-form .control-group {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important; 
    width: 100% !important;
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    margin-left: 0 !important;  /* Blockiert das Ausbrechen nach links */
    margin-right: 0 !important; /* Blockiert das Ausbrechen nach rechts */
    padding: 0 !important;
}

/* 3. Alle Spalten-Blockaden aufheben */
.visforms-form .control-label,
.visforms-form .field-control,
.visforms-form div[class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 4. Labels (Beschriftungen über den Feldern) */
.visforms-form label {
    display: block !important;
    margin-bottom: 8px !important;
    font-weight: 600 !important;
    color: #002d62 !important;
    font-size: 15px !important;
    white-space: normal !important;
    width: 100% !important;
    text-align: left !important;
}

/* 5. EINGABEFELDER & DROPDOWNS */
.visforms-form input, 
.visforms-form input[type="text"],
.visforms-form input[type="email"],
.visforms-form input[type="tel"],
.visforms-form select, 
.visforms-form textarea,
.visforms-form .form-control {
    width: 100% !important;
    min-width: 100% !important; 
    max-width: 100% !important;
    height: 52px !important; /* Moderne Höhe */
    padding: 0 16px !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    box-sizing: border-box !important;
    display: block !important;
    background-color: #f8fafc !important; /* Dezentes Hellgrau, hebt sich edel ab */
    color: #334155 !important;
    font-size: 15px !important;
    text-overflow: clip !important;
    white-space: normal !important;
}

/* Damit lange Texte im Dropdown voll lesbar bleiben */
.visforms-form select option {
    white-space: normal !important;
    word-wrap: break-word !important;
}

.visforms-form textarea {
    height: auto !important;
    padding: 16px !important;
}

/* 6. Absende-Button */
.visforms-form .visfields-submit,
.visforms-form button[type="submit"] {
    width: 100% !important;
    height: 54px !important;
    background-color: #002d62 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    border: none !important;
    font-weight: 600 !important;
    margin-top: 20px !important;
    cursor: pointer !important;
    font-size: 16px !important;
    transition: 0.3s ease !important;
}

.visforms-form .visfields-submit:hover,
.visforms-form button[type="submit"]:hover {
    background-color: #001a3a !important;
}

/* ==========================================================
   7. HANDY-OPTIMIERUNG (schmalere Ränder, perfekte Skalierung)
   ========================================================== */
@media (max-width: 576px) {
    .visforms-form, 
    form[id^="visform"] {
        padding: 25px 20px !important; 
        margin: 15px auto !important;
        border-radius: 12px !important;
    }
    
    .visforms-form input,
    .visforms-form input[type="text"],
    .visforms-form input[type="email"],
    .visforms-form input[type="tel"],
    .visforms-form select,
    .visforms-form textarea,
    .visforms-form .form-control {
        font-size: 14px !important; 
        min-width: 100% !important;
    }
}