<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>@yield('title', 'Ahoj Ministries')</title>

    <!-- Tailwind CSS via CDN -->
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-50 text-gray-800">

<!-- Navbar -->
<nav class="bg-white shadow sticky top-0 z-50">
    <div class="max-w-7xl mx-auto px-6 py-4 flex justify-between items-center">
        <a href="/" class="font-bold text-xl text-red-700">Ahoj Ministries</a>
        <div class="space-x-6">
            <a href="/" class="{{ request()->is('/') ? 'font-semibold text-red-700' : 'hover:text-red-700' }}">Home</a>
            <a href="/about" class="{{ request()->is('about') ? 'font-semibold text-red-700' : 'hover:text-red-700' }}">About</a>
            <a href="/ministries" class="{{ request()->is('ministries') ? 'font-semibold text-red-700' : 'hover:text-red-700' }}">Ministries</a>
            <a href="/events" class="{{ request()->is('events') ? 'font-semibold text-red-700' : 'hover:text-red-700' }}">Events</a>
            <a href="#members" class="hover:text-red-700">Members</a>
            <a href="#contact" class="hover:text-red-700">Contact</a>
        </div>
    </div>
</nav>

{{-- Main Content --}}
<main>
    @yield('content')
</main>

<!-- Footer -->
<footer class="bg-gray-900 text-white mt-20">
    <div class="max-w-7xl mx-auto p-6 flex flex-col md:flex-row justify-between items-center text-sm">
        <div class="mb-4 md:mb-0">
            © {{ date('Y') }} Ahoj Ministries. All rights reserved.
        </div>
        <div class="flex space-x-4">
            <a href="#" class="hover:text-red-700">Privacy Policy</a>
            <a href="#" class="hover:text-red-700">Terms of Service</a>
            <a href="#" class="hover:text-red-700">Contact</a>
        </div>
    </div>
</footer>

</body>
</html>
