@extends(theme_view('layouts.app'))

@section('title', '500 - Error del Servidor')

@section('content')
<div class="main-container col1-layout">
    <div class="main container">
        <div class="col-main">
            <div class="error-page" style="text-align: center; padding: 100px 20px;">
                <h1 style="font-size: 120px; color: #f77b71; margin: 0;">500</h1>
                <h2 style="font-size: 36px; margin: 20px 0;">Error Interno del Servidor</h2>
                <p style="font-size: 18px; color: #666; margin: 20px 0;">
                    Ha ocurrido un error inesperado en el servidor.
                </p>
                <p style="font-size: 16px; color: #999; margin: 20px 0;">
                    Por favor, intentá de nuevo más tarde o contactá al soporte técnico.
                </p>
                <div style="margin: 40px 0;">
                    <a href="javascript:history.back()" class="button" style="background: #f77b71; color: white; padding: 12px 30px; text-decoration: none; border-radius: 4px; display: inline-block;">
                        <i class="fa fa-arrow-left"></i> Volver Atrás
                    </a>
                    <a href="{{ route('front.home') }}" class="button" style="background: #333; color: white; padding: 12px 30px; text-decoration: none; border-radius: 4px; display: inline-block; margin-left: 10px;">
                        <i class="fa fa-home"></i> Volver al Inicio
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection