wagtail-enap-designsystem 1.2.1.127__py3-none-any.whl → 1.2.1.128__py3-none-any.whl

enap_designsystem/templates/enap_designsystem/includes/form_field.html

@@ -1,7 +1,55 @@
-<!-- home/templates/home/includes/form_field.html -->
+<!-- enap_designsystem/includes/form_field.html -->
 {% load wagtailcore_tags %}
 {% load wagtailimages_tags %}
 <style>
+    .conditional-field-condicional-group {
+        position: relative;
+    }
+    
+    .conditional-condicional-fields {
+        border-left: 3px solid var(--primary-color);
+        background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
+        transition: all 0.3s ease;
+    }
+    
+    .conditional-condicional-fields:hover {
+        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+    }
+    
+    .conditional-fields-header {
+        margin-bottom: 1rem;
+        padding-bottom: 0.5rem;
+        border-bottom: 1px solid #dee2e6;
+    }
+    
+    .conditional-fields-header .text-muted {
+        font-style: italic;
+    }
+    
+    /* Animações específicas para campos condicionais */
+    .conditional-condicional-fields.show {
+        animation: slideInDown 0.3s ease-out;
+    }
+    
+    @keyframes slideInDown {
+        from {
+            opacity: 0;
+            transform: translateY(-20px);
+        }
+        to {
+            opacity: 1;
+            transform: translateY(0);
+        }
+    }
+    
+    /* Responsividade para campos condicionais */
+    @media (max-width: 768px) {
+        .conditional-condicional-fields {
+            padding: 0.75rem;
+            margin-top: 0.75rem;
+        }
+    }
+
     .conditional-fields {
         border-left: 4px solid var(--primary-color);
         background: #f8f9fa;
@@ -612,6 +660,288 @@
         >
     </div>
 
+    {% elif block.block_type == 'conditional_field_condicional' %}
+    <div class="form-group conditional-field-condicional-group">
+        <label for="{{ block.block_type }}_{{ block.id }}">
+            {{ block.value.label_con }}
+            {% if block.value.required_con %}<span class="required">*</span>{% endif %}
+        </label>
+        {% if block.value.help_text_con %}
+            <div class="help-text">{{ block.value.help_text_con }}</div>
+        {% endif %}
+        
+        {% if block.value.field_type_con == 'dropdown' %}
+            <select 
+                id="{{ block.block_type }}_{{ block.id }}" 
+                name="{{ block.block_type }}_{{ block.id }}"
+                class="form-control conditional-condicional-trigger"
+                {% if block.value.required_con %}required{% endif %}
+                data-field-id="{{ block.block_type }}_{{ block.id }}"
+            >
+                <option value="">Selecione uma opção...</option>
+                {% for option_block in block.value.conditional_options_con %}
+                    <option value="{{ option_block.value.value_con }}" 
+                            {% if form_data == option_block.value.value_con %}selected{% endif %}>
+                        {{ option_block.value.value_con }}
+                    </option>
+                {% endfor %}
+            </select>
+        {% else %}
+            <!-- Radio buttons -->
+            <div class="radio-group">
+                {% for option_block in block.value.conditional_options_con %}
+                    <div class="radio-item">
+                        <input 
+                            type="radio" 
+                            id="{{ block.block_type }}_{{ block.id }}_{{ forloop.counter }}" 
+                            name="{{ block.block_type }}_{{ block.id }}"
+                            value="{{ option_block.value.value_con }}"
+                            class="conditional-condicional-trigger"
+                            data-field-id="{{ block.block_type }}_{{ block.id }}"
+                            {% if form_data == option_block.value.value_con %}checked{% endif %}
+                            {% if block.value.required_con %}required{% endif %}
+                        >
+                        <label for="{{ block.block_type }}_{{ block.id }}_{{ forloop.counter }}">
+                            {{ option_block.value.value_con }}
+                        </label>
+                    </div>
+                {% endfor %}
+            </div>
+        {% endif %}
+        
+        <!-- Campos condicionais -->
+        {% for option_block in block.value.conditional_options_con %}
+            {% if option_block.value.action_con == 'show_fields_con' %}
+                <div class="conditional-condicional-fields" 
+                     data-parent-field="{{ block.block_type }}_{{ block.id }}"
+                     data-trigger-value="{{ option_block.value.value_con }}"
+                     style="display: none; margin-top: 1rem; padding: 1rem; border: 1px solid #e1e5e9; border-radius: 8px; background: #f8f9fa;">
+                    
+                    <div class="conditional-fields-header">
+                       
+                    </div>
+                    
+                    {% for field_block in option_block.value.fields_to_show_con %}
+                        {% include 'enap_designsystem/includes/form_field.html' with block=field_block %}
+                    {% endfor %}
+                </div>
+            {% endif %}
+        {% endfor %}
+    </div>
+
+<script>
+// JavaScript específico para conditional_field_condicional
+(function() {
+    console.log('🔧 Inicializando conditional_field_condicional para {{ block.block_type }}_{{ block.id }}');
+    
+    function initConditionalField() {
+        const fieldId = '{{ block.block_type }}_{{ block.id }}';
+        const triggers = document.querySelectorAll(`[data-field-id="${fieldId}"].conditional-condicional-trigger`);
+        
+        console.log(`🎯 Encontrados ${triggers.length} triggers para ${fieldId}`);
+        
+        if (triggers.length === 0) {
+            console.warn(`⚠️ Nenhum trigger encontrado para ${fieldId}`);
+            return;
+        }
+        
+        triggers.forEach((trigger, index) => {
+            console.log(`🔗 Configurando trigger ${index + 1}:`, trigger.type, trigger.name);
+            
+            trigger.addEventListener('change', function() {
+                console.log(`📝 Trigger mudou: ${this.value}`);
+                handleConditionalChange(fieldId, this.value);
+            });
+            
+            // Verificar estado inicial
+            if (trigger.checked || (trigger.type === 'select-one' && trigger.value)) {
+                console.log(`🚀 Estado inicial detectado: ${trigger.value}`);
+                handleConditionalChange(fieldId, trigger.value);
+            }
+        });
+    }
+    
+    function handleConditionalChange(fieldId, selectedValue) {
+        console.log(`🔄 Campo ${fieldId} mudou para: "${selectedValue}"`);
+        
+        // Ocultar todos os campos condicionais deste campo
+        const allFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
+        console.log(`📦 Encontrados ${allFields.length} campos condicionais`);
+        
+        allFields.forEach((field, index) => {
+            field.style.display = 'none';
+            console.log(`👁️ Ocultando campo ${index + 1}`);
+            
+            // Limpar valores dos campos ocultos
+            const inputs = field.querySelectorAll('input, select, textarea');
+            inputs.forEach(input => {
+                if (input.type === 'checkbox' || input.type === 'radio') {
+                    input.checked = false;
+                } else {
+                    input.value = '';
+                }
+                
+                // Disparar evento change para outros condicionais aninhados
+                input.dispatchEvent(new Event('change', { bubbles: true }));
+            });
+        });
+        
+        // Mostrar campos para o valor selecionado
+        if (selectedValue) {
+            const targetField = document.querySelector(`[data-parent-field="${fieldId}"][data-trigger-value="${selectedValue}"]`);
+            if (targetField) {
+                targetField.style.display = 'block';
+                
+                // Animação suave
+                targetField.style.opacity = '0';
+                targetField.style.transform = 'translateY(-10px)';
+                
+                setTimeout(() => {
+                    targetField.style.transition = 'all 0.3s ease';
+                    targetField.style.opacity = '1';
+                    targetField.style.transform = 'translateY(0)';
+                }, 10);
+                
+                console.log(`✅ Campos mostrados para: "${selectedValue}"`);
+                
+                // Scroll suave para os campos que apareceram
+                setTimeout(() => {
+                    targetField.scrollIntoView({ 
+                        behavior: 'smooth', 
+                        block: 'nearest' 
+                    });
+                }, 300);
+            } else {
+                console.warn(`⚠️ Nenhum campo condicional encontrado para valor: "${selectedValue}"`);
+            }
+        }
+    }
+    
+    // Inicializar quando DOM estiver pronto
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', initConditionalField);
+    } else {
+        initConditionalField();
+    }
+})();
+</script>
+
+<style>
+/* Estilos específicos para conditional_field_condicional */
+.conditional-field-condicional-group {
+    position: relative;
+    margin-bottom: 1.5rem;
+}
+
+.conditional-condicional-fields {
+    border-left: 4px solid var(--primary-color, #2A5E2C);
+    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
+    transition: all 0.3s ease;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
+    border-radius: 8px;
+    overflow: hidden;
+}
+
+.conditional-condicional-fields:hover {
+    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+}
+
+.conditional-fields-header {
+    margin-bottom: 1rem;
+    padding-bottom: 0.5rem;
+    border-bottom: 1px solid #dee2e6;
+    background: rgba(42, 94, 44, 0.05);
+    margin: -1rem -1rem 1rem -1rem;
+    padding: 0.75rem 1rem;
+}
+
+.conditional-fields-header .text-muted {
+    color: var(--primary-color, #2A5E2C) !important;
+    font-weight: 600;
+    font-size: 0.9rem;
+}
+
+/* Melhorar a aparência dos campos aninhados */
+.conditional-condicional-fields .form-group {
+    margin-bottom: 1.25rem;
+}
+
+.conditional-condicional-fields .form-group:last-child {
+    margin-bottom: 0;
+}
+
+.conditional-condicional-fields .form-control {
+    border-color: #d1d9e0;
+    background: white;
+}
+
+.conditional-condicional-fields .form-control:focus {
+    border-color: var(--primary-color, #2A5E2C);
+    box-shadow: 0 0 0 2px rgba(42, 94, 44, 0.1);
+}
+
+/* Animações */
+@keyframes slideInDown {
+    from {
+        opacity: 0;
+        transform: translateY(-15px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.conditional-condicional-fields.show {
+    animation: slideInDown 0.3s ease-out;
+}
+
+/* Indicador visual para campos condicionais ativos */
+.conditional-condicional-fields::before {
+    content: '';
+    position: absolute;
+    left: -4px;
+    top: 0;
+    bottom: 0;
+    width: 4px;
+    background: linear-gradient(to bottom, var(--primary-color, #2A5E2C), #4CAF50);
+    border-radius: 0 2px 2px 0;
+}
+
+/* Responsivo */
+@media (max-width: 768px) {
+    .conditional-condicional-fields {
+        padding: 0.75rem;
+        margin-top: 0.75rem;
+        border-left-width: 3px;
+    }
+    
+    .conditional-fields-header {
+        margin: -0.75rem -0.75rem 0.75rem -0.75rem;
+        padding: 0.6rem 0.75rem;
+    }
+    
+    .conditional-fields-header .text-muted {
+        font-size: 0.85rem;
+    }
+}
+
+@media (max-width: 480px) {
+    .conditional-condicional-fields {
+        padding: 0.6rem;
+        border-left-width: 2px;
+    }
+    
+    .conditional-fields-header {
+        margin: -0.6rem -0.6rem 0.6rem -0.6rem;
+        padding: 0.5rem 0.6rem;
+    }
+}
+</style>
+
+
+    
+
 {% elif block.block_type == 'checkbox_field' %}
     <div class="form-group">
         <label>{{ block.value.label }}</label>
@@ -1000,6 +1330,90 @@
         {% endif %}
     </div>
 
+
+
+    {% elif block.block_type == 'section_divider' %}
+    <div class="section-divider" 
+        data-section-name="{{ block.value.section_name }}"
+        data-block-id="{{ block.id }}"
+        {% if block.value.is_hidden_by_default %}style="display: none;"{% endif %}>
+        
+        <div class="divider-header">
+            <h2 class="section-title">{{ block.value.title }}</h2>
+            {% if block.value.subtitle %}
+                <p class="section-subtitle">{{ block.value.subtitle }}</p>
+            {% endif %}
+        </div>
+        <hr class="section-line">
+    </div>
+
+    {% elif block.block_type == 'smart_navigation_field' %}
+    <!-- CAMPO COM NAVEGAÇÃO INTELIGENTE -->
+    <div class="form-group smart-navigation-group" 
+        data-field-type="smart_navigation_field"
+        data-field-id="smart_navigation_field_{{ block.id }}">
+        
+        <label>
+            {{ block.value.label }}
+            {% if block.value.required %}<span class="required">*</span>{% endif %}
+        </label>
+        
+        {% if block.value.help_text %}
+            <div class="help-text">{{ block.value.help_text }}</div>
+        {% endif %}
+        
+        {% if block.value.field_type == 'radio' %}
+            <!-- Radio buttons -->
+            <div class="radio-group">
+                {% for option in block.value.navigation_options %}
+                    <div class="radio-item">
+                        <input 
+                            type="radio" 
+                            name="smart_navigation_field_{{ block.id }}" 
+                            id="smart_nav_{{ block.id }}_{{ forloop.counter }}"
+                            value="{{ option.value.value }}"
+                            class="smart-navigation-trigger"
+                            {% if block.value.required %}required{% endif %}>
+                        <label for="smart_nav_{{ block.id }}_{{ forloop.counter }}">
+                            {{ option.value.value }}
+                        </label>
+                    </div>
+                {% endfor %}
+            </div>
+            
+        {% elif block.value.field_type == 'dropdown' %}
+            <!-- Dropdown -->
+            <select 
+                class="form-control smart-navigation-trigger" 
+                name="smart_navigation_field_{{ block.id }}"
+                id="smart_navigation_field_{{ block.id }}"
+                {% if block.value.required %}required{% endif %}>
+                <option value="">Selecione uma opção...</option>
+                {% for option in block.value.navigation_options %}
+                    <option value="{{ option.value.value }}">
+                        {{ option.value.value }}
+                    </option>
+                {% endfor %}
+            </select>
+            
+        {% elif block.value.field_type == 'checkbox' %}
+            <!-- Checkbox único -->
+            {% for option in block.value.navigation_options %}
+                <div class="checkbox-item">
+                    <input 
+                        type="checkbox" 
+                        name="smart_navigation_field_{{ block.id }}" 
+                        id="smart_nav_{{ block.id }}_{{ forloop.counter }}"
+                        value="{{ option.value.value }}"
+                        class="smart-navigation-trigger"
+                        {% if block.value.required %}required{% endif %}>
+                    <label for="smart_nav_{{ block.id }}_{{ forloop.counter }}">
+                        {{ option.value.value }}
+                    </label>
+                </div>
+            {% endfor %}
+        {% endif %}
+    </div>
     
 
 {% endif %}
@@ -1129,445 +1543,447 @@
         e.currentTarget.style.background = '#f8f9fa';
     }
 
-// Atualizar texto de rating
-document.addEventListener('click', function(e) {
-    if (e.target.classList.contains('star')) {
-        const ratingGroup = e.target.parentNode;
-        const value = parseInt(e.target.dataset.value);
-        const maxRating = ratingGroup.querySelectorAll('.star').length;
-        const ratingText = ratingGroup.querySelector('.rating-text');
-        
-        if (ratingText) {
-            ratingText.textContent = `${value} de ${maxRating} estrelas`;
+    // Atualizar texto de rating
+    document.addEventListener('click', function(e) {
+        if (e.target.classList.contains('star')) {
+            const ratingGroup = e.target.parentNode;
+            const value = parseInt(e.target.dataset.value);
+            const maxRating = ratingGroup.querySelectorAll('.star').length;
+            const ratingText = ratingGroup.querySelector('.rating-text');
+            
+            if (ratingText) {
+                ratingText.textContent = `${value} de ${maxRating} estrelas`;
+            }
         }
-    }
-});
+    });
 
 
 
-// JavaScript para campos condicionais
-document.addEventListener('DOMContentLoaded', function() {
-    // Encontrar todos os campos condicionais
-    const conditionalTriggers = document.querySelectorAll('.conditional-trigger');
-    
-    conditionalTriggers.forEach(trigger => {
-        // Adicionar listener de mudança
-        trigger.addEventListener('change', function() {
-            handleConditionalField(this);
+    // JavaScript para campos condicionais
+    document.addEventListener('DOMContentLoaded', function() {
+        // Encontrar todos os campos condicionais
+        const conditionalTriggers = document.querySelectorAll('.conditional-trigger');
+        
+        conditionalTriggers.forEach(trigger => {
+            // Adicionar listener de mudança
+            trigger.addEventListener('change', function() {
+                handleConditionalField(this);
+            });
+            
+            // Processar estado inicial se já tem valor
+            if (trigger.value) {
+                handleConditionalField(trigger);
+            }
         });
+
+            // Adicione esta função após validateCPF no template
+
+        function validateCNPJ(cnpj) {
+            const digits = cnpj.replace(/[^0-9]/g, '');
+            return digits.length === 14;
+        }
+
+        // E adicione esta validação no método validateCurrentStep, após a validação do CPF:
+
+        if (input.classList.contains('cnpj-field') && input.value) {
+            if (!validateCNPJ(input.value)) {
+                showFieldError(input, 'CNPJ deve ter 14 dígitos');
+                isValid = false;
+            }
+        }
         
-        // Processar estado inicial se já tem valor
-        if (trigger.value) {
-            handleConditionalField(trigger);
+        function handleConditionalField(triggerElement) {
+            const fieldId = triggerElement.dataset.fieldId;
+            const selectedValue = triggerElement.value;
+            
+            // Encontrar todos os campos condicionais relacionados
+            const conditionalFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
+            
+            conditionalFields.forEach(fieldContainer => {
+                const triggerValue = fieldContainer.dataset.triggerValue;
+                
+                if (selectedValue === triggerValue) {
+                    // Mostrar campos
+                    fieldContainer.style.display = 'block';
+                    
+                    // Ativar validação dos campos filhos
+                    const inputs = fieldContainer.querySelectorAll('input, select, textarea');
+                    inputs.forEach(input => {
+                        if (input.dataset.originalRequired !== undefined) {
+                            input.required = input.dataset.originalRequired === 'true';
+                        }
+                    });
+                } else {
+                    // Esconder campos
+                    fieldContainer.style.display = 'none';
+                    
+                    // Desativar validação e limpar valores
+                    const inputs = fieldContainer.querySelectorAll('input, select, textarea');
+                    inputs.forEach(input => {
+                        // Salvar estado original do required
+                        if (input.dataset.originalRequired === undefined) {
+                            input.dataset.originalRequired = input.required.toString();
+                        }
+                        input.required = false;
+                        
+                        // Limpar valores
+                        if (input.type === 'checkbox' || input.type === 'radio') {
+                            input.checked = false;
+                        } else {
+                            input.value = '';
+                        }
+                    });
+                }
+            });
         }
     });
 
-        // Adicione esta função após validateCPF no template
 
-    function validateCNPJ(cnpj) {
-        const digits = cnpj.replace(/[^0-9]/g, '');
-        return digits.length === 14;
-    }
+    // ADICIONE ESTE CÓDIGO AO FINAL DO SEU <script> NO form_field.html
 
-    // E adicione esta validação no método validateCurrentStep, após a validação do CPF:
+    // ========================================
+    // SISTEMA MULTI-REDIRECIONAMENTO
+    // ========================================
 
-    if (input.classList.contains('cnpj-field') && input.value) {
-        if (!validateCNPJ(input.value)) {
-            showFieldError(input, 'CNPJ deve ter 14 dígitos');
-            isValid = false;
-        }
-    }
-    
-    function handleConditionalField(triggerElement) {
-        const fieldId = triggerElement.dataset.fieldId;
-        const selectedValue = triggerElement.value;
+    // Variáveis de controle
+    let multiRedirectFields = new Map();
+    let pendingActions = new Map();
+
+    // INICIALIZAÇÃO DOS CAMPOS MULTI-REDIRECT
+    function initializeMultiRedirectFields() {
+        console.log('🔀 Inicializando multi-redirecionamento...');
         
-        // Encontrar todos os campos condicionais relacionados
-        const conditionalFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
+        const groups = document.querySelectorAll('.checkbox-multi-redirect-group');
+        console.log(`🔍 Encontrados ${groups.length} grupos multi-redirect`);
         
-        conditionalFields.forEach(fieldContainer => {
-            const triggerValue = fieldContainer.dataset.triggerValue;
-            
-            if (selectedValue === triggerValue) {
-                // Mostrar campos
-                fieldContainer.style.display = 'block';
+        groups.forEach(group => {
+            try {
+                const configData = group.getAttribute('data-field-config');
+                if (!configData) {
+                    console.log('⚠️ Configuração não encontrada para grupo:', group);
+                    return;
+                }
                 
-                // Ativar validação dos campos filhos
-                const inputs = fieldContainer.querySelectorAll('input, select, textarea');
-                inputs.forEach(input => {
-                    if (input.dataset.originalRequired !== undefined) {
-                        input.required = input.dataset.originalRequired === 'true';
-                    }
-                });
-            } else {
-                // Esconder campos
-                fieldContainer.style.display = 'none';
+                const config = JSON.parse(configData);
+                multiRedirectFields.set(config.fieldId, config);
                 
-                // Desativar validação e limpar valores
-                const inputs = fieldContainer.querySelectorAll('input, select, textarea');
+                const inputs = group.querySelectorAll('.multi-redirect-input');
                 inputs.forEach(input => {
-                    // Salvar estado original do required
-                    if (input.dataset.originalRequired === undefined) {
-                        input.dataset.originalRequired = input.required.toString();
-                    }
-                    input.required = false;
-                    
-                    // Limpar valores
-                    if (input.type === 'checkbox' || input.type === 'radio') {
-                        input.checked = false;
-                    } else {
-                        input.value = '';
-                    }
+                    input.addEventListener('change', function() {
+                        handleMultiRedirectChange(config, this);
+                    });
                 });
+                
+                console.log(`✅ Campo configurado: ${config.fieldId} (${config.fieldType})`);
+                
+            } catch (error) {
+                console.error('❌ Erro configuração multi-redirect:', error, group);
             }
         });
+        
+        console.log(`🔀 ${multiRedirectFields.size} campos multi-redirect ativos`);
     }
-});
-
-
-// ADICIONE ESTE CÓDIGO AO FINAL DO SEU <script> NO form_field.html
 
-// ========================================
-// SISTEMA MULTI-REDIRECIONAMENTO
-// ========================================
-
-// Variáveis de controle
-let multiRedirectFields = new Map();
-let pendingActions = new Map();
-
-// INICIALIZAÇÃO DOS CAMPOS MULTI-REDIRECT
-function initializeMultiRedirectFields() {
-    console.log('🔀 Inicializando multi-redirecionamento...');
-    
-    const groups = document.querySelectorAll('.checkbox-multi-redirect-group');
-    console.log(`🔍 Encontrados ${groups.length} grupos multi-redirect`);
-    
-    groups.forEach(group => {
-        try {
-            const configData = group.getAttribute('data-field-config');
-            if (!configData) {
-                console.log('⚠️ Configuração não encontrada para grupo:', group);
-                return;
-            }
-            
-            const config = JSON.parse(configData);
-            multiRedirectFields.set(config.fieldId, config);
-            
-            const inputs = group.querySelectorAll('.multi-redirect-input');
-            inputs.forEach(input => {
-                input.addEventListener('change', function() {
-                    handleMultiRedirectChange(config, this);
-                });
-            });
-            
-            console.log(`✅ Campo configurado: ${config.fieldId} (${config.fieldType})`);
-            
-        } catch (error) {
-            console.error('❌ Erro configuração multi-redirect:', error, group);
+    // GERENCIAR MUDANÇA NO CAMPO
+    function handleMultiRedirectChange(config, input) {
+        const value = input.value;
+        const isSelected = input.checked || (input.tagName === 'SELECT' && value);
+        
+        console.log(`🎯 Campo ${config.fieldId}: valor="${value}", selecionado=${isSelected}`);
+        
+        // Para radio e select, sempre processar se tem valor
+        // Para checkbox, só processar se estiver marcado
+        const shouldProcess = (config.fieldType === 'checkbox') ? input.checked : Boolean(value);
+        
+        if (!shouldProcess) {
+            hideAllMessages(config.fieldId);
+            hideAllConditionalFields(config.fieldId);
+            return;
         }
-    });
-    
-    console.log(`🔀 ${multiRedirectFields.size} campos multi-redirect ativos`);
-}
-
-// GERENCIAR MUDANÇA NO CAMPO
-function handleMultiRedirectChange(config, input) {
-    const value = input.value;
-    const isSelected = input.checked || (input.tagName === 'SELECT' && value);
-    
-    console.log(`🎯 Campo ${config.fieldId}: valor="${value}", selecionado=${isSelected}`);
-    
-    // Para radio e select, sempre processar se tem valor
-    // Para checkbox, só processar se estiver marcado
-    const shouldProcess = (config.fieldType === 'checkbox') ? input.checked : Boolean(value);
-    
-    if (!shouldProcess) {
-        hideAllMessages(config.fieldId);
-        hideAllConditionalFields(config.fieldId);
-        return;
-    }
-    
-    const option = config.options.find(opt => opt.value === value);
-    if (!option) {
-        console.log(`⚠️ Opção não encontrada para valor: ${value}`);
-        return;
-    }
-    
-    console.log(`🚀 Executando ação: ${option.action} para "${option.value}"`);
-    
-    // Limpar ações/mensagens anteriores
-    clearPreviousActions(config.fieldId);
-    
-    // Mostrar mensagem se configurada
-    if (option.message) {
-        showMultiRedirectMessage(config.fieldId, option);
-    }
-    
-    // Processar ação
-    const delay = (option.delay || 1) * 1000;
-    
-    switch (option.action) {
-        case 'continue':
-            console.log('➡️ Continuando normalmente');
-            break;
-            
-        case 'next_step':
-            console.log('⏩ Programando próxima etapa');
-            setTimeout(() => {
-                if (typeof nextStep === 'function') {
-                    nextStep();
-                } else {
-                    console.log('⚠️ Função nextStep não encontrada');
-                }
-            }, delay);
-            break;
-            
-        case 'specific_section':
-            if (option.targetSection) {
-                console.log(`🎯 Programando redirecionamento para: ${option.targetSection}`);
+        
+        const option = config.options.find(opt => opt.value === value);
+        if (!option) {
+            console.log(`⚠️ Opção não encontrada para valor: ${value}`);
+            return;
+        }
+        
+        console.log(`🚀 Executando ação: ${option.action} para "${option.value}"`);
+        
+        // Limpar ações/mensagens anteriores
+        clearPreviousActions(config.fieldId);
+        
+        // Mostrar mensagem se configurada
+        if (option.message) {
+            showMultiRedirectMessage(config.fieldId, option);
+        }
+        
+        // Processar ação
+        const delay = (option.delay || 1) * 1000;
+        
+        switch (option.action) {
+            case 'continue':
+                console.log('➡️ Continuando normalmente');
+                break;
+                
+            case 'next_step':
+                console.log('⏩ Programando próxima etapa');
                 setTimeout(() => {
-                    if (typeof redirectToSpecificSection === 'function') {
-                        redirectToSpecificSection(option.targetSection);
+                    if (typeof nextStep === 'function') {
+                        nextStep();
                     } else {
-                        console.log('⚠️ Função redirectToSpecificSection não encontrada');
+                        console.log('⚠️ Função nextStep não encontrada');
                     }
                 }, delay);
-            }
-            break;
+                break;
+                
+            case 'specific_section':
+                if (option.targetSection) {
+                    console.log(`🎯 Programando redirecionamento para: ${option.targetSection}`);
+                    setTimeout(() => {
+                        if (typeof redirectToSpecificSection === 'function') {
+                            redirectToSpecificSection(option.targetSection);
+                        } else {
+                            console.log('⚠️ Função redirectToSpecificSection não encontrada');
+                        }
+                    }, delay);
+                }
+                break;
+                
+            case 'skip_to_end':
+                console.log('⏭️ Programando finalização');
+                setTimeout(() => {
+                    skipToFinalStep();
+                }, delay);
+                break;
+                
+            case 'show_fields':
+                console.log(`👁️ Mostrando campos condicionais para: ${value}`);
+                showConditionalFields(config.fieldId, value);
+                break;
+        }
+    }
+
+    // MOSTRAR MENSAGEM DE REDIRECIONAMENTO
+    function showMultiRedirectMessage(fieldId, option) {
+        const blockId = fieldId.split('_').pop();
+        const optionIndex = multiRedirectFields.get(fieldId).options.findIndex(opt => opt.value === option.value);
+        const messageEl = document.getElementById(`redirect_message_${blockId}_${optionIndex}`);
+        
+        if (messageEl) {
+            messageEl.style.display = 'block';
+            console.log(`💬 Mensagem mostrada para opção: ${option.value}`);
             
-        case 'skip_to_end':
-            console.log('⏭️ Programando finalização');
             setTimeout(() => {
-                skipToFinalStep();
-            }, delay);
-            break;
-            
-        case 'show_fields':
-            console.log(`👁️ Mostrando campos condicionais para: ${value}`);
-            showConditionalFields(config.fieldId, value);
-            break;
+                messageEl.scrollIntoView({ 
+                    behavior: 'smooth', 
+                    block: 'center' 
+                });
+            }, 100);
+        }
     }
-}
 
-// MOSTRAR MENSAGEM DE REDIRECIONAMENTO
-function showMultiRedirectMessage(fieldId, option) {
-    const blockId = fieldId.split('_').pop();
-    const optionIndex = multiRedirectFields.get(fieldId).options.findIndex(opt => opt.value === option.value);
-    const messageEl = document.getElementById(`redirect_message_${blockId}_${optionIndex}`);
-    
-    if (messageEl) {
-        messageEl.style.display = 'block';
-        console.log(`💬 Mensagem mostrada para opção: ${option.value}`);
+    // MOSTRAR CAMPOS CONDICIONAIS
+    function showConditionalFields(fieldId, value) {
+        // Primeiro esconder todos os campos condicionais deste campo
+        hideAllConditionalFields(fieldId);
         
-        setTimeout(() => {
-            messageEl.scrollIntoView({ 
-                behavior: 'smooth', 
-                block: 'center' 
-            });
-        }, 100);
+        // Mostrar apenas o campo correspondente ao valor selecionado
+        const conditionalField = document.querySelector(
+            `[data-parent-field="${fieldId}"][data-option-value="${value}"]`
+        );
+        
+        if (conditionalField) {
+            conditionalField.style.display = 'block';
+            console.log(`👁️ Campos condicionais mostrados para: ${value}`);
+            
+            setTimeout(() => {
+                conditionalField.scrollIntoView({ 
+                    behavior: 'smooth', 
+                    block: 'center' 
+                });
+            }, 200);
+        }
     }
-}
 
-// MOSTRAR CAMPOS CONDICIONAIS
-function showConditionalFields(fieldId, value) {
-    // Primeiro esconder todos os campos condicionais deste campo
-    hideAllConditionalFields(fieldId);
-    
-    // Mostrar apenas o campo correspondente ao valor selecionado
-    const conditionalField = document.querySelector(
-        `[data-parent-field="${fieldId}"][data-option-value="${value}"]`
-    );
-    
-    if (conditionalField) {
-        conditionalField.style.display = 'block';
-        console.log(`👁️ Campos condicionais mostrados para: ${value}`);
+    // OCULTAR TODAS AS MENSAGENS
+    function hideAllMessages(fieldId) {
+        const blockId = fieldId.split('_').pop();
+        const messages = document.querySelectorAll(`[id^="redirect_message_${blockId}_"]`);
         
-        setTimeout(() => {
-            conditionalField.scrollIntoView({ 
-                behavior: 'smooth', 
-                block: 'center' 
-            });
-        }, 200);
+        messages.forEach(message => {
+            message.style.display = 'none';
+        });
     }
-}
-
-// OCULTAR TODAS AS MENSAGENS
-function hideAllMessages(fieldId) {
-    const blockId = fieldId.split('_').pop();
-    const messages = document.querySelectorAll(`[id^="redirect_message_${blockId}_"]`);
-    
-    messages.forEach(message => {
-        message.style.display = 'none';
-    });
-}
 
-// OCULTAR TODOS OS CAMPOS CONDICIONAIS
-function hideAllConditionalFields(fieldId) {
-    const conditionalFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
-    
-    conditionalFields.forEach(field => {
-        field.style.display = 'none';
-    });
-}
+    // OCULTAR TODOS OS CAMPOS CONDICIONAIS
+    function hideAllConditionalFields(fieldId) {
+        const conditionalFields = document.querySelectorAll(`[data-parent-field="${fieldId}"]`);
+        
+        conditionalFields.forEach(field => {
+            field.style.display = 'none';
+        });
+    }
 
-// LIMPAR AÇÕES ANTERIORES
-function clearPreviousActions(fieldId) {
-    pendingActions.delete(fieldId);
-    hideAllMessages(fieldId);
-}
+    // LIMPAR AÇÕES ANTERIORES
+    function clearPreviousActions(fieldId) {
+        pendingActions.delete(fieldId);
+        hideAllMessages(fieldId);
+    }
 
-// PULAR PARA ETAPA FINAL
-function skipToFinalStep() {
-    console.log(`⏭️ Executando pulo para final`);
-    
-    // Adicionar campo hidden indicando redirecionamento
-    const form = document.getElementById('wagtailForm');
-    if (form) {
-        let skipField = form.querySelector('input[name="form_redirected"]');
-        if (!skipField) {
-            skipField = document.createElement('input');
-            skipField.type = 'hidden';
-            skipField.name = 'form_redirected';
-            form.appendChild(skipField);
-        }
-        skipField.value = 'true';
+    // PULAR PARA ETAPA FINAL
+    function skipToFinalStep() {
+        console.log(`⏭️ Executando pulo para final`);
         
-        console.log('📨 Submetendo formulário...');
-        form.submit();
-    } else {
-        console.log('⚠️ Formulário não encontrado');
+        // Adicionar campo hidden indicando redirecionamento
+        const form = document.getElementById('wagtailForm');
+        if (form) {
+            let skipField = form.querySelector('input[name="form_redirected"]');
+            if (!skipField) {
+                skipField = document.createElement('input');
+                skipField.type = 'hidden';
+                skipField.name = 'form_redirected';
+                form.appendChild(skipField);
+            }
+            skipField.value = 'true';
+            
+            console.log('📨 Submetendo formulário...');
+            form.submit();
+        } else {
+            console.log('⚠️ Formulário não encontrado');
+        }
     }
-}
 
-// FUNÇÃO PARA REDIRECIONAR PARA SEÇÃO ESPECÍFICA (caso não exista)
-if (typeof redirectToSpecificSection === 'undefined') {
-    function redirectToSpecificSection(sectionTitle) {
-        console.log(`🎯 Procurando seção: "${sectionTitle}"`);
-        
-        // Procurar divisores com título correspondente
-        const dividers = document.querySelectorAll('.divider-title');
-        
-        for (const divider of dividers) {
-            const dividerTitle = divider.textContent?.trim() || '';
+    // FUNÇÃO PARA REDIRECIONAR PARA SEÇÃO ESPECÍFICA (caso não exista)
+    if (typeof redirectToSpecificSection === 'undefined') {
+        function redirectToSpecificSection(sectionTitle) {
+            console.log(`🎯 Procurando seção: "${sectionTitle}"`);
             
-            if (dividerTitle.toLowerCase().includes(sectionTitle.toLowerCase()) ||
-                sectionTitle.toLowerCase().includes(dividerTitle.toLowerCase())) {
-                
-                console.log(`✅ Seção encontrada: "${dividerTitle}"`);
-                
-                // Scroll para o divisor
-                setTimeout(() => {
-                    divider.scrollIntoView({ 
-                        behavior: 'smooth', 
-                        block: 'center' 
-                    });
-                }, 100);
+            // Procurar divisores com título correspondente
+            const dividers = document.querySelectorAll('.divider-title');
+            
+            for (const divider of dividers) {
+                const dividerTitle = divider.textContent?.trim() || '';
                 
-                return true;
+                if (dividerTitle.toLowerCase().includes(sectionTitle.toLowerCase()) ||
+                    sectionTitle.toLowerCase().includes(dividerTitle.toLowerCase())) {
+                    
+                    console.log(`✅ Seção encontrada: "${dividerTitle}"`);
+                    
+                    // Scroll para o divisor
+                    setTimeout(() => {
+                        divider.scrollIntoView({ 
+                            behavior: 'smooth', 
+                            block: 'center' 
+                        });
+                    }, 100);
+                    
+                    return true;
+                }
             }
+            
+            console.log(`❌ Seção "${sectionTitle}" não encontrada`);
+            return false;
         }
-        
-        console.log(`❌ Seção "${sectionTitle}" não encontrada`);
-        return false;
     }
-}
 
-// INICIALIZAÇÃO QUANDO DOM CARREGAR
-document.addEventListener('DOMContentLoaded', function() {
-    // Aguardar um pouco para garantir que tudo carregou
-    setTimeout(() => {
-        initializeMultiRedirectFields();
-    }, 500);
-});
-
-// DEBUGGING
-window.debugMultiRedirect = {
-    fields: () => multiRedirectFields,
-    pending: () => pendingActions,
-    testSection: (name) => redirectToSpecificSection(name),
-    skipToEnd: () => skipToFinalStep(),
-    init: () => initializeMultiRedirectFields()
-};
-
-console.log('🔀 Sistema Multi-Redirecionamento carregado');
-console.log('🔧 Debug: window.debugMultiRedirect');
-
-document.addEventListener('DOMContentLoaded', function() {
-    initializeMultiRedirectField('{{ block.block_type }}_{{ block.id }}');
-});
-
-function initializeMultiRedirectField(fieldId) {
-    const fieldGroup = document.querySelector(`[data-field-id="${fieldId}"]`);
-    if (!fieldGroup) return;
-
-    const inputs = fieldGroup.querySelectorAll('.multi-redirect-input');
-    const conditionalFields = fieldGroup.querySelectorAll('.multi-redirect-fields');
-
-    // Função para mostrar/ocultar campos condicionais
-    function toggleConditionalFields(selectedValue) {
-        conditionalFields.forEach(conditionalField => {
-            const optionValue = conditionalField.getAttribute('data-option-value');
-            
-            if (optionValue === selectedValue) {
-                // Mostrar campos desta opção
-                conditionalField.style.display = 'block';
-                conditionalField.style.animation = 'fadeIn 0.3s ease-in-out';
-                
-                // Marcar campos como obrigatórios se necessário
-                const nestedInputs = conditionalField.querySelectorAll('input[data-originally-required], select[data-originally-required], textarea[data-originally-required]');
-                nestedInputs.forEach(input => {
-                    input.required = true;
-                });
-            } else {
-                // Ocultar campos de outras opções
-                conditionalField.style.display = 'none';
+    // INICIALIZAÇÃO QUANDO DOM CARREGAR
+    document.addEventListener('DOMContentLoaded', function() {
+        // Aguardar um pouco para garantir que tudo carregou
+        setTimeout(() => {
+            initializeMultiRedirectFields();
+        }, 500);
+    });
+
+    // DEBUGGING
+    window.debugMultiRedirect = {
+        fields: () => multiRedirectFields,
+        pending: () => pendingActions,
+        testSection: (name) => redirectToSpecificSection(name),
+        skipToEnd: () => skipToFinalStep(),
+        init: () => initializeMultiRedirectFields()
+    };
+
+    console.log('🔀 Sistema Multi-Redirecionamento carregado');
+    console.log('🔧 Debug: window.debugMultiRedirect');
+
+    document.addEventListener('DOMContentLoaded', function() {
+        initializeMultiRedirectField('{{ block.block_type }}_{{ block.id }}');
+    });
+
+    function initializeMultiRedirectField(fieldId) {
+        const fieldGroup = document.querySelector(`[data-field-id="${fieldId}"]`);
+        if (!fieldGroup) return;
+
+        const inputs = fieldGroup.querySelectorAll('.multi-redirect-input');
+        const conditionalFields = fieldGroup.querySelectorAll('.multi-redirect-fields');
+
+        // Função para mostrar/ocultar campos condicionais
+        function toggleConditionalFields(selectedValue) {
+            conditionalFields.forEach(conditionalField => {
+                const optionValue = conditionalField.getAttribute('data-option-value');
                 
-                // Remover obrigatoriedade dos campos ocultos
-                const nestedInputs = conditionalField.querySelectorAll('input, select, textarea');
-                nestedInputs.forEach(input => {
-                    if (!input.getAttribute('data-originally-required')) {
-                        input.setAttribute('data-originally-required', input.required ? 'true' : 'false');
-                    }
-                    input.required = false;
+                if (optionValue === selectedValue) {
+                    // Mostrar campos desta opção
+                    conditionalField.style.display = 'block';
+                    conditionalField.style.animation = 'fadeIn 0.3s ease-in-out';
+                    
+                    // Marcar campos como obrigatórios se necessário
+                    const nestedInputs = conditionalField.querySelectorAll('input[data-originally-required], select[data-originally-required], textarea[data-originally-required]');
+                    nestedInputs.forEach(input => {
+                        input.required = true;
+                    });
+                } else {
+                    // Ocultar campos de outras opções
+                    conditionalField.style.display = 'none';
                     
-                    // Limpar valores dos campos ocultos
-                    if (input.type === 'checkbox' || input.type === 'radio') {
-                        input.checked = false;
+                    // Remover obrigatoriedade dos campos ocultos
+                    const nestedInputs = conditionalField.querySelectorAll('input, select, textarea');
+                    nestedInputs.forEach(input => {
+                        if (!input.getAttribute('data-originally-required')) {
+                            input.setAttribute('data-originally-required', input.required ? 'true' : 'false');
+                        }
+                        input.required = false;
+                        
+                        // Limpar valores dos campos ocultos
+                        if (input.type === 'checkbox' || input.type === 'radio') {
+                            input.checked = false;
+                        } else {
+                            input.value = '';
+                        }
+                    });
+                }
+            });
+        }
+
+        // Event listeners para diferentes tipos de input
+        inputs.forEach(input => {
+            if (input.type === 'checkbox') {
+                input.addEventListener('change', function() {
+                    if (this.checked) {
+                        toggleConditionalFields(this.value);
                     } else {
-                        input.value = '';
+                        toggleConditionalFields('');
+                    }
+                });
+                
+            } else if (input.type === 'radio') {
+                input.addEventListener('change', function() {
+                    if (this.checked) {
+                        toggleConditionalFields(this.value);
                     }
                 });
+                
+            } else if (input.tagName === 'SELECT') {
+                input.addEventListener('change', function() {
+                    toggleConditionalFields(this.value);
+                });
             }
         });
+
+        console.log(`✅ Multi-redirect field ${fieldId} inicializado com ${conditionalFields.length} campos condicionais`);
     }
 
-    // Event listeners para diferentes tipos de input
-    inputs.forEach(input => {
-        if (input.type === 'checkbox') {
-            input.addEventListener('change', function() {
-                if (this.checked) {
-                    toggleConditionalFields(this.value);
-                } else {
-                    toggleConditionalFields('');
-                }
-            });
-            
-        } else if (input.type === 'radio') {
-            input.addEventListener('change', function() {
-                if (this.checked) {
-                    toggleConditionalFields(this.value);
-                }
-            });
-            
-        } else if (input.tagName === 'SELECT') {
-            input.addEventListener('change', function() {
-                toggleConditionalFields(this.value);
-            });
-        }
-    });
 
-    console.log(`✅ Multi-redirect field ${fieldId} inicializado com ${conditionalFields.length} campos condicionais`);
-}
 
 // document.addEventListener('DOMContentLoaded', function() {
 //     // Dados dos estados passados pelo Django