<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>@yield('title', 'Admin') | {{ $siteName ?? 'Accessway Express' }}</title>
    @if(!empty($faviconUrl))<link rel="icon" href="{{ $faviconUrl }}">@endif
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="{{ asset('css/app.css') }}">
    <link rel="stylesheet" href="{{ asset('css/admin.css') }}">
</head>
<body class="admin">
    <header class="admin-topbar">
        <div class="admin-topbar-left">
            <button class="hamburger" type="button" data-toggle-side aria-label="Toggle menu">☰</button>
            <strong>{{ $siteName ?? 'Accessway Express Courier' }}</strong>
        </div>
        <div class="admin-user">
            <span class="profile-ico" aria-hidden="true">👤</span>
            <span>{{ trim((auth()->user()->first_name ?? '').' '.(auth()->user()->last_name ?? '')) ?: auth()->user()->name }}</span>
            <form method="POST" action="{{ route('admin.logout') }}">
                @csrf
                <button type="submit">Log out</button>
            </form>
        </div>
    </header>

    <div class="admin-shell">
        <aside class="admin-side">
            <div class="side-head">
                <small>Admin Manager</small>
                <b>Admin</b>
            </div>
            <a href="{{ route('admin.shipments.index') }}" class="{{ request()->routeIs('admin.dashboard') || request()->routeIs('admin.shipments.index') || request()->routeIs('admin.shipments.show') ? 'active' : '' }}">
                <span class="ico">⌂</span> Dashboard
            </a>
            <a href="{{ route('admin.shipments.create') }}" class="{{ request()->routeIs('admin.shipments.create') ? 'active' : '' }}">
                <span class="ico">🚚</span> Create New Shipment
            </a>
            <div class="side-group {{ request()->routeIs('admin.email.*') || request()->routeIs('admin.messages.*') ? 'open' : '' }}">
                <button type="button" class="side-toggle {{ request()->routeIs('admin.email.*') || request()->routeIs('admin.messages.*') ? 'active' : '' }}">
                    <span><span class="ico">✉</span> Email Services</span>
                    <span>▾</span>
                </button>
                <div class="side-sub">
                    <a href="{{ route('admin.email.create') }}" class="{{ request()->routeIs('admin.email.*') ? 'active' : '' }}">Send Email</a>
                    <a href="{{ route('admin.messages.index') }}" class="{{ request()->routeIs('admin.messages.*') ? 'active' : '' }}">Inbox</a>
                </div>
            </div>
            <a href="{{ route('admin.administrators.index') }}" class="{{ request()->routeIs('admin.administrators.*') ? 'active' : '' }}">
                <span class="ico">👤</span> Administrator(s)
            </a>
            <div class="side-group {{ request()->routeIs('admin.settings.*') ? 'open' : '' }}">
                <button type="button" class="side-toggle {{ request()->routeIs('admin.settings.*') ? 'active' : '' }}">
                    <span><span class="ico">⚙</span> Settings</span>
                    <span>▾</span>
                </button>
                <div class="side-sub">
                    <a href="{{ route('admin.settings.index') }}" class="{{ request()->routeIs('admin.settings.*') ? 'active' : '' }}">App Settings</a>
                </div>
            </div>
            <a href="{{ route('home') }}" target="_blank">
                <span class="ico">i</span> View website
            </a>
        </aside>

        <div class="admin-main">
            <div class="admin-page-head">
                <h1>@yield('heading', 'Dashboard')</h1>
                <div class="page-actions">
                    @yield('actions')
                </div>
            </div>
            @if(session('success'))
                <div class="alert alert-ok">{{ session('success') }}</div>
            @endif
            @if($errors->any())
                <div class="alert alert-err">{{ $errors->first() }}</div>
            @endif
            @yield('content')
        </div>
    </div>
    <script>
        document.querySelector('[data-toggle-side]')?.addEventListener('click', function () {
            document.body.classList.toggle('side-collapsed');
        });
        document.querySelectorAll('.side-toggle').forEach(function (btn) {
            btn.addEventListener('click', function () {
                btn.parentElement.classList.toggle('open');
            });
        });
    </script>
    @yield('scripts')
</body>
</html>
