<!DOCTYPE html>
<html lang="en">
    <head>
    <?php $title = "Register & Sign Up";
    include 'partials/title-meta.php'; ?>

		<?php include 'partials/head-css.php'; ?>

    </head>

    <body class="loading authentication-bg authentication-bg-pattern">
        
        

        <div class="account-pages mt-5 mb-5">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-lg-8">
                        <div class="text-center">
                            <a href="index.php">
                                <img src="assets/images/faida-logo.png" alt="" height="40" class="mx-auto">
                            </a>
                            <p class="text-muted mt-2 mb-4">Faida Accounting System</p>
                        </div>
                        <div class="card">

                            <div class="card-body p-4">
                                
                                <div class="text-center mb-4">
                                    <h4 class="text-uppercase mt-0">Register</h4>
                                </div>

                                <form action="register.php" method="post">

                                    <div class="row">
                                        <div class="col-md-6 mb-3">
                                            <label for="fullname" class="form-label">Full Name</label>
                                            <input class="form-control" type="text" id="fullname" name="fullname" placeholder="Enter your name" required>
                                        </div>
                                        <div class="col-md-6 mb-3">
                                            <label for="username" class="form-label">UserName</label>
                                            <input class="form-control" type="text" id="username" name="username" placeholder="Enter your username e.g samtest" required>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6 mb-3">
                                            <label for="emailaddress" class="form-label">Email address</label>
                                            <input class="form-control" type="email" id="emailaddress" name="email" required placeholder="Enter your email">
                                        </div>
                                        <div class="col-md-6 mb-3">
                                            <label for="password" class="form-label">Password</label>
                                            <input class="form-control" type="password" required id="password" name="password" placeholder="Enter your password">
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6 mb-3">
                                            <label for="company" class="form-label">Company Name</label>
                                            <input class="form-control" type="company" id="name" name="name" required placeholder="Enter your company name">
                                        </div>
                                        <div class="col-md-6 mb-3">
                                            <label for="company" class="form-label">Company Physical Address</label>
                                            <input class="form-control" type="companyadd" id="companyadd" name="address" required placeholder="Enter your company address">
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-6 mb-3">
                                            <label for="company" class="form-label">Company Mailing Address</label>
                                            <input class="form-control" type="companymail" id="companymail" name="maddress" required placeholder="Enter your company mailing address">
                                        </div>
                                        <div class="col-md-6 mb-3">
                                            <label for="company" class="form-label">Company Industry</label>
                                            <input class="form-control" type="companyind" id="companyind" name="industry" required placeholder="Enter your company industry">
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-12 mb-3">
                                            <div class="form-check">
                                                <input type="checkbox" class="form-check-input" id="same-address" name="sameaddress">
                                                <label class="form-check-label" for="same-address">Mailing address is the same as the physical address</label>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-6 mb-3">
                                        <div class="form-check">
                                            <input type="checkbox" class="form-check-input" id="checkbox-signup">
                                            <label class="form-check-label" for="checkbox-signup">I accept <a href="javascript: void(0);" class="text-dark">Terms and Conditions</a></label>
                                        </div>
                                    </div>
                                    <div class="mb-3 text-center d-grid">
                                        <button class="btn btn-primary" type="submit"> Sign Up </button>
                                    </div>
                                    
                                    <div class="col-12 text-center">
                                <p class="text-muted">Already have account?  <a href="auth-login.php" class="text-dark ms-1"><b>Sign In</b></a></p>
                            </div>

                                </form>

                            </div> <!-- end card-body -->
                        </div>
                        <!-- end card -->
                        <!-- end col 
                        <div class="row mt-3">
                            <div class="col-12 text-center">
                                <p class="text-muted">Already have account?  <a href="auth-login.php" class="text-dark ms-1"><b>Sign In</b></a></p>
                            </div> 
                        </div> -->
                        <!-- end row -->

                    </div> <!-- end col -->
                </div>
                <!-- end row -->
            </div>
            <!-- end container -->
        </div>
        <!-- end page -->

        <?php include 'partials/footer-scripts.php'; ?>

        <!-- App js -->
        <script src="assets/js/app.min.js"></script>
        <script>
            document.getElementById('same-address').addEventListener('change', function() {
                var mailingAddressInput = document.getElementById('companymail');
                var physicalAddressInput = document.getElementById('companyadd');
                if (this.checked) {
                    mailingAddressInput.value = physicalAddressInput.value;
                    mailingAddressInput.disabled = true;
                } else {
                    mailingAddressInput.disabled = false;
                    mailingAddressInput.value = '';  // Clear the value if the user unchecks the box
                }
            });
        </script>
    </body>
</html>