<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Kaataru</title>

    <!-- bootstrap css cdn -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- custom style -->
    <link rel="stylesheet" href="<?= base_url(); ?>assets/css/style.css">
</head>

<body>
    <div class="container pt-3">
        <div class="row g-4">
            <div class="col-md-6 ">
                <img class="img-fluid" src="<?= base_url(); ?>assets/images/travel.png" alt="">
            </div>
            <div class="col-md-6">
                <div>
                    <h1 class="f-h1">Welcome Back</h1>
                    <p class="f-s1">Ready to explore the world on two wheels? Let's get
                        started!</p>
                    <button class="btn w-100 btn-auth py-3">
                        <img src="<?= base_url(); ?>assets/images/google.png" alt="">
                        Continue with Google
                    </button>
                    <div class="d-flex justify-content-center">
                        <p class="mt-4 f-s2 font-bef-aft">or</p>
                    </div>
                    <form class="mt-3" action="<?= base_url(); ?>login/login_action" method="post">
                        <?php if($this->session->flashdata('warningmessage')): ?>
                            <div class="alert alert-warning">
                                <?php echo $this->session->flashdata('warningmessage'); ?>
                            </div>
                        <?php endif; ?>
                        <?php if($this->session->flashdata('successmessage')): ?>
                            <div class="alert alert-success">
                                <?php echo $this->session->flashdata('successmessage'); ?>
                            </div>
                        <?php endif; ?>
                        <label for="email" class="label-auth">Email address</label>
                        <div class="input-group mb-3">

                            <span class="input-group-text form-input-text" id="basic-addon1"><img
                                    src="<?= base_url(); ?>assets/images/icons/email.png" alt=""></span>
                            <input type="email" name="email" id="email" class="form-control form-input border-left-0"
                                placeholder="Example@info.com">
                        </div>

                        <label for="email" class="label-auth">Password</label>
                        <div class="input-group mb-3">

                            <span class="input-group-text form-input-text" id="basic-addon1"><img
                                    src="<?= base_url(); ?>assets/images/icons/password.png" alt=""></span>
                            <input type="password" name="password" id="password"
                                class="form-control form-input border-left-0" placeholder="Password">

                        </div>
                        <!-- use this for submit form -->
                        <!-- <button type="submit" class="btn btn-log">Login</button> -->
                        <button type="submit" class="btn btn-log">Login</button>
                        <p class="f-s3 mt-3">Don't have an account? <a href="<?= base_url().'signup'; ?>">Sign Up</a></p>
                    </form>
                </div>
            </div>
        </div>
    </div>


    <!-- bootstrap cdn -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/js/bootstrap.bundle.min.js"></script>
</body>

</html>