<?php $__env->startPush('page_title'); ?>
    Register
<?php $__env->stopPush(); ?>
<?php $__env->startSection('content'); ?>

    <body data-theme-color="color-red">
        <div class="page-wraper">


            <style>
                body {
                    background: linear-gradient(183deg, #d8e01e, #fbffa1 34%, #f5f9bc);
                }



                .input-group .input-group-text {
                    border-radius: 12px;
                }

                .btn-rounded {
                    border-radius: 0.7rem;
                }

                .btn {
                    font-size: 17px;
                    font-weight: bold;
                    padding: 17px 25px;
                    font-family: 'Poppins', sans-serif;
                }

                .account-area form {
                    display: flex;
                    flex-direction: column;
                    background: #ffffff;
                    padding: 11px;
                    border-radius: 9px;
                }

                .image-container {
                    width: 85%;
                    margin: 5px 26px 11px 17px;
                }

                .input-group .input-group-text {
                    border-color: #ccd500;
                    background: #feffe8 !important;
                    border-left: 0px white solid;
                }

                .form-control {
                    border-radius: 12px;
                    font-size: 18px;
                    font-weight: bold;
                    color: #202020 ! important;
                    height: 50px;
                    transition: none;
                    border-color: #cdd500;
                    background: #feffe8 !important;
                }

                .form-control::placeholder {
                    font-size: 12px;
                    color: gray;
                }

                .container {
                    padding-top: 8px;
                }

                .form-control[readonly] {
                    background-color: #e9ecef00;
                    opacity: 1;
                }

                .banner-wrapper {
                    border-bottom-left-radius: 30px;
                    border-bottom-right-radius: 30px;
                    background: none;
                }

                .light.btn-primary {
                    background-color: #fdfdfd00;
                    color: #bfc700 ! important;
                    font-size: 11px;
                    margin-top: -11px;
                    border: 0px white solid;
                }

                .form-control:active,
                .form-control.active {
                    border-color: #ccd500;
                    background: #feffe8 !important;
                }

                .light.btn-primary:hover {
                    background-color: #c8d00d;
                    color: var(--primary) !important;
                    border: 1px #c8d00d solid;
                }

                .input-group .input-group-text {
                    background: #fff;
                    color: #aeb500;
                    transition: all 0.3s ease-in-out;
                }

                .banner-wrapper .inner-wrapper span,
                .banner-wrapper .inner-wrapper p {
                    color: #fff;
                }

                .btn-primary:active,
                .btn-primary:focus,
                .btn-primary:hover {
                    border-color: #c3cb0d;
                    background-color: #c3cb0d;
                    box-shadow: none;
                    box-shadow: rgba(255, 255, 255, 0.1) -3px -3px 9px inset, rgb(255 255 255 / 7%) 0 3px 9px inset,
                        rgba(255, 255, 255, 0.6) 0 1px 1px inset, rgb(0 0 0 / 5%) 0 -8px 36px inset, rgba(255, 255, 255, 0.6) 0 1px 5px inset, rgb(0 0 0 / 3%) 2px 19px 31px;
                }

                .btn-primary {
                    background-color: #c8d00d;
                    border-color: #dbe32a;
                    box-shadow: rgba(255, 255, 255, 0.1) -3px -3px 9px inset, rgb(255 255 255 / 7%) 0 3px 9px inset,
                        rgba(255, 255, 255, 0.6) 0 1px 1px inset, rgb(0 0 0 / 5%) 0 -8px 36px inset, rgba(255, 255, 255, 0.6) 0 1px 5px inset, rgb(0 0 0 / 3%) 2px 19px 31px;
                }

                .input-group:focus-within .input-group-text,
                .input-group:focus-within .form-control {
                    border-color: #c6ce0d;
                }

                .toast.style-1.toast-danger {
                    background-color: #1e1e1e5e;
                    color: #fff;
                    border: 0px white solid;
                    backdrop-filter: blur(5px);
                }

                .toast.style-1 .toast-body {
                    display: flex;
                    align-items: center;
                    padding: 14px;
                }

                .toast.style-1.toast-danger .toast-content strong {
                    color: #fff;
                    font-weight: 600;
                }
            </style>

            <!-- Page Content -->
            <div class="page-content">

                <!-- Banner -->
                <div class="banner-wrapper shape-1">
                    <div class="container inner-wrapper">
                        <h2 class="dz-title">Sign Up</h2>
                        <p class="mb-0">Please create your account to continue</p>
                    </div>
                </div>
                <!-- Banner End -->

                <div class="container" style="margin-bottom: 80px;">
                    <div class="account-area">
                        <form id="register-form" action="#" method="POST">
                            <div class="image-container">
                                <img src="<?php echo e(asset('assets/app/img/Ola-Cabs-logo-svg.png')); ?>" alt="Sample Image">
                            </div>

                            <div class="input-group">
                                <input type="tel" id="phone" placeholder="Phone Number" maxlength="10"
                                    class="form-control" name="mobile" required="">
                            </div>

                            <div style="position: relative;margin-bottom: 14px;">
                                <input type="text" id="otp" placeholder="Enter Captcha" class="form-control"
                                    name="captcha" style="padding-right: 82px;">
                                <img src="<?php echo e(url('captcha.php')); ?>" onclick="<?php echo e(url('captcha.php')); ?>"
                                    style="position: absolute;right: 14px;top: 50%;transform: translateY(-50%); border: 0px #ffffff73 solid;background: #ea711a;box-shadow: 0px 4px 10px rgb(255 190 142);">
                            </div>

                            <div class="input-group">
                                <input type="password" placeholder="Password" id="dz-password" required=""
                                    name="password" class="form-control be-0"
                                    style="border-right: 1px #d6e9ff solid ! important; ">
                                <span class="input-group-text show-pass">
                                    <i class="fa fa-eye-slash"></i>
                                    <i class="fa fa-eye"></i>
                                </span>
                            </div>


                            <div class="input-group" id="code-group">
                                <input type="text" placeholder="Enter Your Referral Code" class="form-control"
                                    name="referBy" <?php if(session()->get('reference') != null): ?>  <?php endif; ?>
                                    value="<?php echo e(session()->get('reference')); ?>">
                            </div>
                            <div class="input-group">
                                <button type="submit" id="create-account-btn"
                                    class="btn mt-2 btn-primary w-100 btn-rounded">REGISTER
                                    NOW</button>
                            </div>
                            <a href="<?php echo e(route('user.login')); ?>"
                            class="btn btn-primary light btn-rounded text-primary d-block">Already have an account?
                            Login</a>
                        </form>

                    </div>
                </div>

            </div>
            <!-- Page Content End -->


            <!-- Footer -->
            <footer class="footer fixed">
                <div class="w-100 bg-danger text-white p-3 d-none" id="error-div">

                </div>

            </footer>
            <!-- Footer End -->


        </div>



    </body>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.auth', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /Applications/MAMP/htdocs/olex/core/resources/views/auth/register.blade.php ENDPATH**/ ?>