@php
    $ui ??= \App\Support\SiteContent::ui();
    $languages ??= ['ps' => 'پښتو', 'fa' => 'دری', 'ar' => 'العربية', 'en' => 'English'];
    $nav ??= \App\Support\SiteContent::shared()['nav'];
    $currentLocale ??= app()->getLocale();
    $pageDir = $currentLocale === 'en' ? 'ltr' : 'rtl';
    $footerRights = [
        'ps' => 'ټول حقوق خوندي دي.',
        'fa' => 'تمامی حقوق محفوظ است.',
        'ar' => 'جميع الحقوق محفوظة.',
        'en' => 'All rights reserved.',
    ][$currentLocale] ?? 'ټول حقوق خوندي دي.';
@endphp
<!doctype html>
<html lang="{{ $currentLocale }}" dir="{{ $pageDir }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta name="description" content="{{ $ui['meta_description'] }}">
    <title>@yield('title', $ui['brand'])</title>
    <link rel="preconnect" href="https://fonts.bunny.net">
    <link href="https://fonts.bunny.net/css?family=noto-naskh-arabic:400,500,600,700|outfit:400,500,600,700" rel="stylesheet">
    @vite(['resources/css/app.css', 'resources/js/app.js'])
</head>
<body>
    <a class="skip-link" href="#content">{{ $ui['skip'] }}</a>
    <div class="ambient-geometry" aria-hidden="true">
        <span class="geo-motif geo-motif--one"></span>
        <span class="geo-motif geo-motif--two"></span>
        <span class="geo-motif geo-motif--three"></span>
    </div>

    <header class="site-header">
        <div class="topline" id="live-meta" data-default-zone="Asia/Kabul">
            <div class="container topline__grid">
                <p class="topline__blessing">{{ $ui['bismillah'] }}</p>
                <div class="topline__dates" aria-live="polite">
                    <span><i data-lucide="calendar-days" aria-hidden="true"></i><em id="date-gregorian">...</em></span>
                    <span><i data-lucide="moon-star" aria-hidden="true"></i><em id="date-hijri-qamari">...</em></span>
                    <span><i data-lucide="sun-medium" aria-hidden="true"></i><em id="date-hijri-shamsi">...</em></span>
                </div>
                <div class="topline__time">
                    <span class="topline__location"><i data-lucide="map-pin" aria-hidden="true"></i><em id="location-label">کابل، افغانستان</em></span>
                    <i data-lucide="clock-3" aria-hidden="true"></i>
                    <strong id="clock-time">--:--:--</strong>
                </div>
                <div class="topline__actions">
                    <label class="topline-select" aria-label="Languages">
                        <i data-lucide="languages" aria-hidden="true"></i>
                        <select data-language-select>
                            @foreach ($languages as $localeCode => $language)
                                <option value="{{ route('locale.switch', $localeCode) }}" @selected($currentLocale === $localeCode)>{{ $language }}</option>
                            @endforeach
                        </select>
                    </label>
                    @auth
                        @if (auth()->user()->isAdmin())
                            <a class="topline-link" href="{{ route('admin.dashboard') }}">{{ $ui['admin'] }}</a>
                        @endif
                        <form class="logout-form logout-form--top" method="post" action="{{ route('logout') }}">
                            @csrf
                            <button type="submit">{{ $ui['logout'] }}</button>
                        </form>
                    @else
                        <a class="topline-link" href="{{ route('login') }}"><i data-lucide="log-in" aria-hidden="true"></i>{{ $ui['login'] }}</a>
                    @endauth
                </div>
            </div>
        </div>

        <nav class="navbar" aria-label="اصلي لارښود">
            <div class="container navbar__inner">
                <a class="brand" href="{{ route('home') }}" aria-label="{{ $ui['brand'] }}">
                    <img src="{{ asset('images/logo.png') }}" alt="{{ $ui['brand'] }}">
                    <span>
                        <strong>{{ $ui['brand'] }}</strong>
                        <small>{{ $ui['brand_en'] }}</small>
                    </span>
                </a>

                <button class="nav-toggle" type="button" aria-expanded="false" aria-controls="main-nav" data-nav-toggle>
                    <span></span>
                    <span></span>
                    <span></span>
                    <span class="sr-only">لارښود پرانيستل</span>
                </button>

                <div class="navlinks" id="main-nav" data-nav-menu>
                    @foreach ($nav as $item)
                        <a href="{{ route($item['route']) }}" @class(['is-active' => request()->routeIs($item['route'])])>{{ $item['label'] }}</a>
                    @endforeach
                </div>
            </div>
        </nav>
    </header>

    <main id="content">
        @if (session('status'))
            <div class="container flash-message" role="status">{{ session('status') }}</div>
        @endif

        @yield('content')
    </main>

    <footer class="footer">
        <div class="container footer__grid">
            <section class="footer__brand">
                <img src="{{ asset('images/logo.png') }}" alt="">
                <h2>{{ $ui['brand'] }}</h2>
                <p>{{ $ui['footer_copy'] }}</p>
            </section>

            <section>
                <h3>{{ $ui['footer_links'] }}</h3>
                <div class="footer__links">
                    @foreach ($nav as $item)
                        <a href="{{ route($item['route']) }}">{{ $item['label'] }}</a>
                    @endforeach
                    <a href="{{ route('donate') }}">مرسته او صدقات</a>
                </div>
            </section>

            <section>
                <h3>{{ $ui['footer_services'] }}</h3>
                <div class="footer__links">
                    <a href="{{ route('darul-ifta') }}">{{ collect($nav)->firstWhere('route', 'darul-ifta')['label'] ?? 'Darul Ifta' }}</a>
                    <a href="{{ route('departments') }}">{{ collect($nav)->firstWhere('route', 'departments')['label'] ?? 'Departments' }}</a>
                    <a href="{{ route('publications') }}">{{ collect($nav)->firstWhere('route', 'publications')['label'] ?? 'Publications' }}</a>
                </div>
            </section>

            <section>
                <h3>{{ $ui['footer_contact'] }}</h3>
                <p class="footer__meta"><i data-lucide="map-pin" aria-hidden="true"></i> کابل، افغانستان</p>
                <p>{{ $ui['contact_hint'] }}</p>
                <div class="language-row" aria-label="ژبې">
                    @foreach ($languages as $localeCode => $language)
                        <a href="{{ route('locale.switch', $localeCode) }}" @class(['is-active' => $currentLocale === $localeCode])>{{ $language }}</a>
                    @endforeach
                </div>
                <div class="footer-theme">
                    <span>{{ $ui['theme'] }}</span>
                    <button class="theme-toggle footer-theme-toggle" type="button" data-theme-toggle aria-label="{{ $ui['theme'] }}">
                        <i data-lucide="sun" aria-hidden="true"></i>
                        <i data-lucide="moon" aria-hidden="true"></i>
                    </button>
                </div>
            </section>
        </div>
        <div class="footer__bottom">
            <div class="container">© {{ date('Y') }} {{ $ui['brand'] }}. {{ $footerRights }}</div>
        </div>
    </footer>
</body>
</html>
