
<div class="row">
    <div class="col-md-12">
        <div class="card">
            <div class="card-header">
                Student Registration
            </div>
            <div class="card-body">
                <form method="post" action="">
                    <input type="hidden" name="action" value="register">
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="surname" class="form-label">Surname</label>
                            <input type="text" class="form-control" id="surname" name="surname" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="firstname" class="form-label">First Name</label>
                            <input type="text" class="form-control" id="firstname" name="firstname" required>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="othername" class="form-label">Other Name</label>
                            <input type="text" class="form-control" id="othername" name="othername">
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="maidenname" class="form-label">Maiden Name (If applicable)</label>
                            <input type="text" class="form-control" id="maidenname" name="maidenname">
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="sex" class="form-label">Sex</label>
                            <select class="form-select" id="sex" name="sex" required>
                                <option value="">Select...</option>
                                <option value="Male">Male</option>
                                <option value="Female">Female</option>
                            </select>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="dob" class="form-label">Date of Birth</label>
                            <input type="date" class="form-control" id="dob" name="dob" required>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="nationality" class="form-label">Nationality</label>
                            <input type="text" class="form-control" id="nationality" name="nationality" value="Nigerian">
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="state" class="form-label">State of Origin</label>
                            <input type="text" class="form-control" id="state" name="state" required>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="lga" class="form-label">Local Government Area</label>
                            <input type="text" class="form-control" id="lga" name="lga" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="phone" class="form-label">Telephone (Mobile)</label>
                            <input type="tel" class="form-control" id="phone" name="phone" required>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="phone_res" class="form-label">Telephone (Residential)</label>
                            <input type="tel" class="form-control" id="phone_res" name="phone_res">
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="email" class="form-label">Email Address</label>
                            <input type="email" class="form-control" id="email" name="email" required>
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="address" class="form-label">Permanent Home Address</label>
                        <textarea class="form-control" id="address" name="address" rows="3" required></textarea>
                    </div>
                    
                    <div class="mb-3">
                        <label for="activities" class="form-label">Extra Curricular Activities</label>
                        <textarea class="form-control" id="activities" name="activities" rows="3" placeholder="Sports, Clubs, Hobbies, etc."></textarea>
                    </div>
                    
                    <div class="mb-3">
                        <label for="nok_name" class="form-label">Next of Kin/Parent Name & Address</label>
                        <textarea class="form-control" id="nok_name" name="nok_name" rows="3" required></textarea>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="nok_phone" class="form-label">Next of Kin Telephone</label>
                            <input type="tel" class="form-control" id="nok_phone" name="nok_phone" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="sub1" class="form-label">Subject 1</label>
                            <input type="text" class="form-control" id="sub1" name="sub1" required>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="sub2" class="form-label">Subject 2</label>
                            <input type="text" class="form-control" id="sub2" name="sub2" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="sub3" class="form-label">Subject 3</label>
                            <input type="text" class="form-control" id="sub3" name="sub3" required>
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label for="sponsor_name" class="form-label">Sponsor's Name & Address</label>
                        <textarea class="form-control" id="sponsor_name" name="sponsor_name" rows="3" required></textarea>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="sponsor_phone" class="form-label">Sponsor's Telephone</label>
                            <input type="tel" class="form-control" id="sponsor_phone" name="sponsor_phone" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="sponsor_occ" class="form-label">Sponsor's Occupation</label>
                            <input type="text" class="form-control" id="sponsor_occ" name="sponsor_occ" required>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label for="password" class="form-label">Password</label>
                            <input type="password" class="form-control" id="password" name="password" required>
                        </div>
                        
                        <div class="col-md-6 mb-3">
                            <label for="confirm_password" class="form-label">Confirm Password</label>
                            <input type="password" class="form-control" id="confirm_password" name="confirm_password" required>
                        </div>
                    </div>
                    
                    <div class="d-grid">
                        <button type="submit" class="btn btn-primary">Register</button>
                    </div>
                    
                    <div class="mt-3 text-center">
                        <p>Already have an account? <a href="?page=login">Login here</a></p>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
