<?php $__env->startSection('content'); ?>
    <main class="page-wrapper">
        <section class="jss-details py-120">
            <div class="container">
                <div class="row gy-5">
                    <div class="col-lg-8">
                        <div class="jss-details-main bg--white">
                            <?php echo $__env->make('Template::items.details.banner', ['type' => 'service'], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>

                            <!-- Hidden Block (if any content is needed) -->
                            <div class="jss-details-main__block two d-lg-none">
                                <!-- Content for block two (optional) -->
                            </div>

                            <!-- Tab Navigation and Content -->
                            <div class="jss-details-main__block three">
                                <!-- Tabs Navigation -->
                                <ul class="nav nav-tabs custom--tab" role="tablist">
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link active" data-bs-toggle="tab"
                                            data-bs-target="#jss-details-tab-1" type="button" role="tab">
                                            <?php echo app('translator')->get('Description'); ?>
                                        </button>
                                    </li>
                                    <?php if($extraServices->count() > 0): ?>
                                        <li class="nav-item" role="presentation">
                                            <button class="nav-link" data-bs-toggle="tab"
                                                data-bs-target="#jss-details-tab-2" type="button" role="tab">
                                                <?php echo app('translator')->get('Extra Services'); ?>
                                            </button>
                                        </li>
                                    <?php endif; ?>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link" data-bs-toggle="tab" data-bs-target="#jss-details-tab-3"
                                            type="button" role="tab">
                                            <?php echo app('translator')->get('Reviews'); ?>
                                        </button>
                                    </li>
                                    <li class="nav-item" role="presentation">
                                        <button class="nav-link comments-tab-btn" data-bs-toggle="tab"
                                            data-bs-target="#jss-details-tab-4" type="button" role="tab">
                                            <?php echo app('translator')->get('Comments'); ?>
                                        </button>
                                    </li>

                                </ul>

                                <!-- Tabs Content -->
                                <div class="tab-content">
                                    <!-- Description Tab -->
                                    <div class="tab-pane active" id="jss-details-tab-1" role="tabpanel" tabindex="0">
                                        <?php echo $__env->make('Template::items.details.description', [
                                            'type' => 'service',
                                        ], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                                    </div>

                                    <!-- Extra Services Tab -->
                                    <?php if($extraServices->count() > 0): ?>
                                        <div class="tab-pane" id="jss-details-tab-2" role="tabpanel" tabindex="0">
                                            <div class="extra-services">
                                                <div class="extra-services-list service-card-body">
                                                    <div class="service-card-form">
                                                        <?php $__empty_1 = true; $__currentLoopData = $extraServices; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key => $extraService): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                                                            <div class="form-row">
                                                                <div class="left">
                                                                    <div class="form-group custom-check-group">
                                                                        <input class="extraServices custom-checkbox"
                                                                            type="checkbox" name="extra_services[]"
                                                                            id="extra_service_<?php echo e($key); ?>"
                                                                            data-id="<?php echo e($extraService->id); ?>"
                                                                            data-key="<?php echo e($key); ?>"
                                                                            data-price="<?php echo e(showAmount($extraService->price, currencyFormat: false)); ?>"
                                                                            value="<?php echo e($extraService->id); ?>">
                                                                        <label class="custom-checkbox-label"
                                                                            for="extra_service_<?php echo e($key); ?>"><?php echo e($extraService->name); ?></label>
                                                                    </div>
                                                                </div>
                                                                <div class="right">
                                                                    <span
                                                                        class="value"><?php echo e(showAmount($extraService->price)); ?></span>
                                                                </div>
                                                            </div>
                                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                                                            <div class="empty-message-box">
                                                                <i class="las la-folder-open icon"></i>
                                                                <p class="caption"><?php echo app('translator')->get('No extra services available at this time.'); ?></p>
                                                            </div>
                                                        <?php endif; ?>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    <?php endif; ?>

                                    <!-- Reviews Tab -->
                                    <div class="tab-pane" id="jss-details-tab-3" role="tabpanel" tabindex="0">
                                        <?php echo $__env->make('Template::items.details.reviews', [
                                            'type' => 'service',
                                        ], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                                    </div>

                                    <!-- Comments Tab -->
                                    <div class="tab-pane" id="jss-details-tab-4" role="tabpanel" tabindex="0">
                                        <?php echo $__env->make('Template::items.details.comments', [
                                            'type' => 'service',
                                        ], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                                    </div>

                                    <!-- End of Comments Tab -->
                                </div>
                                <!-- End of Tab Content -->
                            </div>
                            <!-- End of jss-details-main__block three -->
                        </div>
                        <!-- End of jss-details-main -->
                    </div>
                    <!-- End of col-lg-8 -->

                    <div class="col-lg-4 d-none d-lg-block details-sidebar">
                        <div class="jss-details-sidebar">
                            <!-- Service Details Widget -->
                            <div class="jss-details-sidebar__block">
                                <form class="jss-details-sidebar__block"
                                    action="<?php echo e(route('user.service.add.booking', $productDetails->id)); ?>" method="POST">
                                    <?php echo csrf_field(); ?>
                                    <div class="extra_services_container"></div>

                                    <div class="widget-card">
                                        <div class="widget-card__header">
                                            <h5 class="widget-card__title"><?php echo app('translator')->get('Service Details'); ?></h5>
                                        </div>
                                        <div class="widget-card__body">
                                            <ul class="info-list style-two">
                                                <li class="info-list-item">
                                                    <span class="info-list-item__label"><?php echo app('translator')->get('Estimated Delivery Time'); ?></span>
                                                    <span
                                                        class="info-list-item__value"><?php echo e($productDetails->delivery_time ?? 'N/A'); ?>

                                                        <?php echo app('translator')->get('Days'); ?></span>
                                                </li>
                                                <li class="info-list-item">
                                                    <span class="info-list-item__label"><?php echo app('translator')->get('Service Price'); ?></span>
                                                    <span class="info-list-item__value"><?php echo e(gs('cur_sym')); ?><span
                                                            class="servicePrice"><?php echo e(showAmount($productDetails->price, currencyFormat: false)); ?></span></span>
                                                </li>
                                                <li
                                                    class="info-list-item <?php echo e($extraServices->count() > 0 ? '' : 'd-none'); ?>">
                                                    <span class="info-list-item__label"><?php echo app('translator')->get('Extras Service'); ?></span>
                                                    <span class="info-list-item__value"><?php echo e(gs('cur_sym')); ?><span
                                                            class="extraServicePrice">0.00</span></span>
                                                </li>
                                                <li class="info-list-item">
                                                    <span class="info-list-item__label"><?php echo app('translator')->get('Quantity'); ?></span>
                                                    <div class="quantity-control">
                                                        <button type="button"
                                                            class="quantity-btn quantity-btn--minus decrementBtn">
                                                            <i class="las la-minus"></i>
                                                        </button>
                                                        <span
                                                            class="info-list-item__value d-flex align-items-center quantity">1</span>
                                                        <button type="button"
                                                            class="quantity-btn quantity-btn--plus incrementBtn">
                                                            <i class="las la-plus"></i>
                                                        </button>
                                                        <input type="hidden" name="service_qty" value="1">
                                                    </div>
                                                </li>
                                            </ul>

                                            <?php if(auth()->guard()->check()): ?>
                                                <button type="submit" class="mt-4 btn btn--lg btn--base w-100">
                                                    <?php echo app('translator')->get('Book Now'); ?>
                                                    (<?php echo e(gs('cur_sym')); ?><span
                                                        class="totalPrice"><?php echo e(showAmount($productDetails->price, currencyFormat: false)); ?></span>)
                                                </button>
                                            <?php else: ?>
                                                <button type="button" class="mt-4 btn btn--lg btn--base w-100"
                                                    data-bs-toggle="modal" data-bs-target="#loginModal">
                                                    <?php echo app('translator')->get('Book Now'); ?>
                                                    (<?php echo e(gs('cur_sym')); ?><span
                                                        class="totalPrice"><?php echo e(showAmount($productDetails->price, currencyFormat: false)); ?></span>)
                                                </button>
                                            <?php endif; ?>

                                        </div>
                                    </div>
                                </form>
                            </div>

                            <!-- Contact Us Widget -->
                            <?php if($productDetails->user): ?>
                                <div class="jss-details-sidebar__block">
                                    <div class="widget-card">
                                        <div class="widget-card__header">
                                            <h5 class="widget-card__title">
                                                <?php echo app('translator')->get('Do you have any special requirements?'); ?>
                                            </h5>
                                        </div>
                                        <div class="widget-card__body">
                                            <a class="btn btn--lg btn--base w-100"
                                                href="<?php echo e(route('public.profile', ['username' => $productDetails->user->username, 'contact' => 'true'])); ?>">
                                                <?php echo app('translator')->get('Contact Now'); ?>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            <?php endif; ?>

                            <!-- Short Profile Widget -->
                            <div class="jss-details-sidebar__block">
                                <?php echo $__env->make('Template::partials.short_profile', [
                                    'user' => $productDetails->user,
                                ], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                            </div>
                        </div>
                    </div>
                    <!-- End of col-lg-4 -->
                </div>
                <!-- End of row gy-5 -->
            </div>
            <!-- End of container -->
        </section>
    </main>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('script'); ?>
    <script>
        (function($) {
                "use strict";

                let quantity = 1;
                let servicePrice = parseFloat('<?php echo e(showAmount($productDetails->price, currencyFormat: false)); ?>');
                let extraService = 0;
                let extraServicesArray = [];

                // Calculate initial extra service prices if any are selected
                $('.extraServices:checked').each(function() {
                    extraService += parseFloat($(this).data('price'));
                    extraServicesArray.push($(this).val());
                });
                updatePrices();
                updateExtraServices();

                $(document).on('click', '.incrementBtn', function() {
                    quantity++;
                    $('.quantity').text(quantity);
                    $('input[name="service_qty"]').val(quantity);
                    updatePrices();
                });

                $(document).on('click', '.decrementBtn', function() {
                    if (quantity > 1) {
                        quantity--;
                        $('.quantity').text(quantity);
                        $('input[name="service_qty"]').val(quantity);
                        updatePrices();
                    }
                });

                $(document).on('change', '.extraServices', function() {
                    extraService = 0;
                    extraServicesArray = [];
                    $('.extraServices:checked').each(function() {
                        extraService += parseFloat($(this).data('price'));
                        extraServicesArray.push($(this).val());
                    });
                    $('.extraServicePrice').text(extraService.toFixed(2));
                    updatePrices();
                    updateExtraServices();
                });

                function updatePrices() {
                    let totalServicePrice = servicePrice * quantity;
                    let totalExtraPrice = extraService;
                    let total = totalServicePrice + totalExtraPrice;

                    $('.servicePrice').text(totalServicePrice.toFixed(2));
                    $('.extraServicePrice').text(totalExtraPrice.toFixed(2));
                    $('.totalPrice').text(total.toFixed(2));

                    updateOrderNowLink();
                }

                function updateExtraServices() {
                    $('.extra_services_container').empty();
                    $('.extraServices:checked').each(function() {
                        const extraServiceId = $(this).val();
                        $('<input>').attr({
                            type: 'hidden',
                            name: 'extra_services[]',
                            value: extraServiceId
                        }).appendTo('.extra_services_container');
                    });
                }

                function updateOrderNowLink() {
                    let extraServicesQuery = extraServicesArray.join(',');
                    let orderNowUrl =
                        `<?php echo e(route('user.service.add.booking', $productDetails->id)); ?>?quantity=${quantity}&extra_services=${extraServicesQuery}`;
                    $('.order-now-btn').attr('href', orderNowUrl);
                }

                // Check if both elements exist on the page
                if ($('.details-sidebar').length && $('.jss-details-main__block.three').length) {
                    var sidebarContent = $('.details-sidebar').html();
                    $('.jss-details-main__block.two').html(sidebarContent);
                }

                <?php if(auth()->guard()->guest()): ?>
                $('.comments-tab-btn').on('click', function(e) {
                    e.preventDefault(); // Prevent default tab behavior
                    $('#loginModal').modal('show'); // Show the login modal
                });
            <?php endif; ?>


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

<?php echo $__env->make('Template::layouts.frontend', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /home/mojibor/work.mojibor.com/core/resources/views/templates/basic/service/service_details.blade.php ENDPATH**/ ?>