{% extends 'bare.html.twig' %}

{% block body %}
    <h2 class="px-4 py-4 text-3xl font-extrabold text-orange-500">500</h2>
    <div class="flex flex-col bg-orange-500/50 p-4 rounded-lg gap-4 w-full md:w-[420px] border-orange-500 border-2 text-gray-50 animate-fade">
        <div class="flex flex-col m-0 text-center">
            <h3 class="text-2xl text-bold text-center text-gray-50">Oh crap!</h3>
        </div>
        <p class="mb-2">There are many things I'm capable of, but this ain't one of 'em!</p>
        <pre class="bg-gray-800 text-white p-4 rounded-md overflow-x-auto">
            <code class="language-plaintext">
                {{ exception.message }}
            </code>
        </pre>
    </div>
{% endblock %}