<!doctype html>
<html lang="<?php echo e(str_replace('_', '-', app()->getLocale())); ?>" data-bs-theme="light">

<head>
    <meta charset="utf-8" />
    <title>Admin Login | <?php echo e(config('app.name', 'Admin Panel')); ?></title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="<?php echo e(csrf_token()); ?>">

    <!-- App favicon -->
    <link rel="shortcut icon" href="<?php echo e(asset('favicon.ico')); ?>">

    <!-- Bootstrap Css -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Icons Css -->
    <link href="https://cdn.jsdelivr.net/npm/remixicon@3.5.0/fonts/remixicon.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet">

    <style>
        :root {
            --vz-primary: #405189;
            --vz-success: #0ab39c;
        }

        body {
            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            min-height: 100vh;
        }

        .auth-page-wrapper {
            display: flex;
            min-height: 100vh;
        }

        .auth-page-content {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            padding: 40px 20px;
        }

        .auth-card {
            background: #fff;
            border-radius: 12px;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
            width: 100%;
            max-width: 420px;
            overflow: hidden;
        }

        .auth-card-header {
            background: var(--vz-primary);
            padding: 30px;
            text-align: center;
        }

        .auth-card-header h5 {
            color: #fff;
            margin: 0;
            font-size: 24px;
            font-weight: 600;
        }

        .auth-card-header p {
            color: rgba(255, 255, 255, 0.7);
            margin: 8px 0 0;
            font-size: 14px;
        }

        .auth-card-body {
            padding: 30px;
        }

        .form-label {
            font-weight: 500;
            color: #495057;
            margin-bottom: 8px;
        }

        .form-control {
            padding: 12px 16px;
            border-radius: 8px;
            border: 1px solid #e9ebec;
            font-size: 14px;
        }

        .form-control:focus {
            border-color: var(--vz-primary);
            box-shadow: 0 0 0 0.25rem rgba(64, 81, 137, 0.15);
        }

        .input-group-text {
            background: #f3f6f9;
            border: 1px solid #e9ebec;
            border-radius: 8px 0 0 8px;
        }

        .input-group .form-control {
            border-radius: 0 8px 8px 0;
        }

        .btn-primary {
            background: var(--vz-primary);
            border-color: var(--vz-primary);
            padding: 12px 24px;
            border-radius: 8px;
            font-weight: 500;
            font-size: 15px;
            transition: all 0.3s ease;
        }

        .btn-primary:hover {
            background: #364574;
            border-color: #364574;
            transform: translateY(-1px);
        }

        .auth-logo {
            width: 60px;
            height: 60px;
            background: rgba(255, 255, 255, 0.2);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 16px;
        }

        .auth-logo i {
            font-size: 32px;
            color: #fff;
        }

        .form-check-input:checked {
            background-color: var(--vz-primary);
            border-color: var(--vz-primary);
        }

        .alert {
            border-radius: 8px;
            border: none;
            font-size: 14px;
        }

        .alert-danger {
            background-color: rgba(240, 101, 72, 0.1);
            color: #f06548;
        }

        .password-toggle {
            position: absolute;
            right: 12px;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            color: #878a99;
            z-index: 10;
        }

        .password-toggle:hover {
            color: #495057;
        }

        .position-relative {
            position: relative;
        }
    </style>
</head>

<body>
    <div class="auth-page-wrapper">
        <div class="auth-page-content">
            <div class="auth-card">
                <div class="auth-card-header">
                    <div class="auth-logo">
                        <i class="ri-shield-user-line"></i>
                    </div>
                    <h5>Welcome Back!</h5>
                    <p>Sign in to continue to Admin Panel</p>
                </div>

                <div class="auth-card-body">
                    <?php if($errors->any()): ?>
                    <div class="alert alert-danger mb-4">
                        <div class="d-flex align-items-center">
                            <i class="ri-error-warning-line me-2 fs-5"></i>
                            <div><?php echo e($errors->first()); ?></div>
                        </div>
                    </div>
                    <?php endif; ?>

                    <form action="<?php echo e(route('admin.login.submit')); ?>" method="POST">
                        <?php echo csrf_field(); ?>

                        <div class="mb-3">
                            <label for="email" class="form-label">Email Address</label>
                            <div class="input-group">
                                <span class="input-group-text"><i class="ri-mail-line"></i></span>
                                <input type="email" class="form-control <?php $__errorArgs = ['email'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>" id="email" name="email" value="<?php echo e(old('email')); ?>" placeholder="Enter email address" required autofocus>
                            </div>
                        </div>

                        <div class="mb-3">
                            <label for="password" class="form-label">Password</label>
                            <div class="position-relative">
                                <div class="input-group">
                                    <span class="input-group-text"><i class="ri-lock-2-line"></i></span>
                                    <input type="password" class="form-control <?php $__errorArgs = ['password'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?> is-invalid <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>" id="password" name="password" placeholder="Enter password" required>
                                </div>
                                <span class="password-toggle" onclick="togglePassword()">
                                    <i class="ri-eye-line" id="password-icon"></i>
                                </span>
                            </div>
                        </div>

                        <div class="mb-4">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" name="remember" id="remember" <?php echo e(old('remember') ? 'checked' : ''); ?>>
                                <label class="form-check-label" for="remember">Remember me</label>
                            </div>
                        </div>

                        <div class="d-grid">
                            <button type="submit" class="btn btn-primary">
                                <i class="ri-login-circle-line align-middle me-1"></i> Sign In
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>

    <script>
        function togglePassword() {
            var passwordInput = document.getElementById('password');
            var passwordIcon = document.getElementById('password-icon');

            if (passwordInput.type === 'password') {
                passwordInput.type = 'text';
                passwordIcon.classList.remove('ri-eye-line');
                passwordIcon.classList.add('ri-eye-off-line');
            } else {
                passwordInput.type = 'password';
                passwordIcon.classList.remove('ri-eye-off-line');
                passwordIcon.classList.add('ri-eye-line');
            }
        }
    </script>
</body>

</html>
<?php /**PATH /home/takwgzfj/montsportscamp.com/resources/views/admin/auth/login.blade.php ENDPATH**/ ?>