<?php
/**
 * GFB Setting View
 *
 * @package GFB.
 */

if ( ! defined( 'ABSPATH' ) ) {
	exit; // Exit if accessed directly.
}

$apbgf_settings = get_option('apbgf_settings', array());

$hide_slot_capacity = isset($apbgf_settings['general']['hide_slot_capacity']) ? $apbgf_settings['general']['hide_slot_capacity'] : 'disabled';

$apbgf_price_policy = isset($apbgf_settings['general']['apbgf_price_policy']) ? $apbgf_settings['general']['apbgf_price_policy'] : '';

$apbgf_appointment_policy = isset($apbgf_settings['general']['apbgf_appointment_policy']) ? $apbgf_settings['general']['apbgf_appointment_policy'] : '';

$gbf_start_of_week = isset($apbgf_settings['general']['gbf_start_of_week']) ? $apbgf_settings['general']['gbf_start_of_week'] : '';
$gbf_lead_time = isset($apbgf_settings['general']['gbf_lead_time']) ? $apbgf_settings['general']['gbf_lead_time'] : '';

$gbf_time_duration = isset($apbgf_settings['general']['gbf_time_duration']) ? $apbgf_settings['general']['gbf_time_duration'] : '';

$gbf_time_interval = isset($apbgf_settings['general']['gbf_time_interval']) ? $apbgf_settings['general']['gbf_time_interval'] : '';

$apbgf_calendar_timeslot_format = isset($apbgf_settings['general']['apbgf_calendar_timeslot_format']) ? $apbgf_settings['general']['apbgf_calendar_timeslot_format'] : '';

$gbf_show_timeslot = isset($apbgf_settings['general']['gbf_show_timeslot']) ? $apbgf_settings['general']['gbf_show_timeslot'] : '';

$apbgf_prior_months_book_appointment = isset($apbgf_settings['general']['apbgf_prior_months_book_appointment']) ? $apbgf_settings['general']['apbgf_prior_months_book_appointment'] : '3';

/*CT-284*/
$apbgf_prior_days_book_appointment = isset($apbgf_settings['general']['apbgf_prior_days_book_appointment']) ? $apbgf_settings['general']['apbgf_prior_days_book_appointment'] : '0';
/*CT-284*/


$apbgf_cal_gradient_color_top = isset($apbgf_settings['display']['apbgf_cal_gradient_color_top']) ? $apbgf_settings['display']['apbgf_cal_gradient_color_top'] : '#f1f3f6';

$apbgf_cal_gradient_color_bottom = isset($apbgf_settings['display']['apbgf_cal_gradient_color_bottom']) ? $apbgf_settings['display']['apbgf_cal_gradient_color_bottom'] : '#f1f3f6';

$apbgf_cal_border_color = isset($apbgf_settings['display']['apbgf_cal_border_color']) ? $apbgf_settings['display']['apbgf_cal_border_color'] : '#26547c21';

$apbgf_cal_header_bg_color = isset($apbgf_settings['display']['apbgf_cal_header_bg_color']) ? $apbgf_settings['display']['apbgf_cal_header_bg_color'] : '#7C9299';

$apbgf_cal_header_text_color = isset($apbgf_settings['display']['apbgf_cal_header_text_color']) ? $apbgf_settings['display']['apbgf_cal_header_text_color'] : '#FFFFFF';

$apbgf_cal_text_color = isset($apbgf_settings['display']['apbgf_cal_text_color']) ? $apbgf_settings['display']['apbgf_cal_text_color'] : '#6D8298';

$apbgf_cal_selected_text_color = isset($apbgf_settings['display']['apbgf_cal_selected_text_color']) ? $apbgf_settings['display']['apbgf_cal_selected_text_color'] : '#FFFFFF';

$apbgf_cal_selected_text_bg_color = isset($apbgf_settings['display']['apbgf_cal_selected_text_bg_color']) ? $apbgf_settings['display']['apbgf_cal_selected_text_bg_color'] : '#00D0AC';

$apbgf_cal_available_days_text_color = isset($apbgf_settings['display']['apbgf_cal_available_days_text_color']) ? $apbgf_settings['display']['apbgf_cal_available_days_text_color'] : '#6D8298';

$apbgf_cal_available_days_bg_color = isset($apbgf_settings['display']['apbgf_cal_available_days_bg_color']) ? $apbgf_settings['display']['apbgf_cal_available_days_bg_color'] : '#FFFFFF';

$apbgf_cal_holiday_days_text_color = isset($apbgf_settings['display']['apbgf_cal_holiday_days_text_color']) ? $apbgf_settings['display']['apbgf_cal_holiday_days_text_color'] : '#6D8298';

$apbgf_cal_holiday_days_bg_color = isset($apbgf_settings['display']['apbgf_cal_holiday_days_bg_color']) ? $apbgf_settings['display']['apbgf_cal_holiday_days_bg_color'] : '';

$apbgf_company_name = isset($apbgf_settings['company']['apbgf_company_name']) ? $apbgf_settings['company']['apbgf_company_name'] : '';

$apbgf_company_address = isset($apbgf_settings['company']['apbgf_company_address']) ? $apbgf_settings['company']['apbgf_company_address'] : '';
$apbgf_company_number = isset($apbgf_settings['company']['apbgf_company_number']) ? $apbgf_settings['company']['apbgf_company_number'] : '';

$apbgf_company_email = isset($apbgf_settings['company']['apbgf_company_email']) ? $apbgf_settings['company']['apbgf_company_email'] : '';

$apbgf_company_website_url = isset($apbgf_settings['company']['apbgf_company_website_url']) ? $apbgf_settings['company']['apbgf_company_website_url'] : '';

$apbgf_sender_name = isset($apbgf_settings['email']['apbgf_sender_name']) ? $apbgf_settings['email']['apbgf_sender_name'] : '';

$apbgf_sender_email = isset($apbgf_settings['email']['apbgf_sender_email']) ? $apbgf_settings['email']['apbgf_sender_email'] : '';

?>
<div class="container">
	<div class="gf_booking_overlayDiv"></div>
	<div class="main-setting--div">        
		<div class="setting--content">
			<div class="top--heading">
				<h2><?php echo esc_html__('Settings', 'appointment-and-booking-for-gravity-forms'); ?></h2>
			</div>

			<div class="gf_booking_card--r1">
				<div class="apbgf_item_box">
					<div class="gf_booking_card--content" id="gf_booking_cardOne">
						<img src="<?php echo esc_url( APBGF_IMAGE_URL ); ?>General-setting.png" alt="">
						<h4><?php echo esc_html__('General Settings', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php echo esc_html__('Use these settings to define plugin general settings and default settings for your services and appointments.', 'appointment-and-booking-for-gravity-forms'); ?></p>
					</div>
				</div>
				<div class="apbgf_item_box">
					<div class="gf_booking_card--content" id="gf_booking_cardtwo">
						<span class="apbgf-pro-label"><?php echo esc_attr('PRO', 'appointment-and-booking-for-gravity-forms'); ?></span>
						<img src="<?php echo esc_url( APBGF_IMAGE_URL ); ?>Untitled-2.png" alt="">
						<h4><?php echo esc_html__('Display Settings', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php echo esc_html__('Use these settings to define the color scheme of the calendar on front-end.', 'appointment-and-booking-for-gravity-forms'); ?> </p>
					</div>
				</div>
				<div class="apbgf_item_box">
					<div class="gf_booking_card--content" id="gf_bookings_appointments">
						<!-- new changes -->
						<span class="apbgf-pro-label"><?php echo esc_attr('PRO', 'appointment-and-booking-for-gravity-forms'); ?></span>
						<img src="<?php echo esc_url( APBGF_IMAGE_URL ); ?>Appointments.png" alt="">
						<h4><?php echo esc_html__('Labels', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php echo esc_html__('Use these settings to change the labels on front-end.', 'appointment-and-booking-for-gravity-forms'); ?></p>
					</div>
				</div>

				<div class="apbgf_item_box">
					<div class="gf_booking_card--content" id="gf_booking_company_detail">
						<img src="<?php echo esc_url( APBGF_IMAGE_URL ); ?>Company.png" alt="">
						<h4><?php echo esc_html__('Company', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php echo esc_html__('Use these settings to add your company details.', 'appointment-and-booking-for-gravity-forms'); ?> </p>
					</div>
				</div>
				<div class="apbgf_item_box">
					<div class="gf_booking_card--content" id="gf_booking_email_configuration">
						<img src="<?php echo esc_url( APBGF_IMAGE_URL ) ; ?>Email-Configuration.png" alt="">
						<h4><?php echo esc_html__('Email Configuration', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php echo esc_html__('Use this settings to configure email work flow.', 'appointment-and-booking-for-gravity-forms'); ?> </p>
					</div>
				</div>
				<div class="apbgf_item_box">
					<div class="gf_booking_card--content" id="gf_booking_integration">
						<span class="apbgf-pro-label"><?php echo esc_attr('PRO', 'appointment-and-booking-for-gravity-forms'); ?></span>
						<img src="<?php echo esc_url( APBGF_IMAGE_URL ); ?>Integrations.png" alt="">
						<h4><?php echo esc_html__('Integrations', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php echo esc_html__('Configure Google, Office 365 and Zoom integrations.', 'appointment-and-booking-for-gravity-forms'); ?></p>
					</div>
				</div>
			</div>
		</div>
	</div>

</div>

<?php
// Global Pro popup modal using the shared SVG artwork in this plugin.
$apbgf_pro_popup_img = APBGF_IMAGE_URL . 'ProPopup.svg';
$apbgf_pricing_url   = 'https://gravitybooking.com/pricing/?utm_source=plugin&utm_medium=settings';
if ( $apbgf_pro_popup_img ) :
	?>
	<div id="apbgf-pro-modal" class="apbgf-pro-modal" style="display:none;">
		<div class="apbgf-pro-modal-backdrop" style="position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:100000;"></div>
		<div class="apbgf-pro-modal-inner" style="position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:100001;max-width:640px;width:100%;overflow:hidden;border-radius:8px;">
			<div class="apbgf-pro-modal-content" style="position:relative;">
				<img src="<?php echo esc_url( $apbgf_pro_popup_img ); ?>" alt="<?php esc_attr_e( 'Upgrade to Pro', 'appointment-and-booking-for-gravity-forms' ); ?>" style="display:block;width:100%;height:auto;" />
				<a href="<?php echo esc_url( $apbgf_pricing_url ); ?>" target="_blank" rel="noopener noreferrer"
				   aria-label="<?php esc_attr_e( 'Buy Gravity Bookings', 'appointment-and-booking-for-gravity-forms' ); ?>"
				   style="position:absolute;left:31%;top:69%;width:38%;height:15%;background:transparent;border:none;outline:none;box-shadow:none;cursor:pointer;text-indent:-9999px;overflow:hidden;">
					<?php esc_html_e( 'Buy Gravity Bookings', 'appointment-and-booking-for-gravity-forms' ); ?>
				</a>
				<button type="button" class="apbgf-pro-modal-close-area" aria-label="<?php esc_attr_e( 'Close', 'appointment-and-booking-for-gravity-forms' ); ?>" style="position:absolute;top:0;right:0;width:15%;height:12%;background:transparent;border:none;outline:none;box-shadow:none;cursor:pointer;z-index:2;"></button>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		(function() {
			function apbgfReady(fn) {
				if (document.readyState === 'loading') {
					document.addEventListener('DOMContentLoaded', fn);
				} else {
					fn();
				}
			}
			apbgfReady(function() {
				var modal     = document.getElementById('apbgf-pro-modal');
				if (!modal) { return; }
				var closeArea = modal.querySelector('.apbgf-pro-modal-close-area');
				var backdrop  = modal.querySelector('.apbgf-pro-modal-backdrop');

				function openModal(e) {
					if (e) {
						e.preventDefault();
						if (e.stopImmediatePropagation) {
							e.stopImmediatePropagation();
						}
						e.stopPropagation();
					}
					modal.style.display = 'block';
				}

				function closeModal(e) {
					if (e) {
						e.preventDefault();
					}
					modal.style.display = 'none';
				}

				// PRO sidebar panels: the dimmed body is a click-target for the
				// upgrade popup. We attach a single delegated listener on each
				// panel and bail when the click originates from the panel title
				// (heading + PRO badge) or from the Integrations tab strip.
				var proPanels = document.querySelectorAll('.apbgf-pro-panel');
				proPanels.forEach(function(panel) {
					panel.addEventListener('click', function(e) {
						if (e.target.closest('.apbgf-setting--title')) { return; }
						if (e.target.closest('.apbgf-integration-tabs')) { return; }
						openModal(e);
					}, true);
				});

				// Mark all form fields inside PRO panels as readonly so the
				// browser does not commit any local edits. (The capture-phase
				// listener above already prevents native interaction.)
				var proPanelFields = document.querySelectorAll(
					'.apbgf-pro-panel input, ' +
					'.apbgf-pro-panel select, ' +
					'.apbgf-pro-panel textarea'
				);
				proPanelFields.forEach(function(el) {
					el.setAttribute('readonly', 'readonly');
					el.setAttribute('tabindex', '-1');
				});

				// Inline PRO controls inside General Settings (these live inside
				// the otherwise-active General sidebar so we trigger per-element).
				var inlineProTriggers = [
					document.getElementById('custom_slots_multiple_enabled'),
					document.getElementById('gbf_lead_time'),
					document.getElementById('lead-time-pro-feature'),
					document.getElementById('custom-slot-gen-pro-feature')
				];
				inlineProTriggers.forEach(function(el) {
					if (!el) { return; }
					el.addEventListener('mousedown', openModal);
					el.addEventListener('click', openModal);
				});

				// Block submission of any form inside a PRO panel.
				var proForms = document.querySelectorAll('.apbgf-pro-panel form');
				proForms.forEach(function(form) {
					form.addEventListener('submit', openModal, true);
				});

				if (closeArea) {
					closeArea.addEventListener('click', closeModal);
				}
				if (backdrop) {
					backdrop.addEventListener('click', closeModal);
				}
			});
		})();
	</script>
	<?php
endif;
?>

<div class="gf_booking_sidebar">
	<span class="close_icon"></span>
	<div class="apbgf_booking_setting--inner apbgf_fancy_scroll gf_booking_general--inner boxsizing closed">
		<h3 class="apbgf-setting--title"><?php esc_html_e('General Settings', 'appointment-and-booking-for-gravity-forms'); ?></h3>
		<form class="apbgf_setting_form">
			<input type="hidden" name="type" value="general" />
						
			<div class="apbgf-field-wrapper">
				<label><?php echo esc_html__('Slot Capacity on Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="radio" name="hide_slot_capacity" id="hide_slot_capacity_enabled" value="enabled" <?php checked('enabled', $hide_slot_capacity, true); ?> /> <?php esc_html_e('Hide', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
				<input type="radio" name="hide_slot_capacity" id="hide_slot_capacity_disabled" value="disabled" <?php checked('disabled', $hide_slot_capacity, true); ?> />  <?php esc_html_e('Show', 'appointment-and-booking-for-gravity-forms'); ?>
			</div>
			<div class="apbgf-field-wrapper">
				<label class="apbgf-pro-feature-heading"><?php echo esc_html__('Custom Slots Multiple Booking', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<div id="custom-slot-gen-pro-feature">
					<input type="radio" name="" id="custom_slots_multiple_enabled" value="enabled"/> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
					<input type="radio" name="" id="hide_slot_capacity_disabled" value="disabled"/>  <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
				</div>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_price_policy"><?php echo esc_html__('Price Policy', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<select name="apbgf_price_policy" id="apbgf_price_policy">                    
					<option value="admin" <?php selected('admin', $apbgf_price_policy, true); ?>><?php esc_html_e('Admin', 'appointment-and-booking-for-gravity-forms'); ?></option>
					<option value="staff" <?php selected('staff', $apbgf_price_policy, true); ?>><?php esc_html_e('Staff', 'appointment-and-booking-for-gravity-forms'); ?></option>                    
				</select>
				<small><?php esc_html_e('Allow staff/admin to give rights to set the price for any service. Default is Admin', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_appointment_policy"><?php echo esc_html__('Appointment Policy', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<select name="apbgf_appointment_policy" id="apbgf_appointment_policy">                    
					<option value="admin" <?php selected('admin', $apbgf_appointment_policy, true); ?>><?php esc_html_e('Admin', 'appointment-and-booking-for-gravity-forms'); ?></option>
					<option value="staff" <?php selected('staff', $apbgf_appointment_policy, true); ?>><?php esc_html_e('Staff', 'appointment-and-booking-for-gravity-forms'); ?></option>                    
				</select>
				<small><?php esc_html_e('Allow staff/admin to give rights to confirm appointments assigned to them. Default is Admin', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="gbf_start_of_week"><?php echo esc_html__('Start Day of Week', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<select name="gbf_start_of_week" id="gbf_start_of_week">                    
					<option value="monday" <?php selected('monday', $gbf_start_of_week, true); ?>><?php esc_html_e('Monday', 'appointment-and-booking-for-gravity-forms'); ?></option>
					<option value="sunday" <?php selected('sunday', $gbf_start_of_week, true); ?>><?php esc_html_e('Sunday', 'appointment-and-booking-for-gravity-forms'); ?></option>
				</select>
				<small><?php esc_html_e('This will set your calendar day start with.  Default is Monday', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			 <div class="apbgf-field-wrapper">
				<label class="apbgf-pro-feature-heading" for="gbf_lead_time"><?php echo esc_html__('Lead Time (minutes)', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<div id="lead-time-pro-feature">
					<input type="number" min="1" name="gbf_lead_time" id="gbf_lead_time" value="<?php echo esc_attr($gbf_lead_time); ?>" readonly style="cursor: pointer;" />                    
				</div>
				<small><?php esc_html_e('Time slot lead time. Ex: 180 = 3 hours.  Default is 30 mins', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="gbf_time_duration" class="apbgf-pro-feature-heading"><?php echo esc_html__('Time Slot Duration (minutes)', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="number" min="1" name="gbf_time_duration" id="gbf_time_duration" value="<?php echo esc_attr($gbf_time_duration); ?>" />                    
				<small><?php esc_html_e('Each time slot duration. Ex: 180 = 3 hours.  Default is 30 mins', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="staff" class="apbgf-pro-feature-heading"><?php echo esc_html__('Time Slot Interval (minutes)', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="number" min="0" name="gbf_time_interval" id="gbf_time_interval" value="<?php echo esc_attr($gbf_time_interval); ?>" />                    
				<small><?php esc_html_e('Gap between each time slots. Ex: 60 = 1 hour. Default is 15 mins', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_calendar_timeslot_format"><?php echo esc_html__('Timeslot Format on Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<select name="apbgf_calendar_timeslot_format" id="apbgf_calendar_timeslot_format">                    
					<option value="24" <?php selected('24', $apbgf_calendar_timeslot_format, true); ?>><?php esc_html_e('24 Hours', 'appointment-and-booking-for-gravity-forms'); ?></option>
					<option value="12" <?php selected('12', $apbgf_calendar_timeslot_format, true); ?>><?php esc_html_e('12 Hours', 'appointment-and-booking-for-gravity-forms'); ?></option>
				</select>
				<small><?php esc_html_e('This will set the time format of the Timeslots on the calendar. Default is 24 Hours', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="gbf_show_timeslot"><?php echo esc_html__('Timeslots on Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<select name="gbf_show_timeslot" id="gbf_show_timeslot">                    
					<option value="right" <?php selected('right', $gbf_show_timeslot, true); ?>><?php esc_html_e('Right', 'appointment-and-booking-for-gravity-forms'); ?></option>
					<option value="bottom" <?php selected('bottom', $gbf_show_timeslot, true); ?>><?php esc_html_e('Bottom', 'appointment-and-booking-for-gravity-forms'); ?></option>
				</select>
				<small><?php esc_html_e('This will set the position of the Timeslots on the calendar. Default is Right', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_prior_months_book_appointment"><?php echo esc_html__('Prior Months to Book Appointment', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="number" min="0" name="apbgf_prior_months_book_appointment" id="apbgf_prior_months_book_appointment" value="<?php echo esc_attr($apbgf_prior_months_book_appointment); ?>" />                    
				<small><?php esc_html_e('No. of months allowed to book appointments. It cannot be zero.  Default is 3', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<!-- CT-284 -->
			<div class="apbgf-field-wrapper">
				<label for="apbgf_prior_days_book_appointment"><?php echo esc_html__('Prior Days to Book Appointment', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="number" min="0" name="apbgf_prior_days_book_appointment" id="apbgf_prior_days_book_appointment" value="<?php echo esc_attr($apbgf_prior_days_book_appointment); ?>" />
				<small><?php esc_html_e('No. of days to block an appointment from current date. 0 will start from today. Default is 0.', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>
			<!-- CT-284 -->

			<button><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>
		</form>
	</div>

	<div class="apbgf_booking_setting--inner apbgf_fancy_scroll gf_booking_display--inner apbgf-pro-panel boxsizing closed">
		<h3 class="apbgf-setting--title">
			<?php esc_html_e('Display Settings', 'appointment-and-booking-for-gravity-forms'); ?>
			<span class="apbgf-pro-tag"><?php esc_html_e('PRO', 'appointment-and-booking-for-gravity-forms'); ?></span>
		</h3>
		<div>
			<input type="hidden" name="type" value="display" />

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_gradient_color_top"><?php echo esc_html__('Calendar Background Color Gradient', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_gradient_color_top" id="apbgf_cal_gradient_color_top" value="<?php echo esc_attr($apbgf_cal_gradient_color_top); ?>" />
				<input type="color" name="apbgf_cal_gradient_color_bottom" id="apbgf_cal_gradient_color_bottom" value="<?php echo esc_attr($apbgf_cal_gradient_color_bottom); ?>" />
				<small><?php esc_html_e('Default is #f1f3f6, #f1f3f6', 'appointment-and-booking-for-gravity-forms'); ?></small>         
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_border_color"><?php echo esc_html__('Calendar Border Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_border_color" id="apbgf_cal_border_color" value="<?php echo esc_attr($apbgf_cal_border_color); ?>" />  
				<small><?php esc_html_e('Default is #26547c21', 'appointment-and-booking-for-gravity-forms'); ?></small>               
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_header_bg_color"><?php echo esc_html__('Calendar Header Background Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_header_bg_color" id="apbgf_cal_header_bg_color" value="<?php echo esc_attr($apbgf_cal_header_bg_color); ?>" />  
				<small><?php esc_html_e('Default is #7C9299', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_header_text_color"><?php echo esc_html__('Calendar Header Text Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_header_text_color" id="apbgf_cal_header_text_color" value="<?php echo esc_attr($apbgf_cal_header_text_color); ?>" />  
				<small><?php esc_html_e('Default is #FFFFFF', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_text_color"><?php echo esc_html__('Calendar Text Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_text_color" id="apbgf_cal_text_color" value="<?php echo esc_attr($apbgf_cal_text_color); ?>" />  
				<small><?php esc_html_e('Default is #6D8298', 'appointment-and-booking-for-gravity-forms'); ?></small>               
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_selected_text_color"><?php echo esc_html__('Calendar Selected Text Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_selected_text_color" id="apbgf_cal_selected_text_color" value="<?php echo esc_attr($apbgf_cal_selected_text_color); ?>" /> 
				<small><?php esc_html_e('Default is #FFFFFF', 'appointment-and-booking-for-gravity-forms'); ?></small>                
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_selected_text_bg_color"><?php echo esc_html__('Calendar Selected Text Background Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_selected_text_bg_color" id="apbgf_cal_selected_text_bg_color" value="<?php echo esc_attr($apbgf_cal_selected_text_bg_color); ?>" />   
				<small><?php esc_html_e('Default is #00D0AC', 'appointment-and-booking-for-gravity-forms'); ?></small>              
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_available_days_text_color"><?php echo esc_html__('Calendar Available Days Text Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_available_days_text_color" id="apbgf_cal_available_days_text_color" value="<?php echo esc_attr($apbgf_cal_available_days_text_color); ?>" />  
				<small><?php esc_html_e('Default is #6D8298', 'appointment-and-booking-for-gravity-forms'); ?></small>               
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_available_days_bg_color"><?php echo esc_html__('Calendar Available Days Background Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_available_days_bg_color" id="apbgf_cal_available_days_bg_color" value="<?php echo esc_attr($apbgf_cal_available_days_bg_color); ?>" />
				<small><?php esc_html_e('Default is #FFFFFF', 'appointment-and-booking-for-gravity-forms'); ?></small> 
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_holiday_days_text_color"><?php echo esc_html__('Calendar Holiday Days Text Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_holiday_days_text_color" id="apbgf_cal_holiday_days_text_color" value="<?php echo esc_attr($apbgf_cal_holiday_days_text_color); ?>" />  
				<small><?php esc_html_e('Default is #6D8298', 'appointment-and-booking-for-gravity-forms'); ?></small>               
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_cal_holiday_days_bg_color"><?php echo esc_html__('Calendar Holiday Days Background Color', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="color" name="apbgf_cal_holiday_days_bg_color" id="apbgf_cal_holiday_days_bg_color" value="<?php echo esc_attr($apbgf_cal_holiday_days_bg_color); ?>" />
				<small><?php esc_html_e('Default is empty', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<button type="button"><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>
			<!-- end -->
		</div>
	</div>

	<div class="apbgf_booking_setting--inner apbgf_fancy_scroll gf_booking_apointments_listing apbgf-pro-panel boxsizing closed">
		<h3 class="apbgf-setting--title">
			<?php esc_html_e('Label Settings', 'appointment-and-booking-for-gravity-forms'); ?>
			<span class="apbgf-pro-tag"><?php esc_html_e('PRO', 'appointment-and-booking-for-gravity-forms'); ?></span>
		</h3>
		<!-- new changes -->
		<div>
			<input type="hidden" name="type" value="label" />            

			<div class="apbgf-field-wrapper">
				<label for="apbgf_label_location"><?php echo esc_html__('Location', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<!-- new changes -->
				<input type="text" name="" id="apbgf_label_location" />                
			</div>

			<div class="apbgf-field-wrapper" style="display: none;">
				<label for="apbgf_label_category"><?php echo esc_html__('Service Category', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<!-- new changes -->
				<input type="text" name="" id="apbgf_label_category"  />                
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_label_service"><?php echo esc_html__('Service', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<!-- new changes -->
				<input type="text" name="" id="apbgf_label_service"  />                
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_label_staff"><?php echo esc_html__('Staff', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<!-- new changes -->
				<input type="text" name="" id="apbgf_label_staff" />                
			</div>
			<!-- GB free version PRO Popup -->
			<?php
			/* <div class="apbgf-booking-pro-version">
				<div class="apbgf-pro-version">
					<h2 class="apbgf-pro-cross">X</h2>
					<h3> <?php esc_html_e( "Try pro version to unlock this feature"); ?> </h3>
					<button > <?php esc_html_e('Buy Now'); ?> </button>
				</div>
			</div>
			*/
			?>

			<button><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>
		</div> 
	</div>    

	



	<div class="apbgf_booking_setting--inner apbgf_fancy_scroll gf_booking_compnay_detail boxsizing closed">
		<h3 class="apbgf-setting--title"><?php esc_html_e('Company Settings', 'appointment-and-booking-for-gravity-forms'); ?></h3>
		<form class="apbgf_setting_form">
			<input type="hidden" name="type" value="company" />

			<div class="apbgf-field-wrapper">
				<label for="apbgf_company_name"><?php echo esc_html__('Name', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="text" name="apbgf_company_name" id="apbgf_company_name" value="<?php echo esc_attr($apbgf_company_name); ?>" />
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_company_address"><?php echo esc_html__('Address', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<textarea name="apbgf_company_address" id="apbgf_company_address" cols="30" rows="10"><?php echo esc_attr($apbgf_company_address); ?></textarea>                
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_company_number"><?php echo esc_html__('Phone Number', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="text" name="apbgf_company_number" id="apbgf_company_number" value="<?php echo esc_attr($apbgf_company_number); ?>" />                
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_company_email"><?php echo esc_html__('Email ID', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="email" name="apbgf_company_email" id="apbgf_company_email" value="<?php echo esc_attr($apbgf_company_email); ?>" />                
			</div>

			<div class="apbgf-field-wrapper">
				<label for="apbgf_company_website_url"><?php echo esc_html__('Website URL', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="url" name="apbgf_company_website_url" id="apbgf_company_website_url" value="<?php echo esc_attr($apbgf_company_website_url); ?>" />                
			</div>

		  

			<button><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>
		</form>
   
	</div>   

	<div class="apbgf_booking_setting--inner apbgf_fancy_scroll gf_booking_email_configuration boxsizing closed">
		<h3 class="apbgf-setting--title"><?php esc_html_e('Email Configuration', 'appointment-and-booking-for-gravity-forms'); ?></h3>
		<form class="apbgf_setting_form">
			<input type="hidden" name="type" value="email" />

			<div class="apbgf-field-wrapper">
				<label for="apbgf_sender_name"><?php echo esc_html__('Sender Name', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="text" name="apbgf_sender_name" id="apbgf_sender_name" value="<?php echo esc_attr($apbgf_sender_name); ?>" />
			</div>            

			<div class="apbgf-field-wrapper">
				<label for="apbgf_sender_email"><?php echo esc_html__('Sender Email', 'appointment-and-booking-for-gravity-forms'); ?></label>
				<input type="email" name="apbgf_sender_email" id="apbgf_sender_email" value="<?php echo esc_attr($apbgf_sender_email); ?>" />
				<small><?php esc_html_e('Enter email address from which sender will send the email. Email should be of domain.', 'appointment-and-booking-for-gravity-forms'); ?></small>
			</div>

			<button><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>
		</form>
	</div>
	<!-- PRO Integrations panel (Google / Outlook / Zoom) -->
	<div class="apbgf_booking_setting--inner apbgf_fancy_scroll gf_booking_integrations--inner apbgf-pro-panel boxsizing closed">

		<h3 class="apbgf-setting--title">
			<?php esc_html_e('Integrations', 'appointment-and-booking-for-gravity-forms'); ?>
			<span class="apbgf-pro-tag"><?php esc_html_e('PRO', 'appointment-and-booking-for-gravity-forms'); ?></span>
		</h3>

		<div class="apbgf-integration-tabs">
			<ul class="Tabs" role="tablist" aria-label="<?php esc_attr_e('Integration tabs', 'appointment-and-booking-for-gravity-forms'); ?>">
				<li class="Tabs__tab Tab apbgf-integration-tab is-active" data-tab="google" role="tab" aria-selected="true">
					<a href="javascript:void(0);"><?php esc_html_e('Google', 'appointment-and-booking-for-gravity-forms'); ?></a>
				</li>
				<li class="Tabs__tab Tab apbgf-integration-tab" data-tab="outlook" role="tab" aria-selected="false">
					<a href="javascript:void(0);"><?php esc_html_e('Outlook', 'appointment-and-booking-for-gravity-forms'); ?></a>
				</li>
				<li class="Tabs__tab Tab apbgf-integration-tab" data-tab="zoom" role="tab" aria-selected="false">
					<a href="javascript:void(0);"><?php esc_html_e('Zoom', 'appointment-and-booking-for-gravity-forms'); ?></a>
				</li>
				<li class="Tabs__presentation-slider" role="presentation"></li>
			</ul>
		</div>

		<div class="apbgf-integration-panels">

			<!-- Google panel -->
			<div class="apbgf-integration-panel is-active" data-tab-panel="google" role="tabpanel">
				<div>
					<input type="hidden" name="type" value="gcal" />

					<div class="apbgf-field-wrapper">
						<label><?php echo esc_html__('Enable Google Meet', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="radio" name="" id="apbgf_gmeet_enabled" value="enabled" /> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
						<input type="radio" name="" id="apbgf_gmeet_disabled" value="disabled" /> <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
					</div>

					<div class="apbgf-field-wrapper">
						<label><?php echo esc_html__('Enable Google Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="radio" name="" id="apbgf_gcal_enabled" /> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
						<input type="radio" name="" id="apbgf_gcal_disabled" value="<?php echo esc_attr( true ); ?>" /> <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
					</div>

					<div class="apbgf-field-wrapper">
						<label><?php echo esc_html__('Enable Two Way Sync', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="radio" name="" id="apbgf_gcal_two_way_sync_enabled" /> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
						<input type="radio" name="" id="apbgf_gcal_two_way_sync_disabled" value="<?php echo esc_attr( true ); ?>" /> <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_gcal_client_id"><?php echo esc_html__('Client ID', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_gcal_client_id" />
						<small><?php esc_html_e('Enter Client Id.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_gcal_secret_key"><?php echo esc_html__('Secret Key', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_gcal_secret_key" />
						<small><?php esc_html_e('Enter Secret Key.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_gcal_sync_fields"><?php echo esc_html__('Fields to be Sync with Google Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>

						<?php foreach ( self::gcal_synchronization_fields() as $key => $field ) : ?>
							<label class="apbgf-cb-container">
								<input type="checkbox" value="1">
								<div class="apbgf-checkmark"></div>
								<?php echo esc_attr( $field ); ?>
							</label>
						<?php endforeach; ?>
					</div>

					<button type="button"><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>

					<div class="apbgf-info">
						<h4><?php esc_html_e('Instructions', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php esc_html_e('To find your client ID and client secret, do the following:', 'appointment-and-booking-for-gravity-forms'); ?></p>
						<ol>
							<li><?php esc_html_e('Go to the Google Developers Console.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Login to your gmail account.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Select a project, or create a new one.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Click in the upper left part to see a sliding sidebar. Next, click API Manager. In the list of APIs look for Calendar API and make sure it is enabled.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('In the sidebar on the left, select Credentials.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Go to OAuth consent screen tab and give a name to the product, then click Save.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Go to Credentials tab and in New credentials drop-down menu select OAuth client ID.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php printf( esc_html__( "Select Web application and create your project's OAuth 2.0 credentials by providing the necessary information. For Authorized redirect URIs enter the Redirect URI '%s'. Click Create.", 'appointment-and-booking-for-gravity-forms' ), esc_url( admin_url() ) ); ?></li>
							<li><?php printf( esc_html__( 'If you want to enable add to my calendar functionality then you will need to insert another Authorized Redirect URI i.e. "%s/{url_where_form_placed}"', 'appointment-and-booking-for-gravity-forms' ), esc_url( site_url() ) ); ?></li>
							<li><?php esc_html_e('In the popup window look for the Client ID and Client secret. Use them in the form below on this page.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Login with Staff Members, on dashboard click Connect.', 'appointment-and-booking-for-gravity-forms'); ?></li>
						</ol>
					</div>
				</div>
			</div>

			<!-- Outlook panel -->
			<div class="apbgf-integration-panel" data-tab-panel="outlook" role="tabpanel">
				<div>
					<input type="hidden" name="type" value="ocal" />

					<div class="apbgf-field-wrapper">
						<label><?php echo esc_html__('Enable Office 365 Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="radio" name="" id="apbgf_ocal_enabled" /> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
						<input type="radio" name="" id="apbgf_ocal_disabled" value="<?php echo esc_attr( true ); ?>" /> <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_ocal_client_id"><?php echo esc_html__('Client ID', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_ocal_client_id" value="" />
						<small><?php esc_html_e('Application (client) ID', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_ocal_secret_key"><?php echo esc_html__('Value', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_ocal_secret_key" />
						<small><?php esc_html_e('Application Secret Key.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_ocal_sync_fields"><?php echo esc_html__('Fields to be Sync with Outlook Calendar', 'appointment-and-booking-for-gravity-forms'); ?></label>

						<?php foreach ( self::gcal_synchronization_fields() as $key => $field ) : ?>
							<label class="apbgf-cb-container">
								<input type="checkbox" value="1">
								<div class="apbgf-checkmark"></div>
								<?php echo esc_attr( $field ); ?>
							</label>
						<?php endforeach; ?>
					</div>

					<button type="button"><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>

					<div class="apbgf-info">
						<h4><?php esc_html_e('Instructions', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php esc_html_e('To find your client ID and client secret, do the following:', 'appointment-and-booking-for-gravity-forms'); ?></p>
						<ol>
							<li><?php esc_html_e('Go to the', 'appointment-and-booking-for-gravity-forms'); ?> <a href="https://portal.azure.com/" target="_blank" rel="noopener noreferrer">https://portal.azure.com/</a>.</li>
							<li><?php esc_html_e('Login to your outlook account.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('In the Azure services, Go to App registrations.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Click on New registration and Enter app name.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Select this option: Accounts in any organizational directory (Any Azure AD directory – Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox)', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Select Web in the application type field.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php printf( esc_html__( "Add the Redirect URL '%s'", 'appointment-and-booking-for-gravity-forms' ), esc_url( admin_url() ) ); ?></li>
							<li><?php esc_html_e('Click on register button.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php printf( esc_html__( 'If you want to enable add to my calendar functionality for customer then on the Overview Screen click on Redirect URIs and you will need to insert another Authorized Redirect URI i.e. "%s/{url_where_form_placed}"', 'appointment-and-booking-for-gravity-forms' ), esc_url( site_url() ) ); ?></li>
							<li><?php esc_html_e('After Registering, click on Certificates & Secrets on the left side of the screen.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Click on New Client Secret.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Add Description and Expires details.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Copy Value and paste into Secret Key.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Click on add button.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Click on Overview. Copy Application (client) ID. Paste into Client ID.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Go to API Permissions and Click on Add Premission.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Click On Microsoft Graph then Delegated Permissions.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Search for Calendars and check on Calendars.Read and Calendars.ReadWrite and click on Add Permission.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Follow the same steps and add the delegated permission for MailboxSettings.Read.', 'appointment-and-booking-for-gravity-forms'); ?></li>
						</ol>
					</div>
				</div>
			</div>

			<!-- Zoom panel -->
			<div class="apbgf-integration-panel" data-tab-panel="zoom" role="tabpanel">
				<div>
					<input type="hidden" name="type" value="zoom" />

					<div class="apbgf-field-wrapper">
						<label><?php echo esc_html__('Enable Zoom Meeting', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="radio" name="" id="apbgf_zoom_enabled" /> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
						<input type="radio" name="" id="apbgf_zoom_disabled" value="<?php echo esc_attr( true ); ?>" /> <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_zoom_account_id"><?php echo esc_html__('Account ID', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_zoom_account_id" />
						<small><?php esc_html_e('Enter Zoom Account ID.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_zoom_client_id"><?php echo esc_html__('Client ID', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_zoom_client_id" />
						<small><?php esc_html_e('Enter Zoom Client ID.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_zoom_client_secret"><?php echo esc_html__('Client Secret', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_zoom_client_secret" />
						<small><?php esc_html_e('Enter Zoom Client Secret.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_zoom_meeting_title"><?php echo esc_html__('Meeting Title', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="text" name="" id="apbgf_zoom_meeting_title" />
						<small><?php esc_html_e('Title displayed for the Zoom meeting.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label for="apbgf_zoom_meeting_agenda"><?php echo esc_html__('Meeting Agenda', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<textarea name="" id="apbgf_zoom_meeting_agenda" rows="4"></textarea>
						<small><?php esc_html_e('Agenda/description displayed for the Zoom meeting.', 'appointment-and-booking-for-gravity-forms'); ?></small>
					</div>

					<div class="apbgf-field-wrapper">
						<label><?php echo esc_html__('Create Meetings For Pending Appointments', 'appointment-and-booking-for-gravity-forms'); ?></label>
						<input type="radio" name="" id="apbgf_zoom_meeting_for_pending_enabled" /> <?php esc_html_e('Enable', 'appointment-and-booking-for-gravity-forms'); ?>&nbsp;&nbsp;
						<input type="radio" name="" id="apbgf_zoom_meeting_for_pending_disabled" value="<?php echo esc_attr( true ); ?>" /> <?php esc_html_e('Disable', 'appointment-and-booking-for-gravity-forms'); ?>
					</div>

					<button type="button"><?php esc_html_e('Save', 'appointment-and-booking-for-gravity-forms'); ?></button>

					<div class="apbgf-info">
						<h4><?php esc_html_e('Instructions', 'appointment-and-booking-for-gravity-forms'); ?></h4>
						<p><?php esc_html_e('To find your Zoom account credentials, do the following:', 'appointment-and-booking-for-gravity-forms'); ?></p>
						<ol>
							<li><?php esc_html_e('Go to', 'appointment-and-booking-for-gravity-forms'); ?> <a href="https://marketplace.zoom.us/" target="_blank" rel="noopener noreferrer">Zoom App Marketplace</a>.</li>
							<li><?php esc_html_e('Create a Server-to-Server OAuth app.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Copy the Account ID from your app credentials page.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Copy the Client ID and Client Secret and paste them above.', 'appointment-and-booking-for-gravity-forms'); ?></li>
							<li><?php esc_html_e('Save settings, then assign Zoom configuration to your booking workflow.', 'appointment-and-booking-for-gravity-forms'); ?></li>
						</ol>
					</div>
				</div>
			</div>

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