<?php $this->load->view('layouts/header'); ?>

    <!-- App Header -->
    <div class="appHeader no-border transparent position-absolute">
        <div class="left">
            <a href="<?php echo base_url('auth/login'); ?>" class="headerButton">
                <ion-icon name="chevron-back-outline"></ion-icon>
            </a>
        </div>
        <div class="pageTitle"></div>
        <div class="right"></div>
    </div>

    <!-- App Capsule -->
    <div id="appCapsule">
        <div class="section mt-2 text-center">
            <h1>Register</h1>
            <h4>Create your <?php echo get_app_name(); ?> account</h4>
        </div>
        
        <!-- Flashdata is now displayed via global dialogs -->
        
        <div class="section mb-5 p-2">
            <?php echo form_open('auth/do_register'); ?>
                
                <div class="card">
                    <div class="card-body pb-1">
                        <div class="row">
                            <div class="col-6">
                                <div class="form-group basic">
                                    <div class="input-wrapper">
                                        <label class="label">First Name</label>
                                        <input type="text" class="form-control" name="first_name" placeholder="First name" required>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="form-group basic">
                                    <div class="input-wrapper">
                                        <label class="label">Last Name</label>
                                        <input type="text" class="form-control" name="last_name" placeholder="Last name" required>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="form-group basic">
                            <div class="input-wrapper">
                                <label class="label">E-mail</label>
                                <input type="email" class="form-control" name="email" placeholder="Your e-mail" required>
                            </div>
                        </div>
                        
                        <div class="form-group basic">
                            <div class="input-wrapper">
                                <label class="label">Phone Number</label>
                                <input type="tel" class="form-control" name="phone" placeholder="08012345678" required>
                            </div>
                        </div>

                        <div class="form-group basic">
                            <div class="input-wrapper">
                                <label class="label">Password</label>
                                <input type="password" class="form-control" name="password" placeholder="Min 8 characters" required minlength="8">
                            </div>
                        </div>
                        
                        <div class="form-group basic">
                            <div class="input-wrapper">
                                <label class="label">Confirm Password</label>
                                <input type="password" class="form-control" name="confirm_password" placeholder="Confirm password" required>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="form-links mt-2">
                    <div>
                        Already have an account? <a href="<?php echo base_url('auth/login'); ?>">Login</a>
                    </div>
                </div>

                <div class="form-button-group transparent">
                    <button type="submit" class="btn btn-primary btn-block btn-lg">Register</button>
                </div>
            <?php echo form_close(); ?>
        </div>
    </div>

<?php $this->load->view('layouts/footer'); ?>
