{# Step 2: Parameters #}
<div class="moodia-step" data-moodia--stepper-target="step" data-step="2" style="display: none;" data-controller="moodia--step-2-parameters">
    <div class="moodia-card">
        <div class="step-header">
            <h2 class="step-title">Configurez votre cours</h2>
            <p class="step-description">Donnez du contexte à l'IA pour créer un cours sur mesure</p>
        </div>

        {{ form_start(parametersForm, {'attr': {'id': 'parametersForm'}}) }}
            <div class="parameters-form">
                {# ============================================
                   SECTION 1 : IDENTITÉ DU COURS
                   ============================================ #}
                <div class="moodia-form-section">
                    <h3 class="moodia-form-section__title">
                        {% include '_components/icons/book.html.twig' %}
                        Identité du cours
                    </h3>

                    {# Ligne 1: Titre et Niveau #}
                    <div class="form-row">
                        <div class="form-group">
                            <label for="{{ parametersForm.courseTitle.vars.id }}">
                                Titre du cours
                                <span class="required">*</span>
                            </label>
                            {{ form_widget(parametersForm.courseTitle, {
                                'attr': {
                                    'data-moodia--step-2-parameters-target': 'courseTitle',
                                    'placeholder': 'Ex: Introduction à la programmation Python'
                                }
                            }) }}
                        </div>

                        <div class="form-group">
                            <label for="{{ parametersForm.method.vars.id }}">
                                Niveau
                                <span class="required">*</span>
                            </label>
                            {{ form_widget(parametersForm.method, {
                                'attr': {'data-moodia--step-2-parameters-target': 'method'}
                            }) }}
                        </div>
                    </div>

                    {# Ligne 2: Public cible et Durée #}
                    <div class="form-row">
                        <div class="form-group">
                            <label for="{{ parametersForm.publicTarget.vars.id }}">
                                Public cible
                                <span class="required">*</span>
                            </label>
                            {{ form_widget(parametersForm.publicTarget, {
                                'attr': {
                                    'data-moodia--step-2-parameters-target': 'publicTarget',
                                    'placeholder': 'Ex: Étudiants en 1ère année, Professionnels...'
                                }
                            }) }}
                        </div>

                        <div class="form-group">
                            <label for="{{ parametersForm.totalDuration.vars.id }}">
                                Durée totale (heures)
                                <span class="required">*</span>
                            </label>
                            {{ form_widget(parametersForm.totalDuration, {
                                'attr': {
                                    'data-moodia--step-2-parameters-target': 'totalDuration',
                                    'placeholder': 'Ex: 20',
                                    'type': 'number',
                                    'min': '1'
                                }
                            }) }}
                        </div>
                    </div>

                </div>

                {# ============================================
                   SECTION 2 : OBJECTIFS PÉDAGOGIQUES
                   ============================================ #}
                <div class="moodia-form-section">
                    <h3 class="moodia-form-section__title">
                        {% include '_components/icons/rocket.html.twig' %}
                        Objectifs pédagogiques
                    </h3>

                    {# Objectifs d'apprentissage #}
                    <div class="form-group form-group--full">
                        <label for="{{ parametersForm.objectives.vars.id }}">
                            Objectifs d'apprentissage
                            <span class="required">*</span>
                        </label>
                        {{ form_widget(parametersForm.objectives, {
                            'attr': {
                                'data-moodia--step-2-parameters-target': 'objectives',
                                'rows': '4',
                                'placeholder': 'Ex: Maîtriser les bases de Python, créer des scripts fonctionnels, comprendre la logique de programmation...'
                            }
                        }) }}
                        <small class="input-help">Listez les compétences acquises à la fin du cours</small>
                    </div>

                    {# Prérequis (optionnel) #}
                    <div class="form-group form-group--full">
                        <label>
                            Prérequis
                            <span class="optional-badge">Optionnel</span>
                        </label>
                        <textarea
                            name="prerequisites"
                            rows="2"
                            class="input"
                            placeholder="Ex: Aucun (débutants acceptés), Bases en algorithmique..."
                            data-moodia--step-2-parameters-target="prerequisites"
                        ></textarea>
                        <small class="input-help">Ce que l'apprenant doit déjà savoir</small>
                    </div>
                </div>

                {# ============================================
                   SECTION 3 : PRÉFÉRENCES DE GÉNÉRATION
                   ============================================ #}
                <div class="moodia-form-section">
                    <h3 class="moodia-form-section__title">
                        {% include '_components/icons/settings.html.twig' %}
                        Préférences de génération
                    </h3>

                    {# Ligne 1: Approche pédagogique et Nombre de sections #}
                    <div class="form-row">
                        <div class="form-group">
                            <label for="pedagogical_approach">
                                Approche pédagogique
                                <span class="required">*</span>
                            </label>
                            <select
                                id="pedagogical_approach"
                                name="pedagogical_approach"
                                class="input"
                                data-moodia--step-2-parameters-target="pedagogicalApproach"
                                required
                            >
                                <option value="balanced" selected>Équilibrée (théorie + pratique)</option>
                                <option value="theoretical">Théorique (concepts et fondamentaux)</option>
                                <option value="practical">Pratique (exercices et cas réels)</option>
                            </select>
                            <small class="input-help">Influence le type de contenu généré</small>
                        </div>

                        <div class="form-group">
                            {% if parametersForm.maxSections is defined %}
                                <label for="{{ parametersForm.maxSections.vars.id }}">
                                    Nombre de sections
                                    <span class="required">*</span>
                                </label>
                                {{ form_widget(parametersForm.maxSections, {
                                    'attr': {
                                        'data-moodia--step-2-parameters-target': 'maxSections',
                                        'placeholder': 'Ex: 5',
                                        'min': '2',
                                        'max': '15',
                                        'value': '5'
                                    }
                                }) }}
                                <small class="input-help">Structure globale du cours</small>
                            {% endif %}
                        </div>
                    </div>

                    {# Instructions additionnelles (optionnel) #}
                    <div class="form-group form-group--full">
                        <label>
                            Instructions additionnelles
                            <span class="optional-badge">Optionnel</span>
                        </label>
                        <textarea
                            name="additional_instructions"
                            rows="3"
                            class="input"
                            placeholder="Ex: Inclure des exemples concrets du monde réel, éviter les formules mathématiques, privilégier les schémas..."
                            data-moodia--step-2-parameters-target="additionalInstructions"
                        ></textarea>
                        <small class="input-help">Précisions pour personnaliser davantage le contenu</small>
                    </div>
                </div>

                {# Champ caché pour compatibilité #}
                {% if parametersForm.activityDuration is defined %}
                    {{ form_widget(parametersForm.activityDuration, {'attr': {'style': 'display:none;', 'value': '30'}}) }}
                {% endif %}
            </div>

            <div class="step-actions">
                <button
                    type="button"
                    class="btn btn--secondary btn--large"
                    data-action="click->moodia--stepper#previousStep"
                >
                    Retour
                </button>
                <button
                    type="button"
                    class="btn btn--primary btn--large"
                    data-moodia--step-2-parameters-target="nextBtn"
                    data-action="click->moodia--step-3-analysis#startAnalysis"
                    disabled
                >
                    Lancer l'analyse
                </button>
            </div>
        {{ form_end(parametersForm) }}
    </div>
</div>