<?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, maximum-scale=1.0, user-scalable=no">
    <title><?php echo e($lang == 'bn' ? 'রেজিস্টার' : 'Register'); ?> - <?php echo e(\App\Models\Setting::val('site_name', 'Client Portal')); ?></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>
    
    <?php if(\App\Models\Setting::val('enable_captcha') == 'yes'): ?>
        <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <?php endif; ?>

    <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>
        /* This ensures smooth scrolling and pull-to-refresh works on mobile */
        html, body { overscroll-behavior-y: contain; overflow-x: hidden; }
    </style>
</head>
<body class="bg-slate-50 dark:bg-[#020617] text-slate-800 dark:text-slate-300 min-h-[100dvh] flex items-center justify-center relative py-10 transition-colors duration-300">

    <div class="absolute top-6 right-6 z-50 flex gap-3">
        <a href="<?php echo e(route('lang.switch', $lang == 'bn' ? 'en' : 'bn')); ?>" class="w-10 h-10 rounded-full bg-white dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] shadow-sm flex items-center justify-center font-bold text-sm text-slate-600 dark:text-slate-300 hover:text-blue-500 transition-colors">
            <?php echo e($lang == 'bn' ? 'EN' : 'BN'); ?>

        </a>
        <button onclick="toggleTheme()" class="w-10 h-10 rounded-full bg-white dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] shadow-sm flex items-center justify-center text-slate-600 dark:text-slate-300 hover:text-blue-500 transition-colors">
            <i class="fas fa-moon dark:hidden"></i>
            <i class="fas fa-sun hidden dark:block text-yellow-400"></i>
        </button>
    </div>

    <div class="absolute top-[-5%] right-[-10%] w-64 h-64 md:w-[400px] md:h-[400px] bg-blue-500/20 blur-[100px] rounded-full pointer-events-none z-0"></div>
    <div class="absolute bottom-[-5%] left-[-10%] w-64 h-64 md:w-[400px] md:h-[400px] bg-emerald-500/10 blur-[100px] rounded-full pointer-events-none z-0"></div>

    <div class="w-full max-w-md p-6 relative z-10">
        
        <div class="text-center mb-8">
            <a href="<?php echo e(route('home')); ?>">
                <?php if(\App\Models\Setting::val('site_logo')): ?>
                    <img src="<?php echo e(asset(\App\Models\Setting::val('site_logo'))); ?>" alt="Logo" class="h-10 mx-auto mb-4 object-contain">
                <?php else: ?>
                    <div class="inline-flex items-center justify-center w-12 h-12 rounded-xl bg-gradient-to-br from-blue-500 to-indigo-600 text-white text-2xl mb-4 shadow-lg shadow-blue-500/30"><i class="fas fa-rocket"></i></div>
                <?php endif; ?>
            </a>
            <h2 class="text-2xl font-bold text-slate-800 dark:text-white tracking-tight"><?php echo e($lang == 'bn' ? 'একাউন্ট তৈরি করুন' : 'Create Account'); ?></h2>
        </div>

        <?php if(session('error')): ?>
            <div class="bg-red-100 dark:bg-red-500/10 border border-red-200 dark:border-red-500/20 text-red-600 dark:text-red-400 px-4 py-3 rounded-xl mb-6 text-sm flex items-center gap-2">
                <i class="fas fa-exclamation-circle"></i> <?php echo e(session('error')); ?>

            </div>
        <?php endif; ?>
        <?php if($errors->any()): ?>
            <div class="bg-red-100 dark:bg-red-500/10 border border-red-200 dark:border-red-500/20 text-red-600 dark:text-red-400 px-4 py-3 rounded-xl mb-6 text-sm">
                <ul class="list-disc list-inside">
                    <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <li><?php echo e($error); ?></li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </ul>
            </div>
        <?php endif; ?>

        <div class="bg-white dark:bg-[#0f172a]/80 backdrop-blur-xl border border-slate-200 dark:border-[#1e293b] rounded-2xl p-6 sm:p-8 shadow-xl dark:shadow-2xl">
            <form action="<?php echo e(route('register.post')); ?>" method="POST">
                <?php echo csrf_field(); ?>
                <div class="mb-4">
                    <label class="block text-xs font-bold text-slate-500 dark:text-slate-400 uppercase tracking-wider mb-2"><?php echo e($lang == 'bn' ? 'ইউজারনেম' : 'Username'); ?></label>
                    <input type="text" name="username" value="<?php echo e(old('username')); ?>" class="w-full bg-slate-50 dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] text-slate-800 dark:text-white text-sm rounded-xl focus:ring-blue-500 p-3 outline-none" required>
                </div>
                <div class="mb-4">
                    <label class="block text-xs font-bold text-slate-500 dark:text-slate-400 uppercase tracking-wider mb-2"><?php echo e($lang == 'bn' ? 'ইমেইল' : 'Email Address'); ?></label>
                    <input type="email" name="email" value="<?php echo e(old('email')); ?>" class="w-full bg-slate-50 dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] text-slate-800 dark:text-white text-sm rounded-xl focus:ring-blue-500 p-3 outline-none" required>
                </div>
                <div class="mb-4">
                    <label class="block text-xs font-bold text-slate-500 dark:text-slate-400 uppercase tracking-wider mb-2"><?php echo e($lang == 'bn' ? 'ফোন নাম্বার' : 'Phone Number'); ?></label>
                    <input type="text" name="phone" value="<?php echo e(old('phone')); ?>" class="w-full bg-slate-50 dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] text-slate-800 dark:text-white text-sm rounded-xl focus:ring-blue-500 p-3 outline-none" required>
                </div>
                <div class="mb-6">
                    <label class="block text-xs font-bold text-slate-500 dark:text-slate-400 uppercase tracking-wider mb-2"><?php echo e($lang == 'bn' ? 'পাসওয়ার্ড' : 'Password'); ?></label>
                    <input type="password" name="password" class="w-full bg-slate-50 dark:bg-[#1e293b] border border-slate-200 dark:border-[#334155] text-slate-800 dark:text-white text-sm rounded-xl focus:ring-blue-500 p-3 outline-none" required>
                </div>

                <?php if(\App\Models\Setting::val('enable_captcha') == 'yes'): ?>
                <div class="mb-6 flex justify-center w-full overflow-hidden">
                    <div class="g-recaptcha" data-sitekey="<?php echo e(\App\Models\Setting::val('recaptcha_site_key')); ?>" data-theme="dark"></div>
                </div>
                <?php endif; ?>

                <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 rounded-xl shadow-lg transition-all"><?php echo e($lang == 'bn' ? 'রেজিস্টার' : 'Create Account'); ?></button>
            </form>

            <?php if(\App\Models\Setting::val('enable_google_login') == 'yes'): ?>
                <div class="mt-6 flex items-center">
                    <div class="flex-grow border-t border-slate-200 dark:border-[#334155]"></div>
                    <span class="flex-shrink-0 mx-4 text-slate-400 text-xs uppercase font-bold"><?php echo e($lang == 'bn' ? 'অথবা' : 'Or register with'); ?></span>
                    <div class="flex-grow border-t border-slate-200 dark:border-[#334155]"></div>
                </div>

                <div class="mt-6">
                    <a href="<?php echo e(route('google.login')); ?>" class="w-full bg-slate-50 dark:bg-[#1e293b] hover:bg-slate-100 dark:hover:bg-[#334155] border border-slate-200 dark:border-[#334155] text-slate-700 dark:text-white font-medium py-2.5 rounded-xl transition-colors flex items-center justify-center gap-3">
                        <img src="https://www.svgrepo.com/show/475656/google-color.svg" alt="Google" class="w-5 h-5">
                        <?php echo e($lang == 'bn' ? 'গুগল দিয়ে একাউন্ট করুন' : 'Sign up with Google'); ?>

                    </a>
                </div>
            <?php endif; ?>

        </div>

        <p class="text-center text-sm text-slate-500 mt-8">
            <?php echo e($lang == 'bn' ? 'ইতিমধ্যেই একাউন্ট আছে?' : 'Already have an account?'); ?> 
            <a href="<?php echo e(route('login')); ?>" class="text-blue-400 hover:text-blue-300 font-bold transition-colors"><?php echo e($lang == 'bn' ? 'লগইন করুন' : 'Sign In'); ?></a>
        </p>
    </div>

    <script>
        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/auth/register.blade.php ENDPATH**/ ?>