

/**

 * This file adds some LIVE to the Theme Customizer live preview. To leverage

 * this, set your custom settings to 'postMessage' and then add your handling

 * here. Your javascript should grab settings from customizer controls, and 

 * then make any necessary changes to the page using jQuery.

 */

(function ($) {



	//Icon left

	wp.customize('fl_settings[fl_left_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_left_icon');

			if ($('.fl_prev_icon').hasClass('disabled')) {




				if (newval.indexOf("dashicons") > -1) {

					$('.floating_next_prev_wrap.fl_primary_bar.fl_primary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon disabled " + newval);

				}

				else {

					$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon fa  disabled  fa-" + newval);

				}



			}

			else if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon  " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon fa  fa-" + newval);

			}







		});

	});



	//Icon right

	wp.customize('fl_settings[fl_right_icon]', function (value) {



		value.bind(function (newval) {

			if ($('.fl_next_icon').hasClass('disabled')) {




				if (newval.indexOf("dashicons") > -1) {

					$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon disabled " + newval);

				}

				else {

					$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon fa  disabled  fa-" + newval);

				}



			}

			else if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon  " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon fa  fa-" + newval);

			}



		});

	});





	//Icon Random

	wp.customize('fl_settings[fl_random_icon]', function (value) {



		value.bind(function (newval) {

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_random_icon').removeAttr('class').addClass("fl_random_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_random_icon').removeAttr('class').addClass("fl_random_icon fa fa-" + newval);

			}



		});

	});



	//Icon top

	wp.customize('fl_settings[fl_up_icon]', function (value) {



		value.bind(function (newval) {

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_top_icon').removeAttr('class').addClass("fl_top_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_top_icon').removeAttr('class').addClass("fl_top_icon fa  fa-" + newval);

			}

		});

	});



	//Icon bottom

	wp.customize('fl_settings[fl_down_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_bottom_icon').removeAttr('class').addClass("fl_bottom_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_bottom_icon').removeAttr('class').addClass("fl_bottom_icon fa  fa-" + newval);

			}



		});

	});



	//Icon home

	wp.customize('fl_settings[fl_home_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_home_icon').removeAttr('class').addClass("fl_home_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_home_icon').removeAttr('class').addClass("fl_home_icon fa  fa-" + newval);

			}



		});

	});





	//Icon copy url

	wp.customize('fl_settings[fl_copy_url_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_copy_url_icon').removeAttr('class').addClass("fl_copy_url_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_copy_url_icon').removeAttr('class').addClass("fl_copy_url_icon fa  fa-" + newval);

			}



		});

	});





	//Icon Slimmer

	wp.customize('fl_settings[fl_slimer_close_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimmer_icon').removeAttr('class').addClass("fl_slimmer_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimmer_icon').removeAttr('class').addClass("fl_slimmer_icon fa  fa-" + newval);

			}



		});

	});





	//Icon open

	wp.customize('fl_settings[fl_slimer_open_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_close_icon ').removeAttr('class').addClass("fl_slimer_close_icon  " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_close_icon ').removeAttr('class').addClass("fl_slimer_close_icon  fa  fa-" + newval);

			}



		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_bg_color]', function (value) {



		value.bind(function (newval) {

			// Use style tag instead of inline style to allow hover states to work
			$('style[data-fl-primary-base-bg]').remove();
			$('<style data-fl-primary-base-bg>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap{background-color:' + newval + ';}</style>').appendTo('head');

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_position]', function (value) {



		value.bind(function (newval) {



			jQuery('.floating_next_prev_wrap.fl_primary_bar').attr('class', 'floating_next_prev_wrap fl_primary_bar');



			jQuery('.floating_next_prev_wrap.fl_primary_bar').addClass('fl_' + newval);

			// Preserve current customization settings before resetting styles
			var currentBgColor = wp.customize('fl_settings[fl_bg_color]') ? wp.customize('fl_settings[fl_bg_color]').get() : null;
			var currentColor = wp.customize('fl_settings[fl_color]') ? wp.customize('fl_settings[fl_color]').get() : null;
			var currentIconSize = wp.customize('fl_settings[fl_icon_size]') ? wp.customize('fl_settings[fl_icon_size]').get() : null;
			var currentSeparatorColor = wp.customize('fl_settings[fl_seprator_color]') ? wp.customize('fl_settings[fl_seprator_color]').get() : null;

			// Check if the bar is currently closed before resetting styles
			var $innerWrap = $('#fl_inner_primary_wrap');
			var $minimizer = $('.fl_primary_bar .fl_slimer_Wrap');
			var isCurrentlyClosed = $minimizer.hasClass('fl-close');

			// Reset ALL inline styles to ensure consistent styling across position changes
			// This prevents style leakage from previous positions
			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').attr('style', '');
			$('.floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .disabled').attr('style', '');
			$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap').attr('style', '');
			$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap .fl-wrapper').attr('style', '');
			$('.floating_next_prev_wrap.fl_primary_bar .fl_slimer_Wrap').attr('style', '');
			$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').attr('style', '');
			$('.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child').attr('style', '');

			// Re-apply preserved customization settings after style reset
			// Use <style> tags instead of inline styles to allow hover states to work properly
			// Inline styles have highest specificity and can block :hover rules even with !important
			
			// Remove existing base style tags first
			$('style[data-fl-primary-base-bg]').remove();
			$('style[data-fl-primary-base-color]').remove();
			$('style[data-fl-primary-base-size]').remove();
			$('style[data-fl-primary-base-border]').remove();
			
			if (currentBgColor) {
				$('<style data-fl-primary-base-bg>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap{background-color:' + currentBgColor + ';}</style>').appendTo('head');
			}
			if (currentColor) {
				$('<style data-fl-primary-base-color>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap{color:' + currentColor + ';}</style>').appendTo('head');
			}
			if (currentIconSize) {
				$('<style data-fl-primary-base-size>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap, #fl_slimer_primary_wrap i{font-size:' + currentIconSize + 'px;}</style>').appendTo('head');
			}
			if (currentSeparatorColor) {
				$('<style data-fl-primary-base-border>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap{border-color:' + currentSeparatorColor + ';}</style>').appendTo('head');
			}

			// Reset flex-direction to column by default (will be overridden for top/bottom center)
			// This ensures proper layout when switching from horizontal (top/bottom) to vertical positions
			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({
				'flex-direction': 'column',
				'width': ''
			});
			$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap').css({
				'flex-direction': 'column'
			});
			$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap .fl-wrapper').css({
				'flex-direction': 'column'
			});

		if (newval == 'left') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'left': '0',

				'transform': 'translate(0px, -50%)',

				'bottom': 'auto',

				'right': 'auto',

				'top': '50%',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'left': '105%'

				});



			}



		else if (newval == 'left_top') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'left': '0',

				'transform': 'translate(0, 0)',

				'bottom': 'auto',

				'right': 'auto',

				'top': '0',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'left': '105%'

				});



			}



		else if (newval == 'left_bottom') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'left': '0',

				'transform': 'translate(0, 0)',

				'bottom': '0',

				'right': 'auto',

				'top': 'auto',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'left': '105%'

				});



			}



		else if (newval == 'right') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'right': '0',

				'left': 'auto',

				'transform': 'translate(0px, -50%)',

				'bottom': 'auto',

				'top': '50%',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'right': '105%',

					'left': 'auto'

				});



			}



		else if (newval == 'right_top') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'right': '0',

				'left': 'auto',

				'transform': 'translate(0, 0)',

				'bottom': 'auto',

				'top': '0',

			});



			}





		else if (newval == 'right_bottom') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'right': '0',

				'left': 'auto',

				'transform': 'translate(0, 0)',

				'bottom': '0',

				'top': 'auto',

			});

			

			}



			else if (newval == 'bottom') {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

					'bottom': '0',

					'left': '50%',

					'right': '0',

					'transform': 'translate(-50%, 0)',

					// Horizontal layout: match social icons bar (row + fit-content)
					'display': 'flex',

					'flex-direction': 'row',

					'width': 'fit-content',

					'top': 'auto'

				});
				// Set inner wrap to horizontal layout for top/bottom center positions
				$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap').css({
					'flex-direction': 'row'
				});
				$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap .fl-wrapper').css({
					'flex-direction': 'row'
				});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '-55px'

				});

			}



		else if (newval == 'bottom_left') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'bottom': '0',

				'left': '0',

				'right': 'auto',

				'transform': 'translate(0, 0)',

				'display': 'inline-table',

				'top': 'auto',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '-55px',

					'left': '0'

				});

			}



		else if (newval == 'bottom_right') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'bottom': '0',

				'left': 'auto',

				'right': '0',

				'transform': 'translate(0, 0)',

				'display': 'inline-table',

				'top': 'auto',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '-55px'

				});

			}



			else if (newval == 'top') {

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

					'top': '0',

					'transform': 'translate(-50%, 0)',

					// Horizontal layout: match social icons bar (row + fit-content)
					'display': 'flex',

					'flex-direction': 'row',

					'width': 'fit-content',

					'bottom': 'auto',

					'left': '50%',

					'right': '0'

				});
				// Set inner wrap to horizontal layout for top/bottom center positions
				$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap').css({
					'flex-direction': 'row'
				});
				$('.floating_next_prev_wrap.fl_primary_bar .fl_inner_wrap .fl-wrapper').css({
					'flex-direction': 'row'
				});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '0'

				});



			}



		else if (newval == 'top_right') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'left': 'auto',

				'transform': 'translate(0, 0)',

				'display': 'inline-table',

				'bottom': 'auto',

				'top': '0',

				'right': '0',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '0'

				});



			}



		else if (newval == 'top_left') {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css({

				'left': '0',

				'transform': 'translate(0, 0)',

				'display': 'inline-table',

				'bottom': 'auto',

				'top': '0',

				'right': 'auto',

			});

				$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '0',

					'left': '105%'

				});



			}

			// Restore closed state if the bar was closed before position change
			if (isCurrentlyClosed) {
				var isHorizontal = newval == 'top' || newval == 'bottom';
				$innerWrap.css(isHorizontal ? {
					'display': 'none',
					'width': '0',
					'overflow': 'hidden'
				} : {
					'display': 'none'
				});
				$minimizer.addClass('fl-close');
			} else {
				$minimizer.removeClass('fl-close');
			}

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_hover_bg_color]', function (value) {



		value.bind(function (newval) {

			// Remove existing hover bg style tag to prevent accumulation
			$('style[data-fl-primary-hover-bg]').remove();
			$('<style data-fl-primary-hover-bg>.floating_next_prev_wrap.fl_primary_bar .floating_links a:hover, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap:hover{background-color:' + newval + ' !important;}</style>').appendTo('head');

		});

	});





	//Update site link color in real time...

	wp.customize('fl_settings[fl_color]', function (value) {

		value.bind(function (newval) {

			// Use style tag instead of inline style to allow hover states to work
			$('style[data-fl-primary-base-color]').remove();
			$('<style data-fl-primary-base-color>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap{color:' + newval + ';}</style>').appendTo('head');

		});

	});



	//Update site link color in real time...

	wp.customize('fl_settings[fl_icon_hover_color]', function (value) {

		value.bind(function (newval) {

			// Remove existing hover color style tag to prevent accumulation
			$('style[data-fl-primary-hover-color]').remove();
			$('<style data-fl-primary-hover-color>.floating_next_prev_wrap.fl_primary_bar .floating_links a:hover{color:' + newval + ' !important;}</style>').appendTo('head');

		});

	});



	//Update site link color in real time...

	wp.customize('fl_settings[fl_icon_size]', function (value) {

		value.bind(function (newval) {

			// Use style tag instead of inline style for consistency
			$('style[data-fl-primary-base-size]').remove();
			$('<style data-fl-primary-base-size>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap, #fl_slimer_primary_wrap i{font-size:' + newval + 'px;}</style>').appendTo('head');

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_seprator_color]', function (value) {



		value.bind(function (newval) {

			// Use style tag instead of inline style for consistency
			$('style[data-fl-primary-base-border]').remove();
			$('<style data-fl-primary-base-border>.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_primary_bar .floating_links a, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap{border-color:' + newval + ' !important;}</style>').appendTo('head');

		});

	});



	// ================================

	// Social Icons – Live Preview

	// ================================



	// Removed global background color live binding (use per-network)



	// Hover background color

	wp.customize('fl_settings[social_icons][hover_bg_color]', function (value) {

		value.bind(function (newval) {

			// Remove existing hover background styles first

			$('style[data-fl-hover-bg]').remove();

			if (newval && newval.trim() !== '') {

				$('<style data-fl-hover-bg>.floating_next_prev_wrap.fl_social_icons_bar .floating_links a:hover, .floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_slimer_Wrap:hover{background-color:' + newval + ' !important;}</style>').appendTo('head');

			}

		});

	});



	// Removed global icon color live binding (use per-network)



	// Icon hover color

	wp.customize('fl_settings[social_icons][hover_color]', function (value) {

		value.bind(function (newval) {

			// Remove existing hover color styles first

			$('style[data-fl-hover-color]').remove();

			if (newval && newval.trim() !== '') {

				$('<style data-fl-hover-color>.floating_next_prev_wrap.fl_social_icons_bar .floating_links a:hover{color:' + newval + ' !important;} .floating_next_prev_wrap.fl_social_icons_bar .floating_links a:hover svg{fill:' + newval + ' !important;}</style>').appendTo('head');

			}

		});

	});



	// Separator color

	wp.customize('fl_settings[social_icons][separator_color]', function (value) {

		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_social_icons_bar .floating_links a, .floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_slimer_Wrap').css('border-color', newval);

		});

	});



	// Icon size

	wp.customize('fl_settings[social_icons][icon_size]', function (value) {

		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_social_icons_bar .floating_links i').css('font-size', newval + 'px');

			// Also update SVG icons (like Twitter X logo) - SVG uses 1em which is relative to font-size
			// Set font-size on the anchor containing the SVG so the em-based dimensions work correctly
			$('.floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_icon_holder').css('font-size', newval + 'px');

			// Update the displayed value in the Customizer control
			const parentDoc = (typeof parent !== 'undefined' && parent.document) ? parent.document : document;
			const control = jQuery(parentDoc).find('#customize-control-fl_settings-social_icons-icon_size');
			if (control.length) {
				const valueDisplay = control.find('.cs-range-value');
				if (valueDisplay.length) {
					valueDisplay.text(newval);
				}
			}

		});

	});



	// Shadow

	wp.customize('fl_settings[social_icons][shadow]', function (value) {

		value.bind(function (newval) {

			var shadow = newval ? '-6px 4px 20px 0px rgba(0,0,0,0.75)' : 'none';

			$('.floating_next_prev_wrap.fl_social_icons_bar .floating_links').css('box-shadow', shadow);

		});

	});



	// Position (apply inline styles for instant reflection similar to primary bar)

	wp.customize('fl_settings[social_icons][bar_position]', function (value) {

		value.bind(function (newval) {

			let wrap = $('.floating_next_prev_wrap.fl_social_icons_bar');

			let links = $('.floating_next_prev_wrap.fl_social_icons_bar .floating_links');

			if (!wrap.length || !links.length) { return; }



			// IMPORTANT:
			// The PHP template for the social icons bar outputs classes like:
			//   fl_social_icons_bar fl_social_icons_wrap fl_[position]
			// where [position] itself is already stored with an `fl_` prefix
			// (e.g. `fl_left`, `fl_bottom`). This means the actual class on the
			// wrapper can be `fl_fl_left`, `fl_fl_bottom`, etc.
			//
			// When switching positions in the Customizer, we must remove BOTH:
			//   - the single‑prefixed classes:  fl_left, fl_right, fl_bottom, fl_top, ...
			//   - the double‑prefixed classes: fl_fl_left, fl_fl_right, fl_fl_bottom, fl_fl_top, ...
			//
			// If we don't, old horizontal classes like `fl_bottom` / `fl_fl_bottom`
			// can remain on the wrapper after moving to a vertical position,
			// causing the minimizer to think the bar is still horizontal.
			wrap
				.removeClass(
					'fl_left fl_left_top fl_left_bottom fl_right fl_right_top fl_right_bottom fl_bottom fl_bottom_left fl_bottom_right fl_top fl_top_left fl_top_right ' +
					'fl_fl_left fl_fl_left_top fl_fl_left_bottom fl_fl_right fl_fl_right_top fl_fl_right_bottom fl_fl_bottom fl_fl_bottom_left fl_fl_bottom_right fl_fl_top fl_fl_top_left fl_fl_top_right'
				)
				.addClass(newval);



			var base = { left: '', right: '', top: '', bottom: '', transform: '', display: '' };

			switch (newval) {

				case 'fl_left':

					base.left = '0'; base.top = '50%'; base.right = 'auto'; base.bottom = 'auto'; base.transform = 'translate(0, -50%)'; break;

				case 'fl_left_top':

					base.left = '0'; base.top = '0'; base.right = 'auto'; base.bottom = 'auto'; base.transform = 'translate(0, 0)'; break;

				case 'fl_left_bottom':

					base.left = '0'; base.bottom = '0'; base.right = 'auto'; base.top = 'auto'; base.transform = 'translate(0, 0)'; break;

				case 'fl_right':

					base.right = '0'; base.left = 'auto'; base.top = '50%'; base.bottom = 'auto'; base.transform = 'translate(0, -50%)'; break;

				case 'fl_right_top':

					base.right = '0'; base.left = 'auto'; base.top = '0'; base.bottom = 'auto'; base.transform = 'translate(0, 0)'; break;

				case 'fl_right_bottom':

					base.right = '0'; base.left = 'auto'; base.bottom = '0'; base.top = 'auto'; base.transform = 'translate(0, 0)'; break;

				case 'fl_bottom':

					base.left = '50%'; base.bottom = '0'; base.right = '0'; base.top = 'auto'; base.display = 'inline-table'; base.transform = 'translate(-50%, 0)'; break;

				case 'fl_bottom_left':

					base.left = '0'; base.bottom = '0'; base.right = 'auto'; base.top = 'auto'; base.display = 'inline-table'; base.transform = 'translate(0, 0)'; break;

				case 'fl_bottom_right':

					base.right = '0'; base.bottom = '0'; base.left = 'auto'; base.top = 'auto'; base.display = 'inline-table'; base.transform = 'translate(0, 0)'; break;

				case 'fl_top':

					base.left = '50%'; base.right = '0'; base.top = '0'; base.bottom = 'auto'; base.display = 'inline-table'; base.transform = 'translate(-50%, 0)'; break;

				case 'fl_top_left':

					base.left = '0'; base.right = 'auto'; base.top = '0'; base.bottom = 'auto'; base.display = 'inline-table'; base.transform = 'translate(0, 0)'; break;

				case 'fl_top_right':

					base.right = '0'; base.left = 'auto'; base.top = '0'; base.bottom = 'auto'; base.display = 'inline-table'; base.transform = 'translate(0, 0)'; break;

			}

			links.css(base);

			// Apply horizontal layout for Top Center and Bottom Center positions
			let innerWrap = $('.floating_next_prev_wrap.fl_social_icons_bar #fl_social_icons_inner_wrap');
			let minimizer = $('.floating_next_prev_wrap.fl_social_icons_bar .fl_slimer_Wrap');
			let iconHolders = innerWrap.find('.fl_icon_holder');
			
			// Check if the bar is currently closed (has fl-close class on minimizer)
			var isCurrentlyClosed = minimizer.hasClass('fl-close');
			// Check current visibility state before making changes
			var wasVisible = innerWrap.is(':visible');
			// Store current width if visible (for horizontal positions)
			var currentWidth = wasVisible ? innerWrap.outerWidth() : 0;
			
			if (newval === 'fl_top' || newval === 'fl_bottom') {
				// Horizontal layout - apply styles to .floating_links container
				links.css({
					'display': 'flex',
					'flex-direction': 'row',
					'width': 'fit-content'
				});
				// Horizontal layout - apply inline styles with !important to ensure they override CSS
				innerWrap.attr('style', function(i, style) {
					return (style || '').replace(/flex-direction[^;]+;?/g, '').replace(/display[^;]+;?/g, '').replace(/width[^;]+;?/g, '').replace(/overflow[^;]+;?/g, '') + 'flex-direction: row !important;';
				});
				innerWrap.css({
					'-webkit-box-orient': 'horizontal',
					'-webkit-box-direction': 'normal',
					'-ms-flex-direction': 'row',
					'overflow': ''
				});
				// Preserve closed state: if closed, set width to 0 and display to none, otherwise set display to flex
				if (isCurrentlyClosed) {
					innerWrap.css({
						'display': 'none',
						'width': '0',
						'overflow': 'hidden'
					});
				} else {
					innerWrap.css({
						'display': 'flex',
						'width': ''
					});
				}
				iconHolders.css({
					'flex': '0 1 auto',
					'width': 'auto',
					'border-right': '1px solid rgba(0, 0, 0, 0.1)',
					'border-bottom': 'none'
				});
				iconHolders.last().css({
					'border-right': 'none'
				});
				// Set minimizer flex-direction with !important
				minimizer.attr('style', function(i, style) {
					return (style || '').replace(/flex-direction[^;]+;?/g, '') + 'flex-direction: row !important;';
				});
			} else {
				// Vertical layout - force .floating_links back to vertical column layout
				// Explicitly override the PHP-generated horizontal CSS (display:flex; flex-direction:row)
				links.css({
					'display': 'flex',
					'flex-direction': 'column',
					'width': ''
				});
				// Vertical layout (default) - explicitly reset all horizontal layout styles
				// Use !important to override CSS rules that have !important
				innerWrap.attr('style', function(i, style) {
					return (style || '').replace(/flex-direction[^;]+;?/g, '').replace(/display[^;]+;?/g, '').replace(/width[^;]+;?/g, '').replace(/overflow[^;]+;?/g, '') + 'flex-direction: column !important;';
				});
				innerWrap.css({
					'-webkit-box-orient': 'vertical',
					'-webkit-box-direction': 'normal',
					'-ms-flex-direction': 'column',
					'overflow': ''
				});
				// Preserve closed state: if closed, hide it, otherwise show it
				if (isCurrentlyClosed) {
					innerWrap.css({
						'display': 'none',
						'width': ''
					});
				} else {
					innerWrap.css({
						'display': '',
						'width': ''
					});
				}
				// Remove horizontal-specific styles from icon holders
				// Setting to empty string removes inline styles, allowing CSS defaults to apply
				iconHolders.each(function() {
					$(this).css({
						'flex': '',
						'width': '',
						'border-right': '',
						'border-bottom': ''
					});
				});
				// Reset minimizer - remove all inline styles and set flex-direction to column
				minimizer.attr('style', function(i, style) {
					// Remove flex-direction and any other positioning styles
					var cleaned = (style || '').replace(/flex-direction[^;]+;?/g, '').replace(/flex[^;]+;?/g, '').replace(/order[^;]+;?/g, '').trim();
					// Add column flex-direction with !important
					var newStyle = cleaned ? (cleaned + '; flex-direction: column !important;') : 'flex-direction: column !important;';
					return newStyle;
				});
				// Also explicitly reset via css() to ensure cleanup
				minimizer.css({
					'flex': '',
					'order': ''
				});
			}

		});

	});



	// Per-network colors & icon classes live

	var flNetworks = ['facebook', 'twitter', 'linkedin', 'pinterest', 'whatsapp', 'reddit', 'googleplus', 'youtube'];

	flNetworks.forEach(function (nid) {

		wp.customize('fl_settings[social_icons][networks][' + nid + '][icon]', function (value) {

			// Apply initial value on load
			let initialIcon = value();
			// Twitter uses SVG, not <i> tag, so handle differently
			if (nid === 'twitter') {
				let link = $('#fl_social_twitter');
				if (link.length) {
					// If icon is 'svg' or empty, show SVG
					if (!initialIcon || initialIcon === 'svg') {
						// Remove any existing icon
						link.find('.fl_twitter_icon').remove();
						// Check if SVG already exists, if not add it
						if (!link.find('svg').length) {
							// SVG markup for X logo
							let svgMarkup = '<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" viewBox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg>';
							link.prepend(svgMarkup);
						}
					} else {
						// Font Awesome icon selected - replace SVG with icon
						if (link.find('svg').length) {
							link.find('svg').remove();
							link.prepend('<i class="fl_twitter_icon ' + initialIcon + '"></i>');
						} else {
							// Update existing icon or add if missing
							let i = link.find('.fl_twitter_icon');
							if (i.length) {
								i.attr('class', 'fl_twitter_icon ' + initialIcon);
							} else {
								link.prepend('<i class="fl_twitter_icon ' + initialIcon + '"></i>');
							}
						}
					}
				}
			} else {
				if (initialIcon) {
					let i = $('.fl_' + nid + '_icon');
					if (i.length) {
						i.attr('class', 'fl_' + nid + '_icon ' + initialIcon);
					}
				}
			}
			// Bind to changes
			value.bind(function (newval) {

				// Twitter uses SVG, not <i> tag, so handle differently
				if (nid === 'twitter') {
					let link = $('#fl_social_twitter');
					if (link.length) {
						// If new value is 'svg' or empty, show SVG
						if (!newval || newval === 'svg') {
							// Remove any existing icon
							link.find('.fl_twitter_icon').remove();
							// Check if SVG already exists, if not add it
							if (!link.find('svg').length) {
								// SVG markup for X logo
								let svgMarkup = '<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" viewBox="0 0 512 512"><path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z"/></svg>';
								link.prepend(svgMarkup);
							}
						} else {
							// Font Awesome icon selected - replace SVG with icon
							if (link.find('svg').length) {
								link.find('svg').remove();
								link.prepend('<i class="fl_twitter_icon ' + newval + '"></i>');
							} else {
								// Update existing icon
								let i = link.find('.fl_twitter_icon');
								if (i.length) {
									i.attr('class', 'fl_twitter_icon ' + newval);
								} else {
									// Add icon if it doesn't exist
									link.prepend('<i class="fl_twitter_icon ' + newval + '"></i>');
								}
							}
						}
					}
				} else {
				let i = $('.fl_' + nid + '_icon');

					if (!i.length) {
						return;
					}
				i.attr('class', 'fl_' + nid + '_icon ' + newval);

				}
			});

		});



		['bg_color', 'color', 'hover_bg_color', 'hover_color'].forEach(function (prop) {

			wp.customize('fl_settings[social_icons][networks][' + nid + '][' + prop + ']', function (value) {

				// Apply initial value on load
				var initialVal = value();
				var trimmedInitial = (initialVal && typeof initialVal === 'string') ? initialVal.trim() : '';
				let a = $('.fl_social_' + nid);
				
				if (a.length) {
					if (prop === 'bg_color') {
						// Remove existing inline style tag first
						$('style[data-fl-' + nid + '-bg]').remove();
						if (trimmedInitial !== '') {
							// Use style tag with !important to override SCSS defaults
							$('<style data-fl-' + nid + '-bg>.fl_social_' + nid + '{background-color:' + trimmedInitial + ' !important;}</style>').appendTo('head');
						}
					}
					if (prop === 'color') {
						// Remove existing inline style tag first
						$('style[data-fl-' + nid + '-color]').remove();
						if (trimmedInitial !== '') {
							// Use style tag with !important to override SCSS defaults
							$('<style data-fl-' + nid + '-color>.fl_social_' + nid + '{color:' + trimmedInitial + ' !important;} .fl_social_' + nid + ' svg{fill:' + trimmedInitial + ' !important;} .fl_social_' + nid + ' i{color:' + trimmedInitial + ' !important;}</style>').appendTo('head');
						}
					}
					if (prop === 'hover_bg_color') {
						$('style[data-fl-' + nid + '-hover-bg]').remove();
						if (trimmedInitial !== '') {
							$('<style data-fl-' + nid + '-hover-bg>.fl_social_' + nid + ':hover{background-color:' + trimmedInitial + ' !important;}</style>').appendTo('head');
						}
					}
					if (prop === 'hover_color') {
						$('style[data-fl-' + nid + '-hover-color]').remove();
						if (trimmedInitial !== '') {
							$('<style data-fl-' + nid + '-hover-color>.fl_social_' + nid + ':hover{color:' + trimmedInitial + ' !important;} .fl_social_' + nid + ':hover svg{fill:' + trimmedInitial + ' !important;} .fl_social_' + nid + ':hover i{color:' + trimmedInitial + ' !important;}</style>').appendTo('head');
						}
					}
				}
				// Bind to changes
				value.bind(function (newval) {

					let a = $('.fl_social_' + nid);

					if (!a.length) { return; }

					// Trim and validate the new value
					var trimmedVal = (newval && typeof newval === 'string') ? newval.trim() : '';

					if (prop === 'bg_color') {
						// Always remove existing style tag first
						$('style[data-fl-' + nid + '-bg]').remove();
						// Only add new style if value is not empty
						if (trimmedVal !== '') {
							// Use style tag with !important to override SCSS defaults
							$('<style data-fl-' + nid + '-bg>.fl_social_' + nid + '{background-color:' + trimmedVal + ' !important;}</style>').appendTo('head');
						}
					}

					if (prop === 'color') {
						// Always remove existing style tag first
						$('style[data-fl-' + nid + '-color]').remove();
						// Only add new style if value is not empty
						if (trimmedVal !== '') {
							// Use style tag with !important to override SCSS defaults
							$('<style data-fl-' + nid + '-color>.fl_social_' + nid + '{color:' + trimmedVal + ' !important;} .fl_social_' + nid + ' svg{fill:' + trimmedVal + ' !important;} .fl_social_' + nid + ' i{color:' + trimmedVal + ' !important;}</style>').appendTo('head');
						}
					}

					if (prop === 'hover_bg_color') {
						// Always remove existing style first
						$('style[data-fl-' + nid + '-hover-bg]').remove();
						// Only add new style if value is not empty
						if (trimmedVal !== '') {
							$('<style data-fl-' + nid + '-hover-bg>.fl_social_' + nid + ':hover{background-color:' + trimmedVal + ' !important;}</style>').appendTo('head');
						}
					}

					if (prop === 'hover_color') {
						// Always remove existing style first
						$('style[data-fl-' + nid + '-hover-color]').remove();
						// Only add new style if value is not empty
						if (trimmedVal !== '') {
							$('<style data-fl-' + nid + '-hover-color>.fl_social_' + nid + ':hover{color:' + trimmedVal + ' !important;} .fl_social_' + nid + ':hover svg{fill:' + trimmedVal + ' !important;} .fl_social_' + nid + ':hover i{color:' + trimmedVal + ' !important;}</style>').appendTo('head');
						}
					}

				});

			});

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_shadow]', function (value) {



		value.bind(function (newval) {



			if (newval == false) {

				newval = 'none';

			}

			else {

				newval = '-6px 4px 20px 0px rgba(0,0,0,0.75)';

			}

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links').css('box-shadow', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_hover_post_bg_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder:hover').trigger('mouseenter');

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css('background-color', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_hover_post_headings_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_title,.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_description h6').css('color', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_hover_post_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_description p').css('color', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_hover_post_seprator_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details, .floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_title').css('border-color', newval);

		});

	});



	//Secondary Bar



	//Icon left

	wp.customize('fl_settings[fl_secondary][fl_left_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_left_icon');

			if ($('.fl_prev_icon').hasClass('disabled')) {




				if (newval.indexOf("dashicons") > -1) {

					$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon disabled " + newval);

				}

				else {

					$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon fa  disabled  fa-" + newval);

				}



			}

			else if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon  " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_prev_icon').removeAttr('class').addClass("fl_prev_icon fa  fa-" + newval);

			}







		});

	});



	//Icon right

	wp.customize('fl_settings[fl_secondary][fl_right_icon]', function (value) {



		value.bind(function (newval) {

			if ($('.fl_next_icon').hasClass('disabled')) {




				if (newval.indexOf("dashicons") > -1) {

					$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon disabled " + newval);

				}

				else {

					$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon fa  disabled  fa-" + newval);

				}



			}

			else if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon  " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_next_icon').removeAttr('class').addClass("fl_next_icon fa  fa-" + newval);

			}



		});

	});





	//Icon Random

	wp.customize('fl_settings[fl_secondary][fl_random_icon]', function (value) {



		value.bind(function (newval) {

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_random_icon').removeAttr('class').addClass("fl_random_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_random_icon').removeAttr('class').addClass("fl_random_icon fa fa-" + newval);

			}



		});

	});



	//Icon top

	wp.customize('fl_settings[fl_secondary][fl_up_icon]', function (value) {



		value.bind(function (newval) {

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_top_icon').removeAttr('class').addClass("fl_top_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_top_icon').removeAttr('class').addClass("fl_top_icon fa  fa-" + newval);

			}

		});

	});



	//Icon bottom

	wp.customize('fl_settings[fl_secondary][fl_down_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_bottom_icon').removeAttr('class').addClass("fl_bottom_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_bottom_icon').removeAttr('class').addClass("fl_bottom_icon fa  fa-" + newval);

			}



		});

	});



	//Icon home

	wp.customize('fl_settings[fl_secondary][fl_home_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_home_icon').removeAttr('class').addClass("fl_home_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_home_icon').removeAttr('class').addClass("fl_home_icon fa  fa-" + newval);

			}



		});

	});





	//Icon copy url

	wp.customize('fl_settings[fl_secondary][fl_copy_url_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_copy_url_icon').removeAttr('class').addClass("fl_copy_url_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_copy_url_icon').removeAttr('class').addClass("fl_copy_url_icon fa  fa-" + newval);

			}



		});

	});





	//Icon Slimmer

	wp.customize('fl_settings[fl_secondary][fl_slimer_close_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimmer_icon').removeAttr('class').addClass("fl_slimmer_icon " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimmer_icon').removeAttr('class').addClass("fl_slimmer_icon fa  fa-" + newval);

			}



		});

	});





	//Icon open

	wp.customize('fl_settings[fl_secondary][fl_slimer_open_icon]', function (value) {



		value.bind(function (newval) {

			//$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_left_icon');

			if (newval.indexOf("dashicons") > -1) {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_close_icon ').removeAttr('class').addClass("fl_slimer_close_icon  " + newval);

			}

			else {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_close_icon ').removeAttr('class').addClass("fl_slimer_close_icon  fa  fa-" + newval);

			}



		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_bg_color]', function (value) {



		value.bind(function (newval) {

			// Use style tag instead of inline style to allow hover states to work
			$('style[data-fl-secondary-base-bg]').remove();
			$('<style data-fl-secondary-base-bg>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{background-color:' + newval + ';}</style>').appendTo('head');

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_position]', function (value) {



		value.bind(function (newval) {



			jQuery('.floating_next_prev_wrap.fl_secondary_bar').attr('class', 'floating_next_prev_wrap fl_secondary_bar');



			jQuery('.floating_next_prev_wrap.fl_secondary_bar').addClass('fl_' + newval);

			// Preserve current customization settings before resetting styles
			var currentBgColor = wp.customize('fl_settings[fl_secondary][fl_bg_color]') ? wp.customize('fl_settings[fl_secondary][fl_bg_color]').get() : null;
			var currentColor = wp.customize('fl_settings[fl_secondary][fl_color]') ? wp.customize('fl_settings[fl_secondary][fl_color]').get() : null;
			var currentIconSize = wp.customize('fl_settings[fl_secondary][fl_icon_size]') ? wp.customize('fl_settings[fl_secondary][fl_icon_size]').get() : null;
			var currentSeparatorColor = wp.customize('fl_settings[fl_secondary][fl_seprator_color]') ? wp.customize('fl_settings[fl_secondary][fl_seprator_color]').get() : null;

			// Reset ALL inline styles to ensure consistent styling across position changes
			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').attr('style', '');
			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').attr('style', '');
			$('.floating_next_prev_wrap.fl_secondary_bar .fl_inner_wrap').attr('style', '');
			$('.floating_next_prev_wrap.fl_secondary_bar .fl_inner_wrap .fl-wrapper').attr('style', '');
			$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').attr('style', '');
			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').attr('style', '');
			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').attr('style', '');

			// Re-apply preserved customization settings after style reset
			// Use <style> tags instead of inline styles to allow hover states to work properly
			
			// Remove existing base style tags first
			$('style[data-fl-secondary-base-bg]').remove();
			$('style[data-fl-secondary-base-color]').remove();
			$('style[data-fl-secondary-base-size]').remove();
			$('style[data-fl-secondary-base-border]').remove();
			
			if (currentBgColor) {
				$('<style data-fl-secondary-base-bg>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{background-color:' + currentBgColor + ';}</style>').appendTo('head');
			}
			if (currentColor) {
				$('<style data-fl-secondary-base-color>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{color:' + currentColor + ';}</style>').appendTo('head');
			}
			if (currentIconSize) {
				$('<style data-fl-secondary-base-size>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap, #fl_slimer_secondary_wrap i{font-size:' + currentIconSize + 'px;}</style>').appendTo('head');
			}
			if (currentSeparatorColor) {
				$('<style data-fl-secondary-base-border>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{border-color:' + currentSeparatorColor + ';}</style>').appendTo('head');
			}

			// Reset flex-direction to column by default
			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({
				'flex-direction': 'column',
				'width': ''
			});
			$('.floating_next_prev_wrap.fl_secondary_bar .fl_inner_wrap').css({
				'flex-direction': 'column'
			});
			$('.floating_next_prev_wrap.fl_secondary_bar .fl_inner_wrap .fl-wrapper').css({
				'flex-direction': 'column'
			});

			if (newval == 'left') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'left': '0',

					'transform': 'translate(0px, -50%)',

					'bottom': 'auto',

					'right': 'auto',

					'top': '50%',

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'both',

					'width': 'auto'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'left': '105%'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'none'

				});



			}



			else if (newval == 'left_top') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'left': '0',

					'transform': 'translate(0, 0)',

					'bottom': 'auto',

					'right': 'auto',

					'top': '0',

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'both',

					'width': 'auto'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'left': '105%'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'none'

				});



			}



			else if (newval == 'left_bottom') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'left': '0',

					'transform': 'translate(0, 0)',

					'bottom': '0',

					'right': 'auto',

					'top': 'auto',

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'both',

					'width': 'auto'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'left': '105%'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'none'

				});



			}



			else if (newval == 'right') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'right': '0',

					'left': 'auto',

					'transform': 'translate(0px, -50%)',

					'bottom': 'auto',

					'top': '50%',

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'both',

					'width': 'auto'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'right': '105%',

					'left': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'none'

				});





			}



			else if (newval == 'right_top') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'right': '0',

					'left': 'auto',

					'transform': 'translate(0, 0)',

					'bottom': 'auto',

					'top': '0',

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'both',

					'width': 'auto'

				});





				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'none'

				});



			}





			else if (newval == 'right_bottom') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'right': '0',

					'left': 'auto',

					'transform': 'translate(0, 0)',

					'bottom': '0',

					'top': 'auto',

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'both',

					'width': '100%'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'none'

				});





			}



			else if (newval == 'bottom') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'bottom': '0',

					'left': '50%',

					'right': '0',

					'transform': 'translate(-50%, 0)',

					'display': 'inline-table',

					'top': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'left',

					'width': 'auto',

					'clear': 'none'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'none',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').css({

					'border-bottom': '1px solid'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '-55px'

				});

			}



			else if (newval == 'bottom_left') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'bottom': '0',

					'left': '0',

					'right': 'auto',

					'transform': 'translate(0, 0)',

					'display': 'inline-table',

					'top': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'left',

					'width': 'auto',

					'clear': 'none'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'none',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').css({

					'border-bottom': '1px solid'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '-55px',

					'left': '0'

				});

			}



			else if (newval == 'bottom_right') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'bottom': '0',

					'left': 'auto',

					'right': '0',

					'transform': 'translate(0, 0)',

					'display': 'inline-table',

					'top': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'left',

					'width': 'auto',

					'clear': 'none'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'none',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').css({

					'border-bottom': '1px solid'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '-55px'

				});

			}



			else if (newval == 'top') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'top': '0',

					'transform': 'translate(-50%, 0)',

					'display': 'inline-table',

					'bottom': 'auto',

					'left': '50%',

					'right': '0'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'left',

					'width': 'auto',

					'clear': 'none'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'none',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').css({

					'border-bottom': '1px solid'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'margin': '0px',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '0'

				});



			}



			else if (newval == 'top_right') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'left': 'auto',

					'transform': 'translate(0, 0)',

					'display': 'inline-table',

					'bottom': 'auto',

					'top': '0',

					'right': '0'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'left',

					'width': 'auto',

					'clear': 'none'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'none',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').css({

					'border-bottom': '1px solid'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'margin': '0px',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '0'

				});



			}



			else if (newval == 'top_left') {

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css({

					'left': '0',

					'transform': 'translate(0, 0)',

					'display': 'inline-table',

					'bottom': 'auto',

					'top': '0',

					'right': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .fl_slimer_Wrap').css({

					'float': 'left',

					'width': 'auto',

					'clear': 'none'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'clear': 'none',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a:last-child').css({

					'border-bottom': '1px solid'

				});



				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled').css({

					'float': 'left',

					'margin': '0px',

					'width': 'auto'

				});

				$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css({

					'top': '0',

					'left': '105%'

				});



			}





		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_hover_bg_color]', function (value) {



		value.bind(function (newval) {

			// Remove existing hover bg style tag to prevent accumulation
			$('style[data-fl-secondary-hover-bg]').remove();
			$('<style data-fl-secondary-hover-bg>.floating_next_prev_wrap.fl_secondary_bar .floating_links a:hover, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap:hover{background-color:' + newval + ' !important;}</style>').appendTo('head');

		});

	});





	//Update site link color in real time...

	wp.customize('fl_settings[fl_secondary][fl_color]', function (value) {

		value.bind(function (newval) {

			// Use style tag instead of inline style to allow hover states to work
			$('style[data-fl-secondary-base-color]').remove();
			$('<style data-fl-secondary-base-color>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{color:' + newval + ';}</style>').appendTo('head');

		});

	});



	//Update site link color in real time...

	wp.customize('fl_settings[fl_secondary][fl_icon_hover_color]', function (value) {

		value.bind(function (newval) {

			// Remove existing hover color style tag to prevent accumulation
			$('style[data-fl-secondary-hover-color]').remove();
			$('<style data-fl-secondary-hover-color>.floating_next_prev_wrap.fl_secondary_bar .floating_links a:hover{color:' + newval + ' !important;}</style>').appendTo('head');

		});

	});



	//Update site link color in real time...

	wp.customize('fl_settings[fl_secondary][fl_icon_size]', function (value) {

		value.bind(function (newval) {

			// Use style tag instead of inline style for consistency
			$('style[data-fl-secondary-base-size]').remove();
			$('<style data-fl-secondary-base-size>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{font-size:' + newval + 'px;}</style>').appendTo('head');

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_seprator_color]', function (value) {



		value.bind(function (newval) {

			// Use style tag instead of inline style for consistency
			$('style[data-fl-secondary-base-border]').remove();
			$('<style data-fl-secondary-base-border>.floating_next_prev_wrap.fl_secondary_bar .floating_links .disabled, .floating_next_prev_wrap.fl_secondary_bar .floating_links a, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_slimer_Wrap{border-color:' + newval + ' !important;}</style>').appendTo('head');

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_shadow]', function (value) {



		value.bind(function (newval) {



			if (newval == false) {

				newval = 'none';

			}

			else {

				newval = '-6px 4px 20px 0px rgba(0,0,0,0.75)';

			}

			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links').css('box-shadow', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_hover_post_bg_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder:hover').trigger('mouseenter');

			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details').css('background-color', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_hover_post_headings_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_title,.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_description h6').css('color', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_hover_post_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_description p').css('color', newval);

		});

	});



	//Update Bg color in real time...

	wp.customize('fl_settings[fl_secondary][fl_hover_post_seprator_color]', function (value) {



		value.bind(function (newval) {

			$('.floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details, .floating_next_prev_wrap.fl_secondary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_title').css('border-color', newval);

		});

	});



})(jQuery);

