<?php
/**
 * Prevents direct access to the file
 */
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

/**
 * Class FLOATING_LINKS_CUSTOMIZER
 *
 * This class handles the frontend functionalities of the Floating Links plugin in the customizer.
 */

if ( ! class_exists( 'Floating_Links_Customizer' ) ) {
	class Floating_Links_Customizer {

		/**
		 * Floating_Links_Customizer constructor.
		 *
		 * Adds necessary hooks for customizer functionalities of the Floating Links plugin
		 *
		 * @since 1.0.0
		 */
		function __construct() {
			// Enqueues the necessary scripts and styles for the customizer
			add_action( 'customize_register', array( $this, 'customizer_panel_settings' ) );
			// Adds the customizer CSS to the head section
			add_action( 'wp_head', array( $this, 'customizer_css' ) );
			// Adds the customizer JS and CSS to the footer section
			add_action( 'customize_controls_enqueue_scripts', array( $this, 'customizer_scripts' ) );
			// Display the floating links in the preview
			add_action( 'customize_preview_init', array( $this, 'live_preview' ) );
			// Ensure social icons bar renders in Customizer preview
			if ( is_customize_preview() ) {
				add_action( 'wp_footer', array( $this, 'render_social_icons_preview' ) );
			}
		}

		/**
		 * Return a whitelist of Font Awesome 4.6.3 classes for a given social network id.
		 * Only include icons that exist in FA 4.6.3 for the common networks supported.
		 *
		 * @param string $network_id
		 * @return array key=>label pairs (both are full class strings)
		 */
		private function fl_get_fa46_social_choices( $network_id ) {
			$map = array(
				'facebook'   => array( 'fa fa-facebook', 'fa fa-facebook-square', 'fa fa-facebook-official' ),
				'twitter'    => array( 'fa fa-twitter', 'fa fa-twitter-square' ),
				'linkedin'   => array( 'fa fa-linkedin', 'fa fa-linkedin-square' ),
				'pinterest'  => array( 'fa fa-pinterest-p', 'fa fa-pinterest', 'fa fa-pinterest-square' ),
				'reddit'     => array( 'fa fa-reddit-alien', 'fa fa-reddit', 'fa fa-reddit-square' ),
				'whatsapp'   => array( 'fa fa-whatsapp' ),
				'youtube'    => array( 'fa fa-youtube', 'fa fa-youtube-play', 'fa fa-youtube-square' ),
				'googleplus' => array( 'fa fa-google-plus', 'fa fa-google-plus-square', 'fa fa-google-plus-official' ),
			);

			$icons   = isset( $map[ $network_id ] ) ? $map[ $network_id ] : array( 'fa fa-' . $network_id );
			$choices = array();

			// For Twitter, add "Default SVG" as the first option
			if ( 'twitter' === $network_id ) {
				$choices['svg'] = __( 'Default SVG (X Logo)', 'floating-links' );
			}

			foreach ( $icons as $cls ) {
				$choices[ $cls ] = $cls;
			}
			return $choices;
		}

		/**
		 * Get default colors for a social network.
		 * These match the default colors defined in the SCSS file.
		 *
		 * @param string $network_id The network identifier.
		 * @return array Array with keys: bg_color, color, hover_bg_color, hover_color.
		 */
		private function fl_get_social_network_default_colors( $network_id ) {
			$defaults = array(
				'facebook'   => array(
					'bg_color'       => '#3a579a',
					'color'          => '#ffffff',
					'hover_bg_color' => '#354e8b',
					'hover_color'    => '#ffffff',
				),
				'twitter'    => array(
					'bg_color'       => '#01abf0',
					'color'          => '#ffffff',
					'hover_bg_color' => '#0399d7',
					'hover_color'    => '#ffffff',
				),
				'linkedin'   => array(
					'bg_color'       => '#117bb6',
					'color'          => '#ffffff',
					'hover_bg_color' => '#106ea4',
					'hover_color'    => '#ffffff',
				),
				'pinterest'  => array(
					'bg_color'       => '#E60023',
					'color'          => '#ffffff',
					'hover_bg_color' => '#cf001f',
					'hover_color'    => '#ffffff',
				),
				'whatsapp'   => array(
					'bg_color'       => '#25D366',
					'color'          => '#ffffff',
					'hover_bg_color' => '#1EBE5A',
					'hover_color'    => '#ffffff',
				),
				'reddit'     => array(
					'bg_color'       => '#FF4500',
					'color'          => '#ffffff',
					'hover_bg_color' => '#e63e00',
					'hover_color'    => '#ffffff',
				),
				'youtube'    => array(
					'bg_color'       => '#B31217',
					'color'          => '#ffffff',
					'hover_bg_color' => '#a21616',
					'hover_color'    => '#ffffff',
				),
				'googleplus' => array(
					'bg_color'       => '#dd4b39',
					'color'          => '#ffffff',
					'hover_bg_color' => '#c23321',
					'hover_color'    => '#ffffff',
				),
			);

			// Return network-specific defaults or fallback to generic defaults
			if ( isset( $defaults[ $network_id ] ) ) {
				return $defaults[ $network_id ];
			}

			// Fallback defaults if network not found
			return array(
				'bg_color'       => '#ffffff',
				'color'          => '#000000',
				'hover_bg_color' => '#000000',
				'hover_color'    => '#ffffff',
			);
		}

		/**
		 * Add the customizer panel and sections for the Floating Links plugin
		 *
		 * @param $wp_customize
		 * @since 6.3.2
		 */
		public function customizer_panel_settings( $wp_customize ) {
			// Set the option name
			$setting = 'fl_settings';
			// Add the customizer panel
			$wp_customize->add_panel(
				'fl_customizer_panel',
				array(
					'capability'     => null,
					'priority'       => 160,
					'theme_supports' => null,
					'title'          => __( 'Floating Links Settings', 'floating-links' ),
				)
			);
			// Add the customizer section for the icons
			$wp_customize->add_section(
				'fl_icons_section',
				array(
					'title'       => __( 'Change icons ', 'floating-links' ),
					'description' => __( 'Chose any icon from the list below and see the magic live.', 'floating-links' ),
					'priority'    => 160,
					'panel'       => 'fl_customizer_panel',
				)
			);
			// Add the customizer section for the design
			$wp_customize->add_section(
				'fl_design_section',
				array(
					'title'       => __( 'Design', 'floating-links' ),
					'description' => __( 'Customize design of your fancy floating links live.', 'floating-links' ),
					'priority'    => 160,
					'panel'       => 'fl_customizer_panel',
				)
			);

			// Social Icons sections
			$social_icons_description    = __( 'Change the icons of the social icons bar.', 'floating-links' );
			$social_design_description   = __( 'Customize colors for the social icons bar.', 'floating-links' );
			$social_position_description = __( 'Change the position of the social icons bar.', 'floating-links' );

			// Add premium notice for free users
			if ( ! function_exists( 'fl_fs' ) || ! fl_fs()->is__premium_only() ) {
				$premium_notice               = ' <strong style="color: #d63638;">' . __( '(Premium Feature)', 'floating-links' ) . '</strong>';
				$social_icons_description    .= $premium_notice;
				$social_design_description   .= $premium_notice;
				$social_position_description .= $premium_notice;
			}

			$wp_customize->add_section(
				'fl_social_icons_icons_section',
				array(
					'title'       => __( 'Social Icons – Change icons', 'floating-links' ),
					'description' => $social_icons_description,
					'priority'    => 165,
					'panel'       => 'fl_customizer_panel',
				)
			);

			$wp_customize->add_section(
				'fl_social_icons_design_section',
				array(
					'title'       => __( 'Social Icons – Design', 'floating-links' ),
					'description' => $social_design_description,
					'priority'    => 166,
					'panel'       => 'fl_customizer_panel',
				)
			);

			$wp_customize->add_section(
				'fl_social_icons_position_section',
				array(
					'title'       => __( 'Social Icons – Change position', 'floating-links' ),
					'description' => $social_position_description,
					'priority'    => 167,
					'panel'       => 'fl_customizer_panel',
				)
			);
			// Add the customizer section for the position
			$wp_customize->add_section(
				'fl_position_section',
				array(
					'title'       => __( 'Change position', 'floating-links' ),
					'description' => __( 'Show Floating Links on left, right, top and bottom side.', 'floating-links' ),
					'priority'    => 160,
					'panel'       => 'fl_customizer_panel',
				)
			);

			/**
			 * Adding settings and controls for the Floating Links plugin
			 */

			$wp_customize->add_setting(
				'fl_settings[fl_position]',
				array(
					'default'   => 'right',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				'fl_settings[fl_position]',
				array(
					'type'    => 'radio',
					'section' => 'fl_position_section', // Add a default or your own section
					'label'   => __( 'Position', 'floating-links' ),
					'choices' => array(
						'left'         => __( 'Left Center', 'floating-links' ),
						'left_top'     => __( 'Left Top', 'floating-links' ),
						'left_bottom'  => __( 'Left Bottom', 'floating-links' ),
						'right'        => __( 'Right Center', 'floating-links' ),
						'right_top'    => __( 'Right Top', 'floating-links' ),
						'right_bottom' => __( 'Right Bottom', 'floating-links' ),
						'top'          => __( 'Top Center', 'floating-links' ),
						// 'top_left'     => __( 'Top Left', 'floating-links' ),
						// 'top_right'    => __( 'Top Right', 'floating-links' ),
						'bottom'       => __( 'Bottom Center', 'floating-links' ),
						// 'bottom_left'  => __( 'Bottom Left', 'floating-links' ),
						// 'bottom_right' => __( 'Bottom Right', 'floating-links' ),
					),
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_bg_color]',
				array(
					'default'           => '#fff',
					'transport'         => 'postMessage',
					'type'              => 'option',
					'sanitize_callback' => 'sanitize_hex_color',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Color_Control(
					$wp_customize,
					'fl_settings[fl_bg_color]',
					$this->cutomizer_values( __( 'Background color', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_bg_color]', null )
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_color]',
				array(
					'default'           => '#000',
					'transport'         => 'postMessage',
					'type'              => 'option',
					'sanitize_callback' => 'sanitize_hex_color',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Color_Control(
					$wp_customize,
					'fl_settings[fl_color]',
					$this->cutomizer_values( __( 'Icons color', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_color]', null )
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_icon_hover_color]',
				array(
					'default'           => '#fff',
					'transport'         => 'postMessage',
					'type'              => 'option',
					'sanitize_callback' => 'sanitize_hex_color',
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_hover_bg_color]',
				array(
					'default'           => '#000',
					'transport'         => 'postMessage',
					'type'              => 'option',
					'sanitize_callback' => 'sanitize_hex_color',
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_icon_size]',
				array(
					'default'   => '18',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Range_Control(
					$wp_customize,
					'fl_settings[fl_icon_size]',
					array(
						'label'       => __( 'Icons size.', 'floating-links' ),
						'section'     => 'fl_design_section',
						'settings'    => 'fl_settings[fl_icon_size]',
						'input_attrs' => array(
							'max' => 100,
						),
					)
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_seprator_color]',
				array(
					'default'   => '#000',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_shadow]',
				array(
					'default'   => '1',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				'fl_settings[fl_shadow]',
				$this->cutomizer_values( __( 'Enable shadow', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_shadow]', 'checkbox' )
			);

			$wp_customize->add_setting(
				'fl_settings[fl_hover_post_bg_color]',
				array(
					'default'   => '#fff',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Color_Control(
					$wp_customize,
					'fl_settings[fl_hover_post_bg_color]',
					$this->cutomizer_values( __( 'Hover post data background color.', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_hover_post_bg_color]', null )
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_hover_post_headings_color]',
				array(
					'default'   => '#000',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Color_Control(
					$wp_customize,
					'fl_settings[fl_hover_post_headings_color]',
					$this->cutomizer_values( __( 'Hover post data headings color.', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_hover_post_headings_color]', null )
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_hover_post_color]',
				array(
					'default'   => '#000',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Color_Control(
					$wp_customize,
					'fl_settings[fl_hover_post_color]',
					$this->cutomizer_values( __( 'Hover post data text color.', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_hover_post_color]', null )
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_hover_post_seprator_color]',
				array(
					'default'   => '#000',
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new WP_Customize_Color_Control(
					$wp_customize,
					'fl_settings[fl_hover_post_seprator_color]',
					$this->cutomizer_values( __( 'Hover post data seprator color.', 'floating-links' ), 'fl_design_section', 'fl_settings[fl_hover_post_seprator_color]', null )
				)
			);

			// list of left icons
			$iconsleft = apply_filters(
				'fl_left_icons',
				array(
					'dashicons dashicons-arrow-left-alt',
					'dashicons dashicons-arrow-left-alt2',
					'angle-left',
					'arrow-circle-left',
					'arrow-circle-o-left',
					'arrow-left',
					'caret-left',
					'caret-square-o-left',
					'chevron-circle-left',
					'chevron-left',
					'hand-o-left',
					'long-arrow-left',
				)
			);

			$wp_customize->add_setting(
				'fl_settings[fl_left_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_left_icon]',
					array(
						'section' => 'fl_icons_section',
						'label'   => __( 'Select left icon.', 'floating-links' ),
						'type'    => 'radio',
						'choices' => $iconsleft,
					)
				)
			);

			// list of right icons
			$iconsright = apply_filters(
				'fl_right_icons',
				array(
					'dashicons dashicons-arrow-right-alt',
					'dashicons dashicons-arrow-right-alt2',
					'angle-right',
					'arrow-circle-right',
					'arrow-circle-o-right',
					'arrow-right',
					'caret-right',
					'caret-square-o-right',
					'chevron-circle-right',
					'chevron-right',
					'hand-o-right',
					'long-arrow-right',
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_right_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_right_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select right icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $iconsright,
					)
				)
			);

			// list of random icons
			$iconsrandom = apply_filters( 'fl_random_icons', array( 'dashicons dashicons-randomize', 'random' ) );
			$wp_customize->add_setting(
				'fl_settings[fl_random_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_random_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select Random icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $iconsrandom,
					)
				)
			);

			// list of up icons
			$iconsup = apply_filters(
				'fl_up_icons',
				array(
					'dashicons dashicons-arrow-up-alt',
					'dashicons dashicons-arrow-up-alt2',
					'angle-up',
					'arrow-circle-up',
					'arrow-circle-o-up',
					'arrow-up',
					'caret-up',
					'caret-square-o-up',
					'chevron-circle-up',
					'chevron-up',
					'hand-o-up',
					'long-arrow-up',
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_up_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_up_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select up icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $iconsup,
					)
				)
			);

			// list of down icons
			$iconsdown = apply_filters(
				'fl_down_icons',
				array(
					'dashicons dashicons-arrow-down-alt',
					'dashicons dashicons-arrow-down-alt2',
					'angle-down',
					'arrow-circle-down',
					'arrow-circle-o-down',
					'arrow-down',
					'caret-down',
					'caret-square-o-down',
					'chevron-circle-down',
					'chevron-down',
					'hand-o-down',
					'long-arrow-down',
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_down_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_down_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select down icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $iconsdown,
					)
				)
			);

			// list of home icons
			$iconshome = apply_filters(
				'fl_home_icons',
				array(
					'dashicons dashicons-admin-home',
					'dashicons dashicons-store',
					'home',
					'h-square',
					'bank',
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_home_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_home_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select home icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $iconshome,
					)
				)
			);

			// list of copy URL icons
			$icons_copy_url = apply_filters(
				'fl_copy_url_icons',
				array(
					'dashicons dashicons-admin-page',
					'files-o',
					'clone',
					'clipboard',
				)
			);

			// =====================
			// Social Icons controls (Premium-only parts inside)
			// =====================
			// Get merged settings once at registration time to use as defaults
			// Also get raw settings to ensure we have the actual saved values
			$raw_settings        = get_option( 'fl_settings', false );
			$merged_social_icons = function_exists( 'fl_get_social_icons_settings' ) ? fl_get_social_icons_settings() : array();
			$merged_networks     = isset( $merged_social_icons['networks'] ) ? $merged_social_icons['networks'] : array();

			// Merge raw saved networks with merged networks to ensure we have all saved values
			if ( isset( $raw_settings['social_icons']['networks'] ) && is_array( $raw_settings['social_icons']['networks'] ) ) {
				foreach ( $raw_settings['social_icons']['networks'] as $network_id => $raw_network ) {
					if ( is_array( $raw_network ) && isset( $merged_networks[ $network_id ] ) ) {
						// Preserve saved icon from raw settings (WordPress Customizer saves directly)
						if ( isset( $raw_network['icon'] ) && ! empty( $raw_network['icon'] ) ) {
							$merged_networks[ $network_id ]['icon'] = $raw_network['icon'];
						}
						// Preserve saved colors from raw settings (WordPress Customizer saves directly)
						if ( isset( $raw_network['bg_color'] ) && ! empty( $raw_network['bg_color'] ) ) {
							$merged_networks[ $network_id ]['bg_color'] = $raw_network['bg_color'];
						}
						if ( isset( $raw_network['color'] ) && ! empty( $raw_network['color'] ) ) {
							$merged_networks[ $network_id ]['color'] = $raw_network['color'];
						}
						if ( isset( $raw_network['hover_bg_color'] ) && ! empty( $raw_network['hover_bg_color'] ) ) {
							$merged_networks[ $network_id ]['hover_bg_color'] = $raw_network['hover_bg_color'];
						}
						if ( isset( $raw_network['hover_color'] ) && ! empty( $raw_network['hover_color'] ) ) {
							$merged_networks[ $network_id ]['hover_color'] = $raw_network['hover_color'];
						}
					}
				}
			}

			if ( true ) {
				$social_defaults = function_exists( 'fl_social_networks_defaults' ) ? fl_social_networks_defaults() : array();
				if ( ! empty( $social_defaults ) ) {
					foreach ( $social_defaults as $network_id => $network ) {
						$setting_id = 'fl_settings[social_icons][networks][' . $network_id . '][icon]';
						// Use saved icon if key exists, otherwise use default
						// Note: Fl_Nested_Icon_Setting::value() will read from database, so default here is just a fallback
						$default_icon = isset( $merged_networks[ $network_id ]['icon'] )
							? $merged_networks[ $network_id ]['icon']
							: ( isset( $network['icon'] ) ? $network['icon'] : '' );

						// FIXED: Use custom setting class to properly handle nested option paths
						// WordPress Customizer's default WP_Customize_Setting doesn't correctly save nested paths
						$wp_customize->add_setting(
							new Fl_Nested_Icon_Setting(
								$wp_customize,
								$setting_id,
								array(
									'default'           => $default_icon,
									'transport'         => 'refresh',
									'type'              => 'option',
									'sanitize_callback' => 'sanitize_text_field',
									'network_id'        => $network_id, // Pass network ID for proper saving
								)
							)
						);

						// Premium-only visual icon selector;
						$network_label = isset( $network['name'] ) ? $network['name'] : ucfirst( $network_id );
						// Restrict to Font Awesome 4.6.3 classes only for social icons
						$choices_raw = $this->fl_get_fa46_social_choices( $network_id );
						$choices     = apply_filters( 'fl_social_icon_variations_' . $network_id, $choices_raw );

						if ( true ) {
							// translators: %s is the social network name.
							$wp_customize->add_control(
								new Fl_Social_Icons_Control(
									$wp_customize,
									$setting_id,
									array(
										'section'  => 'fl_social_icons_icons_section',
										'settings' => $setting_id,
										/* translators: %s is the social network name. */
										'label'    => sprintf( __( 'Select %s icon', 'floating-links' ), $network_label ),
										'type'     => 'radio',
										'choices'  => $choices,
									)
								)
							);
						}

						// Icon selector is premium; color controls added below for both plans
					}
				}

				// Global color/size/shadow controls added below for both plans

				// Social icons position (visible for preview for free users; persistence blocked server-side)
				if ( true ) {
					$default_position = isset( $merged_social_icons['bar_position'] ) && ! empty( $merged_social_icons['bar_position'] )
						? $merged_social_icons['bar_position']
						: 'fl_left';

					$wp_customize->add_setting(
						'fl_settings[social_icons][bar_position]',
						array(
							'default'   => $default_position,
							'transport' => 'postMessage',
							'type'      => 'option',
						)
					);
					$wp_customize->add_control(
						'fl_settings[social_icons][bar_position]',
						array(
							'type'    => 'radio',
							'section' => 'fl_social_icons_position_section',
							'label'   => __( 'Position', 'floating-links' ),
							'choices' => array(
								'fl_left'         => __( 'Left Center', 'floating-links' ),
								'fl_left_top'     => __( 'Left Top', 'floating-links' ),
								'fl_left_bottom'  => __( 'Left Bottom', 'floating-links' ),
								'fl_right'        => __( 'Right Center', 'floating-links' ),
								'fl_right_top'    => __( 'Right Top', 'floating-links' ),
								'fl_right_bottom' => __( 'Right Bottom', 'floating-links' ),
								'fl_top'          => __( 'Top Center', 'floating-links' ),
								// 'fl_top_left'     => __( 'Top Left', 'floating-links' ),
								// 'fl_top_right'    => __( 'Top Right', 'floating-links' ),
								'fl_bottom'       => __( 'Bottom Center', 'floating-links' ),
								// 'fl_bottom_left'  => __( 'Bottom Left', 'floating-links' ),
								// 'fl_bottom_right' => __( 'Bottom Right', 'floating-links' ),
							),
						)
					);
				}
			} // end premium-gated parts; now add design controls for both plans

			// Add design controls (available for preview to free users, persisted only for premium by server filter)
			$social_defaults_for_design = function_exists( 'fl_social_networks_defaults' ) ? fl_social_networks_defaults() : array();
			if ( ! empty( $social_defaults_for_design ) ) {
				foreach ( $social_defaults_for_design as $network_id => $network ) {
						$bg_setting   = 'fl_settings[social_icons][networks][' . $network_id . '][bg_color]';
						$col_setting  = 'fl_settings[social_icons][networks][' . $network_id . '][color]';
						$hbg_setting  = 'fl_settings[social_icons][networks][' . $network_id . '][hover_bg_color]';
						$hcol_setting = 'fl_settings[social_icons][networks][' . $network_id . '][hover_color]';

					// Get network-specific default colors (matches SCSS defaults)
					// IMPORTANT: Always use network-specific defaults for the 'default' parameter.
					// WordPress Customizer automatically loads saved values from the option,
					// so 'default' should always be the actual network default, not the saved value.
					// This ensures the default button resets to the correct network-specific color.
					$network_defaults = $this->fl_get_social_network_default_colors( $network_id );

					// Register settings with network-specific defaults (not saved values)
					// The saved value will be loaded automatically by WordPress Customizer from the option
							$wp_customize->add_setting(
								$bg_setting,
								array(
									'default'           => $network_defaults['bg_color'],
									'transport'         => 'postMessage',
									'type'              => 'option',
									'sanitize_callback' => 'sanitize_hex_color',
								)
							);
					$wp_customize->add_setting(
						$col_setting,
						array(
							'default'           => $network_defaults['color'],
							'transport'         => 'postMessage',
							'type'              => 'option',
							'sanitize_callback' => 'sanitize_hex_color',
						)
					);
					$wp_customize->add_setting(
						$hbg_setting,
						array(
							'default'           => $network_defaults['hover_bg_color'],
							'transport'         => 'postMessage',
							'type'              => 'option',
							'sanitize_callback' => 'sanitize_hex_color',
						)
					);
					$wp_customize->add_setting(
						$hcol_setting,
						array(
							'default'           => $network_defaults['hover_color'],
							'transport'         => 'postMessage',
							'type'              => 'option',
							'sanitize_callback' => 'sanitize_hex_color',
						)
					);

						$wp_customize->add_control(
							new WP_Customize_Color_Control(
								$wp_customize,
								$bg_setting,
								/* translators: %s is the social network name. */
								$this->cutomizer_values( sprintf( __( '%s background', 'floating-links' ), isset( $network['name'] ) ? $network['name'] : ucfirst( $network_id ) ), 'fl_social_icons_design_section', $bg_setting, null )
							)
						);
						$wp_customize->add_control(
							new WP_Customize_Color_Control(
								$wp_customize,
								$col_setting,
								/* translators: %s is the social network name. */
								$this->cutomizer_values( sprintf( __( '%s color', 'floating-links' ), isset( $network['name'] ) ? $network['name'] : ucfirst( $network_id ) ), 'fl_social_icons_design_section', $col_setting, null )
							)
						);
						$wp_customize->add_control(
							new WP_Customize_Color_Control(
								$wp_customize,
								$hbg_setting,
								/* translators: %s is the social network name. */
								$this->cutomizer_values( sprintf( __( '%s hover background', 'floating-links' ), isset( $network['name'] ) ? $network['name'] : ucfirst( $network_id ) ), 'fl_social_icons_design_section', $hbg_setting, null )
							)
						);
						$wp_customize->add_control(
							new WP_Customize_Color_Control(
								$wp_customize,
								$hcol_setting,
								/* translators: %s is the social network name. */
								$this->cutomizer_values( sprintf( __( '%s hover color', 'floating-links' ), isset( $network['name'] ) ? $network['name'] : ucfirst( $network_id ) ), 'fl_social_icons_design_section', $hcol_setting, null )
							)
						);
				}
			}

				// Keep global hover colors (use saved values as defaults)
				$default_hover_bg    = isset( $merged_social_icons['hover_bg_color'] ) ? $merged_social_icons['hover_bg_color'] : '#000000';
				$default_hover_color = isset( $merged_social_icons['hover_color'] ) ? $merged_social_icons['hover_color'] : '#ffffff';
				$default_separator   = isset( $merged_social_icons['separator_color'] ) ? $merged_social_icons['separator_color'] : '#000000';
				$default_icon_size   = isset( $merged_social_icons['icon_size'] ) ? $merged_social_icons['icon_size'] : '18';
				$default_shadow      = isset( $merged_social_icons['shadow'] ) ? $merged_social_icons['shadow'] : '1';

				$wp_customize->add_setting(
					'fl_settings[social_icons][hover_bg_color]',
					array(
						'default'           => $default_hover_bg,
						'transport'         => 'postMessage',
						'type'              => 'option',
						'sanitize_callback' => 'sanitize_hex_color',
					)
				);

				$wp_customize->add_setting(
					'fl_settings[social_icons][hover_color]',
					array(
						'default'           => $default_hover_color,
						'transport'         => 'postMessage',
						'type'              => 'option',
						'sanitize_callback' => 'sanitize_hex_color',
					)
				);

				$wp_customize->add_setting(
					'fl_settings[social_icons][separator_color]',
					array(
						'default'           => $default_separator,
						'transport'         => 'postMessage',
						'type'              => 'option',
						'sanitize_callback' => 'sanitize_hex_color',
					)
				);

				// Social icon size and shadow
				$wp_customize->add_setting(
					'fl_settings[social_icons][icon_size]',
					array(
						'default'   => $default_icon_size,
						'transport' => 'postMessage',
						'type'      => 'option',
					)
				);
				$wp_customize->add_control(
					new WP_Customize_Range_Control(
						$wp_customize,
						'fl_settings[social_icons][icon_size]',
						array(
							'label'       => __( 'Icons size', 'floating-links' ),
							'section'     => 'fl_social_icons_design_section',
							'settings'    => 'fl_settings[social_icons][icon_size]',
							'input_attrs' => array(
								'max' => 100,
							),
						)
					)
				);

				$wp_customize->add_setting(
					'fl_settings[social_icons][shadow]',
					array(
						'default'   => $default_shadow,
						'transport' => 'postMessage',
						'type'      => 'option',
					)
				);
				$wp_customize->add_control(
					'fl_settings[social_icons][shadow]',
					$this->cutomizer_values( __( 'Enable shadow', 'floating-links' ), 'fl_social_icons_design_section', 'fl_settings[social_icons][shadow]', 'checkbox' )
				);

			// Removed global icon color control for social icons (use per-network instead)
			$wp_customize->add_setting(
				'fl_settings[fl_copy_url_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_copy_url_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select copy URL icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $icons_copy_url,
					)
				)
			);

			// list of close icons
			$iconsslimmer = apply_filters(
				'fl_slimer_close_icons',
				array(
					'dashicons dashicons-no',
					'dashicons dashicons-no-alt',
					'dashicons dashicons-minus',
					'dashicons dashicons-dismiss',
					'close',
					'minus',
					'minus-circle',
					'minus-square',
					'minus-square-o',
					'search-minus',
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_slimer_close_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_slimer_close_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select close icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $iconsslimmer,
					)
				)
			);

			// list of open icons
			$icons_slimmer_closed = apply_filters(
				'fl_slimer_open_icons',
				array(
					'dashicons dashicons-yes',
					'dashicons dashicons-plus',
					'plus',
					'plus-circle',
					'plus-square',
					'plus-square-o',
					'search-plus',
					'crosshairs',
					'arrows',
					'arrows-alt',
					'check-square',
					'check-square-o',
					'plus-square',
				)
			);
			$wp_customize->add_setting(
				'fl_settings[fl_slimer_open_icon]',
				array(
					'transport' => 'postMessage',
					'type'      => 'option',
				)
			);
			$wp_customize->add_control(
				new Fl_Icons_Control(
					$wp_customize,
					'fl_settings[fl_slimer_open_icon]',
					array(
						'section'  => 'fl_icons_section',
						'priority' => 180,
						'label'    => __( 'Select open icon.', 'floating-links' ),
						'type'     => 'radio',
						'choices'  => $icons_slimmer_closed,
					)
				)
			);
		}

		/**
		 * Get the customizer values
		 *
		 * @param $label
		 * @param $section
		 * @param $settings
		 * @param $type
		 *
		 * @return array
		 */
		public function cutomizer_values( $label, $section, $settings, $type ) {
			return array(
				'label'    => __( $label, 'floating-links' ),
				'section'  => $section,
				'settings' => $settings,
				'type'     => $type,
			);
		}

		/**
		 * Enqueue scripts for customizer live preview.
		 */
		public function live_preview() {
			wp_enqueue_script( 'floating-links-customizer-live', FLOATING_LINKS_URL . 'admin/assets/js/floating-links-customizer-live.js', array( 'jquery', 'customize-preview' ), true );
		}

		/**
		 * Render the social icons bar HTML in the Customizer preview.
		 */
		public function render_social_icons_preview() {
			if ( ! is_customize_preview() ) {
				return;
			}
			// Prevent duplicate rendering - check if social icons bar already exists
			// Use output buffering to check if element already exists in the page
			ob_start();
			$fl_templateurl = locate_template( array( 'floating-links/views/social-icons.php' ) );
			if ( $fl_templateurl ) {
				$fl_templateurl = $fl_templateurl;
			} else {
				$fl_templateurl = FLOATING_LINKS_DIR . 'frontend/views/social-icons.php';
			}
			require apply_filters( 'fl_social_icons_views_url', $fl_templateurl );
			$output = ob_get_clean();

			// Only output if no duplicate exists (check by counting existing elements)
			// We'll use JavaScript to handle removal of duplicates as a fallback
			// Output is HTML from template file, so it's safe to echo
			echo $output; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		}

		/**
		 * Enqueue scripts and styles for customizer.
		 */
		public function customizer_scripts() {
			wp_enqueue_style( 'floating-links-fonts', FLOATING_LINKS_URL . 'admin/assets/css/floating-links-fonts.css' );
			wp_enqueue_style( 'dashicons' );
			wp_enqueue_style( 'floating-links-customizer', FLOATING_LINKS_URL . 'admin/assets/css/floating-links-customizer.css' );
			wp_enqueue_script( 'floating-links-customizer', FLOATING_LINKS_URL . 'admin/assets/js/floating-links-customizer.js', array( 'jquery' ), true );
			// Expose premium build flag for upsell logic in Customizer controls frame (build check, not license)
			wp_add_inline_script(
				'floating-links-customizer',
				'window.flIsPremium = ' . ( function_exists( 'fl_fs' ) && fl_fs()->is__premium_only() ? 'true' : 'false' ) . ';'
			);
		}

		/**
		 * Add customizer css
		 */
		function customizer_css() {
			$settings = get_option( 'fl_settings', false );
			?>
			<style>
				/* Primary bar (next/prev etc.) */
				.floating_next_prev_wrap.fl_primary_bar .floating_links a,
				.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled
				{
					<?php if ( ! empty( $settings['fl_bg_color'] ) ) { ?>
					background-color: <?php echo esc_attr( $settings['fl_bg_color'] ); ?>;
					<?php } ?>

					<?php if ( ! empty( $settings['fl_color'] ) ) { ?>
					color: <?php echo esc_attr( $settings['fl_color'] ); ?>;
					<?php } ?>

					<?php if ( ! empty( $settings['fl_seprator_color'] ) ) { ?>
					border-color: <?php echo esc_attr( $settings['fl_seprator_color'] ); ?> !important;
					<?php } ?>

					<?php if ( ! empty( $settings['fl_icon_size'] ) ) { ?>
					font-size: <?php echo absint( $settings['fl_icon_size'] ); ?>px;
					<?php } ?>
				}

				/* Social icons bar - default styles */
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a,
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links .disabled {
					background-color: #ffffff;
					color: #000000;
				}

				/* Per-network overrides */
				<?php
				// Use merged settings to get saved colors properly
				$social_icons_settings = function_exists( 'fl_get_social_icons_settings' ) ? fl_get_social_icons_settings() : ( isset( $settings['social_icons'] ) ? $settings['social_icons'] : array() );
				if ( isset( $social_icons_settings['networks'] ) && is_array( $social_icons_settings['networks'] ) ) {
					foreach ( $social_icons_settings['networks'] as $nid => $ndata ) {
						$nid_safe = sanitize_key( $nid );
						$bg       = isset( $ndata['bg_color'] ) && ! empty( $ndata['bg_color'] ) ? $ndata['bg_color'] : '';
						$col      = isset( $ndata['color'] ) && ! empty( $ndata['color'] ) ? $ndata['color'] : '';
						$hbg      = isset( $ndata['hover_bg_color'] ) && ! empty( $ndata['hover_bg_color'] ) ? $ndata['hover_bg_color'] : '';
						$hcol     = isset( $ndata['hover_color'] ) && ! empty( $ndata['hover_color'] ) ? $ndata['hover_color'] : '';
						if ( $bg || $col ) {
							?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a.fl_social_<?php echo esc_attr( $nid_safe ); ?> {
							<?php
							if ( $bg ) {
								?>
					background-color: <?php echo esc_attr( $bg ); ?>;<?php } ?>
							<?php
							if ( $col ) {
								?>
					color: <?php echo esc_attr( $col ); ?>;<?php } ?>}
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a.fl_social_<?php echo esc_attr( $nid_safe ); ?> svg {
							<?php
							if ( $col ) {
								?>
					fill: <?php echo esc_attr( $col ); ?> !important;<?php } ?>}
							<?php
						}
						if ( $hbg || $hcol ) {
							?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a.fl_social_<?php echo esc_attr( $nid_safe ); ?>:hover {
							<?php
							if ( $hbg ) {
								?>
					background-color: <?php echo esc_attr( $hbg ); ?>;<?php } ?>
							<?php
							if ( $hcol ) {
								?>
					color: <?php echo esc_attr( $hcol ); ?>;<?php } ?>}
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a.fl_social_<?php echo esc_attr( $nid_safe ); ?>:hover svg {
							<?php
							if ( $hcol ) {
								?>
					fill: <?php echo esc_attr( $hcol ); ?> !important;<?php } ?>}
							<?php
						}
					}
				}
				?>

				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a:hover {
					<?php if ( isset( $settings['social_icons']['hover_bg_color'] ) && ! empty( $settings['social_icons']['hover_bg_color'] ) ) { ?>
						background-color: <?php echo esc_attr( $settings['social_icons']['hover_bg_color'] ); ?>;
					<?php } ?>
					<?php if ( isset( $settings['social_icons']['hover_color'] ) && ! empty( $settings['social_icons']['hover_color'] ) ) { ?>
						color: <?php echo esc_attr( $settings['social_icons']['hover_color'] ); ?>;
					<?php } ?>
				}

				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a,
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_slimer_Wrap{
					<?php if ( isset( $settings['social_icons']['separator_color'] ) && ! empty( $settings['social_icons']['separator_color'] ) ) { ?>
						border-color: <?php echo esc_attr( $settings['social_icons']['separator_color'] ); ?> !important;
					<?php } ?>
				}

				.floating_next_prev_wrap.fl_social_icons_bar .floating_links i,
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_icon_holder{
					<?php if ( isset( $settings['social_icons']['icon_size'] ) && ! empty( $settings['social_icons']['icon_size'] ) ) { ?>
						font-size: <?php echo esc_attr( $settings['social_icons']['icon_size'] ); ?>px;
					<?php } ?>
				}

				<?php if ( isset( $settings['social_icons']['shadow'] ) && ! $settings['social_icons']['shadow'] ) { ?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					box-shadow: none;
				}
				<?php } ?>

				/* Make SVG icons follow configured hover color only (global hover) */
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links a:hover svg {
					<?php if ( isset( $settings['social_icons']['hover_color'] ) && ! empty( $settings['social_icons']['hover_color'] ) ) { ?>
						fill: <?php echo esc_attr( $settings['social_icons']['hover_color'] ); ?> !important;
					<?php } else { ?>
						fill: #ffffff !important;
					<?php } ?>
				}

				<?php
				// Positioning for social icons bar (premium only)
				$social_position = 'fl_left';
				if ( function_exists( 'fl_fs' ) && fl_fs()->is__premium_only() && isset( $settings['social_icons']['bar_position'] ) ) {
					$social_position = $settings['social_icons']['bar_position'];
				}
				switch ( $social_position ) {
					case 'fl_left':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 0;
					transform: translate(0, -50%);
					top: 50%;
					right: auto;
					bottom: auto;
				}
						<?php
						break;
					case 'fl_left_top':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 0;
					top: 0;
					right: auto;
					bottom: auto;
					transform: translate(0, 0);
				}
						<?php
						break;
					case 'fl_left_bottom':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 0;
					bottom: 0;
					right: auto;
					top: auto;
					transform: translate(0, 0);
				}
						<?php
						break;
					case 'fl_right':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					right: 0;
					left: auto;
					top: 50%;
					bottom: auto;
					transform: translate(0, -50%);
				}
						<?php
						break;
					case 'fl_right_top':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					right: 0;
					left: auto;
					top: 0;
					bottom: auto;
					transform: translate(0, 0);
				}
						<?php
						break;
					case 'fl_right_bottom':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					right: 0;
					left: auto;
					bottom: 0;
					top: auto;
					transform: translate(0, 0);
				}
						<?php
						break;
					case 'fl_bottom':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 50%;
					bottom: 0;
					right: 0;
					top: auto;
					display: inline-table;
					transform: translate(-50%, 0);
				}
						<?php
						break;
					case 'fl_bottom_left':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 0;
					bottom: 0;
					right: auto;
					top: auto;
					display: inline-table;
					transform: translate(0, 0);
				}
						<?php
						break;
					case 'fl_bottom_right':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					right: 0;
					bottom: 0;
					left: auto;
					top: auto;
					display: inline-table;
					transform: translate(0, 0);
				}
						<?php
						break;
					case 'fl_top':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 50%;
					right: 0;
					top: 0;
					bottom: auto;
					display: inline-table;
					transform: translate(-50%, 0);
				}
						<?php
						break;
					case 'fl_top_left':
						?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					left: 0;
					right: auto;
					top: 0;
					bottom: auto;
					display: inline-table;
					transform: translate(0, 0);
				}
						<?php
						break;
					default:
						break;
				}

				// Horizontal layout for social icons bar when position is Top Center or Bottom Center ONLY
				if ( 'fl_top' === $social_position || 'fl_bottom' === $social_position ) {
					?>
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links {
					display: flex;
					flex-direction: row;
					width: fit-content;
				}
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_inner_wrap {
					flex-direction: row !important;
					-webkit-box-orient: horizontal !important;
					-webkit-box-direction: normal !important;
					-ms-flex-direction: row !important;
				}
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_inner_wrap .fl_icon_holder {
					flex: 0 1 auto;
					width: auto;
				}
				.floating_next_prev_wrap.fl_social_icons_bar .floating_links .fl_slimer_Wrap {
					flex-direction: row !important;
				}
					<?php
				}
				?>
				.floating_next_prev_wrap.fl_primary_bar.fl_primary_bar .floating_links .fl_slimer_Wrap
				{
				<?php if ( isset( $settings['fl_bg_color'] ) && ! empty( $settings['fl_bg_color'] ) ) { ?>
					background-color: <?php echo esc_attr( $settings['fl_bg_color'] ); ?>;
				<?php } ?>
				<?php if ( isset( $settings['fl_color'] ) && ! empty( $settings['fl_color'] ) ) { ?>
					color: <?php echo esc_attr( $settings['fl_color'] ); ?>;
				<?php } ?>
				<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
					border-color: <?php echo esc_attr( $settings['fl_seprator_color'] ); ?> !important;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar.fl_primary_bar .floating_links .fl_slimer_Wrap i
				{
				<?php if ( isset( $settings['fl_icon_size'] ) && ! empty( $settings['fl_icon_size'] ) ) { ?>
					font-size: <?php echo absint( $settings['fl_icon_size'] ); ?>px;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .disabled {
					color: #ebebe4 !important;
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links a:hover,
				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap:hover {
				<?php if ( isset( $settings['fl_hover_bg_color'] ) && ! empty( $settings['fl_hover_bg_color'] ) ) { ?>
					background-color: <?php echo esc_attr( $settings['fl_hover_bg_color'] ); ?>;
				<?php } ?>
				<?php if ( isset( $settings['fl_icon_hover_color'] ) && ! empty( $settings['fl_icon_hover_color'] ) ) { ?>
					color: <?php echo esc_attr( $settings['fl_icon_hover_color'] ); ?>;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details {
				<?php if ( isset( $settings['fl_hover_post_bg_color'] ) && ! empty( $settings['fl_hover_post_bg_color'] ) ) { ?>
					background-color: <?php echo esc_attr( $settings['fl_icon_hover_color'] ); ?>;
				<?php } ?>
				<?php if ( isset( $settings['fl_hover_post_seprator_color'] ) && ! empty( $settings['fl_hover_post_seprator_color'] ) ) { ?>
					border-color: <?php echo esc_attr( $settings['fl_hover_post_seprator_color'] ); ?>;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_title{
				<?php if ( isset( $settings['fl_hover_post_headings_color'] ) && ! empty( $settings['fl_hover_post_headings_color'] ) ) { ?>
					color: <?php echo esc_attr( $settings['fl_hover_post_headings_color'] ); ?>;
				<?php } ?>
				<?php if ( isset( $settings['fl_hover_post_seprator_color'] ) && ! empty( $settings['fl_hover_post_seprator_color'] ) ) { ?>
					border-color: <?php echo esc_attr( $settings['fl_hover_post_headings_color'] ); ?>;
				<?php } ?>
				}

				.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 {
				<?php if ( isset( $settings['fl_hover_post_headings_color'] ) && ! empty( $settings['fl_hover_post_headings_color'] ) ) { ?>
					color: <?php echo esc_attr( $settings['fl_hover_post_headings_color'] ); ?>;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_description p {
				<?php if ( isset( $settings['fl_hover_post_color'] ) && ! empty( $settings['fl_hover_post_color'] ) ) { ?>
					color: <?php echo esc_attr( $settings['fl_hover_post_color'] ); ?>;
				<?php } ?>
				}

				<?php
				if ( isset( $settings['fl_shadow'] ) && ! $settings['fl_shadow'] ) {
					?>
				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					box-shadow:none;
				}
					<?php
				}
				if ( isset( $settings['fl_post_data'] ) && 'true' == $settings['fl_post_data'] ) {
					?>
				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details {
					display: block;
				}
					<?php
				} else {

					?>
				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details {
						display: none;
				}
					<?php
				}

				if ( isset( $settings['fl_position'] ) && ! empty( $settings['fl_position'] ) ) {
					$position = $settings['fl_position'];
				} else {
					$position = 'right';
				}

				switch ( $position ) {
					case 'left':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					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 {
					left: 105%;
				}

						<?php
						break;
					case 'left_top':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					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 {
					left: 105%;
				}

						<?php
						break;

					case 'left_bottom':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : 0;
					transform : translate(0px, 0px);
					top: auto;
					right: auto;
					bottom: 0;
				}


				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details {
					left: 105%;
				}

						<?php
						break;
					case 'right':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : auto;
					transform : translate(0px, -50%);
					bottom : auto;
					right : 0;
					top : 50%;
				}


						<?php
						break;

					case 'right_top':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : auto;
					transform : translate(0px, 0px);
					bottom : auto;
					right : 0;
					top : 0;
				}

						<?php
						break;
					case 'right_bottom':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : auto;
					transform : translate(0px, 0px);
					right : 0;
					top : auto;
					bottom : 0;
				}


						<?php
						break;

					case 'bottom':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : 50%;
					display: flex;
					flex-direction: row;
					width: fit-content;
					transform : translate(-50%, 0);
					bottom : 0;
					right : 0;
					top : auto;
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child {
						<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
						border-bottom : 1px solid <?php echo esc_attr( $settings['fl_seprator_color'] ); ?>;
					<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details{
					top: -55px;
				}

						<?php
						break;

					case 'bottom_left':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : 0;
					display: inline-table;
					transform : translate(0, 0);
					bottom : 0;
					right : auto;
					top : auto;
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child{
						<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
						border-bottom : 1px solid <?php echo esc_attr( $settings['fl_seprator_color'] ); ?>;
					<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details{
					top: -55px;
					left: 0;
				}

						<?php
						break;

					case 'bottom_right':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					left : auto;
					display: inline-table;
					transform : translate(0, 0);
					bottom : 0;
					right : 0;
					top : auto;
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child{
						<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
						border-bottom : 1px solid <?php echo esc_attr( $settings['fl_seprator_color'] ); ?>;
					<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details{
					top: -55px;
				}

						<?php
						break;

					/*
					 * If floating links position is top.
					*/
					case 'top':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links{
					left : 50%;
					display: flex;
					flex-direction: row;
					width: fit-content;
					transform : translate(-50%, 0);
					bottom : auto;
					right : 0;
					top : 0;
				}


				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child {
						<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
						border-bottom : 1px solid <?php echo esc_attr( $settings['fl_seprator_color'] ); ?>;
					<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap {
					float: left;
					margin: 0 auto;
				}
				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details{
					top: 0;
				}

						<?php
						break;

					case 'top_right':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links{
					left : auto;
					display: inline-table;
					transform : translate(0, 0);
					bottom : auto;
					right : 0;
					top : 0;
				}


				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child {
						<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
					border-bottom : 1px solid <?php echo esc_attr( $settings['fl_seprator_color'] ); ?>;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap {
					float: left;
					margin: 0 auto;
				}
				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details{
					top: 0;
				}

						<?php
						break;
					case 'top_left':
						?>

				.floating_next_prev_wrap.fl_primary_bar .floating_links{
					left : 0;
					display: inline-table;
					transform : translate(0, 0);
					bottom : auto;
					right : auto;
					top : 0;
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child {
						<?php if ( isset( $settings['fl_seprator_color'] ) && ! empty( $settings['fl_seprator_color'] ) ) { ?>
					border-bottom : 1px solid <?php echo esc_attr( $settings['fl_seprator_color'] ); ?>;
				<?php } ?>
				}

				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_slimer_Wrap {
					float: left;
					margin: 0 auto;
				}
				.floating_next_prev_wrap.fl_primary_bar .floating_links .fl_inner_wrap .fl_icon_holder .fl_post_details{
					top: 0;
					left: 105%;
				}

						<?php
						break;
					default:
						break;

				}

				if ( ! is_customize_preview() ) {
					/*
					* If floating links position is top and admin bar is showing take some margin.
					*/
					if ( is_admin_bar_showing()
					&& $position == 'top'
					|| $position == 'left_top'
					|| $position == 'top_right'
					|| $position == 'top_left'
					) {
						?>
				.floating_next_prev_wrap.fl_primary_bar .floating_links {
					top : 32px;
				}
						<?php
					}
				}

				if ( ! isset( $settings['fl_minimizer'] ) && 'true' !== $settings['fl_minimizer'] ) {
					?>
				.floating_next_prev_wrap.fl_primary_bar .floating_links a:last-child {
					border: none;
				}
				<?php } ?>

			</style>
			<?php
		}
	}
	new Floating_Links_Customizer();
}
