<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}" data-bs-theme="light">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ $appName }} - Admin</title>

    <!-- Early Theme Check — admin_theme key (store ile karışmasın) -->
    <script>
        (function() {
            if (! localStorage.getItem('admin_theme') && localStorage.getItem('theme')) {
                localStorage.setItem('admin_theme', localStorage.getItem('theme'));
            }
            const theme = localStorage.getItem('admin_theme') || 'light';
            document.documentElement.setAttribute('data-bs-theme', theme);
            if (theme === 'dark') {
                document.documentElement.classList.add('dark-theme');
            }
        })();
    </script>

    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('apple-touch-icon.png') }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon-32x32.png') }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon-16x16.png') }}">
    <link rel="shortcut icon" href="{{ asset('favicon.ico') }}">
    <link rel="manifest" href="{{ asset('site.webmanifest') }}">

    <!-- Scripts and Styles -->
    @vite(['resources/css/admin/app.css', 'resources/js/admin/app.js'])
</head>
<body>
    <div class="min-vh-100 d-flex flex-column">
        <!-- Theme Toggle -->
        <div class="position-fixed top-0 end-0 p-3">
            <button type="button" class="theme-toggle btn btn-link" id="themeToggle" aria-label="Tema Değiştir">
                <i class="fas fa-sun"></i>
            </button>
        </div>

        <!-- Page Content -->
        <main class="flex-grow-1 d-flex align-items-center">
            <div class="container py-4">
                @yield('content')
            </div>
        </main>
    </div>

    @stack('scripts')
    @stack('captcha-scripts')
</body>
</html>