<!DOCTYPE html>
{{--
    Layout for the server-rendered documents (currently the print sheet). The
    app itself is the Vue SPA in resources/views/app.blade.php.
--}}
<html lang="bn">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="theme-color" content="#6d28d9" media="(prefers-color-scheme: light)">
    <meta name="theme-color" content="#0d0c13" media="(prefers-color-scheme: dark)">
    <title>@yield('title', config('tracker.title'))</title>

    {{-- Applied before first paint so the theme never flashes. --}}
    <script>
        (function () {
            try {
                var saved = localStorage.getItem('tracker-theme');
                if (saved === 'light' || saved === 'dark') {
                    document.documentElement.setAttribute('data-theme', saved);
                }
            } catch (e) {}
        })();
    </script>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400..800&family=Noto+Sans+Bengali:wght@400;500;600;700;800&display=swap" rel="stylesheet">

    <link rel="stylesheet" href="{{ asset('css/app.css') }}?v=3">
</head>
<body>

@yield('appbar')

<main class="shell">
    @yield('content')
</main>

</body>
</html>
