@extends('tema.plantilla')

{{-- {} Ajustes, propiedades y estilos --}}
@section('cabezaPagina')

@parent

<style>
    html, body, #error {
        height: 100%
    }
    #error {
        background: url(../imagenes/fondo/autenticacion.png?45649b8…), linear-gradient(90deg, var(--colorPrimario), var(--colorSecundario));
    }
    #error > .row {
        height: 100%;
        align-content: center
    }
    div.col-9.col-md-6.col-lg-5.col-xl-4 {
        padding: 40px 5px;
        background-color: var(--bs-white);
        border-radius: 10px
    }
    div.col-9.col-md-6.col-lg-5.col-xl-4 > * {
        margin: 5px 0
    }
    button {
        width: 104.2px
    }
</style>

@endsection

{{-- {} Título --}}
@section('tituloPagina', 'ERROR')

{{-- {} Contenido --}}
@section('contenidoCuerpoPagina')

<div id="error">
    <div class="row justify-content-center text-center">
        <div class="col-9 col-md-6 col-lg-5 col-xl-4">

            <h1 class="error-title">
                @yield('tituloPagina')
            </h1>

            <p class="subtitle">
                @yield('descripcionErrorPagina')
            </p>

            <button type="submit" class="btn btn-primary" onclick="location.href='{{ route('aplicacion.seccion.inicio') }}'">
                Regresar al inicio
            </button>

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

@endsection