<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta name="chatbot-api-url" content="{{ route('chatbot.send') }}">
    <title>@yield('title', 'BKKBN Kecamatan Kanigoro')</title>
    <link rel="stylesheet"
        href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
    <link rel="stylesheet"
        href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@48,400,1,0" />
    {{-- <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet"> --}}
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" />


    @stack('styles')
    @vite(['resources/css/app.css', 'resources/js/app.js', 'resources/js/chatbot.js'])
</head>

<body class="bg-gray-100 font-sans leading-normal tracking-normal flex flex-col min-h-screen">
    <div class="sticky top-0 z-40">
        {{-- <div class="bg-gradient-to-r from-sky-500 to-blue-700 text-white shadow-lg backdrop-blur-sm">
            <div class="container mx-auto px-4 sm:px-6 lg:px-8 py-3 text-center text-base">
                <p class="font-medium">
                    Punya pertanyaan? Coba
                    <a href="#" id="header-chatbot-link"
                        class="font-bold underline hover:text-sky-200 transition-colors duration-200 ease-in-out">
                        Asisten Wajib Tahu !
                    </a>
                </p>
            </div>
        </div> --}}

        @include('partials.header')

    </div>
    
    <main class="flex-grow">
        @yield('content')
    </main>

    @include('partials.chatbot')
    @if(!request()->is('admin/*'))
    @include('partials.footer')
@endif
    
    <script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.9/dist/cdn.min.js" defer></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    @stack('scripts')
    

</body>

</html>