Error botones plugin

Hola,

He estado haciendo un formulario y al probar en JSFiddle tanto el html y el js funcionaban correctamente. Al tratar de combinar los códigos y pasarlos a wordpress no funcionaban asi que hice esta versión plugin con el código combinado, una opción que ya he hecho otras veces para evitar bloqueos de WordPress pero esta vez los «botones» no funciona. A ver quien me puede echar un mano.

Alguna herramienta que detecte estos errores¿¿

Muchas gracias!

<?php
/*
Plugin Name: Formulario de Entrenamiento Personalizado
Description: Shortcode para mostrar un formulario de entrenamiento personalizado.
Version: 1.0
Author: Tu Nombre
*/

// Agrega un shortcode para mostrar el formulario de entrenamiento personalizado
function custom_training_form_shortcode() {
    ob_start();
    ?>
    <div class="container">
        <h2>Formulario de Entrenamiento</h2>
        <form id="trainingForm">
            <div class="form-step" id="step1">
                <label for="trainingType">¿Entrenas por pulso o vatios?</label><br>
                <input type="radio" id="pulse" name="trainingType" value="Pulso" required> Pulso<br>
                <input type="radio" id="watts" name="trainingType" value="Vatios" required> Vatios<br><br>
                <button type="button" class="next-btn" onclick="nextStep()">Siguiente</button>
            </div>
            
            <div class="form-step" id="step2" style="display: none;">
                <label for="ftp">¿Cuál es tu umbral en vatios?</label>
                <input type="number" id="ftp" name="ftp" required><br><br>
                <label for="weight">¿Cuánto pesas?</label>
                <input type="number" id="weight" name="weight" required><br><br>
                <button type="button" class="next-btn" onclick="nextStep()">Siguiente</button>
            </div>

            <!-- Agrega más pasos del formulario según sea necesario -->

            <div class="form-step" id="step6" style="display: none;">
                <label for="goal">¿Cuál es tu objetivo?</label><br>
                <input type="radio" name="goal" value="Simplemente mejorar" required> Simplemente mejorar<br>
                <input type="radio" name="goal" value="Preparar marchas/carreras" required> Preparar marchas/carreras<br>
                <input type="radio" name="goal" value="Luchar por pódiums" required> Luchar por pódiums<br><br>
                <button type="button" onclick="generateRecommendation()">Obtener Recomendación</button>
            </div>
        </form>
        <div id="recommendationContainer" style="display: none;">
            <p id="recommendation"></p>
            <a id="recommendationLink" class="cta-button" href="#" target="_blank">Ver Plan</a>
        </div>
    </div>

    <style>
        /* Estilos CSS aquí */
        .container {
            margin: 0 auto;
            padding: 20px;
            max-width: 600px;
            background-color: #f9f9f9;
            border: 1px solid #ddd;
            border-radius: 5px;
        }
        .form-step {
            display: none;
        }
        .form-step:first-child {
            display: block;
        }
        .next-btn {
            background-color: #4caf50;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
        .cta-button {
            display: inline-block;
            background-color: #4caf50;
            color: white;
            padding: 10px 20px;
            text-decoration: none;
            border-radius: 5px;
        }
    </style>

    <script>
        // JavaScript aquí
        function nextStep() {
            var currentStep = document.querySelector('.form-step:visible');
            var nextStep = currentStep.nextElementSibling;
            currentStep.style.display = 'none';
            nextStep.style.display = 'block';
        }

        function generateRecommendation() {
            // Aquí va la lógica para generar la recomendación
            var recommendation = "Recomendación generada";
            document.getElementById('recommendation').textContent = recommendation;
            document.getElementById('recommendationContainer').style.display = 'block';

            // Define los enlaces de la recomendación
            var recommendationType = document.querySelector('input[name="goal"]:checked').value;
            var recommendationLink = '';
            if (recommendationType === 'Simplemente mejorar') {
                recommendationLink = 'https://www.vecentrenamientociclista.com/product/plan-de-entrenamiento-avanzado-2/';
            } else if (recommendationType === 'Preparar marchas/carreras') {
                recommendationLink = 'https://www.vecentrenamientociclista.com/plan-de-entrenamiento-premium-ciclismo/';
            } else if (recommendationType === 'Luchar por pódiums') {
                recommendationLink = 'https://www.vecentrenamientociclista.com/plan-de-entrenamiento-basico/';
            }
            document.getElementById('recommendationLink').href = recommendationLink;
        }
    </script>
    <?php
    return ob_get_clean();
}
add_shortcode( 'custom_training_form', 'custom_training_form_shortcode' );