

<?php $__env->startSection('content'); ?>

<script src="https://www.google.com/recaptcha/api.js?hl=es" async defer></script>

<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-md-8 col-lg-6">
            
            
            <?php if(session('success')): ?>
                <div class="alert alert-success shadow-sm mb-4 border-0 animate__animated animate__fadeIn">
                    <i class="bi bi-check-circle-fill me-2"></i> <?php echo e(session('success')); ?>

                </div>
            <?php endif; ?>

            
            <?php if($errors->has('error')): ?>
                <div class="alert alert-danger shadow-sm mb-4 border-0 border-start border-4 border-danger">
                    <i class="bi bi-exclamation-octagon-fill me-2"></i> <?php echo e($errors->first('error')); ?>

                </div>
            <?php endif; ?>

            <div class="card shadow-lg border-0 overflow-hidden">
                <div class="card-header bg-dark text-white p-4 text-center" style="border-bottom: 4px solid #C9A050;">
                    <h3 class="mb-0 fw-bold"><i class="bi bi-envelope-paper me-2"></i> Consultas y Contacto</h3>
                    <p class="mb-0 opacity-75 small mt-2">
                        ¿Tenés dudas sobre las bases o dificultades en la postulación? <br>
                        Envianos tu mensaje y te responderemos por correo electrónico.
                    </p>
                </div>

                <div class="card-body p-4 p-md-5">
                    <form action="<?php echo e(route('contacto.send')); ?>" method="POST" id="form-contacto">
                        <?php echo csrf_field(); ?>
                        
                        <div class="mb-3">
                            <label class="form-label small fw-bold text-uppercase text-muted">Nombre Completo</label>
                            <div class="input-group">
                                <span class="input-group-text bg-light border-end-0"><i class="bi bi-person text-primary"></i></span>
                                <input type="text" name="nombre" class="form-control border-start-0 <?php $__errorArgs = ['nombre'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>" value="<?php echo e(old('nombre')); ?>" placeholder="Ej: Juan Pérez" required>
                                <?php $__errorArgs = ['nombre'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> <div class="invalid-feedback"><?php echo e($message); ?></div> <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label class="form-label small fw-bold text-uppercase text-muted">Correo Electrónico</label>
                            <div class="input-group">
                                <span class="input-group-text bg-light border-end-0"><i class="bi bi-envelope text-primary"></i></span>
                                <input type="email" name="email" class="form-control border-start-0 <?php $__errorArgs = ['email'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>" value="<?php echo e(old('email')); ?>" placeholder="nombre@ejemplo.com" required>
                                <?php $__errorArgs = ['email'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> <div class="invalid-feedback"><?php echo e($message); ?></div> <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label class="form-label small fw-bold text-uppercase text-muted">Motivo de la consulta</label>
                            <select name="asunto" class="form-select <?php $__errorArgs = ['asunto'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>" required>
                                <option value="" selected disabled>Seleccioná una opción...</option>
                                <option value="Problemas técnicos en la carga" <?php echo e(old('asunto') == 'Problemas técnicos en la carga' ? 'selected' : ''); ?>>Problemas técnicos en la carga de fotos</option>
                                <option value="Duda sobre bases y condiciones" <?php echo e(old('asunto') == 'Duda sobre bases y condiciones' ? 'selected' : ''); ?>>Duda sobre bases y condiciones</option>
                                <option value="Consulta general" <?php echo e(old('asunto') == 'Consulta general' ? 'selected' : ''); ?>>Consulta general</option>
                                <option value="Otro" <?php echo e(old('asunto') == 'Otro' ? 'selected' : ''); ?>>Otro</option>
                            </select>
                            <?php $__errorArgs = ['asunto'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> <div class="invalid-feedback"><?php echo e($message); ?></div> <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <div class="mb-4">
                            <label class="form-label small fw-bold text-uppercase text-muted">Mensaje o Detalle del problema</label>
                            <textarea name="mensaje" class="form-control <?php $__errorArgs = ['mensaje'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>" rows="5" 
                                placeholder="Por favor, contanos detalladamente en qué podemos ayudarte. Mínimo 10 caracteres." required><?php echo e(old('mensaje')); ?></textarea>
                            <?php $__errorArgs = ['mensaje'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> 
                                <div class="invalid-feedback fw-bold">El mensaje debe ser más extenso para poder ayudarte mejor.</div> 
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        
                        <div id="captcha-error" class="alert alert-warning py-2 d-none mb-3 text-center border-0 shadow-sm">
                            <i class="bi bi-robot me-2"></i> <span class="small fw-bold">Por favor, confirma que no eres un robot.</span>
                        </div>

                        
                        <div class="mb-4 d-flex justify-content-center">
                            <div class="g-recaptcha" data-sitekey="6LdIUKgaAAAAAPDoRFbU6Am-N75DobUlmx3GePye" data-callback="clearCaptchaError"></div>
                        </div>

                        <div class="d-grid">
                            <button type="submit" id="btn-enviar" class="btn btn-primary btn-lg py-3 fw-bold text-uppercase shadow-sm border-2">
                                <i class="bi bi-send-fill me-2"></i> Enviar Consulta
                            </button>
                        </div>
                    </form>
                </div>
            </div>         
        </div>
    </div>
</div>

<script>
    function clearCaptchaError() {
        document.getElementById('captcha-error').classList.add('d-none');
    }

    document.getElementById('form-contacto').addEventListener('submit', function(e) {
        const errorDiv = document.getElementById('captcha-error');
        const response = grecaptcha.getResponse();
        
        if(response.length == 0) {
            e.preventDefault();
            errorDiv.classList.remove('d-none');
            errorDiv.scrollIntoView({ behavior: 'smooth', block: 'center' });
            return false;
        }

        const btn = document.getElementById('btn-enviar');
        btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span> Enviando consulta...';
        btn.classList.add('disabled');
        
        // Pequeño delay para asegurar el envío del token
        setTimeout(() => {
            btn.style.pointerEvents = 'none';
        }, 50);
    });
</script>

<style>
    .form-control:focus, .form-select:focus {
        border-color: #C9A050;
        box-shadow: 0 0 0 0.25rem rgba(201, 160, 80, 0.25);
    }
    .input-group-text { color: #C9A050; }
    .is-invalid { border-color: #dc3545 !important; }
</style>

<footer class="pt-5 mt-5 text-muted border-top text-center pb-5 bg-light">
    <div class="container">
        <div class="mb-4">
            <img src="<?php echo e(asset('img/logo_coirco.png')); ?>" alt="COIRCO" style="max-height: 80px; filter: grayscale(100%); opacity: 0.6;">
        </div>
        <p class="mb-1 fw-bold">Comité Interjurisdiccional del Río Colorado (COIRCO)</p>
        <p class="small mb-0">&copy; 2026 - Comisión Organizadora del 50 Aniversario</p>
    </div>
</footer>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH C:\wamp64\www\concurso_fotografico\resources\views/contacto.blade.php ENDPATH**/ ?>