@extends('layout.error')

@section('title', 'Página no encontrada - 404')

@section('content')
<div class="card border-warning shadow-lg">
    <div class="card-header card-icatep-rojo2">
        <h4 class="mb-0 text-white">
            <i class="bx bx-error-alt"></i> Error 404 - Página no encontrada
        </h4>
    </div>
    <div class="card-body text-center py-5">
        <div class="mb-4">
            <i class="bx bx-confused text-icatep-rojo2" style="font-size: 100px;"></i>
        </div>
        
        <h1 class="display-1 text-icatep-rojo2 fw-bold">404</h1>
        <h3 class="text-icatep-rojo2 mb-3">¡Ups! Página no encontrada</h3>
        
        <p class="text-muted mb-4">
            La página que buscas no existe o ha sido movida a otra ubicación.
        </p>

        <div class="alert alert-light border mb-4" role="alert">
            <small class="text-muted">
                <strong>¿Qué puedes hacer?</strong>
                <ul class="text-start mt-2 mb-0">
                    <li>Verifica que la URL esté escrita correctamente</li>
                    <li>Regresa al inicio y navega desde ahí</li>
                    <li>Usa el buscador para encontrar lo que necesitas</li>
                    <li>Si crees que esto es un error, contacta al administrador</li>
                </ul>
            </small>
        </div>

        <div class="d-flex justify-content-center gap-3 flex-wrap">
            <a href="javascript:window.top.location.reload()" class="btn btn-icatep-rojo1">
                <i class="bx bx-refresh"></i> Reintentar
            </a>
            
            <a href="{{ route('dashboard') }}" class="btn btn-icatep-verde2" target="_top">
                <i class="bx bx-home"></i> Ir al inicio
            </a>
        </div>
    </div>
    <div class="card-footer text-center bg-light">
        <small class="text-muted">
            <i class="bx bx-help-circle"></i> Si necesitas ayuda, contacta al equipo de soporte
        </small>
    </div>
</div>

@push('scripts')
<script>
    // Registrar error 404 para análisis (opcional)
    console.warn('Error 404: Página no encontrada - URL:', window.location.href);
</script>
@endpush
@endsection