.gform_wrapper.gform-theme.gform-theme--orbital { --gf-color-primary: var(--color-content-secondary); --gf-color-primary-rgb: 217, 136, 65; --gf-color-primary-contrast: #fff; --gf-color-primary-darker: var(--color-accent-700); --gf-color-secondary: var(--color-content-bg-alt); --gf-color-secondary-contrast: var(--color-content-text); --gf-ctrl-border-color: var(--color-secondary-300); --gf-radius: 0.5rem; }

.gform_wrapper .gform_fields { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: stretch; }
.gform_wrapper .gfield--width-third { flex: 1 1 0; min-width: 12rem; padding: 0 !important; }
.gform_wrapper .gfield--type-submit { flex: 0 0 auto; }

.gform_wrapper .ginput_container input[type="text"], .gform_wrapper .ginput_container input[type="tel"], .gform_wrapper .ginput_container input[type="email"], .gform_wrapper .ginput_container input[type="number"], .gform_wrapper .ginput_container textarea, .gform_wrapper .ginput_container select { width: 100%; padding: 1rem 1.25rem; background: var(--color-content-bg-alt); border: 1px solid var(--color-secondary-300); border-radius: 0.5rem; color: var(--color-content-text); font-family: var(--font-family); font-size: 1rem; line-height: 1.3; transition: border-color 200ms ease, background-color 200ms ease, box-shadow 200ms ease; }
.gform_wrapper .ginput_container input:hover, .gform_wrapper .ginput_container textarea:hover, .gform_wrapper .ginput_container select:hover { border-color: var(--color-content-primary); }
.gform_wrapper .ginput_container input:focus, .gform_wrapper .ginput_container textarea:focus, .gform_wrapper .ginput_container select:focus { outline: none; border-color: var(--color-content-primary); background: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-content-primary) 15%, transparent); }
.gform_wrapper .ginput_container input::placeholder, .gform_wrapper .ginput_container textarea::placeholder { color: var(--color-content-faded); opacity: 1; }

.gform_wrapper .gform-button, .gform_wrapper input[type="submit"].gform-button { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; padding: 1rem 2rem 1rem 1.5rem; background: var(--color-content-secondary) !important; border: 1px solid var(--color-content-secondary) !important; border-radius: 0.5rem; color: #fff !important; font-family: var(--font-family); font-size: 1rem; font-weight: 600; cursor: pointer; transition: background-color 200ms ease, border-color 200ms ease, transform 200ms ease; }
/*.gform_wrapper .gform-button::after, .gform_wrapper input[type="submit"].gform-button::after { content: "→"; display: inline-block; margin-left: 0.5rem; transition: transform 250ms cubic-bezier(0.22, 0.61, 0.36, 1); }*/
.gform_wrapper .gform-button:hover, .gform_wrapper input[type="submit"].gform-button:hover { background: var(--color-accent-700) !important; border-color: var(--color-accent-700) !important; }
.gform_wrapper .gform-button:hover::after, .gform_wrapper input[type="submit"].gform-button:hover::after { transform: translateX(0.25em); }

.gform_wrapper .gfield_label.screen-reader-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

.gform_wrapper .gform_validation_errors { background: color-mix(in srgb, var(--color-accent-700) 8%, transparent); border-color: var(--color-accent-700); color: var(--color-accent-700); border-radius: 0.5rem; padding: 0.75rem 1rem; margin-bottom: 1rem; }
.gform_wrapper .gfield_error .ginput_container input, .gform_wrapper .gfield_error .ginput_container textarea, .gform_wrapper .gfield_error .ginput_container select { border-color: var(--color-accent-700); background: color-mix(in srgb, var(--color-accent-700) 5%, var(--color-content-bg-alt)); }
.gform_wrapper .gfield_validation_message, .gform_wrapper .validation_message { color: var(--color-accent-700); font-size: 0.85rem; margin-top: 0.4rem; }

.gform_confirmation_message { padding: 1.25rem 1.5rem; background: color-mix(in srgb, var(--color-content-primary) 8%, transparent); border-left: 4px solid var(--color-content-primary); border-radius: 0.5rem; color: var(--color-content-text); }

@media (max-width: 640px) { .gform_wrapper .gform_fields { gap: 0.625rem; } .gform_wrapper .gfield--width-third { flex: 1 1 100%; } .gform_wrapper .gfield--type-submit { flex: 1 1 100%; } }

.gform_wrapper .gform_fields .gfield select, .gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]):not(.ginput_total):not(.ginput_shipping_price):not(.ginput_product_price) {padding: 0 1.25rem!important;}

/* Callback-form styling: gelijke hoogte, zachte cream-bg, geen harde borders */
.gform_wrapper .ginput_container input[type="text"],
.gform_wrapper .ginput_container input[type="tel"],
.gform_wrapper .ginput_container input[type="email"],
.gform_wrapper .ginput_container input[type="number"],
.gform_wrapper .ginput_container textarea,
.gform_wrapper .ginput_container select { min-height: 3.5rem; border-color: transparent; border-radius: 0.625rem; }
.gform_wrapper .ginput_container input:focus,
.gform_wrapper .ginput_container textarea:focus,
.gform_wrapper .ginput_container select:focus { border-color: var(--color-content-primary); background: #fff; }
.gform_wrapper .gform-button, .gform_wrapper input[type="submit"].gform-button { min-height: 3.5rem !important; height: 3.5rem !important; border-radius: 0.625rem !important; padding: 0 1.5rem 0 1.5rem !important; white-space: nowrap; width: 100% !important; }

/* Submit-cell op dezelfde flex-basis als de andere thirds (override van flex:0 0 auto hierboven) */
.gform_wrapper .gfield--type-submit { flex: 1 1 0 !important; min-width: 12rem; position: relative; overflow: visible; }

/* Pijl-icoon via wrapper-::after (werkt ook op <input type=submit>) */
.gform_wrapper .gfield--type-submit:hover::after, .gform_wrapper .gfield--type-submit:focus-within::after { transform: translate(0.25em, -50%); }

/* ===========================================================================
 * Overrides om GF's inline <style data-form-index>-blok (blauw) te verslaan.
 * Inline styles gebruiken een ID-selector → moeten met !important op de
 * custom-properties + concrete props worden geforceerd.
 * =========================================================================== */
.gform_wrapper.gform-theme.gform-theme--orbital,
.gform_wrapper[data-form-theme="orbital"] {
	--gf-color-primary: var(--color-content-secondary) !important;
	--gf-color-primary-rgb: 224, 138, 60 !important;
	--gf-color-primary-contrast: #fff !important;
	--gf-color-primary-darker: var(--color-accent-700) !important;
	--gf-color-secondary: #fff !important;
	--gf-color-secondary-contrast: var(--color-content-text) !important;
	--gf-ctrl-border-color: var(--color-line, #e5e5e0) !important;
	--gf-radius: 0.5rem !important;
}

/* Verzend-knop in oranje — class is gform_button (underscore!), niet gform-button */
.gform_wrapper input[type="submit"],
.gform_wrapper input[type="submit"].gform_button,
.gform_wrapper .gform_button {
	background: var(--color-content-secondary) !important;
	border-color: var(--color-content-secondary) !important;
	color: #fff !important;
	min-height: 3.5rem !important;
	height: 3.5rem !important;
	border-radius: 0.625rem !important;
	padding: 0 3.25rem 0 1.5rem !important;
	font-weight: 600 !important;
	width: 100% !important;
	transition: background-color 200ms ease, transform 200ms ease;
}
.gform_wrapper input[type="submit"]:hover,
.gform_wrapper .gform_button:hover {
	background: var(--color-accent-700) !important;
	border-color: var(--color-accent-700) !important;
}

/* Verberg de "(Vereist)"-tekst en vervang door simpele asterisk */
.gform_wrapper .gfield_required_text { display: none !important; }
.gform_wrapper .gfield_required::after {
	content: " *";
	color: var(--color-content-secondary);
	font-weight: 600;
	margin-left: 0.15rem;
}

/* Verberg sub-labels (bv. "Voornaam" onder "Naam") — placeholder doet 't werk al */
.gform_wrapper .gform-field-label--type-sub { display: none !important; }

/* Verberg character-counter onder textarea */
.gform_wrapper .ginput_counter,
.gform_wrapper .charleft { display: none !important; }

/* Inputs: witte achtergrond met dunne lijn (i.p.v. cream zonder border) */
.gform_wrapper .ginput_container input[type="text"],
.gform_wrapper .ginput_container input[type="tel"],
.gform_wrapper .ginput_container input[type="email"],
.gform_wrapper .ginput_container input[type="number"],
.gform_wrapper .ginput_container textarea,
.gform_wrapper .ginput_container select {
	background: #fff !important;
	border: 1px solid var(--color-line, #e5e5e0) !important;
}

/* ===========================================================================
 * Select: tekst verticaal centreren + custom chevron-down rechts
 * =========================================================================== */
.gform_wrapper .ginput_container_select { position: relative; }
.gform_wrapper .ginput_container_select select {
	appearance: none !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	background-image: none !important;
	min-height: 3.5rem !important;
	height: 3.5rem !important;
	line-height: 3.5rem !important;
	padding: 0 2.75rem 0 1.25rem !important;   /* extra ruimte rechts voor chevron */
}
.gform_wrapper .ginput_container_select::after {
	content: "";
	position: absolute;
	right: 1.25rem!important;
	top: 50%!important;
	width: 0.85rem;
	height: 0.55rem;
	transform: translateY(-50%);
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1l5 5 5-5' stroke='%232E4B3C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center / contain;
	pointer-events: none;
	transition: transform 200ms ease;
	border: none!important;
}


/* ===========================================================================
 * Submit-knop: label + pijl-span met flex + gap → pijl direct naast de tekst,
 * samen gecentreerd binnen de full-width knop.
 *
 * De gform_submit_button-filter (gravityFormsButton.php) bouwt:
 *   <button class="gform_button"><span class="bk-btn-label">Verzenden</span><span class="bk-btn-arrow">→</span></button>
 * =========================================================================== */
.gform_wrapper button.gform_button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	padding: 0 1.5rem !important;   /* gelijke padding L+R nu de pijl in de flow zit */
}
.gform_wrapper .bk-btn-arrow {
	display: inline-block;
	font-weight: 600;
	font-size: 1.05rem;
	line-height: 1;
	transition: transform 250ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.gform_wrapper button.gform_button:hover .bk-btn-arrow,
.gform_wrapper button.gform_button:focus-visible .bk-btn-arrow {
	transform: translateX(0.25em);
}
.gform_wrapper .ginput_container input:hover,
.gform_wrapper .ginput_container textarea:hover,
.gform_wrapper .ginput_container select:hover {
	border-color: var(--color-content-primary) !important;
}
.gform_wrapper .ginput_container input:focus,
.gform_wrapper .ginput_container textarea:focus,
.gform_wrapper .ginput_container select:focus {
	border-color: var(--color-content-primary) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-content-primary) 12%, transparent) !important;
}