<?php
$pageTitle = 'Reset Password';
$pageDescription = 'Create a new password for your account.';
include __DIR__ . '/../layout/header.php';
?>

<div class="container mx-auto px-4 py-8">
    <div class="max-w-md mx-auto bg-card-bg rounded-xl shadow-lg overflow-hidden">
        <div class="p-6">
            <div class="text-center mb-6">
                <?php if (!empty($settings['logo_path'])): ?>
                <img src="<?= htmlspecialchars($settings['logo_path']) ?>" alt="<?= htmlspecialchars($settings['site_title'] ?? 'Game Portal') ?>" class="h-12 mx-auto mb-4">
                <?php else: ?>
                <h1 class="text-2xl font-bold text-primary"><?= htmlspecialchars($settings['site_title'] ?? 'Game Portal') ?></h1>
                <?php endif; ?>
                <h2 class="text-xl font-semibold">Reset Your Password</h2>
                <p class="text-gray-400 mt-1">Create a new password for your account</p>
            </div>
            
            <?php if (!empty($error)): ?>
            <div class="bg-red-900/50 border border-red-500 text-red-100 px-4 py-3 rounded mb-4">
                <p><?= htmlspecialchars($error) ?></p>
            </div>
            <?php endif; ?>
            
            <?php if (!empty($success)): ?>
            <div class="bg-green-900/50 border border-green-500 text-green-100 px-4 py-3 rounded mb-4">
                <p><?= htmlspecialchars($success) ?></p>
                <p class="mt-2"><a href="/login" class="text-green-300 hover:underline">Click here to login</a></p>
            </div>
            <?php else: ?>
            
            <form method="POST" action="/reset-password?email=<?= htmlspecialchars(urlencode($email)) ?>&token=<?= htmlspecialchars(urlencode($token)) ?>" class="space-y-4">
                <div>
                    <label for="password" class="block text-sm font-medium text-gray-300 mb-1">New Password</label>
                    <input type="password" id="password" name="password" class="w-full px-4 py-2 rounded-lg bg-darker border border-gray-700 text-white focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent" required minlength="8">
                    <p class="text-xs text-gray-400 mt-1">Must be at least 8 characters long</p>
                </div>
                
                <div>
                    <label for="confirm_password" class="block text-sm font-medium text-gray-300 mb-1">Confirm New Password</label>
                    <input type="password" id="confirm_password" name="confirm_password" class="w-full px-4 py-2 rounded-lg bg-darker border border-gray-700 text-white focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent" required minlength="8">
                </div>
                
                <div>
                    <button type="submit" class="w-full bg-primary hover:bg-primary-dark text-white font-bold py-2 px-4 rounded-lg transition duration-200">
                        Reset Password
                    </button>
                </div>
            </form>
            
            <?php endif; ?>
        </div>
    </div>
</div>

<?php include __DIR__ . '/../layout/footer.php'; ?>
