@extends('web.student.index')
@section('title', 'Ocorreu um erro')

<style>
.error-container {
    font-family: 'Inter', sans-serif;
    text-align: center;
    color: #000000; /* Black */
    display: flex;
    flex-direction: column;
    padding-top: 2rem; 
    align-items: center;
    height: 90vh;
}

.error-image {
    width: 20%; /* Adjusted width to better fit the page layout */
    height: auto;
    margin-bottom: 2rem;
    border-radius: 50%;
}

.error-container h1 {
    color: #003366; /* Dark blue based on the header color */
    font-size: 3rem; /* Increased size for better visibility */
    margin: 1rem 0;
}

.error-container p {
    color: #000000; /* Black */
    font-size: 1.5rem; /* Slightly larger font size for readability */
    margin-bottom: 1rem;
}

</style>

@section('content')

<div class="error-container">
    <img src="{{ asset('/images/web/error.webp')}}" alt="Erro 500" class="error-image">
    <h1>Ops! Algo deu errado...</h1>
    <p>Estamos enfrentando problemas técnicos. Caso o problema persista, por favor, acione o  suporte.</p>
    
</div>

@stop