<?php $lang = session('locale', 'en'); ?>
<!DOCTYPE html>
<html lang="<?php echo e($lang); ?>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $__env->yieldContent('title'); ?> - <?php echo e(\App\Models\Setting::val('site_name', 'Client Area')); ?></title>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="https://cdn.tailwindcss.com"></script>
    <script>
        tailwind.config = { darkMode: 'class' }
        if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
            document.documentElement.classList.add('dark')
        } else { document.documentElement.classList.remove('dark') }
    </script>
    <style>body { font-family: 'Inter', sans-serif; }</style>
</head>
<body class="bg-slate-50 dark:bg-[#020617] text-slate-800 dark:text-slate-300 flex h-screen overflow-hidden transition-colors duration-300">

    <div id="sidebarOverlay" class="fixed inset-0 bg-black/60 z-20 hidden lg:hidden backdrop-blur-sm" onclick="toggleSidebar()"></div>

    <?php echo $__env->make('user.layouts.menu', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>

    <div class="flex-1 flex flex-col overflow-hidden relative">
        <header class="h-16 flex items-center justify-between px-4 lg:px-8 border-b border-slate-200 dark:border-[#1e293b] bg-white dark:bg-[#0f172a] z-10">
            <button class="text-slate-500 dark:text-gray-400 lg:hidden" onclick="toggleSidebar()"><i class="fas fa-bars text-2xl"></i></button>
            
            <div class="flex items-center gap-4 ml-auto">
                <button onclick="toggleTheme()" class="w-8 h-8 rounded-full bg-slate-100 dark:bg-[#1e293b] flex items-center justify-center text-slate-600 dark:text-slate-300 hover:text-emerald-500">
                    <i class="fas fa-moon dark:hidden"></i>
                    <i class="fas fa-sun hidden dark:block"></i>
                </button>
                <a href="<?php echo e(route('lang.switch', $lang == 'bn' ? 'en' : 'bn')); ?>" class="w-8 h-8 rounded-full bg-slate-100 dark:bg-[#1e293b] flex items-center justify-center font-bold text-xs text-slate-600 dark:text-slate-300 hover:text-emerald-500">
                    <?php echo e($lang == 'bn' ? 'EN' : 'BN'); ?>

                </a>

                <div class="bg-slate-100 dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] px-4 py-1.5 rounded-full flex items-center gap-2">
                    <i class="fas fa-wallet text-emerald-500 dark:text-emerald-400"></i>
                    <span class="text-sm font-bold text-slate-800 dark:text-white">৳<?php echo e(number_format(Auth::user()->balance, 2)); ?></span>
                </div>
                
                <form action="<?php echo e(route('logout')); ?>" method="POST" class="m-0 border-l border-slate-200 dark:border-[#1e293b] pl-4">
                    <?php echo csrf_field(); ?>
                    <button type="submit" class="text-slate-500 dark:text-gray-400 hover:text-red-500 transition-colors font-medium text-sm flex items-center gap-2">
                        <i class="fas fa-sign-out-alt"></i> <span class="hidden sm:inline"><?php echo e($lang == 'bn' ? 'লগআউট' : 'Logout'); ?></span>
                    </button>
                </form>
            </div>
        </header>

        <main class="flex-1 overflow-x-hidden overflow-y-auto p-4 lg:p-8">
            <?php echo $__env->yieldContent('content'); ?>
        </main>
    </div>

    <script>
        function toggleSidebar() {
            document.getElementById('sidebar').classList.toggle('-translate-x-full');
            document.getElementById('sidebarOverlay').classList.toggle('hidden');
        }
        function toggleTheme() {
            document.documentElement.classList.toggle('dark');
            localStorage.theme = document.documentElement.classList.contains('dark') ? 'dark' : 'light';
        }
    </script>
</body>
</html>
<?php /**PATH /home/anstserv/public_html/resources/views/user/layouts/app.blade.php ENDPATH**/ ?>