{{--
IMPORTANTE:
   - No cambiar el id survey del div principal, la encuesta se localiza por este id
   - Cada una de las preguntas debe ser un obeto de tipo INPUT, TEXTAREA o SELECT
   - Cada pregunta es identificada por su atributo name, por lo que debe especificarse siempre
   - El atributo title se utiliza para mencionar la pregunta en caso de error de validación,
     por lo que debe especificarse siempre
   - Cuando una de las preguntas sea obligatoria se debe especificar el atributo required
--}}


    <div id="survey" class="max-w-7xl mx-auto py-6 w-full flex flex-col">
        <h2 class="font-semibold text-xl text-gray-600 leading-tight mb-4">
            Cancelación
        </h2>
        <div class="flex flex-col sm:flex-row items-center sm:gap-4">
            <div class="w-full sm:w-1/2 flex flex-col mb-4">
                <label class="font-bold" for="tipo_cancelacion">Tipo de trabajo cancelado:</label>
                <select name="tipo_cancelacion" title="Tipo de trabajo cancelado:" class="rounded-xl border border-myagenda focus:border focus:border-caixa focus:ring-0 transition ease-in-out duration-500" required>
                    <option disabled selected>-</option>
                    <option value="Acompañamiento">Acompañamiento</option>
                    <option value="Formación">Formación</option>
                    <option value="Café senior">Café senior</option>
                    <option value="Reunión">Reunión</option>
                    <option value="Feria/Evento">Feria/Evento</option>
                </select>
            </div>

            <div class="w-full sm:w-1/2 flex flex-col mb-4">
                <label class="font-bold" for="motivo_cancelacion">Tipo de trabajo cancelado:</label>
                <select name="motivo_cancelacion" title="Motivo de cancelación:" class="rounded-xl border border-myagenda focus:border focus:border-caixa focus:ring-0 transition ease-in-out duration-500" required>
                    <option disabled selected>-</option>
                    <option value="Cliente no acepta visita">Cliente no acepta visita</option>
                    <option value="GN no acude a la visita">GN no acude a la visita</option>
                    <option value="Incompatibilidad de agenda">Incompatibilidad de agenda</option>
                </select>
            </div>
        </div>
    </div>

<script>
    document.addEventListener('DOMContentLoaded', ()=>{

    })
    function postLoadFromStore() {

    }
</script>