@extends('landing.layout.master')

@section('title', 'Educa Auge - Accede a los mejores cursos online para docentes')
@section('styles')
    <link rel="stylesheet" href="{{ asset('assets/css/landing/index.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/css/landing/postregistro.css') }}" />
    <style>
        .fondo-principalv2 {
            position: relative;
            min-height: 100vh;
            /* ocupa toda la pantalla */
            width: 100%;
            overflow: hidden;
            background-image: url('/assets/img/landing/portada.png');
            background-size: cover;
            /* cubre toda la pantalla */
            background-position: center center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            /* efecto fondo fijo en PC */
        }

        @media (max-width: 768px) {
            .fondo-principalv2 {
                background-image: url('/assets/img/landing/portada_movil.jpg');
                background-attachment: scroll;
                /* evita bugs en iOS/Android */
                background-size: cover;
                background-position: center center;
            }
        }
    </style>
@endsection
@section('content')
    <main class="page-main">

        <div class="fondo-principalv2">
            <div class="contenido-fondo">
                <div class="uk-container otrodiv">
                    <div class="titulo-postregistro">
                        <h1>¡BIENVENIDO(A), DOCENTE!</h1>
                        <p>Ya estás a un paso de recibir tu acceso gratuito al curso. Solo necesitas unirte a nuestra
                            comunidad de docentes en WhatsApp, donde compartimos materiales, clases, sorteos y beneficios
                            exclusivos.</p>

                    </div>

                    <img src="{{ asset('assets/img/landing/principal.png') }}" alt="Fondo escritorio por defecto"
                        class="imagen-parte2">


                    <div class="disenofinal uk-child-width-1-3@s uk-grid-small uk-text-center" uk-grid>
                        <div>
                            <div class="pasofinal">
                                <div class="icono" style="margin-right: 10px">
                                    <img src="{{ asset('assets/img/landing/ads_click.png') }}" alt="Paso 1">
                                </div>
                                <div class="contenido">
                                    <h4>PASO N°01</h4>
                                    <p>Haz clic en el botón que verás más abajo.</p>
                                </div>
                            </div>
                        </div>

                        <div>
                            <div class="pasofinal">
                                <div class="icono" style="margin-right: 10px">
                                    <img src="{{ asset('assets/img/landing/check_circle.png') }}" alt="Paso 2">
                                </div>
                                <div class="contenido">
                                    <h4>PASO N°02</h4>
                                    <p>Acepta enviar el mensaje automático.</p>
                                </div>
                            </div>
                        </div>

                        <div>
                            <div class="pasofinal">
                                <div class="icono" style="margin-right: 10px">
                                    <img src="{{ asset('assets/img/landing/icono3.png') }}" alt="Paso 3">
                                </div>
                                <div class="contenido">
                                    <h4>PASO N°03</h4>
                                    <p>¡Listo! En unos minutos obtendrás tu acceso.</p>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{-- <a href="https://educaauge.com/iniciarsesion" class="uk-button-celeste uk-button-principal"
                        style="margin-bottom: 20px">
                        IR A LA COMUNIDAD <img src="{{ asset('assets/img/landing/icono.png') }}" alt="">
                    </a> --}}

                    <a href="#" id="btnComunidad" class="uk-button-celeste uk-button-principal btnComunidad"
                        style="margin-bottom: 20px">
                        IR A LA COMUNIDAD <img src="{{ asset('assets/img/landing/icono.png') }}" alt="">
                    </a>

                    <hr class="linea">

                    <div class="div-redes uk-child-width-1-4@s uk-grid-small uk-text-center" uk-grid>
                        <div class="div">
                            <a href="#" class="uk-button-redes btnComunidad">
                                <img src="{{ asset('assets/img/landing/facebook.png') }}" alt=""> @Grupo AUGE
                            </a>
                        </div>
                        <div class="div">
                            <a href="#" class="uk-button-redes btnComunidad">
                                <img src="{{ asset('assets/img/landing/tiktok.png') }}" alt=""> @educaauge
                            </a>
                        </div>
                        <div class="div">
                            <a href="#" class="uk-button-redes btnComunidad">
                                <img src="{{ asset('assets/img/landing/youtube.png') }}" alt=""> @augeeduca
                            </a>
                        </div>

                        <div class="div">
                            <a href="#" class="uk-button-redes btnComunidad">
                                <img src="{{ asset('assets/img/landing/instagram.png') }}" alt=""> @auge_peru
                            </a>
                        </div>
                    </div>


                    <div class="aviso-gmail uk-text-center">
                        <p>
                            Si tienes algún problema, escríbenos a informes@educaauge.com y te ayudaremos en breve. También
                            puedes comunicarte por WhatsApp al +51 957 668 571 o +51 912 361 023, o llamarnos a nuestro Call
                            Center: 01 709 7855. {{ $email ? 'Tu correo registrado es: ' . $email : '' }}
                        </p>
                    </div>

                </div>
            </div>
        </div>



    </main>
@endsection

@section('scripts')
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const botones = document.querySelectorAll('.btnComunidad');
            const email = @json($email ?? null);
            const destino = 'https://wa.me/message/HCATZAQBUDGYD1';

            botones.forEach(btn => {
                btn.addEventListener('click', function(e) {
                    e.preventDefault();

                    // Si no hay email, ir directo
                    if (!email) {
                        window.location.href = destino;
                        return;
                    }

                    // Enviar el email por AJAX y luego redirigir igual
                    fetch('{{ route('landing.actualizarultimo') }}', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        body: JSON.stringify({
                            email
                        })
                    }).finally(() => {
                        window.location.href = destino;
                    });
                });
            });
        });
    </script>
@endsection