/**
 * Gravity Forms afgestemd op het Kwizzuth-thema.
 *
 * Deze stylesheet laadt ná de Orbital-stylesheet van Gravity Forms
 * (dependency in includes/gravity-forms.php), zodat de regels hieronder
 * zonder !important winnen. style.css zelf laadt juist vóór GF en is
 * daarom niet de plek voor deze regels.
 *
 * Doel: dezelfde maatvoering als het Bootstrap-formulier dat hier met
 * Contact Form 7 stond — .form-control, .btn-primary en de kleuren uit
 * :root in style.css.
 */

.gform_wrapper.gform-theme {
	/* Bootstrap zet 1rem tussen velden (.form-group), Orbital standaard 40px. */
	--gf-form-gap-y: 1rem;
	--gf-field-gap-y: 1rem;

	/* Foutkleur van het thema (Bootstrap danger) i.p.v. GF-oranjerood. */
	--gf-ctrl-desc-color-error: #dc3545;
	--gf-ctrl-border-color-error: #dc3545;
	--gf-local-color-error: #dc3545;
}

/* Invoervelden op 1rem, gelijk aan .form-control. Orbital gebruikt 14px. */
.gform_wrapper.gform-theme .gfield input,
.gform_wrapper.gform-theme .gfield select,
.gform_wrapper.gform-theme .gfield textarea {
	font-size: 1rem;
}

/* Focus zoals de CF7-regels 'm hadden: gele rand, geen gloed. */
.gform_wrapper.gform-theme .gfield input:focus,
.gform_wrapper.gform-theme .gfield select:focus,
.gform_wrapper.gform-theme .gfield textarea:focus {
	border-color: #fdf151;
	box-shadow: none;
	outline: 0;
}

/* Labels: Bootstrap-gewicht 400, niet Orbital's 500. */
.gform_wrapper.gform-theme .gfield_label {
	font-weight: 400;
	margin-bottom: 0.5rem;
}

/* Verplicht-sterretje direct achter het label, zoals de CF7-labels ("Naam*"). */
.gform_wrapper.gform-theme .gfield_label {
	--gf-label-req-gap: 0;
}

.gform_wrapper.gform-theme .gfield_label .gfield_required,
.gform_wrapper.gform-theme .gfield_label .gfield_required_asterisk {
	margin-left: 0;
	font-size: inherit;
	color: inherit;
}

/*
 * CF7 toonde geen tekenteller onder het berichtveld (wel maxlength).
 * De GF-teller is bovendien niet vertaald, dus die laten we weg.
 */
.gform_wrapper.gform-theme .ginput_counter {
	display: none;
}

/* Knop erft .btn .btn-primary uit style.css; alleen de maatvoering terug. */
.gform_wrapper.gform-theme .gform_footer .gform_button {
	height: auto;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
}

/* Bevestiging: wit op groen, zoals de CF7-response-output in het thema. */
.gform_confirmation_message {
	padding: 0.75rem 1.25rem;
	margin: 1rem 0 0;
	border: 1px solid #28a745;
	border-radius: 0;
	background-color: #28a745;
	color: #fff;
}

/* Formulierbrede foutmelding: wit op rood, idem. */
.gform_wrapper .gform_validation_errors {
	padding: 0.75rem 1.25rem;
	margin: 0 0 1rem;
	border: 1px solid #dc3545;
	border-radius: 0;
	background-color: #dc3545;
	box-shadow: none;
}

.gform_wrapper .gform_validation_errors > h2.gform_submission_error {
	margin: 0;
	padding: 0;
	font-size: 1rem;
	font-weight: 400;
	color: #fff;
}

.gform_wrapper .gform_validation_errors > h2.gform_submission_error .gform-icon {
	display: none;
}

/* De links naar de foute velden staan op rood: wit, anders onleesbaar. */
.gform_wrapper .gform_validation_errors ol {
	margin: 0.5rem 0 0;
	padding-left: 1.25rem;
}

.gform_wrapper .gform_validation_errors ol li a.gform_validation_error_link,
.gform_wrapper .gform_validation_errors ol li a.gform_validation_error_link:hover,
.gform_wrapper .gform_validation_errors ol li a.gform_validation_error_link:focus {
	color: #fff;
	text-decoration: underline;
}

/* In CF7 stonden de telefoonlabels op d-none d-sm-block. */
@media (max-width: 575.98px) {
	.gform_wrapper .gfield.kw-label-sm-up > .gfield_label {
		display: none;
	}
}

/*
 * De honeypot moet verborgen blijven. Wordt hij zichtbaar, dan vult een
 * bezoeker hem in en markeert Gravity Forms elke inzending als spam.
 */
.gform_wrapper .gform_validation_container {
	display: none !important;
}