<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<x-source-comment />
@inject('deployment', 'App\Services\DeploymentService')
@php
    // Reverb (Echo) endpoint derived at RUNTIME from the effective domain, so changing
    // the panel domain from the dashboard needs no JS rebuild. Read by resources/js/app.js.
    $reverb = $deployment->reverbClient();
@endphp
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>{{ $title ?? 'Clusev' }}</title>
    @include('partials.head-icons')
    <script>
        window.__clusev = { reverb: {
            key: @js($reverb['key']),
            host: @js($reverb['host']),
            port: {{ (int) $reverb['port'] }},
            scheme: @js($reverb['scheme']),
        } };
    </script>
    @vite(['resources/css/app.css', 'resources/js/app.js'])
    @livewireStyles
</head>
<body class="min-h-screen overflow-x-clip bg-void font-sans text-ink antialiased selection:bg-accent/25">
    <div x-data="{ nav: false, desktop: window.matchMedia('(min-width: 1024px)').matches }"
         @resize.window.debounce.200ms="desktop = window.matchMedia('(min-width: 1024px)').matches">
        {{-- mobile/tablet backdrop --}}
        <div x-show="nav" x-cloak x-transition.opacity @click="nav = false"
             class="fixed inset-0 z-30 bg-void/70 lg:hidden"
             aria-hidden="true"></div>

        <x-sidebar />

        <div class="relative z-10 lg:pl-[272px]">
            <x-topbar />
            <main class="mx-auto w-full max-w-7xl px-4 py-6 sm:px-6 lg:px-8">
                {{ $slot }}
            </main>
        </div>
    </div>
    @include('partials.toaster')

    {{-- Command palette + keyboard shortcuts (persistent; one global keydown listener) --}}
    <x-command-palette />

    {{-- Persist the modal manager across wire:navigate: otherwise body.replaceWith +
         Alpine.destroyTree tear down its window-level `openModal` listener on every SPA
         navigation, leaving a post-landing window where a click finds no live component
         (dead trigger / "Could not find Livewire component in DOM tree"). @persist keeps
         ONE stable manager + listener for the whole session. --}}
    @persist('modal')
        <livewire:wire-elements-modal />
    @endpersist
    @livewireScripts
</body>
</html>
