Sindbad~EG File Manager

Current Path : /home/copmadinaarea/thecopmadinaarea.org/conference/
Upload File :
Current File : /home/copmadinaarea/thecopmadinaarea.org/conference/join.php

<?php
session_start();
require_once 'includes/functions.php';
require_once 'includes/email_functions.php';

// Check if user is already logged in
if (isLoggedIn()) {
    header('Location: ' . BASE_URL . 'dashboard.php');
    exit();
}

$db = new CopMadinaDB();
$conn = $db->getConnection();

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

// Handle form submission
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $username = sanitizeInput($_POST['username'] ?? '');
    $password = $_POST['password'] ?? '';
    $confirm_password = $_POST['confirm_password'] ?? '';
    $first_name = sanitizeInput($_POST['first_name'] ?? '');
    $last_name = sanitizeInput($_POST['last_name'] ?? '');
    $email = sanitizeInput($_POST['email'] ?? '');
    $phone = sanitizeInput($_POST['phone'] ?? '');
    $date_of_birth = $_POST['date_of_birth'] ?? '';
    $gender = $_POST['gender'] ?? '';
    $marital_status = $_POST['marital_status'] ?? '';
    $occupation = sanitizeInput($_POST['occupation'] ?? '');
    $address = sanitizeInput($_POST['address'] ?? '');
    $city = sanitizeInput($_POST['city'] ?? '');
    $state = sanitizeInput($_POST['state'] ?? '');
    $country = sanitizeInput($_POST['country'] ?? 'Ghana');
    $postal_code = sanitizeInput($_POST['postal_code'] ?? '');
    
    $area_id = $_POST['area_id'] ?? null;
    $district_id = $_POST['district_id'] ?? null;
    $assembly_id = $_POST['assembly_id'] ?? null;
    
    $emergency_contact_name = sanitizeInput($_POST['emergency_contact_name'] ?? '');
    $emergency_contact_phone = sanitizeInput($_POST['emergency_contact_phone'] ?? '');
    $emergency_contact_relationship = sanitizeInput($_POST['emergency_contact_relationship'] ?? '');
    
    $skills_talents = sanitizeInput($_POST['skills_talents'] ?? '');
    $ministry_interests = sanitizeInput($_POST['ministry_interests'] ?? '');
    
    // Validation
    if (empty($username) || empty($password) || empty($first_name) || empty($last_name) || empty($email) || empty($gender)) {
        $error = 'Please fill in all required fields.';
    } elseif ($password !== $confirm_password) {
        $error = 'Passwords do not match.';
    } elseif (strlen($password) < 6) {
        $error = 'Password must be at least 6 characters long.';
    } elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $error = 'Please enter a valid email address.';
    } else {
        // Check if email already exists in members table
        $stmt = $conn->prepare("SELECT id FROM members WHERE email = ?");
        $stmt->execute([$email]);
        if ($stmt->fetch()) {
            $error = 'A member with this email address already exists.';
        } else {
            // Check if username already exists in users table
            $stmt = $conn->prepare("SELECT id FROM users WHERE username = ? OR email = ?");
            $stmt->execute([$username, $email]);
            if ($stmt->fetch()) {
                $error = 'Username or email already exists in the system.';
            } else {
            // Generate unique member ID
            $member_id = 'COP' . date('Y') . str_pad(rand(1, 9999), 4, '0', STR_PAD_LEFT);
            
            // Check if member_id exists and regenerate if needed
            do {
                $stmt = $conn->prepare("SELECT id FROM members WHERE member_id = ?");
                $stmt->execute([$member_id]);
                if ($stmt->fetch()) {
                    $member_id = 'COP' . date('Y') . str_pad(rand(1, 9999), 4, '0', STR_PAD_LEFT);
                } else {
                    break;
                }
            } while (true);
            
            try {
                $conn->beginTransaction();
                
                // Insert member
                $stmt = $conn->prepare("
                    INSERT INTO members (
                        member_id, first_name, last_name, email, phone, date_of_birth, gender, 
                        marital_status, occupation, address, city, state, country, postal_code,
                        area_id, district_id, assembly_id, emergency_contact_name, 
                        emergency_contact_phone, emergency_contact_relationship,
                        skills_talents, ministry_interests, join_date
                    ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
                ");
                
                $stmt->execute([
                    $member_id, $first_name, $last_name, $email, $phone, $date_of_birth ?: null, 
                    $gender, $marital_status ?: null, $occupation ?: null, $address ?: null, 
                    $city ?: null, $state ?: null, $country, $postal_code ?: null,
                    $area_id ?: null, $district_id ?: null, $assembly_id ?: null,
                    $emergency_contact_name ?: null, $emergency_contact_phone ?: null, 
                    $emergency_contact_relationship ?: null, $skills_talents ?: null, 
                    $ministry_interests ?: null, date('Y-m-d')
                ]);
                
                $member_db_id = $conn->lastInsertId();
                
                // Hash password and create user account
                $hashed_password = password_hash($password, PASSWORD_DEFAULT);
                
                // Insert user account
                $stmt = $conn->prepare("
                    INSERT INTO users (
                        username, email, password, first_name, last_name, phone, 
                        role, area_id, district_id, assembly_id, members_id, status
                    ) VALUES (?, ?, ?, ?, ?, ?, 'member', ?, ?, ?, ?, 'active')
                ");
                
                $stmt->execute([
                    $username, $email, $hashed_password, $first_name, $last_name, $phone,
                    $area_id ?: null, $district_id ?: null, $assembly_id ?: null, $member_db_id
                ]);
                
                $user_db_id = $conn->lastInsertId();
                
                // Send welcome email
                sendWelcomeEmail($member_db_id);
                
                // Log audit
                logAudit('create', 'members', $member_db_id);
                
                $conn->commit();
                
                $success = "Welcome to " . htmlspecialchars($settings['site_name'] ?? 'COP Madina') . "! Your membership registration has been successful. Your Member ID is: <strong>{$member_id}</strong>. Please save this ID for future reference. A welcome email has been sent to your email address.";
                
            } catch (Exception $e) {
                $conn->rollback();
                $error = 'Registration failed. Please try again.';
                error_log("Member registration error: " . $e->getMessage());
            }
        }
    }
    }
}

// Get areas, districts, assemblies for dropdowns
$areas = executeQuery("SELECT id, name FROM areas WHERE status = 'active' ORDER BY name")->fetchAll();
$districts = executeQuery("SELECT id, name, area_id FROM districts WHERE status = 'active' ORDER BY name")->fetchAll();
$assemblies = executeQuery("SELECT id, name, district_id FROM assemblies WHERE status = 'active' ORDER BY name")->fetchAll();

// Get settings for site branding
$settings = getSettings();

// Helper function to send welcome email
function sendWelcomeEmail($member_id) {
    try {
        return sendWelcomeEmailToMember($member_id);
    } catch (Exception $e) {
        error_log("Welcome email failed: " . $e->getMessage());
        return false;
    }
}

$settings = getSettings();
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Join <?php echo htmlspecialchars($settings['site_name'] ?? 'COP Madina'); ?> - Church Membership Registration</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
</head>
<body class="bg-gradient-to-br from-slate-50 to-blue-50 min-h-screen">
    <div id="app">
        <!-- Navigation -->
        <nav class="bg-gradient-to-r from-blue-500 via-slate-600 to-violet-400 shadow-lg border-b border-slate-200/50 sticky top-0 z-50">
            <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
                <div class="flex justify-between items-center h-16">
                    <!-- Logo -->
                    <div class="flex items-center space-x-3">
                        <?php if (!empty($settings['site_logo'])): ?>
                        <img src="<?php echo BASE_URL . $settings['site_logo']; ?>" 
                             alt="<?php echo htmlspecialchars($settings['site_name'] ?? 'COP Madina'); ?>" 
                             class="h-12 w-12 rounded-full object-cover">
                        <?php else: ?>
                        <div class="p-2 rounded-xl bg-gradient-to-br from-blue-500 to-purple-600">
                            <i class="fas fa-church text-white text-xl"></i>
                        </div>
                        <?php endif; ?>
                        <div>
                            <h1 class="text-xl font-bold text-white drop-shadow-lg">
                                <?php echo htmlspecialchars($settings['site_name'] ?? 'COP Madina'); ?>
                            </h1>
                            <p class="text-xs text-white/80"><?php echo htmlspecialchars($settings['site_description'] ?? 'Church Membership'); ?></p>
                        </div>
                    </div>
                    
                    <!-- Navigation Links -->
                    <div class="flex items-center space-x-6">
                        <a href="<?php echo BASE_URL; ?>" class="text-white/90 hover:text-white font-medium transition-colors">
                            <i class="fas fa-home mr-2"></i>Home
                        </a>
                        <a href="<?php echo BASE_URL; ?>login.php" class="px-4 py-2 bg-white/20 backdrop-blur-sm hover:bg-white/30 text-white font-medium rounded-lg transition-all duration-200 border border-white/30 hover:border-white/50">
                            <i class="fas fa-sign-in-alt mr-2"></i>Login
                        </a>
                    </div>
                </div>
            </div>
        </nav>

        <!-- Main Content -->
        <main class="container mx-auto px-4 py-8">
            <div class="max-w-4xl mx-auto">
                <!-- Page Header -->
                <div class="text-center mb-8">
                    <h1 class="text-4xl font-bold text-slate-800 mb-4">Join Our Church Family</h1>
                    <p class="text-lg text-slate-600">Become a member of The Church of Pentecost - Madina Area</p>
                </div>

                <!-- Success Message -->
                <?php if ($success): ?>
                <div class="bg-green-50 border border-green-200 text-green-700 px-6 py-4 rounded-lg mb-8">
                    <div class="flex items-center">
                        <i class="fas fa-check-circle mr-2"></i>
                        <?php echo $success; ?>
                    </div>
                    <div class="mt-4 flex space-x-4">
                        <a href="<?php echo BASE_URL; ?>" 
                           class="bg-green-600 text-white px-4 py-2 rounded-lg hover:bg-green-700 transition-colors">
                            <i class="fas fa-home mr-2"></i>Back to Home
                        </a>
                        <a href="<?php echo BASE_URL; ?>login.php" 
                           class="bg-blue-600 text-white px-4 py-2 rounded-lg hover:bg-blue-700 transition-colors">
                            <i class="fas fa-sign-in-alt mr-2"></i>Login
                        </a>
                    </div>
                </div>
                <?php endif; ?>

                <!-- Error Message -->
                <?php if ($error): ?>
                <div class="bg-red-50 border border-red-200 text-red-700 px-6 py-4 rounded-lg mb-8">
                    <div class="flex items-center">
                        <i class="fas fa-exclamation-circle mr-2"></i>
                        <?php echo htmlspecialchars($error); ?>
                    </div>
                </div>
                <?php endif; ?>

                <!-- Registration Form -->
                <?php if (!$success): ?>
                <div class="bg-white rounded-xl shadow-lg overflow-hidden">
                    <div class="bg-gradient-to-r from-blue-500 via-slate-600 to-violet-400 text-white p-6">
                        <h2 class="text-2xl font-bold mb-2">Membership Registration Form</h2>
                        <p class="opacity-90">Please fill out all required information to complete your membership registration</p>
                    </div>

                    <form method="POST" class="p-8">
                        <!-- Account Information -->
                        <div class="mb-8">
                            <h3 class="text-xl font-semibold text-slate-800 mb-4 flex items-center">
                                <i class="fas fa-key mr-2 text-green-600"></i>Account Information
                            </h3>
                            
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                                <div>
                                    <label for="username" class="block text-sm font-medium text-slate-700 mb-2">
                                        Username <span class="text-red-500">*</span>
                                    </label>
                                    <input type="text" id="username" name="username" required
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['username'] ?? ''); ?>"
                                           placeholder="Choose a unique username">
                                </div>
                                
                                <div>
                                    <label for="password" class="block text-sm font-medium text-slate-700 mb-2">
                                        Password <span class="text-red-500">*</span>
                                    </label>
                                    <input type="password" id="password" name="password" required minlength="6"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           placeholder="At least 6 characters">
                                </div>
                                
                                <div class="md:col-span-2">
                                    <label for="confirm_password" class="block text-sm font-medium text-slate-700 mb-2">
                                        Confirm Password <span class="text-red-500">*</span>
                                    </label>
                                    <input type="password" id="confirm_password" name="confirm_password" required minlength="6"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           placeholder="Re-enter your password">
                                </div>
                            </div>
                        </div>

                        <!-- Personal Information -->
                        <div class="mb-8">
                            <h3 class="text-xl font-semibold text-slate-800 mb-4 flex items-center">
                                <i class="fas fa-user mr-2 text-blue-600"></i>Personal Information
                            </h3>
                            
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                                <div>
                                    <label for="first_name" class="block text-sm font-medium text-slate-700 mb-2">
                                        First Name <span class="text-red-500">*</span>
                                    </label>
                                    <input type="text" id="first_name" name="first_name" required
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['first_name'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="last_name" class="block text-sm font-medium text-slate-700 mb-2">
                                        Last Name <span class="text-red-500">*</span>
                                    </label>
                                    <input type="text" id="last_name" name="last_name" required
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['last_name'] ?? ''); ?>">
                                </div>
                            </div>
                            
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mt-6">
                                <div>
                                    <label for="email" class="block text-sm font-medium text-slate-700 mb-2">
                                        Email Address <span class="text-red-500">*</span>
                                    </label>
                                    <input type="email" id="email" name="email" required
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['email'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="phone" class="block text-sm font-medium text-slate-700 mb-2">
                                        Phone Number
                                    </label>
                                    <input type="tel" id="phone" name="phone"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['phone'] ?? ''); ?>">
                                </div>
                            </div>
                            
                            <div class="grid grid-cols-1 md:grid-cols-3 gap-6 mt-6">
                                <div>
                                    <label for="date_of_birth" class="block text-sm font-medium text-slate-700 mb-2">
                                        Date of Birth
                                    </label>
                                    <input type="date" id="date_of_birth" name="date_of_birth"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['date_of_birth'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="gender" class="block text-sm font-medium text-slate-700 mb-2">
                                        Gender <span class="text-red-500">*</span>
                                    </label>
                                    <select id="gender" name="gender" required
                                            class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                                        <option value="">Select Gender</option>
                                        <option value="male" <?php echo ($_POST['gender'] ?? '') === 'male' ? 'selected' : ''; ?>>Male</option>
                                        <option value="female" <?php echo ($_POST['gender'] ?? '') === 'female' ? 'selected' : ''; ?>>Female</option>
                                    </select>
                                </div>
                                
                                <div>
                                    <label for="marital_status" class="block text-sm font-medium text-slate-700 mb-2">
                                        Marital Status
                                    </label>
                                    <select id="marital_status" name="marital_status"
                                            class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                                        <option value="">Select Status</option>
                                        <option value="single" <?php echo ($_POST['marital_status'] ?? '') === 'single' ? 'selected' : ''; ?>>Single</option>
                                        <option value="married" <?php echo ($_POST['marital_status'] ?? '') === 'married' ? 'selected' : ''; ?>>Married</option>
                                        <option value="divorced" <?php echo ($_POST['marital_status'] ?? '') === 'divorced' ? 'selected' : ''; ?>>Divorced</option>
                                        <option value="widowed" <?php echo ($_POST['marital_status'] ?? '') === 'widowed' ? 'selected' : ''; ?>>Widowed</option>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="mt-6">
                                <label for="occupation" class="block text-sm font-medium text-slate-700 mb-2">
                                    Occupation
                                </label>
                                <input type="text" id="occupation" name="occupation"
                                       class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                       value="<?php echo htmlspecialchars($_POST['occupation'] ?? ''); ?>">
                            </div>
                        </div>

                        <!-- Address Information -->
                        <div class="mb-8">
                            <h3 class="text-xl font-semibold text-slate-800 mb-4 flex items-center">
                                <i class="fas fa-map-marker-alt mr-2 text-blue-600"></i>Address Information
                            </h3>
                            
                            <div class="mb-6">
                                <label for="address" class="block text-sm font-medium text-slate-700 mb-2">
                                    Street Address
                                </label>
                                <textarea id="address" name="address" rows="3"
                                          class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"><?php echo htmlspecialchars($_POST['address'] ?? ''); ?></textarea>
                            </div>
                            
                            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
                                <div>
                                    <label for="city" class="block text-sm font-medium text-slate-700 mb-2">
                                        City
                                    </label>
                                    <input type="text" id="city" name="city"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['city'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="state" class="block text-sm font-medium text-slate-700 mb-2">
                                        State/Region
                                    </label>
                                    <input type="text" id="state" name="state"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['state'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="country" class="block text-sm font-medium text-slate-700 mb-2">
                                        Country
                                    </label>
                                    <input type="text" id="country" name="country"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['country'] ?? 'Ghana'); ?>">
                                </div>
                                
                                <div>
                                    <label for="postal_code" class="block text-sm font-medium text-slate-700 mb-2">
                                        Postal Code
                                    </label>
                                    <input type="text" id="postal_code" name="postal_code"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['postal_code'] ?? ''); ?>">
                                </div>
                            </div>
                        </div>

                        <!-- Church Assignment -->
                        <div class="mb-8">
                            <h3 class="text-xl font-semibold text-slate-800 mb-4 flex items-center">
                                <i class="fas fa-church mr-2 text-blue-600"></i>Church Assignment
                            </h3>
                            
                            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                                <div>
                                    <label for="area_id" class="block text-sm font-medium text-slate-700 mb-2">
                                        Area
                                    </label>
                                    <select id="area_id" name="area_id" v-model="selectedArea" @change="updateDistricts"
                                            class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                                        <option value="">Select Area</option>
                                        <?php foreach ($areas as $area): ?>
                                        <option value="<?php echo $area['id']; ?>" <?php echo ($_POST['area_id'] ?? '') == $area['id'] ? 'selected' : ''; ?>>
                                            <?php echo htmlspecialchars($area['name']); ?>
                                        </option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                                
                                <div>
                                    <label for="district_id" class="block text-sm font-medium text-slate-700 mb-2">
                                        District
                                    </label>
                                    <select id="district_id" name="district_id" v-model="selectedDistrict" @change="updateAssemblies"
                                            class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                                        <option value="">Select District</option>
                                        <option v-for="district in filteredDistricts" :key="district.id" :value="district.id">
                                            {{ district.name }}
                                        </option>
                                    </select>
                                </div>
                                
                                <div>
                                    <label for="assembly_id" class="block text-sm font-medium text-slate-700 mb-2">
                                        Assembly
                                    </label>
                                    <select id="assembly_id" name="assembly_id" v-model="selectedAssembly"
                                            class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                                        <option value="">Select Assembly</option>
                                        <option v-for="assembly in filteredAssemblies" :key="assembly.id" :value="assembly.id">
                                            {{ assembly.name }}
                                        </option>
                                    </select>
                                </div>
                            </div>
                        </div>

                        <!-- Emergency Contact -->
                        <div class="mb-8">
                            <h3 class="text-xl font-semibold text-slate-800 mb-4 flex items-center">
                                <i class="fas fa-phone mr-2 text-blue-600"></i>Emergency Contact
                            </h3>
                            
                            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                                <div>
                                    <label for="emergency_contact_name" class="block text-sm font-medium text-slate-700 mb-2">
                                        Contact Name
                                    </label>
                                    <input type="text" id="emergency_contact_name" name="emergency_contact_name"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['emergency_contact_name'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="emergency_contact_phone" class="block text-sm font-medium text-slate-700 mb-2">
                                        Contact Phone
                                    </label>
                                    <input type="tel" id="emergency_contact_phone" name="emergency_contact_phone"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['emergency_contact_phone'] ?? ''); ?>">
                                </div>
                                
                                <div>
                                    <label for="emergency_contact_relationship" class="block text-sm font-medium text-slate-700 mb-2">
                                        Relationship
                                    </label>
                                    <input type="text" id="emergency_contact_relationship" name="emergency_contact_relationship"
                                           placeholder="e.g., Spouse, Parent, Sibling"
                                           class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
                                           value="<?php echo htmlspecialchars($_POST['emergency_contact_relationship'] ?? ''); ?>">
                                </div>
                            </div>
                        </div>

                        <!-- Additional Information -->
                        <div class="mb-8">
                            <h3 class="text-xl font-semibold text-slate-800 mb-4 flex items-center">
                                <i class="fas fa-info-circle mr-2 text-blue-600"></i>Additional Information
                            </h3>
                            
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                                <div>
                                    <label for="skills_talents" class="block text-sm font-medium text-slate-700 mb-2">
                                        Skills & Talents
                                    </label>
                                    <textarea id="skills_talents" name="skills_talents" rows="4"
                                              placeholder="e.g., Music, Teaching, Technology, etc."
                                              class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"><?php echo htmlspecialchars($_POST['skills_talents'] ?? ''); ?></textarea>
                                </div>
                                
                                <div>
                                    <label for="ministry_interests" class="block text-sm font-medium text-slate-700 mb-2">
                                        Ministry Interests
                                    </label>
                                    <textarea id="ministry_interests" name="ministry_interests" rows="4"
                                              placeholder="e.g., Youth Ministry, Evangelism, Music Ministry, etc."
                                              class="w-full px-4 py-3 border border-slate-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"><?php echo htmlspecialchars($_POST['ministry_interests'] ?? ''); ?></textarea>
                                </div>
                            </div>
                        </div>

                        <!-- Submit Button -->
                        <div class="flex justify-center pt-6">
                            <button type="submit" 
                                    class="bg-gradient-to-r from-blue-500 via-slate-600 to-violet-400 text-white px-8 py-4 rounded-lg font-semibold text-lg hover:shadow-lg transform hover:scale-105 transition-all duration-200 flex items-center space-x-2">
                                <i class="fas fa-user-plus"></i>
                                <span>Complete Registration</span>
                            </button>
                        </div>
                    </form>
                </div>
                <?php endif; ?>
            </div>
        </main>
    </div>

    <script>
    const { createApp } = Vue;
    
    createApp({
        data() {
            return {
                selectedArea: '<?php echo $_POST['area_id'] ?? ''; ?>',
                selectedDistrict: '<?php echo $_POST['district_id'] ?? ''; ?>',
                selectedAssembly: '<?php echo $_POST['assembly_id'] ?? ''; ?>',
                areas: <?php echo json_encode($areas); ?>,
                districts: <?php echo json_encode($districts); ?>,
                assemblies: <?php echo json_encode($assemblies); ?>
            }
        },
        computed: {
            filteredDistricts() {
                if (!this.selectedArea) return [];
                return this.districts.filter(district => district.area_id == this.selectedArea);
            },
            filteredAssemblies() {
                if (!this.selectedDistrict) return [];
                return this.assemblies.filter(assembly => assembly.district_id == this.selectedDistrict);
            }
        },
        methods: {
            updateDistricts() {
                this.selectedDistrict = '';
                this.selectedAssembly = '';
            },
            updateAssemblies() {
                this.selectedAssembly = '';
            }
        }
    }).mount('#app');
    </script>
</body>
</html>

Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists