<?php

use Bookingor\Frontend\Controller\Service\ServiceControlFront;
use Bookingor\Frontend\Controller\Staff\StaffControlFront;
use Bookingor\Helper\HelperControl;

// Exit if accessed directly
if (!defined('ABSPATH')) {
    exit;
} ?>
<div class="bookingor design-1" data-design-id="<?php echo isset($get_design_id) ? esc_attr($get_design_id) : ''; ?>">
    <input type="hidden" id="get-time-format" name="get_time_format" value="<?php echo esc_attr(get_option('bookingor_time_format')); ?>">
    <div class="bookingor-container w-100 f-h bookingor-g-0 bookingor-flex flex-column">
        <div class="bookingor-loader-container bookingor-d-flex align-items-center justify-content-center pt-3 pb-3">
            <div class="bookingor-loader-all">
                <div class="bookingor-loader">
                    <div class="bookingor-loader-wheel"></div>
                    <div class="bookingor-loader-text bookingor-d-flex"></div>
                </div>
            </div>
        </div>
        <form id="bkinz-booking-design-2" class="bookingor-v-none bookingor-flex flex-column h-100">
            <input type="hidden" id="get-design-type" name="get_design_type" value="6">
            <input type="hidden" name="shortcode_service_id" value="<?php echo esc_attr($service_get_id); ?>">
            <input type="hidden" name="shortcode_staff_id" value="<?php echo esc_attr($staff_get_id); ?>">
            <input type="hidden" name="shortcode_location_id" value="<?php echo esc_attr($location_get_id); ?>">

            <div id="second-book-6" class="bookingor-ft  cal-pick ">
                <div class="row bookingor-g-0 f-height">
                    <div class="bookingor-col-md-12 bookingor-col-lg-12 bookingor-col-xl-5 sidebar-1 bookingor-flex j-width bookingor-g-0">
                        <div class="card-body">
                            <div class="sidebar_container bookingor-flex flex-column">
                                <?php if (get_option('bookingor_settings_business_details_active') === 'on') { ?>
                                    <div class="mb-2 bookingor-business-all-details">
                                        <?php if (get_option('bookingor_settings_business_logo_required') === 'on') { ?>
                                            <div class="bookingor-f-business-logo">
                                                <img src="<?php echo esc_attr(wp_get_attachment_url(get_option('bookingor_business_logo'))); ?>" alt="">
                                            </div>
                                        <?php } ?>
                                        <div>
                                            <?php if (get_option('bookingor_settings_business_name_required') === 'on') { ?>
                                                <div class="bookingor-f-business-name">
                                                    <?php echo esc_html(get_option('bookingor_business_name')); ?>
                                                </div>
                                            <?php }
                                            if (get_option('bookingor_settings_business_description_required') === 'on') { ?>
                                                <div class="bookingor-f-13 bookingor-f-business-descri"><?php echo esc_html(get_option('bookingor_business_description')); ?></div>
                                            <?php }
                                            if (get_option('bookingor_settings_business_phone_required') === 'on') { ?>
                                                <div class="bookingor-f-business-phone"><?php echo esc_html(get_option('bookingor_business_phone')); ?></div>
                                            <?php }
                                            if (get_option('bookingor_settings_business_email_required') === 'on') { ?>
                                                <div class="bookingor-f-business-email"><?php echo esc_html(get_option('bookingor_business_email')); ?></div>
                                            <?php } ?>
                                        </div>
                                    </div>
                                <?php }
                                if (get_option('bookingor_settings_staff_active') === 'on') {  ?>
                                    <div class="select">
                                        <div id="employeeWarning" class="select_warning bookingor-d-none align-items-center justify-content-center">
                                            <span class="bookingor-flex align-items-center justify-content-center">!</span>
                                            <?php esc_html_e('Must Select a employee', 'bookingor-pro'); ?>
                                        </div>
                                        <div class="bookingor-flex align-items-center justify-content-between">
                                            <div class="full-head-1 bookingor-staff-heading"><?php echo esc_html(get_option('bookingor_settings_staff_name')); ?></div>
                                        </div>
                                        <div id="selectListEmployee-6" class="select-list-1">
                                            <ul class="bookingor-flex emp-g flex-wrap gap-x-10">
                                                <?php
                                                foreach (StaffControlFront::$f_staff as $key => $value) { ?>
                                                    <li data-select="select-shop" data-get-service-id="<?php echo esc_attr($value->service_get_id); ?>" data-staff-id="<?php echo esc_attr($value->staff_id); ?>" class="shop-list-1 select_list no-shadow get_all_data w-100">
                                                        <div class="bookingor-flex align-items-center">
                                                            <i class="fas fa-check-circle"></i>
                                                            <div class="right bookingor-flex justify-content-start flex-row">
                                                                <div class="bookingor-user-avatar">
                                                                    <?php if ($value->staff_icon) { ?>
                                                                        <img class="memeber-ava" src="<?php echo esc_attr(wp_get_attachment_url($value->staff_icon)); ?>" alt="" />
                                                                    <?php } else { ?>
                                                                        <img class="memeber-ava" src="" data-avatar="<?php echo esc_attr($value->staff_first_name . ' ' . $value->staff_last_name); ?>" alt="" />
                                                                    <?php } ?>
                                                                </div>
                                                                <div class="staff-data">
                                                                    <div class="staff-name" data-staff-name="<?php echo esc_attr($value->staff_first_name . ' ' . $value->staff_last_name); ?>">
                                                                        <?php echo esc_html($value->staff_first_name . ' ' . $value->staff_last_name); ?></div>
                                                                    <div class="staff-de">
                                                                        <div class="staff-cl">
                                                                            <i class="bx bx-phone-call"></i>
                                                                            <span class="staff-cl"><?php echo esc_html($value->staff_phone); ?></span>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </li>
                                                <?php
                                                }
                                                ?>
                                            </ul>
                                        </div>
                                    </div>
                                <?php } ?>
                                <div class="select">
                                    <div class="bookingor-flex gap-5">
                                        <div class="full-head-1 bookingor-service-heading"><?php echo esc_html(get_option('bookingor_settings_service_name')); ?></div>
                                        <div id="serviceWarning" class="align-items-center justify-content-center">
                                            <span class="select_warning align-items-center bookingor-d-none justify-content-center">
                                                <?php esc_html_e('Select a ', 'bookingor-pro'); ?><?php echo esc_html(get_option('bookingor_settings_service_name')); ?></span>
                                            <span class="blank_wraing bookingor-d-none"><?php esc_html_e('No ', 'bookingor-pro'); ?><?php echo esc_html(get_option('bookingor_settings_service_name')); ?><?php esc_html_e(' Try another', 'bookingor-pro'); ?></span>
                                        </div>
                                    </div>
                                    <?php if (get_option("bookingor_settings_woocommcerce_payment_active") === "on") { ?>
                                        <?php include plugin_dir_path(__FILE__) . 'Services/woocommerce-service-6.php'; ?>
                                    <?php } else { ?>
                                        <div id="selectService-6" class="select-list-1">
                                            <ul class="main-carousel all-services-shw row">
                                                <?php foreach (
                                                    ServiceControlFront::$f_service_all as $key => $value
                                                ) {  ?>
                                                    <li data-get-location-id="<?php echo esc_attr($value->location_get_id); ?>" data-get-category-id="<?php echo esc_attr($value->category_get_id); ?>" <?php echo esc_attr(isset($value->subcategories) ? 'data-subcategory-id="' . $value->subcategories . '"' : ''); ?> data-repeat-status="<?php echo esc_attr($value->recurring_status); ?>" data-repeat-type="<?php echo esc_attr($value->recurring_type); ?>" data-service-id="<?php echo esc_attr($value->service_id); ?>" data-get-service-price="<?php echo esc_attr($value->service_cost); ?>" data-get-duration="<?php echo esc_attr($value->service_duration); ?>" class="full-service-2 bookingor-full-services get_all_data select_list service-list-view">
                                                        <?php if (get_option("bookingor_settings_service_images_icons") === "bookingor-service-images-show") {
                                                        ?>
                                                            <div class="service-card-contents">
                                                                <div class="service-heading-1"><?php echo esc_html($value->service_name); ?></div>
                                                                <?php if (get_option('bookingor_settings_service_description_show') === 'on') { ?>
                                                                    <div class="bookingor-f-content bookingor-line-h"><?php echo esc_html($value->service_description); ?></div>
                                                                <?php } ?>
                                                            </div>
                                                            <div class="list-f-srvs w-100">
                                                                <div class="serv-detal  w-100">
                                                                    <?php if ($value->service_duration_type !== 'hour-period') { ?>
                                                                        <div class="service-duration mb-1">
                                                                            <div class="bookingor-d-flex gap-1 ">
                                                                                <div class="bookingor-d-flex"><svg xmlns="http://www.w3.org/2000/svg" class="bookingor-icon-duration" viewBox="0 0 24 24" fill="currentColor">
                                                                                        <path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z"></path>
                                                                                    </svg></div>
                                                                                <div class="bookingor-f-15"><?php echo  esc_attr(HelperControl::convert_duration($value->service_duration)); ?></div>
                                                                            </div>
                                                                        </div>
                                                                    <?php } ?>
                                                                    <?php if (get_option('bookingor_settings_location_active') === 'on') { ?>
                                                                        <div class="service-location mb-1">
                                                                            <div class="bookingor-d-flex gap-1 align-items-start">
                                                                                <div class="bookingor-d-flex pt-1">
                                                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="bookingor-icon-location" fill="currentColor">
                                                                                        <path d="M12 20.8995L16.9497 15.9497C19.6834 13.2161 19.6834 8.78392 16.9497 6.05025C14.2161 3.31658 9.78392 3.31658 7.05025 6.05025C4.31658 8.78392 4.31658 13.2161 7.05025 15.9497L12 20.8995ZM12 23.7279L5.63604 17.364C2.12132 13.8492 2.12132 8.15076 5.63604 4.63604C9.15076 1.12132 14.8492 1.12132 18.364 4.63604C21.8787 8.15076 21.8787 13.8492 18.364 17.364L12 23.7279ZM12 13C13.1046 13 14 12.1046 14 11C14 9.89543 13.1046 9 12 9C10.8954 9 10 9.89543 10 11C10 12.1046 10.8954 13 12 13ZM12 15C9.79086 15 8 13.2091 8 11C8 8.79086 9.79086 7 12 7C14.2091 7 16 8.79086 16 11C16 13.2091 14.2091 15 12 15Z"></path>
                                                                                    </svg>
                                                                                </div>
                                                                                <div class="bookingor-f-12 bookingor-f-location-address"><?php echo esc_html($value->location_address); ?></div>
                                                                            </div>
                                                                        </div>
                                                                        <?php }
                                                                    // Check if Google Meet is enabled globally
                                                                    $google_meet_enabled = get_option('bookingor_settings_google_meet_active');
                                                                    if ($google_meet_enabled === 'on') {
                                                                        $has_google_meet_staff = false;

                                                                        // Check if any staff assigned to this service has Google Calendar connected
                                                                        if (!empty(StaffControlFront::$f_staff) && is_array(StaffControlFront::$f_staff)) {
                                                                            foreach (StaffControlFront::$f_staff as $staff) {
                                                                                // Get services assigned to this staff
                                                                                $staff_assigned_services = explode(',', $staff->service_get_id);

                                                                                // Check if current service is assigned to this staff AND staff has Google Calendar ID
                                                                                if (in_array($value->service_id, $staff_assigned_services)) {
                                                                                    if (!empty($staff->google_calendar_id)) {
                                                                                        $has_google_meet_staff = true;
                                                                                        break;
                                                                                    }
                                                                                }
                                                                            }
                                                                        }
                                                                        // print_r($has_google_meet_staff);
                                                                        // exit;
                                                                        if ($has_google_meet_staff) {
                                                                        ?>
                                                                            <div class="service-google-meet mb-1">
                                                                                <div class="bookingor-d-flex gap-1 align-items-center">
                                                                                    <div class="bookingor-d-flex">
                                                                                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-camera-video" viewBox="0 0 16 16">
                                                                                            <path fill-rule="evenodd" d="M0 5a2 2 0 0 1 2-2h7.5a2 2 0 0 1 1.983 1.738l3.11-1.382A1 1 0 0 1 16 4.269v7.461a1 1 0 0 1-1.406.913l-3.111-1.382A2 2 0 0 1 9.5 13H2a2 2 0 0 1-2-2V5zm11.5 5.175 3.5 1.556V4.269l-3.5 1.556v4.35zM2 4a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h7.5a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1H2z" />
                                                                                        </svg>
                                                                                    </div>
                                                                                    <div class="bookingor-f-12"><?php esc_html_e('Google Meet', 'bookingor-pro'); ?></div>
                                                                                </div>
                                                                            </div>
                                                                    <?php }
                                                                    } ?>
                                                                    <div class="service-price">
                                                                        <div class="bokingor-f-cost <?php echo esc_attr(get_option('bookingor_currency_position_change')); ?> bookingor-flex">
                                                                            <div class="<?php echo esc_attr(get_option('bookingor_currency_position_change')); ?>">
                                                                                <?php echo esc_html(get_option('bookingor_settings_currency_symbol')); ?>
                                                                            </div>
                                                                            <div><?php echo esc_html(HelperControl::priceDecimal($value->service_cost)) . ($value->service_duration_type === 'hour-period' ? ' /hr' : ''); ?></div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <div class="f-service-image <?php echo esc_attr(get_option('bookingor_settings_service_images_icons')); ?>">
                                                                    <img class="serv-icon" src="<?php echo esc_attr($value->service_icon ? wp_get_attachment_url($value->service_icon) : $this->f_image_default); ?>" alt="" />
                                                                </div>

                                                            </div>
                                                        <?php } else { ?>

                                                            <div class="list-f-srvs">
                                                                <div class="serv-detal bookingor-d-flex w-100">
                                                                    <div class="service-card-contents">
                                                                        <div class="service-heading-1"><?php echo esc_html($value->service_name); ?></div>
                                                                        <?php if (get_option('bookingor_settings_service_description_show') === 'on') { ?>
                                                                            <div class="bookingor-f-content bookingor-line-h"><?php echo esc_html($value->service_description); ?></div>
                                                                        <?php } ?>
                                                                    </div>
                                                                    <?php if ($value->service_duration_type !== 'hour-period') { ?>
                                                                        <div class="service-duration mb-1">
                                                                            <div class="bookingor-d-flex gap-1 ">
                                                                                <div class="bookingor-d-flex"><svg xmlns="http://www.w3.org/2000/svg" class="bookingor-icon-duration" viewBox="0 0 24 24" fill="currentColor">
                                                                                        <path d="M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM13 12H17V14H11V7H13V12Z"></path>
                                                                                    </svg></div>
                                                                                <div class="bookingor-f-15"><?php echo  esc_attr(HelperControl::convert_duration($value->service_duration)); ?></div>
                                                                            </div>
                                                                        </div>
                                                                    <?php } ?>
                                                                    <?php if (get_option('bookingor_settings_location_active') === 'on') { ?>
                                                                        <div class="service-location mb-1">
                                                                            <div class="bookingor-d-flex gap-1 align-items-start">
                                                                                <div class="bookingor-d-flex pt-1">
                                                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="bookingor-icon-location" fill="currentColor">
                                                                                        <path d="M12 20.8995L16.9497 15.9497C19.6834 13.2161 19.6834 8.78392 16.9497 6.05025C14.2161 3.31658 9.78392 3.31658 7.05025 6.05025C4.31658 8.78392 4.31658 13.2161 7.05025 15.9497L12 20.8995ZM12 23.7279L5.63604 17.364C2.12132 13.8492 2.12132 8.15076 5.63604 4.63604C9.15076 1.12132 14.8492 1.12132 18.364 4.63604C21.8787 8.15076 21.8787 13.8492 18.364 17.364L12 23.7279ZM12 13C13.1046 13 14 12.1046 14 11C14 9.89543 13.1046 9 12 9C10.8954 9 10 9.89543 10 11C10 12.1046 10.8954 13 12 13ZM12 15C9.79086 15 8 13.2091 8 11C8 8.79086 9.79086 7 12 7C14.2091 7 16 8.79086 16 11C16 13.2091 14.2091 15 12 15Z"></path>
                                                                                    </svg>
                                                                                </div>
                                                                                <div class="bookingor-f-12 bookingor-f-location-address"><?php echo esc_html($value->location_address); ?></div>
                                                                            </div>
                                                                        </div>
                                                                    <?php } ?>
                                                                    <div class="service-price">
                                                                        <div class="bokingor-f-cost <?php echo esc_attr(get_option('bookingor_currency_position_change')); ?> bookingor-flex">
                                                                            <div class="<?php echo esc_attr(get_option('bookingor_currency_position_change')); ?>">
                                                                                <?php echo esc_html(get_option('bookingor_settings_currency_symbol')); ?>
                                                                            </div>
                                                                            <div><?php echo esc_html(HelperControl::priceDecimal($value->service_cost)) . ($value->service_duration_type === 'hour-period' ? ' /hr' : ''); ?></div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <div class="f-service-image <?php echo esc_attr(get_option('bookingor_settings_service_images_icons')); ?>">
                                                                    <img class="serv-icon" src="<?php echo esc_attr($value->service_icon ? wp_get_attachment_url($value->service_icon) : $this->f_image_default); ?>" alt="" />
                                                                </div>
                                                            </div>
                                                        <?php  } ?>
                                                    </li>
                                                <?php } ?>
                                            </ul>
                                        </div>
                                    <?php } ?>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="bookingor-ser" class="bookingor-col-sm-12 bookingor-col-md-12 j-width bookingor-col-lg-12 bookingor-col-xl-7 bookingor-g-0 flex-column bookingor-d-flex">
                        <div class="card-body">
                          
                            <div class="row bookingor-g-0  bookingor-g-0 tp-pd-oly">
                                <div class="bookingor-col-sm-12 bookingor-col-md-8 bookingor-col-lg-8 bookingor-flex flex-column lf-rt-pd">
                                    <div class="card-body">
                                        <div class="bookingor-flex flex-column">
                                            <div class="select">
                                                <div id="calendar-full-6"></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="bookingor-col-sm-12 bookingor-col-md-4 bookingor-col-lg-4  bookingor-flex flex-column bookingor-g-0" id="time-slot-sw">
                                    <div class="card-body">
                                        <div id="main-time-container">
                                            <div class="select">
                                                <div id="picktimeWarning" class="select_warning bookingor-d-none align-items-center justify-content-center">
                                                    <span class="bookingor-flex align-items-center justify-content-center">!</span>
                                                    <?php esc_html_e('Must Select a Time', 'bookingor-pro'); ?>
                                                </div>
                                                <div class="bookingor-flex align-items-center justify-content-between">
                                                    <div class="full-head-1 lf-pd-time bookingor-time-heading"><?php echo esc_html(get_option('bookingor_settings_time_name')); ?></div>
                                                </div>
                                                <div id="selectPickTime-6" class="select-list-1">
                                                    <ul class="bookingor-flex flex-wrap all-pick-time select-four max-h-156">
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="main_footer bookingor-d-flex align-items-center justify-content-between main_botm">
                            <div class="bookingor-flex justify-content-start">
                            </div>
                            <div class="bookingor-flex justify-content-end" id="check-repeat">
                                <button type="button" id="book-ready-design-2" class="btn_orange bookingor-button ready-b bookingor-cont-btn"><?php esc_html_e('Book', 'bookingor-pro'); ?></button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <?php
            if (is_plugin_active('bookingor-recurring-appointment/bookingor-recurring-appointment.php')) {
                require_once wp_normalize_path(WP_PLUGIN_DIR . '/bookingor-recurring-appointment/app/Frontend/View/Recurring/recurring.php');
            }
            ?><?php include plugin_dir_path(__FILE__) . 'tabs/customer-book.php'; ?>
            <?php include plugin_dir_path(__FILE__) . 'tabs/customer-payment.php'; ?>
            <?php include plugin_dir_path(__FILE__) . 'tabs/customer-thankyou.php'; ?>
        </form>
    </div>
</div>