@php
    $companyName = app(\App\Services\SettingsService::class)->get('company_name', config('app.name'));
    $notificationCount = app(\App\Services\DashboardService::class)->notificationCount();
    $defaultTheme = app(\App\Services\SettingsService::class)->get('default_theme', 'dark');
    $pageTitle = trim($__env->yieldContent('title')) ?: 'Control Center';
@endphp
<!DOCTYPE html>
<html lang="en" data-default-theme="{{ $defaultTheme }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{{ $pageTitle }} | {{ $companyName }}</title>
    <script>
        (() => {
            const root = document.documentElement;
            const saved = localStorage.getItem('control-center-theme');
            root.dataset.theme = saved || root.dataset.defaultTheme || 'dark';
        })();
    </script>
    <link rel="stylesheet" href="{{ asset('assets/control-center.css') }}">
</head>
<body class="panel-body">
    <div class="panel-shell">
        <aside class="sidebar" data-mobile-nav>
            <div class="brand-lockup">
                <div class="brand-mark">CC</div>
                <div>
                    <p class="eyebrow">Central Multi-Site</p>
                    <h1>{{ $companyName }}</h1>
                </div>
            </div>

            <nav class="sidebar-nav">
                @foreach ($panelNavigation as $item)
                    <a
                        href="{{ route($item['route']) }}"
                        class="nav-link {{ request()->routeIs(...$item['patterns']) ? 'active' : '' }}"
                    >
                        <span class="nav-code">{{ $item['code'] }}</span>
                        <span>{{ $item['label'] }}</span>
                    </a>
                @endforeach
            </nav>

            <div class="sidebar-foot">
                <p class="eyebrow">Session</p>
                <p>{{ auth()->user()->email }}</p>
                <p class="muted">Super Admin</p>
            </div>
        </aside>

        <div class="main-shell">
            <header class="topbar">
                <button class="icon-button mobile-only" type="button" data-mobile-nav-toggle aria-label="Toggle navigation">
                    Menu
                </button>

                <div>
                    <p class="eyebrow">Current Page</p>
                    <h2>{{ $pageTitle }}</h2>
                </div>

                <div class="topbar-actions">
                    <form action="{{ route('search') }}" method="get" class="search-form">
                        <input type="search" name="q" value="{{ request('q') }}" placeholder="Search websites, logs, backups">
                    </form>

                    <a href="{{ route('system-health.index') }}" class="icon-button" aria-label="Notifications">
                        Alerts
                        @if ($notificationCount > 0)
                            <span class="pill">{{ $notificationCount }}</span>
                        @endif
                    </a>

                    <button class="icon-button" type="button" data-theme-toggle aria-label="Toggle theme">
                        Theme
                    </button>

                    <a href="{{ route('profile.show') }}" class="icon-button">
                        {{ auth()->user()->name }}
                    </a>
                </div>
            </header>

            <main class="content-shell">
                @if (session('status'))
                    <div class="flash success">{{ session('status') }}</div>
                @endif

                @if (session('error'))
                    <div class="flash danger">{{ session('error') }}</div>
                @endif

                @if ($errors->any())
                    <div class="flash danger">
                        <strong>There are a few things to fix.</strong>
                        <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                @yield('content')
            </main>
        </div>
    </div>

    <script src="{{ asset('assets/control-center.js') }}"></script>
</body>
</html>
