<?php $__env->startSection('title', 'Our Team'); ?>

<?php $__env->startSection('content'); ?>
    <section class="inner-banner">
        <img src="<?php echo e(asset('front/images/mainBanner.webp')); ?>" alt="image" class="img-fluid w-100 h-100">
        <div class="container">
            <div class="inner-banner__content">
                <h1>checkout</h1>
            </div>
        </div>
    </section>

    <section class="check-out-section">
        <div class="container">
            <div class="check-outBox">
                <h2 class="secHeading">Customer</h2>
                <ul>
                    <li><?php echo e($sessonData['email'] ?? ''); ?></li>
                </ul>
                <button class="themeBtn">Edit</button>
            </div>
            <div class="check-outBox">
                <h2 class="secHeading">Shipping</h2>
                <ul>
                    <li><?php echo e($sessonData['address'] ?? ''); ?></li>
                    <li><?php echo e($sessonData['city'] ?? ''); ?></li>
                    <li> <?php echo e($sessonData['state'] ?? ''); ?></li>
                    <li> <?php echo e($sessonData['postal_code'] ?? ''); ?></li>
                    <li> <?php echo e($sessonData['country'] ?? ''); ?></li>
                    <li></li>
                </ul>
                <button class="themeBtn">Edit</button>
            </div>
            <div class="check-outBox">
                <h2 class="secHeading">Billing</h2>
                <ul>
                    <li><?php echo e($sessonData['first_name'] . ' ' .$sessonData['last_name'] ?? ''); ?></li>
                    <li><?php echo e($sessonData['phone_number'] ?? ''); ?></li>
                    <li> <strong> $<?php echo e(number_format($get_tex_info['amount_total'] / 100, 2) ?? ''); ?> </strong></li>




                </ul>
                <button class="themeBtn">Edit</button>
            </div>
            <div class="check-out-form check-out-3 mt-5">
                <h2 class="primary-heading">Payment Methods </h2>
                <div class="col-12 offset-lg-1 col-lg-10">
                    <div style="display: none" class='col-md-12 error form-group hide'>
                        <div class='alert-danger alert'>
                            Please correct the errors and try again.
                        </div>
                    </div>
                    <form action="<?php echo e(route('checkout.payment')); ?>" id="payment-form" method="post" data-cc-on-file="false"
                        data-stripe-publishable-key="<?php echo e(env('STRIPE_KEY')); ?>">
                        <div class="row tabs-row fields-row">
                            <div class="col-12 text-center mb-4">
                                <img src="<?php echo e(asset('front/images/card-img.png')); ?>" alt="">
                            </div>
                            <?php echo csrf_field(); ?>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>CARD NUMBER</label>
                                    <input type="text" class="form-control card-number" placeholder="CARD NUMBER"
                                        name="card_number">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label>name on card</label>
                                    <input type="text" class="form-control" name="cardholder_name"
                                        placeholder="NAME ON CARD">
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>ex month</label>
                                    <input type="text" placeholder="MM" name="exp_month"
                                        class="card-expiry-month form-control" required>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>ex year</label>
                                    <input type="text" placeholder="YYYY" name="exp_year"
                                        class="card-expiry-year form-control" required>
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div class="form-group">
                                    <label>cvv</label>
                                    <input type="text" class="card-cvc form-control" name="cvv" placeholder="CVV">
                                </div>
                            </div>
                            
                            <div class="col-md-6 mt-25">
                                <div class="col-md-12 checkbox">
                                    <input type="checkbox" id="box-2">
                                    <label for="box-2">
                                        <h5>save card</h5>
                                        information is encrypted and securely stored.
                                    </label>
                                </div>
                            </div>
                            <div class="col-12 mt-20">
                                <button class="btn d-btn w-100" type="submit">Place Order</button>
                            </div>
                        </div>


                </div>
                </form>
            </div>
        </div>
    </section>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('script'); ?>

    <script type="text/javascript">
        $(function() {

            /*------------------------------------------
            --------------------------------------------
            Stripe Payment Code
            --------------------------------------------
            --------------------------------------------*/
            var $form = $(this);

            $('#payment-form').on('submit', function(e) {
                e.preventDefault();


                let cardNumber = $('.card-number').val();
                let cardCVC = $('.card-cvc').val();
                let cardExpMonth = $('.card-expiry-month').val();
                let cardExpYear = $('.card-expiry-year').val();




                var $form = $(this);
                var $errorMessage = $form.find('div.error');
                $errorMessage.addClass('hide');

                $('.has-error').removeClass('has-error');

                if (cardNumber === '' || cardCVC === '' || cardExpMonth === '' || cardExpYear === '') {
                    return;
                }
                var $form = $(this),
                    $errorMessage = $form.find('div.error'),
                    valid = true;
                $errorMessage.addClass('hide');

                $('.has-error').removeClass('has-error');

                if (!$form.data('cc-on-file')) {
                    e.preventDefault();

                    let stripePublishableKey = $form.data('stripe-publishable-key');
                    console.log('stripePublishableKey', stripePublishableKey);

                    Stripe.setPublishableKey(stripePublishableKey);
                    Stripe.card.createToken({
                        number: cardNumber,
                        cvc: cardCVC,
                        exp_month: cardExpMonth,
                        exp_year: cardExpYear,
                    }, function(status, response) {
                        console.log('Tokenization response:', response);


                        if (response.error) {
                            console.log('Error', response);

                            $('.error')
                                .removeClass('hide')
                                .removeAttr('style')
                                .find('.alert')
                                .text(response.error.message);
                        } else {
                            console.log(response);


                            $form.append("<input type='hidden' name='payment_method_id' value='" +
                                response.id + "'/>");

                            $form.get(0).submit();
                        }
                    });
                }


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

<?php echo $__env->make('front.layout.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/servicedemoweb/public_html/luxury-candles/resources/views/front/payment.blade.php ENDPATH**/ ?>