{% extends "layouts/base.twig" %}

{% block content %}
<div class="flex flex-col items-center justify-center py-20 text-center space-y-4">
    <div class="text-6xl">📡</div>
    <h1 class="text-2xl font-bold text-slate-800">You're offline</h1>
    <p class="text-slate-500 max-w-sm">
        No internet connection detected. Some features need a connection — check back when you're online.
    </p>
    <button onclick="window.location.reload()"
            class="mt-4 px-6 py-3 bg-forest text-white font-semibold rounded-xl hover:bg-forest/90 transition-colors">
        Try again
    </button>
</div>
{% endblock %}