/**
 * RedCommerce Multi-Step CF7 v2
 * Checkmark animation · Review panel · Retry button
 * Test mode: add ?rc_test=1 to skip validation.
 */
function rcInitAll() {
	// Only init containers that haven't been initialized yet.
	// CF7 page-cache AJAX replaces the form HTML, so new elements won't have the flag.
	document.querySelectorAll( '.rc-multistep:not([data-rc-init])' ).forEach( function ( c ) {
		c.setAttribute( 'data-rc-init', '1' );
		initMultistep( c );
	} );
}

document.addEventListener( 'DOMContentLoaded', rcInitAll );

// Fallback: some themes (Salient/WPBakery) delay script execution past DOMContentLoaded.
window.addEventListener( 'load', rcInitAll );

// CF7 replaces form HTML from page cache — re-init any new .rc-multistep elements.
document.addEventListener( 'wpcf7:init', rcInitAll );

function trackFormEvent( eventType ) {
	var cfg = window.rcPopupConfig || {};
	if ( ! cfg.ajaxUrl || ! cfg.trackNonce ) { return; }
	var attrJson = window.rcPopupAttrJson ? window.rcPopupAttrJson() : '';
	var data = 'action=rc_popup_track' +
		'&nonce=' + encodeURIComponent( cfg.trackNonce ) +
		'&event=' + encodeURIComponent( eventType ) +
		( attrJson ? '&attr=' + encodeURIComponent( attrJson ) : '' );
	if ( navigator.sendBeacon && ( eventType === 'form_abandon' ) ) {
		var fd = new FormData();
		fd.append( 'action', 'rc_popup_track' );
		fd.append( 'nonce', cfg.trackNonce );
		fd.append( 'event', eventType );
		if ( attrJson ) { fd.append( 'attr', attrJson ); }
		navigator.sendBeacon( cfg.ajaxUrl, fd );
	} else {
		var xhr = new XMLHttpRequest();
		xhr.open( 'POST', cfg.ajaxUrl, true );
		xhr.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
		xhr.send( data );
	}
}

function initMultistep( container ) {
	// Unique token for this init call. Stamped on every choice item so that if
	// this container is re-initialized (e.g. after CF7 page-cache reload), the
	// previous init's click handlers become no-ops (token mismatch → early return).
	var instanceToken = 'rc-' + Date.now() + '-' + Math.random().toString( 36 ).slice( 2 );
	container.setAttribute( 'data-rc-instance', instanceToken );

	var steps      = container.querySelectorAll( '.rc-step' );
	var circles    = container.querySelectorAll( '.rc-step-circle' );
	var lines      = container.querySelectorAll( '.rc-step-line-fill' );
	var btnNext    = container.querySelector( '.rc-btn-next' );
	var btnBack    = container.querySelector( '.rc-btn-back' );
	var btnText    = btnNext && btnNext.querySelector( '.rc-btn-text' );
	var successMsg = container.querySelector( '.rc-success-message' );
	var btnGroup   = container.querySelector( '.rc-btn-group' );
	var totalSteps = steps.length;
	var current    = 0;
	var inReview   = false;
	var reviewPanel = null;
	var testMode      = /[?&]rc_test=1/.test( window.location.search );
	var formStarted   = false;
	var formCompleted = false;
	var autoAdvancing = false;
	var DEBUG         = /[?&]rc_debug=1/.test( window.location.search );

	if ( ! totalSteps || ! btnNext ) { return; }

	// ── Debug: log step contents ────────────────────────────────────────
	if ( DEBUG ) {
		console.group( '[RC] initMultistep — ' + totalSteps + ' steps, ' + circles.length + ' circles' );
		steps.forEach( function ( s, i ) {
			var inputs  = s.querySelectorAll( 'input:not(.rc-choice-radio):not([type="hidden"]):not([type="submit"])' );
			var selects = s.querySelectorAll( 'select' );
			var texts   = s.querySelectorAll( 'textarea' );
			var choices = s.querySelectorAll( '.rc-choice-group' );
			console.log( '[RC] Step ' + (i+1) + ': ' + inputs.length + ' inputs, ' + selects.length + ' selects, ' + texts.length + ' textareas, ' + choices.length + ' rc_choice groups' );
		} );
		console.groupEnd();
	}

	// Hide paragraphs wrapping the hidden CF7 submit button (browsers without :has() support).
	container.querySelectorAll( '.rc-step input[type="submit"], .rc-step .wpcf7-submit' ).forEach( function ( sub ) {
		var p = sub.closest( 'p' );
		if ( p ) { p.style.cssText = 'display:none!important;margin:0!important;'; }
	} );

	// Force-hide all steps with inline !important so no theme CSS can interfere.
	steps.forEach( function ( s ) { setStepVisible( s, false ); } );

	detectThemeStyles( container );
	showStep( 0 );

	// Guard: Salient/WPBakery JS can reset inline styles after we set them.
	// Watch for any style attribute change in the container and re-enforce the
	// active step AND its child <p>/wrap elements.
	var stepGuard = false;
	var guardObserver = new MutationObserver( function () {
		if ( stepGuard ) { return; }
		var active = container.querySelector( '.rc-step.active' );
		if ( ! active ) { return; }

		// Check the step itself.
		var broken = false;
		var disp = active.style.getPropertyValue( 'display' );
		var prio = active.style.getPropertyPriority( 'display' );
		if ( disp !== 'block' || prio !== 'important' ) { broken = true; }

		// Also check child <p> and wrap elements — Salient's scroll-reveal
		// hides these even when the parent step is fine.
		if ( ! broken ) {
			var kids = active.querySelectorAll( 'p, .wpcf7-form-control-wrap' );
			for ( var k = 0; k < kids.length; k++ ) {
				var s = kids[ k ].style;
				if ( s.opacity === '0' || s.visibility === 'hidden' || s.display === 'none' ) {
					broken = true;
					break;
				}
			}
		}

		if ( broken ) {
			stepGuard = true;
			setStepVisible( active, true );
			setTimeout( function () { stepGuard = false; }, 100 );
		}

		// Guard: if Salient re-wraps a native select with Select2, strip it again.
		active.querySelectorAll( 'select[data-rc-native]' ).forEach( function ( sel ) {
			if ( sel.classList.contains( 'select2-hidden-accessible' ) ) {
				if ( window.jQuery ) {
					var $s = window.jQuery( sel );
					if ( $s.data( 'select2' ) ) { try { $s.select2( 'destroy' ); } catch(e){} }
				}
				var p = sel.parentNode;
				if ( p ) { p.querySelectorAll( '.select2-container' ).forEach( function(c){ c.remove(); } ); }
				sel.classList.remove( 'select2-hidden-accessible' );
				sel.removeAttribute( 'aria-hidden' );
				sel.style.cssText = 'display:block!important;visibility:visible!important;width:100%!important;opacity:1!important;position:static!important;clip:auto!important;';
			}
		} );
	} );
	guardObserver.observe( container, {
		attributes:      true,
		attributeFilter: [ 'style', 'class' ],
		childList:       true,
		subtree:         true
	} );

	// CF7 AJAX events
	var cf7Form = container.closest( 'form' );
	if ( cf7Form ) {
		cf7Form.addEventListener( 'wpcf7mailsent',   onMailSent );
		cf7Form.addEventListener( 'wpcf7mailfailed', onMailFailed );
		// Hide CF7 default response output — we use our own success message
		var cfResp = cf7Form.querySelector( '.wpcf7-response-output' );
		if ( cfResp ) { cfResp.style.display = 'none'; }

		// Prevent CF7 from resetting the form after success — it causes a visual flash.
		cf7Form.addEventListener( 'wpcf7submit', function ( e ) {
			if ( successMsg && successMsg.classList.contains( 'active' ) ) {
				e.stopImmediatePropagation();
				// Re-hide any CF7 response output that appears.
				setTimeout( function () {
					var resp = cf7Form.querySelector( '.wpcf7-response-output' );
					if ( resp ) { resp.style.display = 'none'; }
				}, 50 );
			}
		} );
	}

	btnNext.addEventListener( 'click', onNextClick );
	if ( btnBack ) { btnBack.addEventListener( 'click', onBackClick ); }

	// Track abandon when popup close button is clicked after form has been started.
	var popupCloseBtn = document.getElementById( 'rc-popup-close' );
	if ( popupCloseBtn && container.closest( '#rc-popup' ) ) {
		popupCloseBtn.addEventListener( 'click', function () {
			if ( formStarted && ! formCompleted ) { trackFormEvent( 'form_abandon' ); }
		} );
	}

	// Track abandon on page leave (sendBeacon for reliability).
	window.addEventListener( 'beforeunload', function () {
		if ( formStarted && ! formCompleted ) { trackFormEvent( 'form_abandon' ); }
	} );

	container.addEventListener( 'keydown', function ( e ) {
		if ( e.key === 'Enter' ) { e.preventDefault(); btnNext.click(); }
	} );

	container.addEventListener( 'input', clearError );

	// ── rc_choice card selection ─────────────────────────────────────────
	container.querySelectorAll( '.rc-choice-group' ).forEach( function ( group ) {
		group.querySelectorAll( '.rc-choice-item' ).forEach( function ( item ) {
			// Stamp the item with this init's token. If re-initialized later,
			// the stamp changes and this closure's handler becomes a no-op.
			item.setAttribute( 'data-rc-owner', instanceToken );
			item.addEventListener( 'click', function () {
				// Only handle clicks owned by THIS init instance.
				if ( item.getAttribute( 'data-rc-owner' ) !== instanceToken ) { return; }
				if ( ! container.contains( item ) ) { return; }

				// Remove selected from siblings in same group.
				group.querySelectorAll( '.rc-choice-item' ).forEach( function ( sib ) {
					sib.classList.remove( 'selected' );
				} );
				item.classList.add( 'selected' );

				// Explicitly check the hidden radio so :checked state is set in DOM.
				var radio = item.querySelector( '.rc-choice-radio' );
				if ( radio ) { radio.checked = true; }

				// Clear any validation error on the group.
				var w = group.closest( '.wpcf7-form-control-wrap' );
				if ( w ) {
					w.classList.remove( 'wpcf7-not-valid' );
					var tip = w.querySelector( '.wpcf7-not-valid-tip' );
					if ( tip ) { tip.remove(); }
				}
				group.classList.remove( 'wpcf7-not-valid' );

				// Auto-advance: if the current step contains only rc_choice groups
				// (no text/email/tel inputs), move to next step automatically.
				// Re-query steps so we work with the live container DOM.
				var step = container.querySelectorAll( '.rc-step' )[ current ];
				if ( step && step.contains( group ) && container.contains( group ) ) {
					var otherInputs = step.querySelectorAll(
						'input:not(.rc-choice-radio):not([type="hidden"]):not([type="submit"]), select, textarea'
					);
					if ( DEBUG ) { console.log( '[RC] rc_choice click — step ' + (current+1) + ', otherInputs=' + otherInputs.length + ', autoAdvancing=' + autoAdvancing ); }
					if ( otherInputs.length === 0 && ! autoAdvancing ) {
						autoAdvancing = true;
						if ( DEBUG ) { console.log( '[RC] → auto-advance queued from step ' + (current+1) ); }
						setTimeout( function () {
							onNextClick();
							autoAdvancing = false;
						}, 120 );
					}
				}
			} );
		} );
	} );

	// ── Event handlers ──────────────────────────────────────────────────

	function onNextClick() {
		if ( DEBUG ) { console.log( '[RC] onNextClick — current=' + current + ', inReview=' + inReview ); }
		if ( inReview ) { submitForm(); return; }
		if ( ! testMode && ! validateCurrentStep( steps[ current ] ) ) {
			if ( DEBUG ) { console.log( '[RC] → validation failed for step ' + (current+1) ); }
			return;
		}

		if ( current === 0 && ! formStarted ) {
			formStarted = true;
			trackFormEvent( 'form_start' );
		}

		// Single-step form: animate to confirmation step, then submit.
		if ( totalSteps === 2 && container.querySelector( '.rc-step-confirmation' ) ) {
			animateComplete( 0, function () {
				showStep( 1 );
				submitForm();
			} );
			return;
		}

		// Capture next index by value — prevents closure bugs when
		// onNextClick fires more than once before the callback runs.
		var next = current + 1;
		if ( DEBUG ) { console.log( '[RC] → advancing to step ' + (next+1) ); }
		if ( current < totalSteps - 1 ) {
			animateComplete( current, function () { showStep( next ); } );
		} else {
			animateComplete( current, showReview );
		}
	}

	function onBackClick() {
		if ( inReview ) { hideReview(); return; }
		if ( current > 0 ) {
			clearStepFields( steps[ current ] );
			showStep( current - 1 );
		}
	}

	function clearStepFields( stepEl ) {
		stepEl.querySelectorAll( 'input:not([type=hidden]):not([type=submit]), select, textarea' ).forEach( function ( field ) {
			if ( field.type === 'radio' || field.type === 'checkbox' ) {
				field.checked = false;
			} else {
				field.value = '';
			}
		} );
		stepEl.querySelectorAll( '.rc-choice-item' ).forEach( function ( item ) {
			item.classList.remove( 'selected' );
		} );
		stepEl.querySelectorAll( '.wpcf7-not-valid' ).forEach( function ( el ) {
			el.classList.remove( 'wpcf7-not-valid' );
		} );
		stepEl.querySelectorAll( '.wpcf7-not-valid-tip' ).forEach( function ( tip ) {
			tip.remove();
		} );
	}

	function onMailSent() {
		formCompleted = true;
		trackFormEvent( 'form_complete' );
		if ( typeof gtag === 'function' ) {
			gtag( 'event', 'booking_request', {
				event_category: 'leads',
				event_label: 'contact_form'
			});
		}
		// Success already visible (single-step fires it during transition).
		if ( successMsg && successMsg.classList.contains( 'active' ) ) { return; }
		showSuccess();
	}

	function onMailFailed() {
		trackFormEvent( 'form_fail' );
		btnNext.disabled = false;
		if ( btnBack ) { btnBack.disabled = false; }
		if ( btnText )  { btnText.textContent = 'Verstuur'; }
		// Show CF7 error message
		if ( cf7Form ) {
			var resp = cf7Form.querySelector( '.wpcf7-response-output' );
			if ( resp ) { resp.style.display = ''; }
		}
	}

	// ── Step navigation ─────────────────────────────────────────────────

	function setStepVisible( stepEl, visible ) {
		if ( ! stepEl ) { return; }
		if ( visible ) {
			stepEl.style.setProperty( 'display',     'block',   'important' );
			stepEl.style.setProperty( 'visibility',  'visible', 'important' );
			stepEl.style.setProperty( 'height',      'auto',    'important' );
			stepEl.style.setProperty( 'max-height',  'none',    'important' );
			stepEl.style.setProperty( 'overflow',    'visible', 'important' );
			stepEl.style.setProperty( 'opacity',     '1',       'important' );
			stepEl.style.setProperty( 'clip',        'auto',    'important' );
			stepEl.style.setProperty( 'position',    'static',  'important' );
			stepEl.style.setProperty( 'transform',   'none',    'important' );
			stepEl.style.setProperty( 'clip-path',   'none',    'important' );
			stepEl.removeAttribute( 'data-animate-in-effect' );
			// Force-show <p> wrappers — Salient hides them inside .wpcf7-form fieldset
			stepEl.querySelectorAll( 'p, span.wpcf7-form-control-wrap, .wpcf7-form-control-wrap' ).forEach( function ( el ) {
				// Skip the <p> wrapping the CF7 submit button — it must stay hidden.
				if ( el.tagName === 'P' && ( el.querySelector( 'input[type="submit"], .wpcf7-submit' ) ) ) {
					el.style.setProperty( 'display', 'none', 'important' );
					el.style.setProperty( 'margin',  '0',    'important' );
					return;
				}
				el.style.setProperty( 'display',    'block',   'important' );
				el.style.setProperty( 'visibility', 'visible', 'important' );
				el.style.setProperty( 'opacity',    '1',       'important' );
				el.style.setProperty( 'height',     'auto',    'important' );
				// Enforce tight spacing so theme margins don't create large gaps.
				if ( el.tagName === 'P' ) {
					el.style.setProperty( 'margin-top',    '0',    'important' );
					el.style.setProperty( 'margin-bottom', '10px', 'important' );
					el.style.setProperty( 'padding-bottom', '0',   'important' );
				}
			} );
		} else {
			stepEl.style.setProperty( 'display',     'none',    'important' );
			stepEl.style.setProperty( 'visibility',  'hidden',  'important' );
			stepEl.style.setProperty( 'height',      '0',       'important' );
			stepEl.style.setProperty( 'overflow',    'hidden',  'important' );
			stepEl.style.setProperty( 'opacity',     '0',       'important' );
		}
	}

	function showStep( index ) {
		if ( DEBUG ) { console.log( '[RC] showStep(' + index + '), current was ' + current ); }
		// Re-query live — WPBakery/Salient may have replaced inner DOM nodes.
		steps   = container.querySelectorAll( '.rc-step' );
		circles = container.querySelectorAll( '.rc-step-circle' );
		lines   = container.querySelectorAll( '.rc-step-line-fill' );

		// Remove .active BEFORE hiding so the observer does not try to restore it.
		steps[ current ].classList.remove( 'active' );
		setStepVisible( steps[ current ], false );
		steps[ index ].classList.add( 'active' );
		setStepVisible( steps[ index ], true );
		current = index;
		updateProgress();
		updateButtons();
		scrollToForm();

		// Re-enforce visibility after scroll — Salient's scroll-reveal animation
		// detects newly visible elements and resets their opacity/transform.
		// It only fires ONCE per element, which is why back→next works on retry.
		var target = steps[ index ];
		requestAnimationFrame( function () { setStepVisible( target, true ); } );
		setTimeout( function () { setStepVisible( target, true ); }, 50 );
		setTimeout( function () { setStepVisible( target, true ); }, 200 );
		setTimeout( function () { setStepVisible( target, true ); }, 500 );

		// Fix Select2/Fancy Select — strip it and use native <select>.
		// Salient initializes Select2 while step is hidden, breaking the dropdown.
		steps[ index ].querySelectorAll( 'select' ).forEach( function ( sel ) {
			// 1. Destroy Select2 instance via jQuery if available.
			if ( window.jQuery ) {
				var $el = window.jQuery( sel );
				if ( $el.data( 'select2' ) ) {
					try { $el.select2( 'destroy' ); } catch ( e ) {}
				}
			}
			// 2. Remove the Select2 container DOM.
			var parent = sel.parentNode;
			if ( parent ) {
				var containers = parent.querySelectorAll( '.select2-container' );
				containers.forEach( function ( c ) { c.remove(); } );
			}
			// 3. Clean up classes/attributes so the native select shows.
			sel.classList.remove( 'select2-hidden-accessible' );
			sel.removeAttribute( 'aria-hidden' );
			sel.style.cssText = 'display:block!important;visibility:visible!important;width:100%!important;opacity:1!important;position:static!important;clip:auto!important;';
			// 4. Mark as processed so Salient doesn't re-wrap it.
			sel.setAttribute( 'data-rc-native', '1' );
		} );
	}

	function updateProgress() {
		circles.forEach( function ( c, i ) {
			c.classList.remove( 'active', 'completed' );
			if ( i === current ) {
				c.classList.add( 'active' );
				restoreNumber( c );
			} else if ( i < current ) {
				c.classList.add( 'completed' );
				showCheck( c );
			} else {
				restoreNumber( c );
			}
		} );
		lines.forEach( function ( l, i ) {
			l.style.width = i < current ? '100%' : '0%';
		} );
	}

	function updateButtons() {
		if ( btnText ) {
			if ( container.querySelector( '.rc-step-confirmation' ) ) {
				btnText.textContent = 'Aanmelden';
			} else if ( inReview ) {
				btnText.textContent = 'Verstuur';
			} else {
				btnText.textContent = current === totalSteps - 1 ? 'Stuur aanvraag' : 'Volgende';
			}
		}
		if ( btnBack ) {
			btnBack.classList.toggle( 'visible', current > 0 || inReview );
		}
	}

	// ── Checkmark animation ──────────────────────────────────────────────

	function animateComplete( stepIndex, callback ) {
		var circle = circles[ stepIndex ];
		if ( ! circle ) { callback(); return; }
		if ( ! circle.dataset.num ) { circle.dataset.num = circle.textContent.trim(); }
		circle.classList.add( 'completing' );
		setTimeout( function () {
			circle.classList.remove( 'completing' );
			callback();
		}, 380 );
	}

	function showCheck( circle ) {
		if ( ! circle.dataset.num ) { circle.dataset.num = circle.textContent.trim(); }
		circle.innerHTML = '<svg viewBox="0 0 24 24" width="15" height="15"><path fill="currentColor" d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>';
	}

	function restoreNumber( circle ) {
		if ( circle.dataset.num ) { circle.textContent = circle.dataset.num; }
	}

	// ── Review panel ────────────────────────────────────────────────────

	function showReview() {
		inReview = true;
		steps.forEach( function ( s ) {
			s.classList.remove( 'active' );
			setStepVisible( s, false );
		} );
		circles.forEach( function ( c ) {
			c.classList.remove( 'active' );
			c.classList.add( 'completed' );
			showCheck( c );
		} );
		lines.forEach( function ( l ) { l.style.width = '100%'; } );

		reviewPanel = buildReview();
		if ( btnGroup ) {
			container.insertBefore( reviewPanel, btnGroup );
		} else {
			container.appendChild( reviewPanel );
		}

		updateButtons();
		scrollToForm();
	}

	function hideReview() {
		inReview = false;
		if ( reviewPanel ) { reviewPanel.remove(); reviewPanel = null; }
		steps[ current ].classList.add( 'active' );
		setStepVisible( steps[ current ], true );
		updateProgress();
		updateButtons();
		scrollToForm();
		var idx = current;
		setTimeout( function () { if ( steps[ idx ] ) { setStepVisible( steps[ idx ], true ); } }, 350 );
	}

	function buildReview() {
		var panel = document.createElement( 'div' );
		panel.className = 'rc-review-panel';

		var title = document.createElement( 'p' );
		title.className = 'rc-review-title';
		title.textContent = 'Jouw gegevens';
		panel.appendChild( title );

		var list = document.createElement( 'div' );
		list.className = 'rc-review-fields';

		steps.forEach( function ( step ) {
			// rc_choice groups: use the field name as label, selected value as value.
			step.querySelectorAll( '.rc-choice-group' ).forEach( function ( group ) {
				var checked = group.querySelector( '.rc-choice-radio:checked' );
				if ( ! checked || ! checked.value.trim() ) { return; }
				list.appendChild( makeRow( formatName( checked.name ), checked.value.trim() ) );
			} );

			// Regular inputs (skip rc-choice-radio which are handled above).
			var inputs = step.querySelectorAll(
				'input:not([type=hidden]):not([type=submit]):not(.rc-choice-radio), select, textarea'
			);
			inputs.forEach( function ( input ) {
				if ( input.type === 'checkbox' || input.type === 'radio' ) {
					if ( ! input.checked ) { return; }
				}
				var val = ( input.value || '' ).trim();
				if ( ! val ) { return; }
				list.appendChild( makeRow( getLabel( input ), val ) );
			} );
		} );

		panel.appendChild( list );
		return panel;
	}

	function makeRow( labelText, valueText ) {
		var row = document.createElement( 'div' );
		row.className = 'rc-review-row';
		var lbl = document.createElement( 'span' );
		lbl.className = 'rc-review-label';
		lbl.textContent = labelText;
		var v = document.createElement( 'span' );
		v.className = 'rc-review-value';
		v.textContent = valueText;
		row.appendChild( lbl );
		row.appendChild( v );
		return row;
	}

	function formatName( name ) {
		return ( name || '' )
			.replace( /^your-/, '' )
			.replace( /[-_]/g, ' ' )
			.replace( /\b\w/g, function ( c ) { return c.toUpperCase(); } );
	}

	function getLabel( input ) {
		// 1. <label for="id">
		if ( input.id ) {
			var l = document.querySelector( 'label[for="' + input.id + '"]' );
			if ( l ) { return l.textContent.trim(); }
		}
		// 2. wrapping <label>
		var pl = input.closest( 'label' );
		if ( pl ) { return pl.textContent.trim(); }
		// 3. previous sibling label / text element
		var w  = input.closest( '.wpcf7-form-control-wrap' ) || input;
		var el = w.previousElementSibling;
		while ( el ) {
			if ( /^(LABEL|STRONG|B)$/.test( el.tagName ) ) { return el.textContent.trim(); }
			var sub = el.querySelector( 'label' );
			if ( sub ) { return sub.textContent.trim(); }
			el = el.previousElementSibling;
		}
		// 4. placeholder
		if ( input.placeholder ) { return input.placeholder; }
		// 5. format name attribute
		return ( input.name || '' )
			.replace( /^your-/, '' )
			.replace( /[-_]/g, ' ' )
			.replace( /\b\w/g, function ( c ) { return c.toUpperCase(); } );
	}

	// ── Submit & success ────────────────────────────────────────────────

	function submitForm() {
		btnNext.disabled = true;
		if ( btnBack ) { btnBack.disabled = true; }

		// Show success immediately — don't wait for CF7 AJAX round-trip.
		showSuccess();
		trackFormEvent( 'form_submit' );

		// Fire the actual CF7 submit in the background.
		var form = container.closest( 'form' ) || container;
		var sub  = form.querySelector( 'input[type=submit], button[type=submit], .wpcf7-submit' );
		if ( sub ) { sub.click(); }
	}

	function showSuccess() {
		if ( reviewPanel ) { reviewPanel.remove(); reviewPanel = null; }
		if ( btnGroup )    { btnGroup.style.setProperty( 'display', 'none', 'important' ); }

		// Single-step: move success message into the confirmation step.
		var confStep = container.querySelector( '.rc-step-confirmation' );
		if ( confStep && successMsg ) {
			confStep.appendChild( successMsg );
		}

		if ( successMsg ) {
			successMsg.classList.add( 'active' );
		}
	}

	function resetForm() {
		var form = container.closest( 'form' );
		if ( form ) { form.reset(); }

		// Reset CF7 sent/failed state so the form can be re-submitted via AJAX.
		var wpcf7Wrap = container.closest( '.wpcf7' );
		if ( wpcf7Wrap ) {
			wpcf7Wrap.classList.remove( 'wpcf7-form--sent', 'wpcf7-form--failed', 'wpcf7-form--invalid', 'wpcf7-form--spam' );
			wpcf7Wrap.classList.add( 'wpcf7-form--init' );
		}

		inReview      = false;
		current       = 0;
		formStarted   = false;
		formCompleted = false;

		if ( successMsg ) { successMsg.classList.remove( 'active' ); }
		if ( btnGroup )   { btnGroup.style.display = ''; }

		btnNext.disabled = false;
		if ( btnBack ) { btnBack.disabled = false; }
		if ( btnText ) { btnText.textContent = 'Volgende'; }

		circles.forEach( function ( c ) {
			c.classList.remove( 'active', 'completed', 'completing' );
			restoreNumber( c );
		} );
		steps.forEach( function ( s ) {
			s.classList.remove( 'active' );
			setStepVisible( s, false );
		} );

		showStep( 0 );

		// Re-hide CF7 response output
		if ( cf7Form ) {
			var resp = cf7Form.querySelector( '.wpcf7-response-output' );
			if ( resp ) { resp.style.display = 'none'; }
		}
	}

	// ── Helpers ─────────────────────────────────────────────────────────

	function clearError( e ) {
		var field = e.target;
		if ( ! /^(INPUT|TEXTAREA|SELECT)$/.test( field.tagName ) ) { return; }
		field.classList.remove( 'wpcf7-not-valid' );
		var w = field.closest( '.wpcf7-form-control-wrap' );
		if ( w ) {
			w.classList.remove( 'wpcf7-not-valid' );
			var tip = w.querySelector( '.wpcf7-not-valid-tip' );
			if ( tip ) { tip.remove(); }
		}
	}

	function scrollToForm() {
		// Intentionally empty — no auto-scroll on step change.
	}

	function detectThemeStyles( el ) {
		var rootStyles = getComputedStyle( document.documentElement );
		var bodyStyles = getComputedStyle( document.body );
		var accent = rootStyles.getPropertyValue( '--nectar-accent-color' ).trim()
			|| rootStyles.getPropertyValue( '--accent-color' ).trim()
			|| bodyStyles.getPropertyValue( '--accent-color' ).trim();

		if ( ! accent ) {
			var nectarBtn = document.querySelector( '.nectar-button[data-color-override]' );
			if ( nectarBtn ) {
				var ov = nectarBtn.getAttribute( 'data-color-override' );
				if ( ov && ov !== 'false' ) { accent = ov; }
			}
		}
		if ( ! accent ) {
			var accentBtn = document.querySelector( 'a.nectar-button.accent-color' );
			if ( accentBtn ) {
				var bg = getComputedStyle( accentBtn ).backgroundColor;
				if ( bg && bg !== 'rgba(0, 0, 0, 0)' && bg !== 'transparent' ) { accent = bg; }
			}
		}
		if ( accent ) { el.style.setProperty( '--rc-accent', accent ); }

		var themeBtn = document.querySelector( 'a.nectar-button' );
		if ( themeBtn ) {
			var s = getComputedStyle( themeBtn );
			if ( s.borderRadius && s.borderRadius !== '0px' )   { el.style.setProperty( '--rc-btn-radius',    s.borderRadius ); }
			if ( s.letterSpacing && s.letterSpacing !== 'normal' ) { el.style.setProperty( '--rc-btn-spacing', s.letterSpacing ); }
			if ( s.textTransform && s.textTransform !== 'none' )  { el.style.setProperty( '--rc-btn-transform', s.textTransform ); }
			if ( s.fontWeight ) { el.style.setProperty( '--rc-btn-weight', s.fontWeight ); }
			if ( s.fontSize )   { el.style.setProperty( '--rc-btn-size',   s.fontSize ); }
			if ( s.padding )    { el.style.setProperty( '--rc-btn-padding', s.padding ); }
		}
	}

	function validateCurrentStep( stepEl ) {
		var fields  = stepEl.querySelectorAll( '.wpcf7-validates-as-required, [aria-required="true"]' );
		var isValid = true;

		fields.forEach( function ( field ) {
			// Handle rc_choice groups (DIV with radio children).
			if ( field.classList.contains( 'rc-choice-group' ) ) {
				var checked = field.querySelector( '.rc-choice-radio:checked' );
				field.classList.remove( 'wpcf7-not-valid' );
				var w = field.closest( '.wpcf7-form-control-wrap' );
				if ( w ) {
					w.classList.remove( 'wpcf7-not-valid' );
					var old = w.querySelector( '.wpcf7-not-valid-tip' );
					if ( old ) { old.remove(); }
				}
				if ( ! checked ) {
					field.classList.add( 'wpcf7-not-valid' );
					if ( w ) {
						w.classList.add( 'wpcf7-not-valid' );
						var tip       = document.createElement( 'span' );
						tip.className = 'wpcf7-not-valid-tip';
						tip.setAttribute( 'aria-hidden', 'true' );
						tip.textContent = 'Maak een keuze.';
						w.appendChild( tip );
					}
					isValid = false;
				}
				return;
			}

			if ( ! /^(INPUT|SELECT|TEXTAREA)$/.test( field.tagName ) ) { return; }

			var wrapper = field.closest( '.wpcf7-form-control-wrap' );
			field.classList.remove( 'wpcf7-not-valid' );
			if ( wrapper ) {
				wrapper.classList.remove( 'wpcf7-not-valid' );
				var old = wrapper.querySelector( '.wpcf7-not-valid-tip' );
				if ( old ) { old.remove(); }
			}

			var empty = false;
			if ( field.type === 'checkbox' || field.type === 'radio' ) {
				var group   = stepEl.querySelectorAll( '[name="' + field.name + '"]' );
				var checked = false;
				group.forEach( function ( g ) { if ( g.checked ) { checked = true; } } );
				if ( ! checked ) { empty = true; }
			} else if ( field.tagName === 'SELECT' ) {
				if ( ! field.value ) { empty = true; }
			} else {
				if ( ! field.value.trim() ) { empty = true; }
			}

			if ( empty ) {
				field.classList.add( 'wpcf7-not-valid' );
				if ( wrapper ) {
					wrapper.classList.add( 'wpcf7-not-valid' );
					var tip       = document.createElement( 'span' );
					tip.className = 'wpcf7-not-valid-tip';
					tip.setAttribute( 'aria-hidden', 'true' );
					tip.textContent = 'Dit veld is verplicht.';
					wrapper.appendChild( tip );
				}
				isValid = false;
			}
		} );

		if ( ! isValid ) {
			var first = stepEl.querySelector( '.wpcf7-not-valid' );
			if ( first && first.focus ) { first.focus(); }
		}

		return isValid;
	}
}