<script>
document.addEventListener("DOMContentLoaded", function () {

    const options = document.querySelectorAll(".elementor-field-type-radio .elementor-field-option");

    options.forEach(function(option) {

        // Wrap label contents inside a box
        const label = option.querySelector("label");
        const radio = option.querySelector("input[type='radio']");

        if (!label.classList.contains("service-box")) {
            const box = document.createElement("div");
            box.className = "service-box";
            box.innerHTML = label.innerHTML;
            label.innerHTML = "";
            label.appendChild(box);
        }

        // Click container to select radio
        option.addEventListener("click", function () {
            radio.checked = true;

            // Remove old selected
            document.querySelectorAll(".service-box").forEach(function(box){
                box.classList.remove("selected");
            });

            // Add selected class to current box
            option.querySelector(".service-box").classList.add("selected");
        });

    });

});
</script>

<script>
document.addEventListener("DOMContentLoaded", function () {

    function initAutoNext() {
        const forms = document.querySelectorAll("form.elementor-form");

        forms.forEach(form => {
            const radios = form.querySelectorAll(".elementor-field-type-radio input[type='radio']");

            radios.forEach(radio => {
                // Prevent multiple bindings
                if (radio.dataset.autonext === "1") return;
                radio.dataset.autonext = "1";

                radio.addEventListener("change", function () {
                    // Find "Next" button for multi-step forms
                    const nextBtn = form.querySelector(".e-form__buttons__wrapper__button-next");

                    if (nextBtn) {
                        setTimeout(() => nextBtn.click(), 150); // slight natural delay
                    }
                });
            });
        });
    }

    // Run initially
    initAutoNext();

    // Elementor sometimes re-renders form → observe dynamically
    const observer = new MutationObserver(() => {
        initAutoNext();
    });

    observer.observe(document.body, { childList: true, subtree: true });

});
</script>