/* Textfarbe vor den Feldern */
.visform label {
    color: #333333;
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

/* Eingabefelder, Textareas, Selects mit grünem Rahmen und eckigen Ecken */
.visform input[type="text"],
.visform input[type="email"],
.visform input[type="tel"],
.visform input[type="password"],
.visform select,
.visform textarea,
.visform input[type="date"],
.visform input[type="datetime-local"],
.visform input[type="time"] {
    border: 2px solid #6f9a40 !important;
    border-radius: 0 !important;
    padding: 8px 12px !important;
    font-size: 1em !important;
    outline: none !important;
    transition: border-color 0.3s ease !important;
    width: 100% !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-clip: padding-box !important;
}

/* Fokus-Effekt für Eingabefelder */
.visform input[type="text"]:focus,
.visform input[type="email"]:focus,
.visform input[type="tel"]:focus,
.visform input[type="password"]:focus,
.visform select:focus,
.visform textarea:focus,
.visform input[type="date"]:focus,
.visform input[type="datetime-local"]:focus,
.visform input[type="time"]:focus {
    border-color: #558533 !important;
    outline: none !important;
}

/* Button in grün mit eckigen Ecken */
.visform button,
.visform input[type="submit"],
.visform input[type="button"],
.visform input[type="reset"] {
    background-color: #6f9a40 !important;
    color: white !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 10px 20px !important;
    font-size: 1em !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
}

/* Button Hover */
.visform button:hover,
.visform input[type="submit"]:hover,
.visform input[type="button"]:hover,
.visform input[type="reset"]:hover {
    background-color: #558533 !important;
}

/* Kalender-Pfeil und -Rand grün (für input[type="date"]) */
.visform input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(38%) sepia(75%) saturate(374%) hue-rotate(75deg) brightness(85%) contrast(85%);
}

/* Checkbox komplett eigenes Design - grün und eckig */
.visform input[type="checkbox"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    border: 2px solid #6f9a40 !important;
    border-radius: 0 !important;
    background-color: white !important;
    cursor: pointer !important;
    vertical-align: middle !important;
    position: relative !important;
    transition: background-color 0.3s ease, border-color 0.3s ease !important;
}

/* Checkbox angehakt: grüner Hintergrund */
.visform input[type="checkbox"]:checked {
    background-color: #6f9a40 !important;
    border-color: #558533 !important;
}

/* Weißes Häkchen als Pseudo-Element */
.visform input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 6px;
    width: 4px;
    height: 9px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Optional: Abstand rechts bei Checkbox-Labels */
.visform label input[type="checkbox"] {
    margin-right: 8px !important;
}

/* Felder mit Abstand zueinander */
.visform .form-group {
    margin-bottom: 15px !important;
}

/* Flexbox für horizontale Anordnung */
.visform .form-row {
    display: flex !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
}

/* Felder blockweise */
.visform input,
.visform select,
.visform textarea {
    display: block !important;
}

/* Textfarbe der Checkbox-Beschriftung */
.visform label[for] {
    color: #333333 !important;
    font-weight: 600 !important;
}