<?php
/**
 * Modern User Registration Page
 */
require_once 'includes/db.php';
require_once 'includes/config.php';

// Redirect if already logged in (only on GET to allow POST to show toast before redirect)
if (isset($_SESSION['user_id']) && $_SERVER['REQUEST_METHOD'] === 'GET') {
    header("Location: index");
    exit;
}

$error = '';
$success = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $name = trim($_POST['name']);
    $email = trim($_POST['email']);
    $password = $_POST['password'];
    $confirm_password = $_POST['confirm_password'];

    if (empty($name) || empty($email) || empty($password)) {
        $error = "All fields are required.";
    } elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $error = "Invalid email format.";
    } elseif (strlen($password) < 6) {
        $error = "Password must be at least 6 characters.";
    } elseif ($password !== $confirm_password) {
        $error = "Passwords do not match.";
    } else {
        // Check if email already exists
        $stmt = $pdo->prepare("SELECT id FROM users WHERE email = ?");
        $stmt->execute([$email]);
        if ($stmt->fetch()) {
            $error = "Email already registered.";
        } else {
            // Hash password and insert
            $hashed_password = password_hash($password, PASSWORD_DEFAULT);
            $stmt = $pdo->prepare("INSERT INTO users (name, email, password, role) VALUES (?, ?, ?, 'user')");
            if ($stmt->execute([$name, $email, $hashed_password])) {
                // Auto Login
                $_SESSION['user_id'] = $pdo->lastInsertId();
                $_SESSION['user_name'] = $name;
                $_SESSION['user_role'] = 'user';
                
                $success = "Registration successful!";
            } else {
                $error = "Something went wrong. Please try again.";
            }
        }
    }
}

// Generate Google Login URL for Registration
$google_login_url = '';
if (defined('GOOGLE_CLIENT_ID') && !empty(GOOGLE_CLIENT_ID)) {
    $google_login_url = 'https://accounts.google.com/o/oauth2/auth?response_type=code&client_id=' . GOOGLE_CLIENT_ID . '&redirect_uri=' . urlencode(GOOGLE_REDIRECT_URL) . '&scope=email%20profile';
}

$page_title = 'Create Account';
require_once 'includes/header.php';
?>

<style>
    @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Noto+Serif+Bengali:wght@300;400;500;600;700&display=swap');

    .auth-container { 
        font-family: 'Roboto', 'Noto Serif Bengali', sans-serif !important;
        max-width: 450px; 
        margin: 60px auto 100px; 
        background: #ffffff; 
        padding: 40px; 
        border-radius: 8px; 
        box-shadow: none; 
        border: 1px solid #e2e8f0; 
    }
    .auth-title { font-size: 1.8rem; font-weight: 700; color: #00059E; margin-bottom: 10px; text-align: center; }
    .auth-subtitle { color: #64748b; text-align: center; margin-bottom: 30px; font-size: 0.95rem; }
    .form-group { margin-bottom: 20px; }
    .form-group label { display: block; margin-bottom: 8px; font-weight: 500; color: #0f172a; }
    .form-control { width: 100%; padding: 12px 15px; border: 1px solid #e2e8f0; border-radius: 4px; outline: none; transition: all 0.3s ease; font-family: 'Roboto', 'Noto Serif Bengali', sans-serif !important; box-sizing: border-box; }
    .form-control:focus { border-color: #00059E; box-shadow: 0 0 0 3px rgba(0, 5, 158, 0.1); }
    .auth-btn { width: 100%; padding: 14px; font-size: 1.1rem; margin-top: 10px; background-color: #00059E !important; color: #ffffff !important; border: none; border-radius: 4px; cursor: pointer; transition: background 0.3s ease; font-family: 'Roboto', 'Noto Serif Bengali', sans-serif !important; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;}
    .auth-btn:hover { background-color: #00037a !important; }
    
    .google-btn { 
        width: 100%; 
        padding: 12px 14px; 
        font-size: 1.05rem; 
        margin-top: 15px; 
        background-color: #ffffff !important; 
        color: #334155 !important; 
        border: 1px solid #cbd5e1; 
        border-radius: 4px; 
        cursor: pointer; 
        transition: all 0.3s ease; 
        font-family: 'Roboto', 'Noto Serif Bengali', sans-serif !important; 
        font-weight: 600; 
        display: flex; 
        align-items: center; 
        justify-content: center; 
        gap: 10px; 
        text-decoration: none; 
        box-sizing: border-box;
    }
    .google-btn:hover { 
        background-color: #f8fafc !important; 
        border-color: #94a3b8; 
    }

    .auth-footer { text-align: center; margin-top: 25px; color: #64748b; font-size: 0.95rem; }
    .auth-footer a { color: #00059E; font-weight: 600; text-decoration: none; }
    .auth-footer a:hover { text-decoration: underline; color: #00037a; }

    /* SweetAlert2 Colored Mini Toast Styles */
    .swal2-toast {
        padding: 6px 12px !important;
        width: auto !important;
        max-width: 320px !important;
        min-height: 40px !important;
        box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
    }
    .colored-toast.swal2-icon-success {
        background-color: #10b981 !important;
        color: white !important;
    }
    .colored-toast.swal2-icon-error {
        background-color: #ef4444 !important;
        color: white !important;
    }
    .colored-toast .swal2-title {
        color: white !important;
        font-family: 'Roboto', 'Noto Serif Bengali', sans-serif !important;
        font-size: 0.85rem !important;
        font-weight: 600 !important;
        margin: 0 10px !important;
    }
    .colored-toast .swal2-close {
        color: white !important;
    }
    .colored-toast .swal2-html-container {
        color: white !important;
    }
    .colored-toast.swal2-icon-success .swal2-success-circular-line-left,
    .colored-toast.swal2-icon-success .swal2-success-circular-line-right,
    .colored-toast.swal2-icon-success .swal2-success-fix {
        background-color: #10b981 !important;
    }
    .colored-toast.swal2-icon-error .swal2-x-mark {
        background-color: #ef4444 !important;
    }
    .colored-toast .swal2-icon {
        transform: scale(0.6) !important;
        margin: 0 !important;
    }
</style>

<div class="container">
    <div class="auth-container">
        <h1 class="auth-title">Create Account</h1>
        <p class="auth-subtitle">Join us to start downloading premium assets.</p>

        <form action="" method="POST">
            <div class="form-group">
                <label>Full Name</label>
                <input type="text" name="name" class="form-control" placeholder="Enter your name" required>
            </div>
            <div class="form-group">
                <label>Email Address</label>
                <input type="email" name="email" class="form-control" placeholder="email@example.com" required>
            </div>
            <div class="form-group">
                <label>Password</label>
                <input type="password" name="password" class="form-control" placeholder="Min 6 characters" required>
            </div>
            <div class="form-group">
                <label>Confirm Password</label>
                <input type="password" name="confirm_password" class="form-control" placeholder="Repeat password" required>
            </div>
            <button type="submit" class="btn btn-primary auth-btn">Sign Up</button>
        </form>

        <?php if(!empty($google_login_url)): ?>
        <div style="text-align: center; margin: 25px 0 10px 0; color: #94a3b8; font-weight: 600; position: relative; font-size: 0.85rem;">
            <hr style="border: none; border-top: 1px solid #e2e8f0; position: absolute; width: 100%; top: 50%; z-index: 1; margin: 0;">
            <span style="background: #ffffff; padding: 0 15px; position: relative; z-index: 2;">OR</span>
        </div>
        
        <a href="<?php echo htmlspecialchars($google_login_url); ?>" class="google-btn">
            <svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path fill-rule="evenodd" clip-rule="evenodd" d="M24 9.5C27.54 9.5 30.71 10.74 33.22 12.87L40.23 5.86C35.91 1.95 30.34 0 24 0C14.54 0 6.36 5.48 2.37 13.51L10.57 19.87C12.56 13.79 17.81 9.5 24 9.5Z" fill="#EA4335"/>
                <path fill-rule="evenodd" clip-rule="evenodd" d="M47.53 24.5C47.53 22.8 47.23 21.17 46.68 19.64H24V28.91H37.19C36.63 31.86 34.92 34.42 32.44 36.08L40.45 42.29C45.13 37.97 47.53 31.82 47.53 24.5Z" fill="#4285F4"/>
                <path fill-rule="evenodd" clip-rule="evenodd" d="M10.57 28.13C10.05 26.54 9.75 24.81 9.75 24C9.75 23.19 10.05 21.46 10.57 19.87L2.37 13.51C0.87 16.5 0 19.98 0 24C0 28.02 0.87 31.5 2.37 34.49L10.57 28.13Z" fill="#FBBC05"/>
                <path fill-rule="evenodd" clip-rule="evenodd" d="M24 48C30.6 48 36.14 45.81 40.45 42.29L32.44 36.08C30.13 37.63 27.28 38.5 24 38.5C17.81 38.5 12.56 34.21 10.57 28.13L2.37 34.49C6.36 42.52 14.54 48 24 48Z" fill="#34A853"/>
            </svg>
            Continue with Google
        </a>
        <?php endif; ?>

        <div class="auth-footer">
            Already have an account? <a href="login">Login here</a>
        </div>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
    const Toast = Swal.mixin({
        toast: true,
        position: 'top-end',
        iconColor: 'white',
        customClass: {
            popup: 'colored-toast',
        },
        showConfirmButton: false,
        timer: 2000,
        timerProgressBar: true
    });

    <?php if($error): ?>
    Toast.fire({
        icon: 'error',
        title: '<?php echo addslashes($error); ?>'
    });
    <?php endif; ?>

    <?php if($success): ?>
    Toast.fire({
        icon: 'success',
        title: '<?php echo addslashes($success); ?>'
    }).then(function() {
        window.location.href = 'index';
    });
    <?php endif; ?>
</script>

<?php require_once 'includes/footer.php'; ?>
<?php require_once 'includes/mobile-nav.php'; ?>
