firepot

Back Back Up Advanced Editor

<?php
namespace Elementor;

if ( ! defined( 'ABSPATH' ) ) exit; // If this file is called directly, abort.

class Widget_BoostedElementsNavi extends Widget_Base {

public function get_name() {
		return 'boosted-elements-navi';
	}

public function get_title() {
		return esc_html__( 'Navigation - Boosted', 'boosted-elements-progression' );
	}

public function get_icon() {
		return 'eicon-nav-menu boosted-elements-progression-icon';
	}

public function get_categories() {
		return [ 'boosted-elements-progression' ];
	}
    
	public function get_script_depends() { 
		return [ 'boosted_elements_prgoression_navigation'];
	}
    
	public function get_style_depends() { 
		return [ 'elementor-icons-fa-solid'];
	}
    
	public function grab_available_menus() {
		$menus = wp_get_nav_menus();
		$options = [];
		foreach ( $menus as $menu ) {
			$options[ $menu->slug ] = $menu->name;
		}
		return $options;
	}

protected function register_controls() {

$this->start_controls_section(
  			'section_title_boosted_global_options',
  			[
  				'label' => esc_html__( 'Navigation Element', 'boosted-elements-progression' )
  			]
  		);
		
	    
        $menus = $this->grab_available_menus();
		if ( ! empty( $menus ) ) {
			$this->add_control(
				'menu_select',
				[
					'label' => esc_html__( 'Menu Select', 'boosted-elements-progression' ),
					'type' => Controls_Manager::SELECT,
					'options'   => $this->grab_available_menus(),
					'default' => array_keys( $menus )[0],
					'save_default' => true,
					'separator' => 'after',
					'description' => sprintf( __( 'Go to <a href="%s" target="_blank">Appearance Menus</a> to edit your menus', 'boosted-elements-progression' ), admin_url( 'nav-menus.php' ) ),
				]
			);
		} else {
			$this->add_control(
				'menu_select',
				[
					'type' => Controls_Manager::RAW_HTML,
					'raw' => '<strong>' . __( 'There are no navigation menus available.', 'boosted-elements-progression' ) . '</strong><br>' . sprintf( __( 'Please create one in your <a href="%s" target="_blank">Menus screen</a>', 'boosted-elements-progression' ), admin_url( 'nav-menus.php?action=edit&menu=0' ) ),
					'separator' => 'after',
					'content_classes' => 'elementor-panel-alert elementor-panel-alert-info',
				]
			);
		}
        
        
		$this->add_control(
			'menu_align_elements',
			[
				'label' => esc_html__( 'Menu Align', 'boosted-elements-progression' ),
				'type' => Controls_Manager::CHOOSE,
				'options' => [
					'left' => [
						'title' => esc_html__( 'Left', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-left',
					],
					'center' => [
						'title' => esc_html__( 'Center', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-center',
					],
					'right' => [
						'title' => esc_html__( 'Right', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-right',
					],
					'justify' => [
						'title' => esc_html__( 'Stretch', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-stretch',
					],
				],
                'default' => 'center',
                'render_type' => 'template',
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-menu-align' => '{{VALUE}}',
				],
				'selectors_dictionary' => [
					'left' => 'display:flex; justify-content: left;',
					'center' => 'display:flex; justify-content: center;',
					'right' => 'display:flex; justify-content:flex-end;',
                    'justify' => '',
				],
			]
		);
        
        
		$this->add_control(
			'sub_menu_indicator',
			[
				'type' => Controls_Manager::SELECT,
				'label' => esc_html__( 'Dropdown Icon', 'boosted-elements-progression' ),
				'options' => [
					'fas fa-angle-down' => esc_html__( 'Angle', 'boosted-elements-progression' ),
                    'fas fa-chevron-down' => esc_html__( 'Chevron', 'boosted-elements-progression' ),
					'fas fa-caret-down' => esc_html__( 'Triangle', 'boosted-elements-progression' ),
					'fas fa-plus' => esc_html__( 'Plus', 'boosted-elements-progression' ),
                    'fas fa-angle-double-down' => esc_html__( 'Double Down', 'boosted-elements-progression' ),
                    'fas fa-long-arrow-alt-down' => esc_html__( 'Long Arrow', 'boosted-elements-progression' ),
				],
                'default' => 'fas fa-angle-down',
			]
		);
        
		$this->add_control(
			'sub_menu_indicator_size',
			[
				'label' => esc_html__( 'Dropdown Icon Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 30,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .menu-item-has-children .drop-down-icon-boosted' => 'font-size: {{SIZE}}px;',
				],
			]
		);
        
		$this->add_control(
			'sub_menu_indicator_size_submenu',
			[
				'label' => esc_html__( 'Submenu Dropdown Icon Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 30,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .sub-menu .menu-item-has-children .drop-down-icon-boosted' => 'font-size: {{SIZE}}px;',
				],
			]
		);
        
        
        
		
        
        
        $this->add_control(
        			'mobile_heading_icon',
        			[
        				'label' => __( 'Mobile Menu Settings', 'plugin-name' ),
        				'type' => \Elementor\Controls_Manager::HEADING,
        				'separator' => 'before',
        			]
        );
        
		
        
        
		$this->add_control(
			'break_point_menu',
			[
				'type' => Controls_Manager::SELECT,
				'label' => esc_html__( 'Breakpoint', 'boosted-elements-progression' ),
				'options' => [
                    'mobile' => esc_html__( 'Mobile (< 768px)', 'boosted-elements-progression' ),
					'tablet' => esc_html__( 'Tablet (< 1025px)', 'boosted-elements-progression' ),
                    'always' => esc_html__( 'Always Display Mobile Menu', 'boosted-elements-progression' ),
					'none' => esc_html__( 'No Mobile Menu', 'boosted-elements-progression' ),
				],
                'default' => 'tablet',
			]
		);

$this->add_control(
			'mobile_menu_icon',
			[
				'label' => esc_html__( 'Mobile Icon', 'boosted-elements-progression' ),
				'type' => Controls_Manager::ICONS,
                'default' => [
	                    'value' => 'fas fa-bars',
	                     'library' => 'solid',
                    ],
    				'condition' => [
    					'break_point_menu!' => 'none',
    				],
			]
		);
        
		$this->add_control(
			'mobile_menu_align',
			[
				'label' => esc_html__( 'Mobile Icon Align', 'boosted-elements-progression' ),
				'type' => Controls_Manager::CHOOSE,
				'options' => [
					'left' => [
						'title' => esc_html__( 'Left', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-left',
					],
					'center' => [
						'title' => esc_html__( 'Center', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-center',
					],
					'right' => [
						'title' => esc_html__( 'Right', 'boosted-elements-progression' ),
						'icon' => 'eicon-h-align-right',
					],
				],
                'default' => 'right',
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-icon-align' => '{{VALUE}}',
				],
				'selectors_dictionary' => [
					'center' => 'text-align:center;',
					'right' => 'text-align:right;',
                    'justify' => '',
				],
				'condition' => [
					'break_point_menu!' => 'none',
				],
			]
		);
		
		$this->add_control(
			'custom_mobile_menu',
			[
				'label' => esc_html__( 'Custom Mobile Menu', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SWITCHER,
				'separator' => 'before',
				'condition' => [
					'break_point_menu!' => 'none',
				],
			]
		);
        
		$this->add_control(
			'mobile_menu_select',
			[
				'label' => esc_html__( 'Menu Select', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SELECT,
				'options'   => $this->grab_available_menus(),
				'description' => esc_html__( 'Optional Mobile Menu. Leave blank to use same menu on mobile and desktop', 'boosted-elements-progression' ),
                'default' => 'tablet',
				'condition' => [
					'custom_mobile_menu' => 'yes',
				],
			]
		);
        
        
		
		$this->end_controls_section();
        
        
        
  		$this->start_controls_section(
  			'section_nav_main_styles',
  			[
  				'label' => esc_html__( 'Menu Styles', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);
        
        
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
             'name' => 'section_title_boosted_btn_typography',
				'scheme' => \Elementor\Core\Schemes\Typography::TYPOGRAPHY_1,
				'selector' => '{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def',
			]
		);
        
        
		$this->start_controls_tabs( 'boosted_main_tabs' );

$this->start_controls_tab( 'normal', [ 'label' => esc_html__( 'Normal', 'boosted-elements-progression' ) ] );

$this->add_control(
			'boosted_elements_nav_color',
			[
				'label' => esc_html__( 'Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def' => 'color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'boosted_elements_nav_background',
			[
				'label' => esc_html__( 'Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def' => 'background-color: {{VALUE}};',
				],
			]
		);
        
        
		$this->add_control(
			'menu_underline_option',
			[
				'type' => Controls_Manager::SELECT,
				'label' => esc_html__( 'Underline', 'boosted-elements-progression' ),
				'options' => [
					'none' => esc_html__( 'Hide', 'boosted-elements-progression' ),
                    'hover' => esc_html__( 'Display on Hover', 'boosted-elements-progression' ),
                    'always' => esc_html__( 'Always Display', 'boosted-elements-progression' ),
				],
                'default' => 'none',
				'selectors' => [
					'{{WRAPPER}} .item-underline-nav-boosted:before' => '{{VALUE}}',
				],
				'selectors_dictionary' => [
					'none' => 'display:none;',
					'hover' => 'display:block;',
                    'always' => 'width:100%; left:0; opacity:1;',
				],
                
                
                
			]
		);
		
        
		$this->add_control(
			'boosted_elements_underline_color',
			[
				'label' => esc_html__( 'Underline Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def .item-underline-nav-boosted:before' => 'background-color: {{VALUE}};',
				],
				'condition' => [
					'menu_underline_option' => 'always',
				],
			]
		);

$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'boosted_elements_nav_border',
				'selector' => '{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def',
			]
		);
		
		
		$this->end_controls_tab();

$this->start_controls_tab( 'boosted_elements_hover', [ 'label' => esc_html__( 'Hover', 'boosted-elements-progression' ) ] );

$this->add_control(
			'boosted_elements_nav_color_hover',
			[
				'label' => esc_html__( 'Hover Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item a.boosted-nav-link-def:hover' => 'color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'boosted_elements_nav_background_hover',
			[
				'label' => esc_html__( 'Hover Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item a.boosted-nav-link-def:hover' => 'background-color: {{VALUE}};',
				],
			]
		);
        
		$this->add_control(
			'boosted_elements_nav_underline_hover',
			[
				'label' => esc_html__( 'Hover Underline Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def .item-underline-nav-boosted:before, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted a.boosted-nav-link-def .item-underline-nav-boosted:before, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item a.boosted-nav-link-def:hover .item-underline-nav-boosted:before' => 'background-color: {{VALUE}};',
				],
				'condition' => [
					'menu_underline_option!' => 'none',
				],
			]
		);

$this->add_control(
			'boosted_elements_nav_border_hover',
			[
				'label' => esc_html__( 'Hover Border Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item a.boosted-nav-link-def:hover' => 'border-color: {{VALUE}};',
				],
			]
		);
		
		$this->end_controls_tab();
        
        $this->start_controls_tab( 'boosted_elements_active', [ 'label' => esc_html__( 'Active', 'boosted-elements-progression' ) ] );
        
		$this->add_control(
			'boosted_elements_nav_color_active',
			[
				'label' => esc_html__( 'Active Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def' => 'color: {{VALUE}};',
				],
			]
		);
        
		$this->add_control(
			'boosted_elements_nav_background_active',
			[
				'label' => esc_html__( 'Active Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def' => 'background-color: {{VALUE}};',
				],
			]
		);
        
		$this->add_control(
			'boosted_elements_nav_underline_active',
			[
				'label' => esc_html__( 'Active Underline Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def .item-underline-nav-boosted:before' => 'background-color: {{VALUE}};',
				],
				'condition' => [
					'menu_underline_option!' => 'none',
				],
			]
		);

$this->add_control(
			'boosted_elements_nav_border_active',
			[
				'label' => esc_html__( 'Active Border Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .current-menu-item a.boosted-nav-link-def' => 'border-color: {{VALUE}};',
				],
			]
		);
        
        
		$this->end_controls_tab();
		
		$this->end_controls_tabs();
        
        
        $this->add_control(
        			'heading_divider',
        			[
        				'label' => __( 'Menu Spacing', 'plugin-name' ),
        				'type' => \Elementor\Controls_Manager::HEADING,
        				'separator' => 'before',
        			]
        		);
        
        
		$this->add_responsive_control(
			'boosted_elements_nav_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements.sf-arrows .sf-with-ul' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'boosted_elements_nav_margins',
			[
				'label' => esc_html__( 'Margins', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements li.menu-item' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'boosted_elements_nav_radius',
			[
				'label' => esc_html__( 'Border Radius', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements a.boosted-nav-link-def' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
        
        $this->add_control(
        			'underline_hover',
        			[
        				'label' => __( 'Underline Settings', 'plugin-name' ),
        				'type' => \Elementor\Controls_Manager::HEADING,
        				'separator' => 'before',
        				'condition' => [
        					'menu_underline_option!' => 'none',
        				],
        			]
        );
  		
		$this->add_control(
			'underline_height_control',
			[
				'label' => esc_html__( 'Underline Height', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 15,
					],
				],
				'condition' => [
					'menu_underline_option!' => 'none',
				],
				'selectors' => [
					'{{WRAPPER}} .item-underline-nav-boosted:before' => 'height: {{SIZE}}px;',
				],
			]
		);
        
		$this->add_control(
			'underline_position',
			[
				'label' => esc_html__( 'Underline Vertical Position', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => -60,
						'max' => 60,
					],
				],
				'condition' => [
					'menu_underline_option!' => 'none',
				],
				'selectors' => [
					'{{WRAPPER}} .item-underline-nav-boosted:before' => 'bottom: {{SIZE}}px;',
				],
			]
		);
        
        
		$this->add_control(
			'top_levelmain_sub_menu_drop_down_arrow_size',
			[
				'label' => esc_html__( 'Dropdown Icon Font Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 60,
					],
				],
                'size_units' => [ 'px' ],
				'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} .drop-down-icon-boosted' => 'font-size: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
        
        $this->end_controls_section();
        
        
  		$this->start_controls_section(
  			'section_sub_menu_main_styles',
  			[
  				'label' => esc_html__( 'Dropdown Container', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);

$this->add_responsive_control(
			'sub_menu_container_radius',
			[
				'label' => esc_html__( 'Border Radius', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .sub-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'sub_menu_container_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .sub-menu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
        
        
		$this->add_control(
			'sub_menu_main_bg_color',
			[
				'label' => esc_html__( 'Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .sub-menu' => 'background-color: {{VALUE}};',
                    '{{WRAPPER}} .sf-menu-boosted-elements .sub-menu:after' => 'border-bottom-color: {{VALUE}};',
				],
                'default' => '#232323',
			]
		);

$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'sub_menu_drop_border',
				'selector' => '{{WRAPPER}} .sf-menu-boosted-elements .sub-menu',
			]
		);
        
        
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			[
				'name' => 'sub_menu_drop_shadow',
				'selector' => '{{WRAPPER}} .sf-menu-boosted-elements .sub-menu',
			]
		);
        
		$this->add_control(
			'drop_down_menu_min_width',
			[
				'label' => esc_html__( 'Dropdown Minimum Width (px)', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 500,
					],
				],
                'size_units' => [ 'px' ],
				'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements ul.sub-menu' => 'min-width: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
		$this->add_control(
			'drop_down_menu_offset',
			[
				'label' => esc_html__( 'Dropdown Menu Offset(px)', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 100,
					],
				],
                'size_units' => [ 'px' ],
				'separator' => 'before',
				'selectors' => [
                    '{{WRAPPER}} .sf-menu-boosted-elements ul.narrow-fix-boosted' => 'margin-right: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .sf-menu-boosted-elements ul.sub-menu ul.sub-menu' => 'margin-left: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
        $this->end_controls_section();
        
        
        
  		$this->start_controls_section(
  			'section_sub_menu_font_styles',
  			[
  				'label' => esc_html__( 'Dropdown Styles', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);
        
        
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
             'name' => 'sub_menu_link_typography',
				'scheme' => \Elementor\Core\Schemes\Typography::TYPOGRAPHY_1,
				'selector' => '{{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li:last-child li a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item a.boosted-nav-link-def, {{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def',
			]
		);
        
        
        
        
		$this->start_controls_tabs( 'sub_menu_typography_tabs' );

$this->start_controls_tab( 'sub_menu_normal', [ 'label' => esc_html__( 'Normal', 'boosted-elements-progression' ) ] );

$this->add_control(
			'sub_menu_font_nav_color',
			[
				'label' => esc_html__( 'Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted .sub-menu a.boosted-nav-link-def, {{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def' => 'color: {{VALUE}};',
				],
                'default' => '#777777',
			]
		);

$this->add_control(
			'sub_menu_font_background',
			[
				'label' => esc_html__( 'Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted .sub-menu a.boosted-nav-link-def, {{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def' => 'background-color: {{VALUE}};',
				],
                'default' => '#f4f4f4',
			]
		);
        
		
		$this->end_controls_tab();

$this->start_controls_tab( 'bsub_menu_hover', [ 'label' => esc_html__( 'Hover', 'boosted-elements-progression' ) ] );

$this->add_control(
			'sub_menu_font_color_hover',
			[
				'label' => esc_html__( 'Hover Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover' => 'color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'sub_menu_font_background_hover',
			[
				'label' => esc_html__( 'Hover Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item li .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover,
{{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted li.sfHover-boosted a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements li.menu-item.sfHover-boosted .sub-menu a.boosted-nav-link-def:hover' => 'background-color: {{VALUE}};',
				],
                'default' => '#ebebeb',
			]
		);

$this->end_controls_tab();
        
     
		
		$this->end_controls_tabs();
        
        
        
        
		$this->add_control(
			'sub_menu_item_border_color',
			[
				'label' => esc_html__( 'Border Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
                'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li:last-child li:last-child li:last-child li:last-child li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li:last-child li:last-child li:last-child li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li:last-child li:last-child li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li:last-child li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item:last-child li a.boosted-nav-link-def, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item a.boosted-nav-link-def' => 'border-color: {{VALUE}};',
                    '{{WRAPPER}} .menu-item-has-children .mobile-drop-down-icon-boosted:after' => 'background: {{VALUE}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'sub_menu_link_radius',
			[
				'label' => esc_html__( 'Border Radius', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
                'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .sub-menu a.boosted-nav-link-def' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'sub_menu_item_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements.sf-arrows .sub-menu .sf-with-ul, {{WRAPPER}} .sf-menu-boosted-elements .sub-menu a.boosted-nav-link-def' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'sub_menu_item_margins',
			[
				'label' => esc_html__( 'Margin', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sf-menu-boosted-elements .sub-menu li.menu-item' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_control(
			'main_sub_menu_drop_down_arrow_size',
			[
				'label' => esc_html__( 'Dropdown Toggle Font Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 60,
					],
				],
                'size_units' => [ 'px' ],
				'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} .sub-menu .menu-item-has-children .drop-down-icon-boosted' => 'font-size: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->end_controls_section();
        
        
  		$this->start_controls_section(
  			'section_font_awesome_main',
  			[
  				'label' => esc_html__( 'FontAwesome Icon Styles', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);

$this->start_controls_tabs( 'fontawesome_icon_tabs' );

$this->start_controls_tab( 'fontawesome_icon_normal', [ 'label' => esc_html__( 'Normal', 'boosted-elements-progression' ) ] );

$this->add_control(
			'fontaweosme_color_normal',
			[
				'label' => esc_html__( 'Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-fa-icon-custom' => 'color: {{VALUE}}; transition-duration:200ms; transition-property: color;transition-timing-function: ease-in-out;',
				],
			]
		);

$this->end_controls_tab();

$this->start_controls_tab( 'fontawesome_icon_hover', [ 'label' => esc_html__( 'Hover', 'boosted-elements-progression' ) ] );

$this->add_control(
			'fontawesome_color_hover',
			[
				'label' => esc_html__( 'Active/Hover Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} a:hover .boosted-elements-fa-icon-custom, {{WRAPPER}} .current-menu-item a .boosted-elements-fa-icon-custom' => 'color: {{VALUE}};',
				],
			]
		);

$this->end_controls_tab();
        
     
		
		$this->end_controls_tabs();
        
        
        
		$this->add_responsive_control(
			'font_awesome_icon_size',
			[
				'label' => esc_html__( 'Icon Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 60,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-fa-icon-custom' => 'font-size: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'fontwwesome_icon_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-fa-icon-custom' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'fontawesome_vertical_position',
			[
				'label' => esc_html__( 'Vertical Position', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => -50,
						'max' => 50,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-fa-icon-custom' => 'top: {{SIZE}}{{UNIT}}; position:relative;',
				],
			]
		);
        
        $this->add_control(
        			'font_awesome_drop_down_heading',
        			[
        				'label' => __( 'Icon in Dropdown', 'plugin-name' ),
        				'type' => \Elementor\Controls_Manager::HEADING,
        				'separator' => 'before',
        			]
        );
        
        
		$this->start_controls_tabs( 'dropdown_fontawesome_icon_tabs' );

$this->start_controls_tab( 'dropdown_fontawesome_icon_normal', [ 'label' => esc_html__( 'Normal', 'boosted-elements-progression' ) ] );

$this->add_control(
			'dropdown_fontaweosme_color_normal',
			[
				'label' => esc_html__( 'Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sub-menu .boosted-elements-fa-icon-custom' => 'color: {{VALUE}};',
				],
			]
		);

$this->end_controls_tab();

$this->start_controls_tab( 'dropdown_fontawesome_icon_hover', [ 'label' => esc_html__( 'Hover', 'boosted-elements-progression' ) ] );

$this->add_control(
			'dropdown_fontawesome_color_hover',
			[
				'label' => esc_html__( 'Hover Text Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .sub-menu a:hover .boosted-elements-fa-icon-custom' => 'color: {{VALUE}};',
				],
			]
		);

$this->end_controls_tab();
        
     
		
		$this->end_controls_tabs();
        
        
        
        
		$this->add_responsive_control(
			'dropdown_font_awesome_icon_size',
			[
				'label' => esc_html__( 'Icon Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 60,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .sub-menu .boosted-elements-fa-icon-custom' => 'font-size: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'dropdown_fontwwesome_icon_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .sub-menu .boosted-elements-fa-icon-custom' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
		$this->add_responsive_control(
			'drop_down_fontawesome_vertical_position',
			[
				'label' => esc_html__( 'Vertical Position', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => -50,
						'max' => 50,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .sub-menu .boosted-elements-fa-icon-custom' => 'top: {{SIZE}}{{UNIT}}; position:relative;',
				],
			]
		);

$this->end_controls_section();
        
        
        
        
  		$this->start_controls_section(
  			'section_mobile_menu_menu_container',
  			[
  				'label' => esc_html__( 'Mobile Menu Container', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);
        
		$this->add_control(
			'boosted_elements_mobile_container_background',
			[
				'label' => esc_html__( 'Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-menu-list-container' => 'background-color: {{VALUE}};',
				],
			]
		);
        
		$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'boosted_elements_mobile_container_border',
				'selector' => '{{WRAPPER}} .boosted-elements-mobile-menu-list-container',
			]
		);
        
		$this->add_responsive_control(
			'mobile_container_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-menu-list-container' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);

$this->add_responsive_control(
			'boosted_elements_mobile_container_radius',
			[
				'label' => esc_html__( 'Border Radius', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-menu-list-container' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
        
        
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			[
				'name' => 'mobile_menu-container',
				'selector' => '{{WRAPPER}} .boosted-elements-mobile-menu-list-container',
			]
		);
        
	
		$this->end_controls_section();
        
  		$this->start_controls_section(
  			'section_mobile_menu_icon_styles',
  			[
  				'label' => esc_html__( 'Mobile Toggle Icon', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);
        
        
        
        
		$this->start_controls_tabs( 'boosted_mobile_icon_tabs' );

$this->start_controls_tab( 'mobile_icon_normal', [ 'label' => esc_html__( 'Normal', 'boosted-elements-progression' ) ] );

$this->add_control(
			'boosted_elements_mobile_icon_color',
			[
				'label' => esc_html__( 'Icon Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-i' => 'color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'boosted_elements_mobile_icon_background',
			[
				'label' => esc_html__( 'Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-i' => 'background-color: {{VALUE}};',
				],
			]
		);

$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'boosted_elements_mobile_icon_border',
				'selector' => '{{WRAPPER}} .boosted-elements-mobile-i',
			]
		);
		
		
		$this->end_controls_tab();
        
        $this->start_controls_tab( 'mobile_icon_active', [ 'label' => esc_html__( 'Active', 'boosted-elements-progression' ) ] );
        
		$this->add_control(
			'boosted_elements_mobile_icon_color_active',
			[
				'label' => esc_html__( 'Active Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-icon-active .boosted-elements-mobile-i' => 'color: {{VALUE}};',
				],
			]
		);
        
		$this->add_control(
			'boosted_elements_mobile_icon_background_active',
			[
				'label' => esc_html__( 'Active Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-icon-active .boosted-elements-mobile-i' => 'background-color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'boosted_elements_mobile_icon_border_active',
			[
				'label' => esc_html__( 'Active Border Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-icon-active .boosted-elements-mobile-i' => 'border-color: {{VALUE}};',
				],
			]
		);
        
        
		$this->end_controls_tab();
		
		$this->end_controls_tabs();
        
        
        
        
		$this->add_responsive_control(
			'nav_toggle-size',
			[
				'label' => esc_html__( 'Toggle Icon Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 60,
					],
				],
                'separator' => 'before',
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-i' => 'font-size: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
		$this->add_responsive_control(
			'nav_toggle_width',
			[
				'label' => esc_html__( 'Toggle Width', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 200,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-i' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
		$this->add_responsive_control(
			'nav_toggle_height',
			[
				'label' => esc_html__( 'Toggle Height', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 200,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-i' => 'height: {{SIZE}}{{UNIT}}; line-height: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
		$this->add_responsive_control(
			'mobile_icon_margins',
			[
				'label' => esc_html__( 'Margin', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
				'selectors' => [
					'{{WRAPPER}} .boosted-elements-mobile-i' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
        
        
        
        $this->end_controls_section();
        
        
  		$this->start_controls_section(
  			'section_mobile_menu_menu_styles',
  			[
  				'label' => esc_html__( 'Mobile Menu Links', 'boosted-elements-progression' ),
				'tab' => Controls_Manager::TAB_STYLE
  			]
  		);

$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
             'name' => 'section_title_mobile_menu_typography',
				'scheme' => \Elementor\Core\Schemes\Typography::TYPOGRAPHY_1,
				'selector' => '{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def',
			]
		);
        
		
		$this->add_control(
			'boosted_elements_mobile_menu_color',
			[
				'label' => esc_html__( 'Link Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def' => 'color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'boosted_elements_mobile_menu_background',
			[
				'label' => esc_html__( 'Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def' => 'background-color: {{VALUE}};',
				],
			]
		);

$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'boosted_elements_mobile_menu_border',
				'selector' => '{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def',
			]
		);
        
		$this->add_responsive_control(
			'sub_menu_mobile_list_padding',
			[
				'label' => esc_html__( 'Padding', 'boosted-elements-progression' ),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => [ 'px', 'em', '%' ],
                'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item a.boosted-nav-link-def,
{{WRAPPER}} .menu-item-has-children .mobile-drop-down-icon-boosted' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
        
        $this->add_control(
        			'mobile_sub_menu_heading',
        			[
        				'label' => __( 'Sub-Menu Styles', 'plugin-name' ),
        				'type' => \Elementor\Controls_Manager::HEADING,
        				'separator' => 'before',
        			]
        		);
        
		$this->add_control(
			'boosted_elements_sub_menu_mobile_menu_color',
			[
				'label' => esc_html__( 'Sub-menu Link Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item li a.boosted-nav-link-def' => 'color: {{VALUE}};',
				],
			]
		);
        
		$this->add_control(
			'boosted_elements_mobile_menu_sub_menu_darken',
			[
				'label' => esc_html__( 'Sub-menu Background Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item li a.boosted-nav-link-def' => 'background-color: {{VALUE}};',
				],
			]
		);
        
        
        
		$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'boosted_elements_mobile_sub_menu_border',
				'selector' => '{{WRAPPER}} ul.boosted-elements-mobile-menu-list li.menu-item li a.boosted-nav-link-def',
			]
		);
        
        
        $this->add_control(
        			'sub_menu_toggle_heading',
        			[
        				'label' => __( 'Toggle Styles', 'plugin-name' ),
        				'type' => \Elementor\Controls_Manager::HEADING,
        				'separator' => 'before',
        			]
        		);
        
        
		$this->add_control(
			'sub_menu_drop_down_arrow_size',
			[
				'label' => esc_html__( 'Sub-Menu Toggle Font Size', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 60,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .menu-item-has-children .mobile-drop-down-icon-boosted' => 'font-size: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
		$this->add_control(
			'sub_menu_drop_down_toggle_width',
			[
				'label' => esc_html__( 'Sub-Menu Toggle Width', 'boosted-elements-progression' ),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 250,
					],
				],
                'size_units' => [ 'px' ],
				'selectors' => [
					'{{WRAPPER}} .menu-item-has-children .mobile-drop-down-icon-boosted:after' => 'right: {{SIZE}}{{UNIT}};',
				],
			]
		);
        
        
		$this->add_control(
			'boosted_elements_sub_menu_toggle_mobile_menu_color',
			[
				'label' => esc_html__( 'Sub-Menu Toggle Color', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .menu-item-has-children .mobile-drop-down-icon-boosted' => 'color: {{VALUE}};',
				],
			]
		);
        
		$this->add_control(
			'boosted_elements_sub_menu_toggle_mobile_menu_border_color',
			[
				'label' => esc_html__( 'Sub-Menu Toggle Border', 'boosted-elements-progression' ),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .menu-item-has-children .mobile-drop-down-icon-boosted:after' => 'background: {{VALUE}};',
				],
			]
		);

$this->end_controls_section();
        
        
        
	}

protected function render( ) {
        $settings = $this->get_settings();
	?>
    
    <div class="boosted-elements-breakpoint-container<?php if ( $settings['break_point_menu'] == 'mobile' ) : ?> boosted-menu-mobile-break<?php endif; ?><?php if ( $settings['break_point_menu'] == 'tablet' ) : ?> boosted-menu-tablet-break<?php endif; ?><?php if ( $settings['break_point_menu'] == 'always' ) : ?> boosted-menu-awlays-break<?php endif; ?>">
	<div id="boosted-elements-menu-<?php echo esc_attr($this->get_id()); ?>">
		<div class="boosted-elements-main-menu-container">
            <div class="boosted-elements-menu-align<?php if ( $settings['menu_align_elements'] == 'justify' ) : ?> justified-boosted-nav<?php endif; ?>">
    		    <?php 
                wp_nav_menu( array(
                    'menu' => $settings['menu_select'], 
                    'menu_class' => 'sf-menu-boosted-elements', 
                    'link_before' => '<div class="item-underline-nav-boosted"><span class="boosted-elements-arrow-on-hover-menu"><i class="fas fa-circle"></i></span><span class="boosted-elements-menu-hover-text">', 
                    'link_after' => '</span><span class="drop-down-icon-boosted"><i class="' . $settings['sub_menu_indicator'] . '"></i></span></div>', 
                    'fallback_cb' => false,
                    'walker'  => new \Boosted_Elements_Mega_Walker
                ) ); 
                ?>
    		</div>
        </div>
	</div>
    
    
    <?php if ( ! empty( $settings['mobile_menu_icon'] ) ) : ?>
    <div id="boosted-elements-mobile-menu-<?php echo esc_attr($this->get_id()); ?>">
        <div class="boosted-elements-mobile-menu-container">
            <div class="boosted-elements-mobile-icon-align"><div class="boosted-elements-mobile-i"><?php \Elementor\Icons_Manager::render_icon( $settings['mobile_menu_icon'], [ 'aria-hidden' => 'true', 'class' => 'fa-fw boosted-elements-mobile-default-icon'] ); ?><i class="fas fa-times fa-fw"></i></div></div>
            
            <div class="boosted-elements-mobile-menu-list-container">
                <?php if ( $settings['custom_mobile_menu'] == 'yes' ) : ?>
                        <?php 
                        wp_nav_menu( array(
                            'menu' => $settings['mobile_menu_select'], 
                            'menu_class' => 'boosted-elements-mobile-menu-list', 
                            'before' => '<div class="mobile-item-nav-boosted">', 
                            'link_before' => '<span class="boosted-elements-sub-menu-padding">', 
                            'link_after' => '</span>', 
                            'after' => '<span class="mobile-drop-down-icon-boosted"><i class="' . $settings['sub_menu_indicator'] . '"></i></span></div>', 
                            'fallback_cb' => false,
                            'walker'  => new \Boosted_Elements_Mega_Walker
                        )); 
                        ?>
                    <?php else: ?>
                        <?php 
                        wp_nav_menu( array(
                            'menu' => $settings['menu_select'], 
                            'menu_class' => 'boosted-elements-mobile-menu-list', 
                            'before' => '<div class="mobile-item-nav-boosted">', 
                            'link_before' => '<span class="boosted-elements-sub-menu-padding">', 
                            'link_after' => '</span>', 
                            'after' => '<span class="mobile-drop-down-icon-boosted"><i class="' . $settings['sub_menu_indicator'] . '"></i></span></div>', 
                            'fallback_cb' => false,
                            'walker'  => new \Boosted_Elements_Mega_Walker
                        ));
                        ?>
                <?php endif; ?>
            </div>
        </div>
    </div>
    <?php endif; ?>
    </div>

// Shouldn't be necessary, but just doing the straight math
        		       // on dimensions can still allow the menu to float off screen
        		       // by a little bit.
        		       ul_width = ul_width + 50;

if((ul_offset.left+ul_width > w-(ul_width/2)) && (ul_offset.left-ul_width > 0)) {
        		          $(this).addClass('narrow-fix-boosted');
        		       }
        		       else {
        		          $(this).removeClass('narrow-fix-boosted');
        		       }
        		    };
        		 }
                 
          	 });

$('#boosted-elements-mobile-menu-<?php echo esc_attr($this->get_id()); ?> .boosted-elements-mobile-i').on('click', function(e){
         		e.preventDefault();
         		$('#boosted-elements-mobile-menu-<?php echo esc_attr($this->get_id()); ?> .boosted-elements-mobile-menu-list-container').slideToggle(350);
         		$("#boosted-elements-mobile-menu-<?php echo esc_attr($this->get_id()); ?> .boosted-elements-mobile-icon-align").toggleClass("boosted-elements-icon-active");
         	});
            
         	$('#boosted-elements-mobile-menu-<?php echo esc_attr($this->get_id()); ?> .boosted-elements-mobile-menu-list .menu-item-has-children .mobile-drop-down-icon-boosted').on('click', function(e){
         		e.preventDefault();
                $(this).toggleClass('boosted-elements-show-sub-menu');
                $(this).parent().closest('.menu-item-has-children').find('.sub-menu:first').slideToggle(350);
         	});
            
         
            
            
    	});
    	</script>
    
    
	
	<?php
	
	}

protected function content_template(){}

}

Plugin::instance()->widgets_manager->register_widget_type( new Widget_BoostedElementsNavi() );