<?php
	if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
	wp_enqueue_script('scc-bootstrap-min');
	wp_enqueue_script('scc-js-js');
	$translation_array = 'var rt_vars = ' . json_encode(array( 'rt_adminurl' => admin_url(), 'rt_url' => get_site_url(), 'rt_urlajax' =>  (get_site_url() . '/wp-admin/admin-ajax.php') , 'a_value' => '10' ));
	wp_add_inline_script( 'scc-js-js', $translation_array );
	wp_enqueue_style('scc-bootstrap-min');
	include_once SCC_DIR . '/admin/logo-header.php';
	function getNumberofForms()
	{
		global $wpdb;
		$q = $wpdb->get_var("SELECT count(*) as allforms FROM {$wpdb->prefix}scc_forms where description='chewie'");
		return $q;
	}
	global $scc_googlefonts_var;
	$currency_style=[];
    // wp_enqueue_style( 'wp-color-picker' );
	// wp_enqueue_script( 'my-script-handle', plugins_url('my-script.js', __FILE__ ), array( 'wp-color-picker' ), false, true );
	//echo "<pre>";
	//print_r(get_loaded_extensions());
	//echo "<pre/>";
	?>
	<!-- SCRIPTS TO TOGGLE FONT SETTINGS AND MORE -->
	<script>
		var sccMain =[]

/**
 * fixes undefined method and sccMain
 */
function sccWhenAvailable(name, callback) {
	var interval = 10; // ms
	window.setTimeout(function() {
		if (window[name]) {
			callback(window[name]);
		} else {
			sccWhenAvailable(name, callback);
		}
	}, interval);
}
		//php_pdf_test()
		function php_pdf_test() {
			$fragment_refresh = {
				url: rt_vars.rt_urlajax,
				type: 'POST',
				data: {
					action: 'pdf_php',
					html: ''
				},
				xhrFields: {
					responseType: 'blob'
				},
				success: function (data) {
					var a = document.createElement('a');
					var url = window.URL.createObjectURL(data);
					a.href = url;
					a.download = 'myfile.pdf';
					document.body.append(a);
					a.click();
					a.remove();
					window.URL.revokeObjectURL(url);
				}
			};
			jQuery.ajax( $fragment_refresh );
		}
		function myFunction() {
			var x = document.getElementById("myDIV");
			if (x.style.display === "none") {
				x.style.display = "block";
			}
			else {
				x.style.display = "none";
			}
		}
		function myFunction2() {
			var x = document.getElementById("myDIV2");
			if (x.style.display === "none") {
				x.style.display = "block";
			} else {
				x.style.display = "none";
			}
		}
		function myFunction3() {
			var x = document.getElementById("myDIV3");
			if (x.style.display === "none") {
				x.style.display = "block";
			} else {
				x.style.display = "none";
			}
		}
	// function myFunction4() {
	//   var x = document.getElementById("myDIV4");
	//   if (x.style.display === "none") {
	//     x.style.display = "block";
	//   } else {
	//     x.style.display = "none";
	//   }
	// }
</script>
<!-- END OF SCRIPTS TO TOGGLE FONT SETTINGS AND MORE -->
<div id="scc-editing-area-loading">
	<div class="center">
		<div class="sk-chase">
			<div class="sk-chase-dot"></div>
			<div class="sk-chase-dot"></div>
			<div class="sk-chase-dot"></div>
			<div class="sk-chase-dot"></div>
			<div class="sk-chase-dot"></div>
			<div class="sk-chase-dot"></div>
		</div>
	</div>
</div>
<div class="wrap scc_wrapper">
	<?php
	$opt=get_option('scc_licensed');
	$allForms = getNumberofForms();
	include_once( ABSPATH . 'wp-admin/includes/plugin.php' );
	if ( is_plugin_active( 'starter-wp/index.php' )) {
		echo "<div> WP STARTER PLUGIN IS INSTALLED, THIS WOULD BREAK YOUR CALCULATORS </div>";
	}
	if($allForms >= 1 && (empty($opt) || $opt == 0) )
	{
		echo '<p class="free_version">You are using the <span class="highlighted">Demo</span> version of the plugin. Click <span class="highlighted"><a href="http://designful.ca/apps/stylish-cost-calculator-wordpress/">here</a></span> to buy the pro version.</p>';
	}
	else
	{
		?>
		<!--
		<form method="post">
			<input type="hidden" name="page" value="ttest_list_table">
			<?php
			/*
			$list_table = new Stylish_Cost_Calculator_Tabs_List();
			$list_table->prepare_items();
			$list_table->search_box( 'search', 's' );
			$list_table->disccay();
			*/
			?>
		</form>
	-->
	<style>
		.scc_title_bar {
			background: #314af3;
			padding: 15px;
			padding-left: 45px;
			margin-left: -23px;
			font-size: 22px;
			color: #fff;
			letter-spacing: 1px;
			text-transform: uppercase;
			width: 100%;
			margin-bottom: 40px;
			margin-top: 10px;
		}
	</style>
</div>
<div class="scc_title_bar">Start a new calculator</div>
<!-- Demo Load by Mike -->
<div class="col-md-12" style="margin-top:20px;margin-bottom:50px">
	<div style="background: #f9f9fe;border-radius: 4px;max-width: 500px;height:160px;padding:10px">
		<h1 style="font-size:16px;padding-left:10px;padding-bottom:10px;color:#314af3;font-weight: 600; text-transform: capitalize;">Option 1 | One-click Template Load</h1>
		<br>
		<!--START PASTING--->
		<!--<label class="scc_label" style="text-align: left;"><a class="scc_button" onclick="myFunction2()">LOAD DEMO</a></label>-->
		<!--<label class="scc_label" style="text-align: left;"><a class="scc_button" onclick="myFunction4()">Local Translate</a></label>-->
		<div style="" id="myDIV2-2" class="scc_label col-xs-12 col-md-2">
			<?php echo "<span><span style='margin-left:-5px; ; padding: 0px; color: #555;line-height: 11px;float: left;'>";
			echo "<select style=\"width:360px;border: 2px solid #E8E8E8;\" class=\"sccloaddemo\" onChange='loadExample(this)'>";
			echo "<option value=\"\">[Choose A Template]</option>";
			echo "<option value='0'>1 - Venue Rental (template)</option>";
			echo "<option value='1'>2 - Website Designer (template)</option>";
			echo "<option value='2'>3 - Wedding Photographer (template)</option>";
			echo "<option value='3'>4 - Car Rental (template)</option>";
			echo "<option value='4'>5 - T-Shirt Printing (template)</option>";
			echo "<option value='5'>6 - Cleaning Company (template)</option>";
			echo "<option value='6'>7 - Funeral Home Company (template)</option>";
			echo "<option value='7'>8 - Content Writing Agency (template)</option>";
			echo "<option value='8'>9 - Audio Editing Services (template)</option>";
			echo "<option value='9'>10 - Social Media Management (template)</option>";
			echo "<option value='10'>11 - Student Fees (template)</option>";
			echo "<option value='11'>12 - Digital Print and Lamination (template)</option>";
			echo "<option value='12'>13 - Kitchens Renovations (template)</option>";
			echo "<option value='13'>14 - Simple Video Budget (template)</option>";
			echo "<option value='14'>15 - Food Catering (template)</option>";
			echo "<option value='15'>16 - Pest Control Services (template)</option>";
			echo "<option value='16'>17 - Book Publisher Service (template)</option>";
			echo "</select>";
			echo "</span></span>";
			?>
		</div>
		<!--DONE PASTE-->
	</div>
</div>
<!-- END Demo Load by Mike -->
<div style="margin: 50px 0px 50px 0px"><h3> or </h3></div>
<div style="background: #f9f9fe;border-radius: 4px;max-width: 500px;height:210px;padding:10px;margin-left: 15px">
	<h1 style="font-size:16px;padding-left:10px;color:#314af3;font-weight: 600; text-transform: capitalize;">Option 2 | Start a New Calculator</h1>
	<div class="col-md-12" style="margin-top:-10px;">
		<!-- <label class="scc_label col-xs-12 col-md-1" style="text-align: left;"><a class="scc_button" href="javascript:void(0)" onClick="resetFields()">RESET</a></label>-->
		<div style="clear: both;"></div>
		<br />
		<div id="adminsettingsid" data-calculator_id="" style="display: none;"></div>
		<div class="col-xs-12 col-md-12" style="">
			<input type="text" class="col-md-2 input_pad" style="margin-left:-20px;width:360px;border: 2px solid #E8E8E8!important;" placeholder="Calculator name (mandatory)" id="costcalculatorname" value="" />
		</div>
	</div>
</tr>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!---                    Save buttons start                --->
<div class="col-lg-12 col-md-10 custom-btn-scc-top" style="padding-bottom:220px;padding-top:5px;margin-left:-20px;margin-top:5px;">
	<!--<label class="scc_label" style="text-align: left;"><a class="scc_button" href="javascript:void(0)" onClick="saveFields()">SAVE</a></label>-->
	<?php $license_enable = get_option('scc_licensed');
	global $wpdb;
	$results = $wpdb->get_results("SELECT * FROM {$wpdb->prefix}scc_forms");
	if($license_enable == 1){
		?>
		<div class="col-sm-12">
			<label class="scc_label" style="text-align: left;padding-left:0px"><a style="pointer-events: none;padding:10px!important;"  class="scc_button save_button " href="javascript:void(0)" onClick="saveFields(true, <?php echo count($results) ?>,false, false )">START NEW</a></label>
		</div></div>
		<?php
	}
	if($license_enable == 0 || !isset($license_enable)){
		?>
		<div class="col-sm-12">
			<label class="scc_label" style="text-align: left;padding-left:0px"><a style="pointer-events: none;padding:10px!important;" class="scc_button save_button " href="javascript:void(0)" onClick="saveFields(false, <?php echo count($results) ?>,false, false )">START NEW</a></label>
		</div></div>
		<?php
	}
	?>
</div>
<div style="margin-bottom: 200px;"></div>
<!--- Save buttons end--->
<!-- Start of SAVE BUTTONS -->
<!-- End of SAVE BUTTONS -->
<!-- The Modal Videos Tutorials-->
<div id="myModalVideosSCC" class="modalvideosSCC" style="display:none;z-index: 1600;">
	<div class="scc-modal-content-2020-videosSCC">
		<span class="closevideoSCC">&times;</span>
		<p>
			<div style="padding-top:15px;text-align:center;font-size:40px;font-weight:bold;color:#314af3!important;">Video Tutorial</div>
			<div style="padding-top:20px;text-align:center;font-size:20px;color:#484848;">How to use Stylish Cost Calculator</div>
		</p>
		<br><hr><br>
		<p>
		</p>
	</div>
</div>
<!-- End of Modal Video Tutorials -->
<!-- The Modal Contact Support-->
<div id="myModalSupportSCC" class="modalsupportSCC" style="display: none">
	<div class="scc-modal-content-2020-supportSCC" style="min-height: 412px;">
		<span class="closesupportSCC">&times;</span>
		<div style="padding-top:20px;text-align:center;font-size:40px;font-weight:bold;color:#314af3!important;">Contact Support</div>
		<div style="padding-top:20px;text-align:center;font-size:20px;color:#484848;">We're here to help!</div>
		<br><hr><br>
		<p>
			<div style="text-align: center;">
				<div class="col-md-12 col-xs-12" style="margin-top:10px;min-height:800px;">
					<label class="scc_label" style="text-align: left;margin:20px">
						<a class="scc_button" href="https://designful.freshdesk.com/support/solutions/48000446985" target="_blank">Documentation & F.A.Q's</a>
					</label>
					<label class="scc_label" style="text-align: left;margin:20px">
						<a class="scc_button" href="https://stylishcostcalculator.com/support/" target="_blank">Submit A Ticket</a>
					</label>
					<label class="scc_label" style="text-align: left;margin:20px">
						<a class="scc_button" href="https://www.facebook.com/designful" target="_blank">FaceBook Message</a>
					</label>
					<label class="scc_label" style="text-align: left;margin:20px">
						<a class="scc_button" id="myBtnVideosSCC" href="#">Video Tutorials</a>
					</label>
					<label class="scc_label" style="text-align: left;margin:20px">
						<a class="scc_button" href="https://designful.freshdesk.com/support/discussions/forums/48000346574" target="_blank">Forum & Feature Requests</a>
					</label>
				</div>
			</div>
			<br><br>
			<!--  <iframe src="https://designful.ca/spl-support/#splsupportid" scrolling="no" width="90%" height="400px" align="center" ></iframe>-->
		</p>
	</div>
</div>
<!-- End of Modal Video Tutorials -->
<!-- START MORE SETTINGS -->
<div style="display:none;clear:both;" id="myDIV3" class="scc_wrapper">
	<div class="row" style="display: block;">
		<div style="background-color:#f9f9fe;width:700px;padding-left:40px;padding-bottom:20px;height:650px;">
			<br><br><div style="font-size:180%;" class="sccsubtitle scc_email_quote_label"><span style="font-weight:800;">TOGGLE BUTTONS</span> SETTINGS</div><br>
			<!-- START OF SMALL EXTRA SETTINGS -->
			<!-- Start SCC Total Price Style View -->
			<div class="row col-md-12 " style="display: block;">
				<div class="col-xs-12 col-sm-8 col-md-7 col-lg-7">
					<select name="scc_total_price_style_view" class="form-control scc_total_price_style_view" style="height:40px;">
						<?php //echo '<pre>'; print_r($parameters); ?>
						<option class="form-control">Style for Total Price Bar </option>
						<option class="form-control" value="scc_tp_style1" <?php  if(isset($parameters->objecttotalpricestyle) && $parameters->objecttotalpricestyle == 'scc_tp_style1'){echo ' selected="selected"';}?> >Style 1 | Total Price</option>
						<option class="form-control" value="scc_tp_style2" <?php  if(isset($parameters->objecttotalpricestyle) && $parameters->objecttotalpricestyle == 'scc_tp_style2'){echo ' selected="selected"';}?> >Style 2 | Total Price</option>
						<option class="form-control" value="scc_tp_style3" <?php  if(isset($parameters->objecttotalpricestyle) && $parameters->objecttotalpricestyle == 'scc_tp_style3'){echo ' selected="selected"';}?> >Style 3 | Total Price</option>
						<option class="form-control" value="scc_tp_style4" <?php  if(isset($parameters->objecttotalpricestyle) && $parameters->objecttotalpricestyle == 'scc_tp_style4'){echo ' selected="selected"';}?> >Style 4 | Total Price</option>
					</select>
				</div>
			</div>
			<!-- End SCC Total Price Style View -->
			<!-- Start of Currency Symbol or Letters -->
			<div class="row col-md-12" style="display: block;;">
				<div class="col-xs-12 col-sm-8 col-md-7 col-lg-7">
					<select name="scc_currency_style" class="form-control scc_currency_style" style="font-size: 13px!important;height:40px;">
						<option class="form-control" value="0" <?php echo (isset($parameters) && isset($parameters->currency_style) && $parameters->currency_style == 0 ) ? 'selected' : '' ?>>Currency Symbol (Example: $53)</option>
						<option class="form-control" value="1" <?php echo (isset($parameters) && isset($parameters->currency_style) && $parameters->currency_style == 1 ) ? 'selected' : '' ?>>Currency Letters (Example: 53 CAD)</option>
					</select>
				</div>
			</div>
			<!-- End of Currency Symbol or Letters -->
			<!-- Start TAX Percentage Input -->
			<div class="row col-md-12" style="display: block;">
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" style=""><strong> TAX/VAT %</strong></div>
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
					<input    <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?>  type="number" min="1" max="99"  name="scc_tax_amount"  value="<?php if(isset($parameters->objecttaxrate) && $parameters->objecttaxrate != ''){echo esc_html($parameters->objecttaxrate);} ?>" id="scc_tax_amount" class="form-control" style="max-width:55px;min-height: 40px;padding-right: 5px;">
				</div>
			</div>
			<!-- END TAX Percentage Input -->
			<!-- Start Global | Currency label Toggle Button -->
			<div class="row col-md-12" style="display: block;">
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
					<label for="scc_label">Global | Remove <b>Currency</b> label</label>
				</div>
				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
					<label class="scc-switch">
						<div class="scc-switch">
							<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="scc_remove_currency_label" placeholder="" value="scc_remove_currency_label" id="scc_remove_currency_label" <?php if(isset($parameters->objectscccurrencylabel) && $parameters->objectscccurrencylabel != ''){echo ' checked="checked"';} ?> class="form-control">
							<span class="slider round"></span></div></label></div>
						</div>
						<!-- End Global | Currency label Toggle Button -->
						<!-- Start Send Quote Button -->
						<div class="row col-md-12" style="display: block;">
							<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
								<label for="scc_label">Frontend | Turn off  <b>Email Quote</b> button</label>
							</div>
							<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
								<label class="scc-switch">
									<div class="scc-switch">
										<input  <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> type="checkbox" name="scc_send_quote" placeholder="" value="turn_off_send_quote" id="scc_send_quote" <?php  if(isset($parameters->objectsendquote) && $parameters->objectsendquote != ''){echo ' checked="checked"';}?> class="form-control scc_send_quote">
										<span class="slider round"></span></div></label>
									</div>
								</div>
								<!-- End Of Send Quote Button -->
								<!-- START OF DETAILED LIST BUTTON -->
								<div class="row col-md-12" style="display: block;">
									<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
										<label for="scc_label">Frontend | Turn off <b>View Detailed List</b> button</label>
									</div>
									<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
										<label class="scc-switch">
											<div class="scc-switch">
												<input type="checkbox"  <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="scc_detailed_list" placeholder="" value="turn_off_viewed_detailed_list" id="scc_detailed_list" <?php if(isset($parameters->objectdetailedlist) && $parameters->objectdetailedlist != ''){echo ' checked="checked"';} ?> class="form-control scc_detailed_list">
												<span class="slider round"></span></div></label>
											</div>
										</div>
										<!-- END OF DETAILED LIST BUTTON -->
										<!-- Start Total Price Toggle Button -->
										<div class="row col-md-12" style="display: block;">
											<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
												<label for="scc_label">Frontend | Turn off <b>Total Price</b></label>
											</div>
											<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
												<label class="scc-switch">
													<div class="scc-switch">
														<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="scc_remove_total_price_frntd" placeholder="" value="scc_turn_off_total_price_view" id="scc_remove_total_price_frntd" <?php if(isset($parameters->objectscctotalprice) && $parameters->objectscctotalprice != ''){echo ' checked="checked"';} ?> class="form-control">
														<span class="slider round"></span></div></label></div>
													</div>
													<!-- End Total Price Toggle Button -->
													<!-- start of turn off save icon -->
													<div class="row col-md-12" style="display: block;">
														<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
															<label for="scc_label">Detailed List | Turn off <b>Save</b> icon</label>
														</div>
														<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6"  <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
															<label class="scc-switch">
																<div class="scc-switch">
																	<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="scc_save_icon" placeholder="" value="turn_off_save_icon" id="scc_save_icon" <?php if(isset($parameters->objectsaveicon) && $parameters->objectsaveicon != ''){echo ' checked="checked"';} ?> class="form-control scc_save_icon">
																	<span class="slider round"></span></div></label>
																</div>
															</div>
															<!-- end of turn off save icon -->
															<div class="row col-md-12" style="display: block;">
																<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
																	<label for="scc_label">Detailed List | Turn off <b>Tax</b> display</label>
																</div>
																<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
																	<label class="scc-switch">
																		<div class="scc-switch">
																			<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="turn_off_tax" placeholder="" value="turn_off_tax" id="turn_off_tax" <?php if(isset($parameters->objectscctax) && $parameters->objectscctax != ''){echo ' checked="checked"';} ?> class="form-control">
																			<span class="slider round"></span></div></label>
																		</div>
																	</div>
																	<!-- Start Detailed List Title Toggle Button -->
																	<div class="row col-md-12" style="display: block;">
																		<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
																			<label for="scc_label">Detailed List | Remove Title</label>
																		</div>
																		<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?> >
																			<label class="scc-switch">
																				<div class="scc-switch">
																					<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="scc_remove_detailed_list_title" placeholder="" value="scc_remove_detailed_list_title" id="scc_remove_detailed_list_title" <?php if(isset($parameters->objectscctitlelabel) && $parameters->objectscctitlelabel != ''){echo ' checked="checked"';} ?> class="form-control">
																					<span class="slider round"></span></div></label>
																				</div>
																			</div>
																			<!-- END Detailed List Title Toggle Button -->
																			<!-- Start Turn Off Coupon Discount -->
																			<div class="row col-md-12" style="display: block;">
																				<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
																					<label for="scc_label">Discount | Turn off <b>Coupon Discount</b></label>
																				</div>
																				<div class="col-xs-12 col-sm-12 col-md-3 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?>>
																					<!-- <div class="col-xs-12 col-sm-12 col-md-3 col-lg-6" > -->
																						<label class="scc-switch">
																							<div class="scc-switch">
																								<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="turn_off_coupon" placeholder="" value="turn_off_coupon" id="turn_off_coupon" <?php if(isset($parameters->objectscccoupon) && $parameters->objectscccoupon != ''){echo ' checked="checked"';} ?> class="form-control">
																								<!-- <input type="checkbox" name="turn_off_coupon" placeholder="" value="turn_off_coupon" id="turn_off_coupon" checked class="form-control" disabled> -->
																								<span class="slider round"></span></div></label>
																							</div>
																						</div>
																						<!-- End of Turn Off Coupon Display -->
																						<!-- Start Total price bar float left-->
																						<div class="row col-md-12" style="display: block;">
																							<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
																								<label for="scc_label">Total Price| Turn On <b>Total Price</b> Bar Float</label>
																							</div>
																							<div class="col-xs-12 col-sm-12 col-md-3 col-lg-6" <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="You need to have a premium license to use this feature."' : "" ?>>
																								<label class="scc-switch">
																									<div class="scc-switch">
																										<input type="checkbox" <?php echo get_option('scc_licensed') == 0 ? 'disabled' : '' ?> name="turn_on_total_price_float" placeholder="" value="turn_on_total_price_float" id="turn_on_total_price_float" <?php if(isset($parameters->objectscctotalpricefloat) && $parameters->objectscctotalpricefloat != ''){echo ' checked="checked"';} ?> class="form-control">
																										<span class="slider round"></span></div></label>
																									</div>
																								</div>
																								<!-- End Total price bar float left-->
																							</div>
																							<!-- End Detailed List Title Toggle Button -->
																						</div>
																						<!-- END OF SMALL EXTRA SETTINGS -->
																						<div class="row col-md-12" style="display: block;">
																							<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
																								<br><br><div style="font-size:180%;" class="sccsubtitle scc_email_quote_label"><span style="font-weight:800;">LANGUAGE TRANSLATION</span> & WORD CHANGES</div><br>
																							</div>
																							<div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
																								<!-- Start Local Translate  style="display:none;" id="myDIV4"-->
																								<table class="translate_table blueTable"  id="translate_table">
																									<thead>
																										<tr>
																											<th><b>Key</b></th>
																											<th><b>Lang</b></th>
																											<th><b>Translation</b></th>
																										</tr>
																									</thead>
																									<tbody  id="translate_table-tbody">
																										<tr><td><input type="text" disabled value="Total"></td><td><input type="text" value="en"></td><td><input type="text" value="Total"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size:15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Description"></td><td><input type="text" value="en"></td><td><input type="text" value="Description"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Unit Price"></td><td><input type="text" value="en"></td><td><input type="text" value="Unit Price"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Quantity"></td><td><input type="text" value="en"></td><td><input type="text" value="Quantity"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Price"></td><td><input type="text" value="en"></td><td><input type="text" value="Price"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="SEND"></td><td><input type="text" value="en"></td><td><input type="text" value="SEND"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Total Price"></td><td><input type="text" value="en"></td><td><input type="text" value="Total Price"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Summary"></td><td><input type="text" value="en"></td><td><input type="text" value="Summary"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Email Quote"></td><td><input type="text" value="en"></td><td><input type="text" value="Email Quote"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Email Quote Form"></td><td><input type="text" value="en"></td><td><input type="text" value="Email Quote Form"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Prove that you are not a robot"></td><td><input type="text" value="en"></td><td><input type="text" value="Prove that you are not a robot"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Please wait..."></td><td><input type="text" value="en"></td><td><input type="text" value="Please wait..."></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Submit"></td><td><input type="text" value="en"></td><td><input type="text" value="Submit"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Cancel"></td><td><input type="text" value="en"></td><td><input type="text" value="Cancel"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Email Confirmation"></td><td><input type="text" value="en"></td><td><input type="text" value="Email Confirmation"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">x</a></td></tr>
																										<tr><td><input type="text" disabled value="Thank you! We sent your quote to"></td><td><input type="text" value="en"></td><td><input type="text" value="Thank you! We sent your quote to"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">x</a></td></tr>
																										<tr><td><input type="text" disabled value="Remember to check your spam folder."></td><td><input type="text" value="en"></td><td><input type="text" value="Remember to check your spam folder."></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">x</a></td></tr>
																										<tr><td><input type="text" disabled value="Detailed List"></td><td><input type="text" value="en"></td><td><input type="text" value="Detailed List"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Choose an option..."></td><td><input type="text" value="en"></td><td><input type="text" value="Choose an option..."></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Your Name"></td><td><input type="text" value="en"></td><td><input type="text" value="Your Name"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Your Email"></td><td><input type="text" value="en"></td><td><input type="text" value="Your Email"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Your Phone"></td><td><input type="text" value="en"></td><td><input type="text" value="Your Phone"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Your Phone (Optional)"></td><td><input type="text" value="en"></td><td><input type="text" value="Your Phone (Optional)"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Coupon Code"></td><td><input type="text" value="en"></td><td><input type="text" value="Coupon Code"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Please choose an option"></td><td><input type="text" value="en"></td><td><input type="text" value="Please choose an option"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Enter your coupon code"></td><td><input type="text" value="en"></td><td><input type="text" value="Enter your coupon code"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="This code is not valid"></td><td><input type="text" value="en"></td><td><input type="text" value="This code is not valid"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Discount percentage"></td><td><input type="text" value="en"></td><td><input type="text" value="Discount percentage"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Your discount has been applied correctly"></td><td><input type="text" value="en"></td><td><input type="text" value="Your discount has been applied correctly"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="Your discount has not been applied because the total price has to be between"></td><td><input type="text" value="en"></td><td><input type="text" value="Your discount has not been applied because the total price has to be between"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																										<tr><td><input type="text" disabled value="The price must be at least"></td><td><input type="text" value="en"></td><td><input type="text" value="The price must be at least"></td><td><a href="javascript:void(0)" class="fa material-icons" onclick="remove_rowTran(this)" style="font-size: 15px;">cancel</a></td></tr>
																									</tbody>
																								</table>
																								<div class="col-lg-12 col-md-12 col-xs-12" style="text-align:center;padding-top:10px;padding-bottom:30px;min-width: 200px; background: antiquewhite;height: 20px;">
																									<a href="javascript:void(0)" onClick="addNewTran(this)" class="crossnadd" style="font-size: 13px;">+ Add New Translate</a>
																								</div>
																								<!-- End Local Translate -->
																							</div>
																						</div>
																						<!--<div class="row" style="display: block;">-->
																							<!--    <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">-->
																								<!--            <label for="scc_label"><b>Change the "Total" word</b></label>-->
																								<!--        </div>-->
																								<!--        <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">-->
																									<!--            <input type="text" name="scc_change_total_word" placeholder="" value="" id="scc_change_total_word" class="form-control scc_change_total_word">-->
																									<!--        </div>-->
																									<!--    </div>-->
																									<!--    <div class="row" style="display: block;">-->
																										<!--    <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">-->
																											<!--            <label for="scc_label"><b>Change the "view detailed list" word</b></label>-->
																											<!--        </div>-->
																											<!--        <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">-->
																												<!--            <input type="text" name="scc_change_detailed_list_word" placeholder="" value="" id="scc_change_detailed_list_word" class="form-control scc_change_detailed_list_word">-->
																												<!--        </div>-->
																												<!--    </div>-->
																												<!--    <div class="row" style="display: block;">-->
																													<!--    <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">-->
																														<!--            <label for="scc_label"><b>Change the "send quote by email" word</b></label>-->
																														<!--        </div>-->
																														<!--        <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4">-->
																															<!--            <input type="text" name="scc_change_send_quote_word" placeholder="" value="" id="scc_change_send_quote_word" class="form-control scc_change_send_quote_word">-->
																															<!--        </div>-->
																															<!--    </div>-->
																														</div>
																														<!-- END MORE SETTINGS -->
																														<!-- START OF FONT SETTINGS AND COLORS -->
																														<div style="display:none;" id="myDIV">
																															<div class="col-xs-12 col-md-4 col-lg-4 addedFieldsStyle" style="margin-top:10px;margin-right:20px;">
																																<table cellpadding="5px" cellspacing="5px">
																																	<div style="text-align:center;font-size:16px;font-size:16px;padding-bottom:10px;padding-top:10px;" class="col-xs-12 col-md-12">
																																		Title Font Settings
																																	</div><br>
																																	<tr>
																																		<td class="col-xs-12 col-md-5"><label class="scc_label">Size</label>
																																		</td>
																																		<td>
																																			<select name="titlepricefontsize" id="titlepricefontsize" style="box-shadow: 1px 1px 1px #999; border: 0 none;">
																																				<option class="form-control servicepricefontsize" value="">Size</option>
																																				<?php
																																				for($n=1; $n<=100; $n++){
																																					if($n.'px'== '30px'){
																																						$select_ser = "selected";
																																					}
																																					else{
																																						$select_ser = "";
																																					}
																																					?>
																																					<option class="form-control servicepricefontsize" value="<?php echo esc_html($n) ;?>px" <?php echo esc_html($select_ser); ?>>
																																						<?php echo esc_html($n) ;?>px</option>
																																					<?php }
																																					?>
																																				</select>
																																			</td>
																																		</tr>
																																		<tr>
					<!--<td class="col-xs-12 col-md-1"> <label class="scc_label">Admin Email:</label></td>
						<td class="col-xs-12 col-md-2"><input type="text" /></td> -->
						<td class="col-xs-12 col-md-3"><label class="scc_label">Font Type</label> </td>
						<td>
							<?php
							$allfonts = json_decode($scc_googlefonts_var->gf_get_local_fonts());
							?>
							<select id='titlescc_fonttype' style="box-shadow: 1px 1px 1px #999; border: 0 none;">
								<?php
								$fontIndex = 0;
								foreach ($allfonts->items as $allfont) {
									$selected = ('Open Sans' == $allfont->family) ? "selected=selected" : "";
									?>
									<option <?php echo esc_html($selected); ?> value="
										<?php echo esc_html($fontIndex);?>">
										<?php echo esc_html($allfont->family);?>
									</option>
									<?php $fontIndex++; } ?>
								</select>
							</td>
						</tr>
						<tr>
					<!--<td class="col-xs-12 col-md-1"><label class="scc_label">Email Subject</label></td>
						<td class="col-xs-12 col-md-2"><input type="text" /></td>-->
						<td class="col-xs-12 col-md-3"><label class="scc_label">Color</label> </td>
						<td>
							<input type="text" class="color-picker" id="titlecolorPicker" value="#000" /></td>
						</tr>
					</table>
				</div>
				<div class="col-xs-12 col-md-4 col-lg-4 addedFieldsStyle" style="margin-top:10px;margin-right:20px;">
					<table cellpadding="5px" cellspacing="5px">
						<div style="text-align:center;font-size:16px;font-size:16px;padding-bottom:10px;padding-top:10px;" class="col-xs-12 col-md-12">
							Service Font Settings
						</div><br>
						<tr>
					<!--<td class="col-xs-12 col-md-1"><label class="scc_label">Admin Email</label></td>
						<td class="col-xs-12 col-md-2"><input type="text" /></td> -->
						<td class="col-xs-12 col-md-4"><label class="scc_label">Size</label>
						</td>
						<td>
							<select name="servicepricefontsize" id="servicepricefontsize" style="box-shadow: 1px 1px 1px #999; border: 0 none;">
								<option class="form-control servicepricefontsize" value="">Size</option>
								<?php
								for($n=1; $n<=100; $n++){
									if($n.'px'== '16px'){
										$select_ser = "selected";
									}
									else{
										$select_ser = "";
									}
									?>
									<option class="form-control servicepricefontsize" value="<?php echo esc_html($n) ;?>px" <?php echo esc_html($select_ser); ?>>
										<?php echo esc_html($n) ;?>px</option>
									<?php }
									?>
								</select>
							</td>
						</tr>
						<tr>
					<!--<td class="col-xs-12 col-md-1"> <label class="scc_label">Admin Email:</label></td>
						<td class="col-xs-12 col-md-2"><input type="text" /></td> -->
						<td class="col-xs-12 col-md-4"><label class="scc_label">Font Type</label> </td>
						<td>
							<?php
							$allfonts = json_decode($scc_googlefonts_var->gf_get_local_fonts());
							?>
							<select id='scc_fonttype' style="box-shadow: 1px 1px 1px #999; border: 0 none;">
								<?php
								$fontIndex = 0;
								foreach ($allfonts->items as $allfont) {
									$selected = ('Open Sans' == $allfont->family) ? "selected=selected" : "";
									?>
									<option <?php echo esc_html($selected); ?> value="
										<?php echo esc_html($fontIndex);?>">
										<?php echo esc_html($allfont->family);?>
									</option>
									<?php $fontIndex++; } ?>
								</select>
							</td>
						</tr>
						<tr>
					<!--<td class="col-xs-12 col-md-1"><label class="scc_label">Email Subject</label></td>
						<td class="col-xs-12 col-md-2"><input type="text" /></td>-->
						<td class="col-xs-12 col-md-4"><label class="scc_label">Font Color</label> </td>
						<td>
							<input type="text" class="color-picker" id="colorPicker" value="#000" /></td>
						</tr>
					</table>
				</div>
				<div class="col-xs-12 col-md-4 col-lg-4 addedFieldsStyle" style="margin-top:10px;margin-right:20px;">
					<table cellpadding="5px" cellspacing="5px">
						<div style="text-align:center;font-size:16px;font-size:16px;padding-bottom:10px;padding-top:10px;" class="col-xs-12 col-md-12">
							Object Settings
						</div><br>
						<tr>
							<td class="col-xs-12 col-md-4"><label class="scc_label">Object Size</label>
							</td>
							<td>
								<select name="servicepricefontsize" id="objectservicepricefontsize" style="box-shadow: 1px 1px 1px #999; border: 0 none;">
									<option class="form-control servicepricefontsize" value="">Size</option>
									<?php
									for($n=1; $n<=100; $n++){
										if($n.'px'== '50px') {
											$select_ser = "selected";
										}
										else{
											$select_ser = "";
										}
										?>
										<option class="form-control servicepricefontsize" value="<?php echo  esc_html($n) ;?>px" <?php echo esc_html($select_ser); ?>>
											<?php echo esc_html($n) ;?>px</option>
										<?php }
										?>
									</select>
								</td>
							</tr>
							<tr>
								<td class="col-xs-12 col-md-4"><label class="scc_label">Color</label> </td>
								<td>
									<input type="text" class="color-picker" id="objectcolorPicker" value="#000" /></td>
								</tr>
								<tr>
									<td class="col-xs-12 col-md-3"></td>
									<td> </td>
								</tr>
							</table>
						</div>
					</div>
					<!-- ******************************************************************************************** -->
					<script type="text/javascript">
						jQuery(function($) {
							$('.color-picker').wpColorPicker();
						});
						function goToGlobalSettings(){
							window.open("admin.php?page=stylish_cost_calculator_settings")
						}
					</script>
					<!--- ********************************************************************************************************************************* -->
					<div class="row" style="display:none;">
						<div class="col-xs-12 col-md-7 col-lg-6">  <!-- This affects the size of the main container -->
							<div class="scc_wrapper"><div style="clear: both;" id="previewInputsAdd" class="scc_wrapper"></div></div>
							<div class="hover_bkgr_fricc">
								<span class="helper"></span>
								<div>
									<div class="popupCloseButton" href="javascript:void(0)" onClick="ClosePopup()">x</div>
									<b id="hover_bkgr_fricc_message">You cannot add more than three sections items; However, you might able add more subsections or more elements within the currenct sections & subsections. <br> Purchase the pro version <a href="https://stylishcostcalculator.com/">here</a>. It's a one-time purchase with free lifetime upgrades.</b>
								</div>
							</div>
							<div style="clear: both;"></div>
							<div id="themainwarning"></div>
							<br>
							<div id="scc-demover" data-demo="<?php echo esc_html(get_option('scc_licensed'));?>" style="text-align: center;"></div>
							<br>
							<div class="xxx" style="padding-bottom:20px;"><div class="purple_bar" style="text-align:center;">Calculator Input Fields</div></div>
							<div id="allinputstoadd" class="col-xs-6 col-lg-12 col-md-12" style="width:100% !important; padding-left:0px !important;"> </div>  <!-- This affects the size of the main input containers -->
							<div style="max-width:1000px;padding-right:4%;">
								<label class="col-xs-12 col-lg-12 col-md-12" style="padding: 16px;border: 1px solid #314af3;border-radius: 4px; margin: 22px;">
									<a href="javascript:void(0)" onClick="addAnotherField()" class="crossnadd2 scc_new_sec">[+] New Section   <a href="#" style="color:black;padding-left:5%;float:right;" class="tooltipadmin-right" data-tooltip="You use sections to add new titles and descriptions. This helps seperate products/services that are not related to each other.">?</a> </a>
								</label>
							</div>
							<div style="max-width:400px;" >
								<label class="col-xs-12 col-lg-12 col-md-12" style="padding: 16px;border: 1px solid #c0c0c0;border-radius: 5px; ;margin: 22px;">
									<input <?php echo get_option('scc_licensed') == 0 ? ' class="tooltipadmin-right" data-tooltip="Please become Premium to activate Paypal payment	"' : "" ?> style="margin-top:-9px !important;" type="checkbox" onClick="openModalPaypalForm()" id="paypal_checkbox" <?php echo isset($parameters) && isset($parameters->paypal_checked) && $parameters->paypal_checked == true && isset($parameters->paypal_email) && strlen($parameters->paypal_email) > 3 ?  'checked' : ''?>
									<?php echo get_option('scc_licensed') == 0 ? 'disabled' : ''?>><span class="crossnadd2"> Add Pay with Paypal Button</span>
									<div id="paypal_form_result" style="padding-top:12px;">
										<?php if(isset($parameters) && isset($parameters->paypal_checked) && $parameters->paypal_checked){
											echo "<ul>";
											echo " <li>";
											echo "Paypal Email <span style='font-weight:400;'>" .esc_html($parameters->paypal_email);
											echo "</span>  </li>";
											echo " <li>";
											echo "Shopping Cart Name <span style='font-weight:400;'>" .esc_html($parameters->paypal_shopping_cart_name);
											echo " </li>";
											echo "</span>  <li>";
											echo "Currency</strong> <span style='font-weight:400;'> " .esc_html($parameters->paypal_currency);
											echo "</span> </li>";
											echo "</ul>";
										} ?>
									</div>
									<div id="paypal_fields">
										<?php if(isset($parameters) && isset($parameters->paypal_checked) && $parameters->paypal_checked){
											echo "<input type='hidden' id='paypal_email' value='" .esc_html($parameters->paypal_email). "'/>";
											echo "<input type='hidden' id='paypal_shopping_cart_name' value='" .esc_html($parameters->paypal_shopping_cart_name). "'/>";
											echo "<input type='hidden' id='paypal_currency' value='" .esc_html($parameters->paypal_currency). "'/>";
										} ?>
									</div>
									<div id="paypal_modal"></div>
								</label>
							</div>
							<div style="display: none" id="inputtoadd">
								<div class="addedFieldsStyle" style="display:grid;">
									<div id="title54-bar-btns">
										<button id="close-btn" class="btnn material-icons" href="javascript:void(0)" onClick="removeField(this)" style="line-height: 34px;width: 39px;">close</button>
										<button id="down-btn" class="btnn material-icons down" style="display: none; line-height: 34px;width: 39px;" href="javascript:void(0)" onClick="rdown(this)">arrow_drop_down</button>
										<button id="up-btn" class="btnn material-icons up" style="display: none; line-height: 34px;width: 39px;" href="javascript:void(0)" onClick="rup(this)">arrow_drop_up</button>
									</div>
									<!--<button class="collapsible" style="font-size:18px;">Section</button>-->
									<div class="row" style="padding-top:20px;padding-left:24px">
										<div class="scc-col-xs-12 scc-col-md-12 scc-col-lg-12">
											<div onClick="accordionIconClick(this)" style="cursor:pointer;">
												<span style="display: inline-block;height: 100%;vertical-align: middle;"></span>
												<img style="position: absolute;top: 0;bottom: -25px;left:20px; margin: auto;" src="<?php echo esc_url(SCC_URL . '/assets/images/settings-gear-scc-1.png') ?>" height="13px" />
												<div class="accordion-container accordion-tooltip-hidden" style="display:inline-block; margin-left: 25px;width: 90%">
													<div class="accordion-tooltip-left-arrow"></div><div class="accordion-tooltip">
														Accordion
														<label class="accordion_switch_button">
															<input class="scc_accordion_section" name="scc_accordion_section"  type="checkbox" value="yes">
															<span class="accordion_toggle_button round"></span>
														</label>
													</div>
												</div>
											</div>
										</div>
									</div>
									<div id="title54-bar">
										<div id="title54">
											<div style="vertical-align: middle; margin-left:4px">
												<input type="text" class="input_pad sectiontitle" placeholder="Section Title" value="" style="border-raduis:10px;margin-top: 20px;width: 350px;height: 50px;margin-left:13px;margin-bottom:10px;" required />
												<span class="mandatory">*</span>
											</div>
										</div>
									</div>
									<!--<label class="scc_label" style="padding: none; width: 40%; float: left;margin-top: 5px;">Section Description </label>--->
									<textarea class="input_pad sectionDescription" placeholder="Description of the products/services that will be listed below. (Optional)" style="border-raduis:10px;height:125px;padding: 15px;width: 95%;margin-left: 22px;margin-bottom:20px;margin-top:15px;"> </textarea>
									<div class="fieldDatatoAdd">
										<div class="boardOption1" style="margin-right:-10px">
											<label style="width: 100%;">
												<a href="javascript:void(0)" onClick="addAnotherElement(this)" class="crossnadd2 scc_new_subsec">[+] Subection <a href="#" style="color:black;padding-left:5%;" class="tooltipadmin-right" data-tooltip="You can add many elements inside a single subsection. The difference between each subsection is how the math of the slider is considered.">?</a> </a>
											</label>
										</div>
									</div>
								</div>
							</div>
							<!--- ********************************************************************************************************************************* -->
		<!-- <label class="scc_label col-xs-12 col-md-2" style="text-align: left;padding-top:40px;">
			<a class="scc_button" href="javascript:void(0)" onClick="saveFields()">SAVE</a>
		</label> -->
		<!--- ********************************************************************************************************************************* -->
		<div style="display: none">
			<div id="fieldDatatoAdd">
				<div class="boardOption1" style="margin-right:-10px">
					<label style="width: 100%;padding:20px;">
						<!-- This one works -->
						<a href="javascript:void(0)" onClick="addAnotherElement(this)" class="crossnadd2">[+] Subsection <a href="#" style="color:black;float:right;top: -40px;right: -12px" class="tooltipadmin-right" data-tooltip="You can add many elements inside a single subsection. The difference between each subsection is how the math of the slider is considered."> <img src="<?php echo SCC_URL . '/assets/images/info-icon-scc.png'; ?>" alt="Info Icon" height="16px;"></a></a>
					</label>
				</div>
			</div>
			<div id="fieldDatatoAdd11">
				<!--<hgroup class="speech-bubble">
					<div class="AnimCloseButton" href="javascript:void(0)" onClick="ClosePopup1()">x</div>
					<div style="line-height: 15px;">
					<b>PRO TIP</b>
					<br> Everything in this <b>Subsection</b> will effect the total price.
					<br><b>Example:</b> a slider quantity will be multiplied by dropdown or checkbox in the same <b>section.</b>
					</div>
				</hgroup>-->
				<div class="boardOption">
					<div class="scc_subsection" style="background: #f9f9fe;">
						<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField1(this)" style="float:right; font-size:20px;" >x</button>
						<button class="collapsible" style="font-size:18px;">Subsection </button>
						<div class="scc_help_btn_right" style="left:26px;float:right;top:23px;font-size:18px;"><a href="#" style="padding-left:10px;color:black;" class="tooltipadmin-right" data-tooltip="You use subsections to control what elements a slider has an effect on. You can only add one slider per subsection."> <img src="<?php echo SCC_URL . '/assets/images/info-icon-scc.png'; ?>" alt="Info Icon" height="15px;"> </a></div>
					</div>
					<div class="col-md-12 col-xs-12" style="margin:15px">
						<label class="scc_label" style="left:25%;position: absolute;margin-top: -10px;">
							<a style="pointer-events: auto; padding: 10px;" class="scc_button save_button " href="javascript:void(0)" onclick="addElementButton(this)">
								Add Element +
							</a>
						</label>
					</div>
					<div class="col-md-12 col-xs-12" style="margin:15px">
						Add 1 or more elements by clicking the blue buttons<br>
						<button value ="dropdowninput" onclick="getFieldOptionx(this, -1)" class="scc_button btn-backend"><i class="far fa-list-alt" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text">DropDown</div></button>
						<!-- <button value ="switchinput" onclick="getFieldOptionx(this, 1)" class="scc_button btn-backend"><i class="far fa-dot-circle" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text">Radio Button</div></button> -->
						<!-- <button value ="switchinput" class="scc_button btn-backend" onclick="getFieldOptionx(this, 5)"><i class="fas fa-circle" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text">Radio Button 2</div></button> -->
						<button value ="switchinput" class="scc_button btn-backend" onclick="getFieldOptionx(this, 2)"><i class="far fa-check-square" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text">Checkbox</div></button>
						<button value ="switchinput" class="scc_button btn-backend" onclick="getFieldOptionx(this, 3)"><i class="fas fa-toggle-off" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text" >Toggle Switch</div></button>
						<!-- <button value ="switchinput" class="scc_button btn-backend" onclick="getFieldOptionx(this, 4)"><i class="fas fa-toggle-on" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text" >Toggle Switch Circ</div></button> -->
						<button value ="switchinput" class="scc_button btn-backend" onclick="getFieldOptionx(this, 6)"><i class="far fa-rectangle-wide" style="margin-top:5px;font-size:13px;width:26px;height: 9px;background-color: white;"></i> <div class="btn-backend-text" >Simple Button </div></button>
						<button class="scc_button btn-backend" onclick="addSlider(this)"><i class="fas fa-sliders-h" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text">Slider</div></button>
						<input class="inputoption_slidchk" type="checkbox" onClick="addSlider(this)"  style="display:none;"/>
						<button value ="comment_input" class="scc_button btn-backend" onclick="getFieldOptionx(this, 7)"><i class="fas fa-comment" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text" >Comment Box</div></button>
						<button value ="number_input" class="scc_button btn-backend" onclick="getFieldOptionx(this, 8)"><i class="fas fa-comment" style="padding-top:3px;font-size:13px;"></i> <div class="btn-backend-text" >Number Box</div></button>
					</div>
					<div style="clear: both;"></div>
					<div style="clear: both;"></div>
					<div class="subsection-area BodyOption">
					</div>
					<!--
						<li class='form-line'>
						<div class="BodyOption">
						<label class="scc_label" style="padding-left: 20px;width:30%;text-align:left;">Input Type</label>
						<select onchange="getFieldOptionx(this)" style="width:50%;min-width:50%;margin-top:20px;" class="getfieldoptionx ">
						<option value=""></option>
						<option value="dropdowninput">Dropdown Menu</option>
						<option value="switchinput">Checkbox</option>
						</select>
						<div style="clear: both;"></div>
						<div style="clear: both;"></div>
						</div>
						</li>
						<div id="title5400-bar-btns" class="buttonclass11">
						<button id="min-btn" class="crossnadd" href="javascript:void(0)" onClick="addAnotherOption(this)" style="border: none;">+ Add A Dropdown, Checkbox or Switch</button>
						</div>
						<div id="title54-bar" style="">
						<div id="title5400" style="" class="buttonclass11">
						<span style="vertical-align: middle; ">
						<input class="inputoption_slidchk" type="checkbox" onClick="addSlider(this)"  style="display:none;"/>
						<button id="min-btn" class="crossnadd" href="javascript:void(0)" onClick="addSlider(this)" style="border: none;">+ Add A Slider</button>
						</span>
						</div>
						</div>
					-->
					<div class="selslideropt_3" style="display:none;">
						<hr />
						<div style="clear: both;"></div>
						<div class="selslideropt_4" style="background-color:#FFF;margin:20px;padding:10px;">
							<!-- Slider Title ( THIS ONE ) --->
							<div style="padding-bottom:20px;">
								<div style="text-align:center; font-size:20px;padding-top:10px;"> Slider Element</div>
								<div class="scc_help_btn_right" style="float:right;width:10%; top: -20px"><a href="#" style="padding-left:10px;color:black;top:-22px;right:-12px;" class="tooltipadmin-right" data-tooltip="The slider values will be multply the values of any options in this subsection by the slider quantity. You can you a zero value in the price range of the slider if you don't want to add more cost."> <img src="<?php echo SCC_URL . '/assets/images/info-icon-scc.png'; ?>" alt="Info Icon" height="16px;"> </a></div>
							</div>
							<div style="padding-top:30px;"></div>
							<div class="col-md-12 col-xs-12">
								<label class="scc_label  col-xs-2 col-md-2" style="text-align:right;padding-right:10px;margin-top:-15px;height:41px">Slider Name</label>
								<input type="text" class="col-xs-6 col-md-5 input_pad sliderinputoption_T" style="text-align:left;width:270px;border-color: #F0F0F0;" value="" />
							</div>
							<div class="col-md-12 col-xs-12" style="margin-top:10px;">
								<label class="scc_label  col-xs-2 col-md-2" style="margin-top:-12px;text-align:right;padding-right:10px;">Step</label>
								<input type="text" class="col-xs-6 col-md-1 input_pad slidoption_3" value="1" style="text-align:center;height:40px;width:50px"  />
								<label class="scc_label  col-xs-2 col-md-3" style="margin-top:-12px;text-align:right ;padding-right:15px;">Default Value</label>
								<input type="text" class="col-xs-6 col-md-1 input_pad slidoption_4" value="1" val="1" style="text-align:center;height:40px;left:-8px;width:50px;" />
							</div>
							<!-- Start Price Range -->
							<div style="clear: both;"></div>
							<div style="height:auto;background-color:white;display:table;">
								<div style="padding: 5px; margin:5px;" style="height:auto;">
									<table class="price_table col-md-12" cellpadding="0" cellspacing="0" style="    margin-left: 40px!important;">
										<caption style="text-align: left;padding-top:10px;margin-bottom:-20px;font-size:17px;margin-left:-84px;font-size:14px;" class="scc_label">Price Range</caption>
										<thead>
											<tr>
												<th><label class="scc_label  col-xs-2 col-md-2" style="padding-left:20px;font-size:12px;">From</label></th>
												<th><label class="scc_label  col-xs-2 col-md-2" style="padding-left:10px;font-size:12px;">To</label></th>
												<th><label class="scc_label  col-xs-2 col-md-2" style="padding-left:10px;font-size:12px;">Price</label></th>
											</tr>
										</thead>
										<tbody>
											<tr>
												<th><input type="number" min=0 class="scc_label input_pad sliderinputoption `	`scc_input" value="0" style="width:90PX;height:40px;margin-left:12px;padding:6px;" align="center" /></th>
												<th><input type="number" min=0 class="scc_label  input_pad sliderinputoption_2 scc_input" value="100" style="width:90PX;height:40px;margin-left:12px;padding:6px;" align="center" /></th>
												<th><input type="number" min=0 class="scc_label  input_pad sliderinputoption_5 scc_input" value="1" style="width:90PX;height:40px;margin-left:12px;padding:6px;" align="center" /></th>
												<th>
													<label style="width: 10%;font-size: 15px;"></label>
												</th>
											</tr>
										</tbody>
									</table>
								</div>
							</div>
							<!-- End of Price Range -->
						</div>
						<div class="col-lg-12 col-md-12 col-xs-12" style="text-align:center;padding-top:20px;padding-bottom:30px;">
							<a href="javascript:void(0)" onClick="addNewRange(this)" class="crossnadd" style="font-size: 13px;">+ Add Price Range</a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div id="titledescdiv" style="display: none">
			<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)" style="width:10%;">x</button>
			<button class="collapsible">Fix Selection</button>
			<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)" style="width:10%;">-</button>
			<div class="content" value="titledescdiv">
				<label class="scc_label  col-xs-6 col-md-3" style="margin-top:15px;padding-right:5px;">Product/Service </label>
				Mandatory <input type="text"  class="col-xs-12 col-md-5 input_pad sliderinputoption_T" style="margin-top:5px;" value="" />
				<label class="scc_label  " style="width: 40%;margin-bottom:10px;">Price</label>
				<input type="number" min=0 class="input_pad descinputoption" value="100" style="width: 40%;margin-bottom:10px;" align="center" />
			</div>
		</div>
		<!-- Start of Checkbox, Toggle or Button Element -->
		<div id="switchoption" style="display: none" >
			<hr style="margin:15px;">
			<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)">x</button>
			<button class="collapsible" style="padding:0px;font-size:18px">Checkbox / Toggle / Button </button>
			<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)">-</button>
			<div class="content" value="switchoption" >
				<!-- start of style-->
				<div class="col-xs-12 col-md-12" style="margin-top: 30px;">
					<div class="col-xs-2 col-md-2">
						<span class="scc_label " style="margin-top:-15px;text-align:right;">Style</span>
					</div>
					<div class="col-xs-3 col-md-3">
						<select class="fieldFormat" style="margin-left:-10px!important;padding:6px;height:40px;width:270px;border-color:#F0F0F0;">
							<option value="" placeholder="Checkbox style"></option>
							<option value="6">Simple Buttons</option>
							<option value="1">Checkbox (circle) (Animated 1)</option>
							<option value="5">Checkbox (circle) (Animated 2)</option>
							<option value="2">Checkbox (Animated)</option>
							<option value="3">Toggle Switch (Rectangle)</option>
							<option value="4">Toggle Switch (Circle)</option>
						</select>
					</div>
					<span class="col-xs-6 col-md-7"</span>
					</div>
					<!-- end style chooser-->
					<div class="switchoption_2" style="margin-top: -10px;">
						<div class="col-xs-12 col-md-12 switchoption_3" style="margin-top: 10px;">
							<div class="col-xs-2 col-md-2"></div>
							<div class="col-xs-12 col-md-9" style="padding:0px">
								<input type="text" placeholder="Product or service name" class="input_pad switchinputoption col-md-7 col-xs-6" value="" style="height:40px;padding:8px;margin-left:5px;" align="center" required />
								<input type="number" min=0 class="input_pad switchinputoption_2 col-xs-1 col-md-1" value="100" style="width:80px;height:40px;text-align:center;" align="center" />
								<button class="col-md-1 col-xs-1" style="height:40px;border: 1px solid #F0F0F0;" onclick="removeSwitchOption(this)" >X</button>
							</div>
						</div>
					</div>
					<div class="col-lg-12 col-md-12 col-xs-12" style="padding: 10px;margin-bottom: 4px;margin-top: 15px;text-align:center;">
					</div>
					<a href="javascript:void(0)" onClick="addAnotherSwitch(this)" class="crossnadd" style="width:60%; margin-top: 5px;">[+] Add A Product / Service Option </a>
					<div class="warning" style="padding-bottom:20px;"></div>
				</div>
			</div>
			<!-- End of Checkbox, Toggle or Button Element -->
			<!-- start of A-Slider Element NOT USED ?? -->
			<div id="AsliderOption" style="display: none">
				<hr style="margin:15px;">
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)" style="width:10%;">x</button>
				<button class="collapsible">Range Selection</button>
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)" style="width:10%;">-</button>
				<div class="content" value="AsliderOption">
					<div class="selslideropt_4">
						<label class="scc_label  col-xs-12 col-md-4" style="margin-top:15px;">Slider Name</label>
						<input type="text" class="col-xs-12 col-md-5 input_pad sliderinputoption_T" style="margin-top:5px; width:270px" value="" />
						<div style="clear: both;"></div>
						<div style="padding: 5px; margin:5px;">
							<caption style="text-align: center;" class="scc_label" style="padding-top:20px;">Price Range</caption>
							<table class="price_table" cellpadding="0" cellspacing="0" style="width: 80%">
								<thead>
									<tr>
										<th><label class="scc_label  col-xs-6 col-md-2">From</label></th>
										<th><label class="scc_label  col-xs-6 col-md-2">To</label></th>
										<th><label class="scc_label  col-xs-6 col-md-2">Price</label></th>
									</tr>
								</thead>
								<tbody>
									<tr>
										<th><input type="number" min=0 class="input_pad sliderinputoption" value="0" style="width: 50%;" align="center" /></th>
										<th><input type="number" min=0 class="input_pad sliderinputoption_2" value="100" style="width: 50%;" align="center" /></th>
										<th><input type="number" min=0 class="input_pad sliderinputoption_5" value="1" style="width: 50%;" align="center" /></th>
										<th>
											<lable style="width: 10%;font-size: 15px;"></lable>
										</th>
									</tr>
								</tbody>
							</table>
						</div>
						<div col-lg-12 col-md-12 col-xs-12 style="text-align:center;">
							<a href="javascript:void(0)" onClick="addNewRange(this)" class="crossnadd material-icons" style="font-size: 15px;">library_add</a>
						</div>
					</div>
				</div>
			</div>
			<!-- End of A-Slider Element -->
			<!-- start of Button Element -->
			<div id="buttonoption" style="display: none">
				<hr style="margin:15px;">
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)" style="width:10%;">x</button>
				<button class="collapsible">Simple Buttons</button>
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)" style="">-</button>
				<div class="selopt5 col-xs-12 col-md-12" style="margin-top:20px;">
					<label class="scc_label  col-xs-6 col-md-4" style="margin: -2px 30px 25px;text-align:center;">Title</label>
					<input type="text" class="col-xs-6 col-md-5 input_pad inputbuttonservice_title" style="margin-top:5px;padding:10px;" placeholder="Product or service name">
				</div>
				<div class="content" value="buttonoption">
					<div class="buttonoption_2" style="margin-top: 15px;">
						<div class="col-xs-12 col-md-12 buttonoption_3" style="margin-top: 10px;">
							<label class="scc_label  " style="width: 5%; float: none;">XXYYXX</label>
							<input type="text" placeholder="Button Description" class="input_pad buttoninputoption" value="" style="width: 45%;" align="center" required />
							<input type="number" min=0 class="input_pad buttoninputoption_2" value="1" style="width: 15%;height:38px;" align="center" />
						</div>
					</div>
					<div class="col-lg-12 col-md-12 col-xs-12" style="padding: 10px;margin-bottom: 4px;margin-top: 15px;text-align:center;">
					</div>
					<a href="javascript:void(0)" onClick="addAnotherButton(this)" class="crossnadd" style="width:60%; margin-top: 25px;">[+] Add a Product / Service Option </a>
					<div class="warning"></div>
				</div>
			</div>
			<!-- End of Button Element -->
			<!-- Start of Dropdown Element -->
			<div id="selectoption" style="display: none">
				<hr style="margin:15px;">
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)" style="">x</button>
				<button class="collapsible">Dropdown Menu</button>
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)" style="width:10%;">-</button>
				<div class="content" value="selectoption" >
					<div class="selopt5 col-xs-12 col-md-12" style="margin-top:-40px;">
						<div class="scc-col-xs-12 scc-col-md-12 scc-col-lg-12">
							<div onClick="accordionIconClick(this)" style="cursor:pointer; min-height: 15px;">
								<span style="display: inline-block;height: 100%;vertical-align: middle;"></span>
								<img style="position: absolute;top: 0;bottom: -30px;left: 93px; margin: auto;" src="<?php echo SCC_URL . '/assets/images/settings-gear-scc-1.png' ?>" height="13px" />
								<div class="accordion-container accordion-tooltip-hidden" style="display:inline-block; margin-left: 30px;width: 90%">
									<div class="accordion-tooltip-left-arrow" style="float:left; margin-left: 50px; margin-top:10px;"></div>
									<div class="accordion-tooltip" style="width: 60% !important; text-align:left !important; float:left">
										Mandatory
										<label class="accordion_switch_button" style="">
											<input  class="scc_mandatory_dropdown" name="scc_mandatory_dropdown"  type="checkbox" value="yes">
											<span class="accordion_toggle_button round"></span>
										</label>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="selopt5 col-xs-12 col-md-12" style="margin-top:5px;margin-bottom:10px;">
						<div class="col-xs-3 col-md-2"><label class="scc_label" style="margin-top:-x;text-align:right;">Title</label></div>
						<input type="text" class="col-xs-5 col-md-5 input_pad inputoption_title" style="height:41px;margin-top:5px;margin-left:1px!important;" placeholder="Title">
					</div>
					<hr>
					<!-- Dropdown selection MIKE -->
					<div class="selectoption_2 col-xs-12 col-md-12" >
						<div class="selopt3 col-md-12 col-xs-12" style="">
							<div class="col-xs-1 col-md-2">
								<label class="" style="float: none;margin-top:17px!important;">XXYYXX</label>
							</div>
							<input type="text" class="col-xs-3 col-md-2 input_pad inputoption" style="margin-top:5px;margin-right:2px;margin-left:-6px!important;height:41px;" placeholder="Product or service name" />
							<input type="number" class="col-xs-3 col-md-2 input_pad inputoption_2"  style="margin-top:5px;margin-right:2px;text-align:center;height:41px;" placeholder="Price" />
							<textarea class="col-xs-3 col-md-4 input_pad inputoption_desc" style="margin-bottom:10px; height:43px;top:4px;" placeholder="Description"></textarea>
							<button class="col-md-1 col-xs-1" style="height:40px;padding-top:5px;margin-top:5px; border: 1px solid #F0F0F0;" onclick="removeSwitchOptionDropdown(this)" ><span style="margin-left:-3px">X</button></span>
						</div>
					</div>
					<div class="col-lg-12 col-md-12 col-xs-12" style="padding: 10px;margin-bottom: 4px;margin-top: 15px;text-align:center;">
						<!-- This creates space for the add option button -->
					</div>
					<a href="javascript:void(0)" onClick="addOptiontoSelect(this)" class="crossnadd" style="margin-top:5px;margin-bottom:20px;">[+] Add A Product / Service Option </a>
					<div class="warning" style="padding-bottom:20px;"></div>
				</div>
			</div>
			<!-- End of Dropdown Element -->
			<!-- Start of Comment Box Element -->
			<div id="comment_option" style="display: none; background-color:#fff;">
				<div style="clear: both;"></div>
				<hr style="margin:15px;">
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)" style="">x</button>
				<button class="collapsible">Comment Box</button>
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)" style="width:10%;">-</button>
				<div class="content scc_comment_box" value="comment_option" style="background:white !important;">
					<div class=" selopt5 col-xs-12 col-md-12" style="margin-top:30px;background:white;width: 99%;">
						<div class="col-xs-12 col-md-12">
							<label class="scc_label col-xs-2 col-md-2" style="text-align:right;margin-top:-18px;" placeholder="Height">Mandatory </label>
							<input type="checkbox" class="col-xs-2 col-md-5 scc_mandatory_comment" style="margin-top:0px;height:30px;width:30px;border-color:#F0F0F0;" name="scc_mandatory_comment" title="Select this option to make it Mandatory" value="yes">
						</div>
						<div class="col-xs-12 col-md-12" style="margin-top:5px;">
							<label class="scc_label col-xs-2 col-md-2" style="margin-top:-10px;text-align:right;" placeholder="Height">Height</label>
							<input type="number" class="col-xs-2 col-md-5 input_pad inputoption_2"  style="text-align:center;margin-top:5px;margin-right:10px;width:80px;height:40px" placeholder="rows" value="4"/>
						</div>
						<div class="col-xs-12 col-md-12" style="margin-top:5px;">
							<label class="scc_label col-xs-2 col-md-2" style="margin-top:-10px;text-align:right;">Title</label>
							<input type="text" class="col-xs-12 col-md-5 input_pad inputoption_title" style="margin-top:5px;height:40px;width:270px" placeholder="Title">
						</div>
						<div class="col-xs-12 col-md-12" style="margin-top:10px;">
							<label class="scc_label col-xs-2 col-md-2" style="margin-top:-15px;text-align:right;">Placeholder</label>
							<textarea class="col-xs-12 col-md-5 input_pad inputoption_desc" style="height:40px;width:270px" rows="1" placeholder="Box PlaceHolder"></textarea>
						</div>
					</div>
				</div>
				<div class="warning" style="padding-top:20px;"></div>
				<div style="clear: both;"></div>
			</div>
			<!-- End of Comment Box Element -->
			<!-- Start of Number Input Box Element -->
			<div id="number_option" style="display: none;background-color:#fff; ">
				<div style="clear: both;"></div>
				<hr style="margin:15px;">
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onClick="removeField2(this)" style="">x</button>
				<button class="collapsible" style="padding:0px;">Number Input Box</button>
				<button id="close-btn" class="collapsible" href="javascript:void(0)" onclick="colla(this)" style="width:10%;">-</button>
				<div class="content scc_number_box" value="number_option" style="background:white !important;">
					<div class="selopt5 col-xs-12 col-md-12" style="padding-top:30px;background:white;width: 99%;">
						<div class="col-xs-12 col-md-12">
							<label class="scc_label col-xs-2 col-md-2" style="margin-top:-18px;text-align:left;">Mandatory</label>
							<input class="col-xs-5 col-md-5" type="checkbox" class="scc_mandatory_number" style="margin-top:0px;height:30px;width:30px;border-color:#F0F0F0;" name="scc_mandatory_number" title="Select this option to make it Mandatory" value="yes">
						</div>
						<label class="scc_label  col-xs-2 col-md-2" style="margin-right: 15px;text-align:right;">Title</label>
						<input type="text" class="col-xs-12 col-md-6 input_pad inputoption_title" style="margin-top:10px;margin-left:-2px;height:41px;width:270px" placeholder="Title">
					</div>
					<!-- Dropdown selection MIKE -->
					<div class="selectoption_2 col-xs-12 col-md-12" style="background:white; padding-bottom: 20px;width:100%;">
						<div class="selopt3" style="padding-top:10px; margin-bottom: 5px; margin-top:-7px;">
							<div class="col-xs-12 col-md-12">
								<label class="scc_label col-xs-2 col-md-2" style="margin-top:-8px;text-align:right;" placeholder="Unit Value">Unit Value</label>
								<input type="number" class="col-xs-2 col-md-5 input_pad inputoption_2"  style="margin-top:5px;margin-right:10px;width:80px;height:40px" placeholder="rows" value="1" min="0"/>
							</div>
						</div>
						<div class="warning"></div>
					</div>
					<!--	<a href="javascript:void(0)" onClick="addOptiontoSelect(this)" class="crossnadd" style="margin-top:10px;margin-bottom:20px;">+ Add Option </a> -->
				</div>
				<div class="warning" style="padding-top:20px;"></div>
				<div style="clear: both;"></div>
			</div>
			<!-- End of Number Box Element -->
			<!-- BELOW CODE DEPRRCTATED? -->
			<li id='form-line' style="display: none">
				<hr style="margin:15px;">
				<div class="BodyOption">
					<label class="scc_label" style="padding-left: 20px;width:30%;text-align:left;">Input Type</label>
					<select onchange="getFieldOptionx(this)" class="getfieldoptionx " style="width:50%;min-width:50%;margin-top:20px;" >
						<option value=""></option>
						<option value="dropdowninput">Dropdown Menu</option>
						<option value="switchinput">Checkbox</option>
						<!--<option value="simplebuttons">Simple Buttons</option>-->
						<!-- <option value="addSlider(this)">Combind Slide</option> -->
					</select>
					<div style="clear: both;"></div>
				</div>
			</li>
			<!-- ABOVE CODE DEPRECTATED? -->
			<div class="scc_wrapper"><div style="clear: both;" id="previewInputsAdd" class="scc_wrapper"></div></div>
			<div id="scc-demover" data-demo="<?php echo esc_html(get_option('scc_licensed'));?>"></div>
		</div>
		<!-- Start Preview -->
		<?php if(isset($_REQUEST["id"]) && $_REQUEST["id"]){ ?>
			<div class="col-xs-12 col-md-6 col-lg-6">
				<div style="background:#f8f9ff;padding:21px;display:block;clear:both;border: 0px dotted #E2E2E2;max-width:842px;" id="myPREVIEW" class="scc_wrapper scc_preview_backend">
					<div class="xxx" style="padding-bottom:20px;margin-top:20px;"><div class="purple_bar" style="text-align:center;">Preview Panel</div></div>
					<?php $license_enable = get_option('scc_licensed');
					if($license_enable == 1){
						?>
						<label class="scc_label" style="text-align: middle;"><a  data-tooltip="Changes will be saved" style="pointer-events: none;15px;" class="scc_button save_button  tooltipadmin-right" href="javascript:void(0)" onClick="saveFields(true, <?php echo count($results) ?>,<?php echo isset($allinputstoadd)  ? 'true' : 'false' ?> , false)">Refresh</a></label>
						<?php
					}
					if($license_enable == 0 || !isset($license_enable)){
						?>
						<label class="scc_label" style="text-align: middle;"><a data-tooltip="Changes will be saved"  style="pointer-events: none;padding:15px;" class="scc_button save_button tooltipadmin-right" href="javascript:void(0)" onClick="saveFields(false, <?php echo count($results) ?>,<?php echo isset($allinputstoadd) && is_array($allinputstoadd) && sizeof($allinputstoadd)  > 0 ? 'true' : 'false' ?> , false)">Refresh </a></label>
						<?php
					}
					?>
					<?php echo do_shortcode('[scc_calculator type="text" idvalue="'.$_REQUEST["id"].'"]');?>
				</div>
			</div>
		<?php } ?>
	</div>
	<script>
		let formFieldsArray = <?php echo isset($parameters->formFieldsArray) ? $parameters->formFieldsArray : "[]"; ?>;
		function addElementButton(element){
			jQuery(element).parent().parent().remove()
		}
		function accordionIconClick(settingsIcon){
			jQuery(settingsIcon).find('.scc-accordion-container').each(function(index, ob){
				jQuery(ob).toggleClass('scc-accordion-tooltip-hidden')
			})
		}    jQuery(document).ready(function(){
			var previewModalOpenned = false
			jQuery('#scc-wp-footer').css('position', 'absolute')
			jQuery('.scc_preview_calculator').click(function(){
				//	if(!previewModalOpenned){
				//	}
				/*
					var x = document.getElementById("myPREVIEW");
					if (x.style.display === "none") {
					x.style.display = "block";
					} else {
					x.style.display = "none";
					}
					*/
				});
		});
	</script>
	<!-- End Preview -->
</div>
<br>
<!-- ******************************************************* -->
<div class="col-md-12" style="margin-top:10px;display:none;">
	<!--<label class="scc_label col-xs-12 col-md-1" style="text-align: left;"><a class="scc_button" href="javascript:void(0)" onClick="resetFields()">RESET</a></label>-->
	<?php $license_enable = get_option('scc_licensed');
	global $wpdb;
	$results = $wpdb->get_results("SELECT * FROM {$wpdb->prefix}scc_forms");
	if($license_enable == 1){
		if (isset($_GET['id']) && is_numeric($_GET['id']) && $_GET['id'] > 0){
			?>
			<label class="scc_label" style="text-align: left;"><a style="pointer-events: none;" class="scc_button save_button " href="javascript:void(0)" onClick="saveFields(true, <?php echo count($results) ?>,<?php echo isset($allinputstoadd)  ? 'true' : 'false' ?> , false)"> <i class="fas fa-user"></i>SAVE</a></label>
			<label class="scc_label " style="text-align: left;padding-left: 0px!important;"><a class="scc_button" href="javascript:void(0)" onClick="downloadBackup()">BACKUP</a></label>
			<a id="downloadAnchorElem"></a>
			<?php
		}else{
			?>
			<label class="scc_label" style="text-align: left;"><a  style="pointer-events: none;" class="scc_button save_button " href="javascript:void(0)"  onClick="saveFields(true, <?php echo count($results) ?>,<?php echo isset($allinputstoadd) && is_array($allinputstoadd) && sizeof($allinputstoadd)  > 0 ? 'true' : 'false' ?> , false)"><i class="fas fa-user"></i>SAVE</a></label>
			<?php
		}
	}else if($license_enable == 0 || !isset($license_enable)){
		?>
		<label class="scc_label" style="text-align: left;"><a  style="pointer-events: none;" class="scc_button save_button " href="javascript:void(0)"  onClick="saveFields(false, <?php echo count($results) ?>,<?php echo isset($allinputstoadd) && is_array($allinputstoadd) && sizeof($allinputstoadd)  > 0 ? 'true' : 'false' ?> , false)"><i class="fas fa-user"></i>SAVE</a></label>
		<label class="scc_label " style="text-align: left;padding-left: 0px!important;"><a class="scc_button tooltipadmin-right" href="javascript:void(0)" data-tooltip="To get this feature, please become Premium. Thank you">BACKUP</a></label>
		<?php
	}
	?>
	<div id="preview_modal_section"></div>
</div>
<script >
	UTF8 = {
		encode: function(s){
			for(var c, i = -1, l = (s = s.split("")).length, o = String.fromCharCode; ++i < l;
				s[i] = (c = s[i].charCodeAt(0)) >= 127 ? o(0xc0 | (c >>> 6)) + o(0x80 | (c & 0x3f)) : s[i]
				);
				return s.join("");
		},
		decode: function(s){
			for(var a, b, i = -1, l = (s = s.split("")).length, o = String.fromCharCode, c = "charCodeAt"; ++i < l;
				((a = s[i][c](0)) & 0x80) &&
				(s[i] = (a & 0xfc) == 0xc0 && ((b = s[i + 1][c](0)) & 0xc0) == 0x80 ?
					o(((a & 0x03) << 6) + (b & 0x3f)) : o(128), s[++i] = "")
				);
				return s.join("");
		}
	}
	function downloadBackup(){
		$fragment_refresh = {
			url: rt_vars.rt_urlajax,
			type: 'POST', //jQuery('#previewInputsAdd').html().trim()
			data: {
				action: 'sccDownloadBackup',
				id: <?php echo (isset($_GET['id']) && is_numeric($_GET['id']) && $_GET['id'] > 0) ? $_GET['id'] : 0 ?>
			},
			success: function( data ) {
				var dataStringified = JSON.stringify(data)
				if(dataStringified[dataStringified.length -2] === "0"){
					dataStringified = dataStringified.substring(0, dataStringified.length -2)
					dataStringified += "\'"
				}
				dataStringified = dataStringified.replace(/\\\\/g, "");
				dataStringified = dataStringified.replace(/\\\\/g, "");
				dataStringified = dataStringified.replace(/\\\\/g, "");
				dataStringified = dataStringified.replace(/\"/g, "\'");
				dataStringified = dataStringified.replace(/\\\'/g, "\"");
				dataStringified = dataStringified.replace(/\"{/g, "{");
				dataStringified = dataStringified.replace(/\"\[/g, "[");
				dataStringified = dataStringified.replace(/}\"/g, "}");
				dataStringified = dataStringified.replace(/\]\"/g, "]");
				dataStringified[dataStringified.length - 1] = "\'"
				dataStringified = dataStringified.substring(1,dataStringified.length - 1 )
				dataStringified = dataStringified.replace(/u0/g, "\\u0");
				var jsonData = JSON.parse(dataStringified)
				var iterateData = function(obj) {
					if(typeof obj === 'object'){
						for(var i in obj) {
							if(obj.hasOwnProperty(i)){
								if(typeof obj[i] === 'object'){
									iterateData(obj[i])
									return;
								}else{
									obj[i] = decodeURIComponent(obj[i]);
								}
							}
						}
					}
				}
				iterateData(jsonData)
				var dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(jsonData))	;
				var sccName = 'No name.json'
				try{
					sccName = jsonData.scc_form.formname + '.json'
				}catch(err){
				}
				/*
					if(dataStringified.indexOf('formname') != 1){
					sccName = dataStringified.split('formname')[1]
					if(sccName && typeof sccName === 'string'){
					sccName = sccName.split(',')[0]
					sccName = sccName.replace(/_/g, "");
					}
					}
					*/
					var a = document.getElementById('downloadAnchorElem');
					a.setAttribute("href",     dataStr     );
					var json = JSON.stringify(jsonData),
					blob = new Blob([json], {type: "octet/stream"}),
					url = window.URL.createObjectURL(blob);
					a.href = url;
					a.download = sccName;
					a.click();
				//			window.URL.revokeObjectURL(url);
				//			dlAnchorElem.setAttribute("download", sccName + ".json");
				//				dlAnchorElem.click();
			}
		};
		jQuery.ajax( $fragment_refresh );
	}
	function previewModal(){
		previewModalOpenned = true
		var code = ""
		code += '<div id="preview_modal" class="scc-modal-2020 fade"  role="dialog">'
		code += '	<div class="scc-modal-dialog-2020" style="width: 100%;  margin: 0;padding: 0;">'
		code += '		<div class="scc-modal-content-2020" style="height:550px; margin-top: 330px;margin-left: 70px; border-radius: 0;width:70%">'
		code += '		<div class="scc-modal-header-2020">'
		code += '			<button type="button" class="close" data-dismiss="modal">&times;</button>'
		code += '			<h3 class="scc-modal-title-2020">PREVIEW CALCULATOR (Draggable)</h3>'
		code += '		</div>'
		code += '		<div class="scc-modal-body-2020" style="height: 90%; overflow: hidden;overflow-y: scroll">'
		code += jQuery('#myPREVIEW').html()
		code += '		</div>'
		code += '		</div>'
		code += '	</div>'
		code += '</div>'
		jQuery('#preview_modal_section').html(code)
		jQuery('#preview_modal').modal('show')
		//		$('.scc-modal-content-2020').resizable({
		//alsoResize: ".scc-modal-dialog-2020",
		//			minHeight: 300,
		//			minWidth: 300
		//		});
		//	$('.scc-modal-dialog-2020').draggable();
	}
	function closePreviewModal(){
		jQuery('#preview_modal').modal('hide')
		jQuery('#preview_modal').modal('hide')
		setTimeout(() => {
			jQuery('#preview_modal').remove()
			jQuery('#preview_modal_section').html('')
			jQuery('.modal-backdrop').each((index, element) => {
				jQuery('#preview_modal').modal('hide')
				element.remove()
				jQuery(element).remove()
				setTimeout(() => {
					jQuery('#preview_modal').modal('hide')
					jQuery('#preview_modal').modal('hide')
				}, 1000);
			});
		}, 1000);
		previewModalOpenned = false
	}
	var scc_currency = "<?php echo htmlspecialchars(stripslashes(sanitize_text_field(get_option('scc_currency')))) ?>";
	function removeSwitchOption(element){
		if(element && element.parentNode && element.parentNode.parentNode){
			element.parentNode.parentNode.remove();
		}else{
			element.parentNode.remove();
		}
	}
	function removeSwitchOptionDropdown(element){
		element.parentNode.remove();
	}
	function openModalPaypalForm(){
		if(jQuery('#paypal_checkbox').prop('checked')){
			var code = ""
			code += '    <div id="modalPaypalForm" class="scc-modal-2020 fade" role="dialog" data-backdrop="static" data-keyboard="false" >'
			code += '        <div class="scc-modal-dialog-2020" style="width:560px;top:250px;">'
			code += '          <div class="scc-modal-content-2020">'
			code += '            <div class="scc-modal-header-2020">'
			code += '             <button type="button" class="close" data-dismiss="modal">&times;</button>'
			code += '             <h4 class="scc-modal-title-2020">Paypal Form</h4>'
			code += '            </div>'
			code += '            <div class="scc-modal-body-2020" style="margin-top:<?php echo isset($parameters) && is_array($parameters) && count($parameters)  > 0 ? '280px' : '0px' ?>;  ">'
			code += '              <p></p>'
			code += '               <div class="form-group">'
			code += '                   <label for="paypal_email_form">Email address(Business Paypal email mandatory!):</label>'
			code += '                   <input type="email" class="form-control" id="paypal_email_form" required>'
			code += '               </div>'
			code += '               <div class="form-group">'
			code += '                    <label for="paypal_shopping_cart_name_form">Shopping cart name:</label>'
			code += '                    <input type="text" class="form-control" id="paypal_shopping_cart_name_form">'
			code += '               </div>'
			code += '               <div class="form-group">'
			code += '                    <label for="paypal_currency_form">Currency:</label>'
			code += '                    <select class="form-control" id="paypal_currency_form" required>'
			code += '                        <option value="0">Select Currency</option>'
			code += '                        <option value="AUD">Australian Dollar</option>'
			code += '                        <option value="BOB">Bolivian boliviano</option>'
			code += '                        <option value="BRL">Brazilian Real </option>'
			code += '                        <option value="CAD">Canadian Dollar</option>'
			code += '                        <option value="CZK">Czech Koruna</option>'
			code += '                        <option value="DKK">Danish Krone</option>'
			code += '                        <option value="EGP">Egyptian Pound</option>'
			code += '                        <option value="EUR">Euro</option>'
			code += '                        <option value="HKD">Hong Kong Dollar</option>'
			code += '                        <option value="ILS">Israeli New Sheqel</option>'
			code += '                        <option value="INR">Indian Rupee</option>'
			code += '                        <option value="JPY">Japanese Yen</option>'
			code += '                        <option value="MYR">Malaysian Ringgit</option>'
			code += '                        <option value="MXN">Mexican Peso</option>'
			code += '                        <option value="ANG">Netherlands Antillean Guilder</option>'
			code += '                        <option value="NOK">Norwegian Krone</option>'
			code += '                        <option value="NZD">New Zealand Dollar</option>'
			code += '                        <option value="PHP">Philippine Peso</option>'
			code += '                        <option value="PLN">Polish Zloty</option>'
			code += '                        <option value="GBP">British Pound Sterling</option>'
			code += '                        <option value="RON">Romanian leu</option>'
			code += '                        <option value="RUB">Russian Rubles</option>'
			code += '                        <option value="SGD">Singapore Dollar</option>'
			code += '                        <option value="SEK">Swedish Krona</option>'
			code += '                        <option value="CHF">Swiss Franc</option>'
			code += '                        <option value="KRW">South Korean won</option>'
			code += '                        <option value="TWD">Taiwan New Dollar</option>'
			code += '                        <option value="THB">Thai Baht</option>'
			code += '                        <option value="USD" >U.S. Dollar</option>'
			code += '                     </select>'
			code += '                </div>'
			code += '                <div id="paypal_modal_form_no_valid_fields_message" style="color:red"></div>'
			code += '            </div>'
			code += '            <div class="modal-footer">'
			code += '              <button type="button" class="btn btn-default" data-dismiss="modal" onclick="cancelModalButton()">Cancel</button>'
			code += '              <button type="button" class="btn btn-primary" onclick="paypalFormValidation()">Accept</button>'
			code += '            </div>'
			code += '           </div>'
			code += '        </div>'
			code += '      </div>'
			jQuery('#paypal_modal').html(code)
			jQuery('#modalPaypalForm').modal('show')
			jQuery('#paypal_currency').children('option').each( function() {
				if(jQuery(this).val() === scc_currency){
					jQuery(this).prop('selected', true)
				}
			});
		}else{
			jQuery('#paypal_fields').html('')
			jQuery('#paypal_form_result').html('')
		}
	}
	function cancelModalButton(){
		jQuery('#paypal_checkbox').prop( "checked", false )
		jQuery('#modalPaypalForm').modal('hide')
	}
	function paypalFormValidation(){
		var paypalEmail = jQuery('#paypal_email_form').val()
		var paypalShoppingCartName = jQuery('#paypal_shopping_cart_name_form').val()
		var paypalCurrency = ""
		jQuery.each(jQuery("#paypal_currency_form option:selected"), function(){
			paypalCurrency = jQuery(this).val()
		})
		var noValidMessage = false
		if(paypalEmail == null || typeof paypalEmail == "undefined" || paypalEmail.length < 5
			|| paypalEmail.indexOf("@") == -1 || paypalEmail.indexOf(".") == -1 ){
			noValidMessage = "Invalid Email!"
	}
	if(paypalShoppingCartName == null || typeof paypalShoppingCartName == "undefined"
		|| paypalShoppingCartName.length < 2
		){
		noValidMessage === false ? noValidMessage = " | Invalid Shopping card Name!" : noValidMessage += " | Invalid Shopping card Name!"
}
if(paypalCurrency == null || typeof paypalCurrency == "undefined" || paypalCurrency == "0"){
	noValidMessage === false ? noValidMessage = " | Select a Currency!" : noValidMessage += " | Select a Currency!"
}
if(!noValidMessage){
	var paypal_form_result = ""
	paypal_form_result += "<ul>"
	paypal_form_result += " <li>"
	paypal_form_result += "Email: " + paypalEmail
	paypal_form_result += " </li>"
	paypal_form_result += " <li>"
	paypal_form_result += "Shopping Cart Name: " + paypalShoppingCartName
	paypal_form_result += " </li>"
	paypal_form_result += " <li>"
	paypal_form_result += "Currency: " + paypalCurrency
	paypal_form_result += " </li>"
	paypal_form_result += " </ul>"
	jQuery('#paypal_form_result').html(paypal_form_result)
	var paypal_fields = ""
	paypal_fields += "<input type='hidden' id='paypal_email' value='" + paypalEmail + "'/>"
	paypal_fields += "<input type='hidden' id='paypal_shopping_cart_name' value='" + paypalShoppingCartName + "'/>"
	paypal_fields += "<input type='hidden' id='paypal_currency' value='" + paypalCurrency + "'/>"
	jQuery('#paypal_fields').html(paypal_fields)
	jQuery('#modalPaypalForm').modal('hide')
}else{
	jQuery('#paypal_modal_form_no_valid_fields_message').html(noValidMessage.replace('false', ''))
}
}
function checkPluginCacheHasBeenLoaded(){
	var ss = document.styleSheets
	var cacheCssLinkExists = false
	var scriptsCacheExists = false
	for(var i=0; i< ss.length; i++){
		if(ss[i].href && ss[i].href.indexOf("cache") != -1){
			cacheCssLinkExists = true
			break
		}
	}
	var scripts = document.querySelectorAll('script')
	for(var i=0; i< scripts.length; i++){
		if(scripts[i].src && scripts[i].src.indexOf("cache") != -1){
			scriptsCacheExists = true
			break
		}
	}
	if(cacheCssLinkExists || scriptsCacheExists){
		jQuery('#cache_message').css('display', 'block')
	}
}
function removeCacheMessage(object){
	if(object && jQuery(object) && jQuery(object).parent()){
		jQuery(object).parent().remove()
	}
}
</script>
<!--- ********************************************************************************************************************************* -->
<?php
include_once SCC_DIR . '/admin/logo-footer.php';
?>
<!--- ********************************************************************************************************************************* -->
<?php } ?>
<!-- JS for section and subsection initial display-->
<script>
	jQuery(function($){
		$('.scc_new_sec').click();
		$('.scc_new_subsec').click();
		$('button[value="dropdowninput"]:eq(0)').click();
		$('.input_pad.sectiontitle:eq(0)').val('Section Title');
		$('.sectionDescription:eq(0)').val('Section description');
		$('.input_pad.inputoption_title:eq(0)').val('Default Dropdown');
		$('.col-xs-3.col-md-2.input_pad.inputoption:eq(0)').val('Default Product');
		$('.col-xs-3.col-md-2.input_pad.inputoption_2:eq(0)').val('3');
		$('.col-xs-3.col-md-4.input_pad.inputoption_desc:eq(0)').val('Product description');
	})
</script>
<!-- JS for section  and subsection initial display-->
<!-- JS for Video Tutorials BTN --->
<script>
	// Get the modal
	var modalvideoSCC = document.getElementById('myModalVideosSCC');
	// Get the button that opens the modal
	var btnvideoSCC = document.getElementById("myBtnVideosSCC");
	// Get the <span> element that closes the modal
	var spanvideoSCC = document.getElementsByClassName("closevideoSCC")[0];
	// When the user clicks the button, open the modal
	btnvideoSCC.onclick = function() {
		modalvideoSCC.style.display = "block";
	}
	// When the user clicks on <span> (x), close the modal
	spanvideoSCC.onclick = function() {
		modalvideoSCC.style.display = "none";
	}
	// When the user clicks anywhere outside of the modal, close it
	window.onclick = function(event) {
		if (event.target == modalvideoSCC) {
			modalvideoSCC.style.display = "none";
		}
	}
</script>
<script>
	// Get the modal
	var modalsupportSCC = document.getElementById('myModalSupportSCC');
	// Get the button that opens the modal
	var btnsupportSCC = document.getElementById("myBtnSupportSCC");
	// Get the <span> element that closes the modal
	var spansupportSCC = document.getElementsByClassName("closesupportSCC")[0];
	// When the user clicks the button, open the modal
	if (btnsupportSCC) {
		btnsupportSCC.onclick = function() {
			modalsupportSCC.style.display = "block";
		}
	}
	// When the user clicks on <span> (x), close the modal
	spansupportSCC.onclick = function() {
		modalsupportSCC.style.display = "none";
	}
	// When the user clicks anywhere outside of the modal, close it
	window.onclick = function(event) {
		if (event.target == modalsupportSCC) {
			modalsupportSCC.style.display = "none";
		}
	}
</script>
