@extends('layouts.app')

@section('content')
<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-md-8 col-lg-7">
            <div class="card shadow-lg border-0 text-center">
                <div class="card-header bg-dark text-white p-4" style="border-bottom: 4px solid #C9A050;">
                    <img src="{{ asset('img/logo_50_aniversario.png') . '?' . filemtime(public_path('img/logo_50_aniversario.png')) }}" 
                        alt="50 Años" 
                        class="mb-2" 
                        style="max-height: 80px; filter: drop-shadow(0px 2px 4px rgba(0,0,0,0.5));">
                    <h2 class="mb-0 fw-bold">¡Postulación Recibida!</h2>
                </div>

                <div class="card-body p-5">
                    <div class="mb-4">
                        <i class="bi bi-check-circle-fill text-success" style="font-size: 4rem;"></i>
                    </div>
                    
                    <h3 class="fw-bold text-dark">¡Muchas gracias por participar!</h3>
                    <p class="lead text-muted">Tu inscripción al Concurso Fotográfico 50° Aniversario ha sido procesada correctamente.</p>
                    
                    {{-- Bloque de advertencias según Bases y Condiciones --}}
                    <div class="row text-start g-3 my-4">
                        <div class="col-12">
                            <div class="p-3 rounded-3 bg-light border-start border-4 border-warning">
                                <h6 class="fw-bold mb-1"><i class="bi bi-info-circle-fill me-2"></i> Próximos pasos:</h6>
                                <ul class="small text-muted mb-0 ps-3">
                                    <li>Tu material será revisado para constatar que cumple con los requisitos técnico.</li>
                                    <li>La selección final del jurado será <strong>inapelable</strong> y se notificará oportunamente.</li>
                                    <li>Recuerda que conservas tus derechos de autor, autorizando a COIRCO el uso institucional de las obras.</li>
                                </ul>
                            </div>
                        </div>
                    </div>

                    <div class="alert alert-info border-0 small shadow-sm py-3 mb-4">
                        <i class="bi bi-envelope-check-fill me-2"></i>
                        Se ha enviado un correo electrónico de confirmación. 
                        <br><strong>Revisa tu carpeta de Correo No Deseado o Spam.</strong>
                    </div>

                    <hr class="my-4 opacity-25">

                    <div class="d-grid gap-2 col-md-8 mx-auto">
                        <a href="{{ url('/') }}" class="btn btn-dark btn-lg py-3 shadow-sm fw-bold text-uppercase" style="border-bottom: 3px solid #C9A050;">
                            <i class="bi bi-house-door-fill me-2"></i> Volver al Inicio
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- FOOTER --}}
<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="{{ asset('img/logo_coirco.png') }}" alt="COIRCO" style="max-height: 60px; 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>
@endsection