<?php
// register.php
require_once '../Config/DB.php';
$swal = ""; 

if (isset($_POST['register'])) {
    $username = trim($_POST['username']);
    $email = trim($_POST['email']);
    $password = $_POST['password'];
    $confirm_password = $_POST['confirm_password'];

    if (empty($username) || empty($email) || empty($password)) {
        $swal = "Swal.fire({ icon: 'error', title: 'THẤT BẠI', text: 'Vui lòng điền đầy đủ các thông tin bắt buộc!', background: '#130924', color: '#fff', confirmButtonColor: '#f43f5e' });";
    } elseif ($password !== $confirm_password) {
        $swal = "Swal.fire({ icon: 'warning', title: 'KHÔNG KHỚP', text: 'Mật khẩu xác nhận không khớp nhau!', background: '#130924', color: '#fff', confirmButtonColor: '#f43f5e' });";
    } else {
        $stmt = $conn->prepare("SELECT id FROM users WHERE username = ? OR email = ?");
        $stmt->execute([$username, $email]);
        if ($stmt->rowCount() > 0) {
            $swal = "Swal.fire({ icon: 'error', title: 'TRÙNG LẶP', text: 'Tên tài khoản hoặc Email này đã có người sử dụng!', background: '#130924', color: '#fff', confirmButtonColor: '#f43f5e' });";
        } else {
            $hashed_password = password_hash($password, PASSWORD_BCRYPT);
            $stmt = $conn->prepare("INSERT INTO users (username, email, password) VALUES (?, ?, ?)");
            if ($stmt->execute([$username, $email, $hashed_password])) {
                $swal = "Swal.fire({ icon: 'success', title: 'ĐĂNG KÝ THÀNH CÔNG', text: 'Hệ thống đã khởi tạo tài khoản. Đang chuyển tới trang Đăng Nhập...', background: '#130924', color: '#fff', confirmButtonColor: '#ec4899', timer: 2500, showConfirmButton: false }).then(() => { window.location.href = 'login.php'; });";
            } else {
                $swal = "Swal.fire({ icon: 'error', title: 'LỖI HỆ THỐNG', text: 'Đã có lỗi xảy ra trong quá trình tạo tài khoản.', background: '#130924', color: '#fff', confirmButtonColor: '#f43f5e' });";
            }
        }
    }
}
?>

<!DOCTYPE html>
<html lang="vi">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>Đăng Ký - DICHVUGIARE.SHOP</title>
    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Rajdhani:wght@500;600;700&family=Inter:wght@400;500&display=swap" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    
    <style>
        body { font-family: 'Rajdhani', sans-serif; background: radial-gradient(circle at center, #1a0b2e 0%, #0a0516 100%); }
        .font-gaming { font-family: 'Orbitron', sans-serif; }
        /* Font chuẩn cho ô nhập liệu không bị lỗi khoảng cách chữ */
        .font-input { font-family: 'Inter', sans-serif; }
        .neon-border-pink { box-shadow: 0 0 15px rgba(236, 72, 153, 0.4), inset 0 0 15px rgba(236, 72, 153, 0.2); border: 1px solid rgba(236, 72, 153, 0.6); }
        .neon-text-pink { text-shadow: 0 0 10px rgba(236, 72, 153, 0.6); }
        .neon-btn-pink { background: linear-gradient(135deg, #ec4899 0%, #f43f5e 100%); box-shadow: 0 0 15px rgba(236, 72, 153, 0.4); transition: all 0.3s ease; }
        .neon-btn-pink:hover { box-shadow: 0 0 25px rgba(236, 72, 153, 0.8); transform: translateY(-2px); }
    </style>
</head>
<body class="min-h-screen flex items-center justify-center p-4 overflow-x-hidden relative">

    <div class="absolute top-1/4 left-1/4 w-96 h-96 bg-purple-600/10 rounded-full blur-3xl pointer-events-none"></div>
    <div class="absolute bottom-1/4 right-1/4 w-96 h-96 bg-pink-600/10 rounded-full blur-3xl pointer-events-none"></div>

    <div class="w-full max-w-[92%] sm:max-w-md bg-[#130924]/80 backdrop-blur-xl p-6 sm:p-8 rounded-2xl neon-border-pink relative z-10">
        
        <div class="text-center mb-8">
            <h1 class="font-gaming text-2xl sm:text-3xl font-black tracking-widest text-transparent bg-clip-text bg-gradient-to-r from-cyan-400 via-purple-400 to-pink-500 uppercase">
                DICHVUGIARE
            </h1>
            <p class="text-gray-400 text-xs tracking-widest uppercase mt-1 font-gaming neon-text-pink text-pink-400">
                CREATE NEW ACCOUNT
            </p>
        </div>

        <form action="" method="POST" class="space-y-5">
            <div>
                <label class="block text-gray-400 text-xs uppercase font-gaming mb-2 tracking-wider">Tên tài khoản</label>
                <input type="text" name="username" required autocomplete="off"
                    class="font-input w-full bg-[#0c0418] border border-purple-900/60 rounded-xl px-4 py-3 text-white placeholder-gray-600 focus:outline-none focus:border-pink-500 transition-colors text-sm box-border" 
                    placeholder="Tên Tài Khoản...">
            </div>

            <div>
                <label class="block text-gray-400 text-xs uppercase font-gaming mb-2 tracking-wider">Địa chỉ Email</label>
                <input type="email" name="email" required autocomplete="off"
                    class="font-input w-full bg-[#0c0418] border border-purple-900/60 rounded-xl px-4 py-3 text-white placeholder-gray-600 focus:outline-none focus:border-pink-500 transition-colors text-sm box-border" 
                    placeholder="game@dichvugiare.shop">
            </div>

            <div>
                <label class="block text-gray-400 text-xs uppercase font-gaming mb-2 tracking-wider">Mật khẩu</label>
                <input type="password" name="password" required
                    class="font-input w-full bg-[#0c0418] border border-purple-900/60 rounded-xl px-4 py-3 text-white placeholder-gray-600 focus:outline-none focus:border-pink-500 transition-colors text-sm box-border" 
                    placeholder="••••••••">
            </div>

            <div>
                <label class="block text-gray-400 text-xs uppercase font-gaming mb-2 tracking-wider">Xác nhận mật khẩu</label>
                <input type="password" name="confirm_password" required
                    class="font-input w-full bg-[#0c0418] border border-purple-900/60 rounded-xl px-4 py-3 text-white placeholder-gray-600 focus:outline-none focus:border-pink-500 transition-colors text-sm box-border" 
                    placeholder="••••••••">
            </div>

            <div class="text-right">
                <a href="DangNhap.php" class="text-xs text-purple-400 hover:text-purple-300 transition-colors font-gaming uppercase tracking-wider">← Đã có tài khoản? Đăng nhập</a>
            </div>

            <button type="submit" name="register" class="w-full py-3.5 rounded-xl text-white font-gaming font-bold tracking-widest text-sm uppercase neon-btn-pink cursor-pointer mt-2">
                REGISTER NOW
            </button>
        </form>

        <div class="mt-8 pt-4 border-t border-purple-900/30 text-center text-[11px] text-gray-600 uppercase tracking-widest font-gaming">
            &copy; 2026 <span class="text-pink-500">DichVuGiaRe.Shop</span>
        </div>
    </div>

    <script>
        document.addEventListener("DOMContentLoaded", function() {
            <?php echo $swal; ?>
        });
    </script>
</body>
</html>
