<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{{ ($title ?? __('errors.generic_title')).' — Clusev' }}</title>
    @include('partials.head-icons')
    @vite(['resources/css/app.css'])
</head>
{{-- Self-contained: no Livewire/session/auth deps, so it renders even when those
     are the thing that broke. Design tokens come from the bundled CSS (R3). --}}
<body class="grid min-h-screen place-items-center bg-void font-sans text-ink antialiased">
    <main class="w-full max-w-md px-6 py-10 text-center">
        <div class="mb-8 flex items-center justify-center gap-2.5">
            <span class="grid h-9 w-9 place-items-center rounded-md border border-accent/25 bg-accent/10 text-accent shadow-[0_0_18px_-2px_var(--color-accent)]">
                <x-icon name="server" class="h-5 w-5" />
            </span>
            <span class="font-display text-xl font-semibold tracking-wide text-ink">Clus<span class="text-accent">e</span>v</span>
        </div>

        <p class="font-mono text-[64px] font-bold leading-none text-accent/25 sm:text-[80px]">@yield('code')</p>
        <h1 class="mt-3 font-display text-2xl font-semibold text-ink">@yield('heading')</h1>
        <p class="mx-auto mt-3 max-w-sm text-sm leading-relaxed text-ink-2">@yield('message')</p>

        <div class="mt-8">
            <x-btn href="/" variant="secondary" size="lg">
                <x-icon name="chevron-left" class="h-3.5 w-3.5" /> {{ __('errors.back_home') }}
            </x-btn>
        </div>
    </main>
</body>
</html>
