forbidals

Back Back Up Advanced Editor

<?php
/**
 * Elementor rsgallery Widget.
 *
 * Elementor widget that inserts an embbedable content into the page, from any given URL.
 *
 * @since 1.0.0
 */
use Elementor\Group_Control_Css_Filter;
use Elementor\Repeater;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Image_Size;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Background;
use Elementor\Utils;

defined('ABSPATH') || die();

class Rsaddon_Portfolio_Slider_Pro_Widget extends \Elementor\Widget_Base
{

/**
	 * Get widget name.
	 *
	 * Retrieve rsgallery widget name.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget name.
	 */
	public function get_name()
	{
		return 'portfolio-slider';
	}

/**
	 * Get widget title.
	 *
	 * Retrieve rsgallery widget title.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget title.
	 */
	public function get_title()
	{
		return __('RS Portfolio Slider', 'rsaddon');
	}

/**
	 * Get widget icon.
	 *
	 * Retrieve rsgallery widget icon.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget icon.
	 */
	public function get_icon()
	{
		return 'rs-badge';
	}

/**
	 * Get widget categories.
	 *
	 * Retrieve the list of categories the rsgallery widget belongs to.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return array Widget categories.
	 */
	public function get_categories()
	{
		return ['rsaddon_category'];
	}

/**
	 * Register rsgallery widget controls.
	 *
	 * Adds different input fields to allow the user to change and customize the widget settings.
	 *
	 * @since 1.0.0
	 * @access protected
	 */
	protected function register_controls()
	{

$post_dropdown[0] = 'Select Portfolio';
		$wp_portfolio_query = new wp_Query(array(
			'post_type'      => 'portfolios',
			'posts_per_page' => '-1',
		));

if ($wp_portfolio_query->have_posts()) :
			while ($wp_portfolio_query->have_posts()) : $wp_portfolio_query->the_post();
				$id    = get_the_ID($wp_portfolio_query->ID);
				$title = get_the_title($wp_portfolio_query->ID);
				$post_dropdown[$id] = $title;
			endwhile;
			wp_reset_query();
		endif;

$this->start_controls_section(
			'content_section',
			[
				'label' => esc_html__('Content', 'rsaddon'),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);

$this->add_control(
			'portfolio_slider_style',
			[
				'label'   => esc_html__('Select Style', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => '1',
				'options' => [
					'1' => 'Style 1',
					'2' => 'Style 2',
					'3' => 'Style 3',
					'4' => 'Style 4',
					'5' => 'Style 5',
				],
			]
		);
		$this->add_control(
			'portfolio_is_manual_selection',
			[
				'label' => esc_html__('Select Portfolio by:', 'prelements'),
				'type' => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'yes'       => esc_html__('Selected Portfolio', 'prelements'),
					''        => esc_html__('Category Portfolio', 'prelements'),
				],
			]
		);
		$this->add_control(
			'portfolio_category',
			[
				'label'   => esc_html__('Category', 'rsaddon'),
				'type'    => Controls_Manager::SELECT2,
				'default' => 0,
				'options' => $this->getCategories(),
				'multiple' => true,
				'condition' => ['portfolio_is_manual_selection' => ''],
				'separator' => 'before',
			]
		);
		$this->add_control(
			'select_portfolio_item',
			[
				'label'   => esc_html__('Select Portfolio', 'prelements'),
				'type'    => Controls_Manager::SELECT2,
				'default' => 0,
				'options' => [] + $post_dropdown,
				'multiple' => true,
				'condition' => ['portfolio_is_manual_selection' => 'yes'],
			]
		);
		$this->add_control(
			'per_page',
			[
				'label' => esc_html__('Portfolio Show Per Page', 'rsaddon'),
				'type' => Controls_Manager::TEXT,
				'placeholder' => esc_html__('example 3', 'rsaddon'),
				'separator' => 'before'
			]
		);

$this->add_group_control(
			Group_Control_Image_Size::get_type(),
			[
				'name' => 'thumbnail',
				'default' => 'large',
				'separator' => 'before',
				'separator' => 'before',
			]
		);
		$this->add_control(
			'cat_show_hide',
			[
				'label' => esc_html__('Show Category', 'rsaddon'),
				'type' => Controls_Manager::SWITCHER,
				'label_on' => esc_html__('Show', 'rsaddon'),
				'label_off' => esc_html__('Hide', 'rsaddon'),
				'return_value' => 'yes',
				'default' => 'yes',
				'separator' => 'before',
			]
		);
		$this->add_control(
			'desc_show_hide',
			[
				'label' => esc_html__('Show Description', 'rsaddon'),
				'type' => Controls_Manager::SWITCHER,
				'label_on' => esc_html__('Show', 'rsaddon'),
				'label_off' => esc_html__('Hide', 'rsaddon'),
				'return_value' => 'yes',
				'default' => 'no',
				'separator' => 'before',
				'condition' => [
					'portfolio_slider_style' => '4'
				]
			]
		);
		$this->add_control(
			'btn__show_hide',
			[
				'label' => esc_html__('Button Show', 'rsaddon'),
				'type' => Controls_Manager::SWITCHER,
				'label_on' => esc_html__('Show', 'rsaddon'),
				'label_off' => esc_html__('Hide', 'rsaddon'),
				'return_value' => 'yes',
				'separator' => 'before',
			]
		);
		$this->add_control(
			'btn__title',
			[
				'label' => esc_html__('Button Title', 'rsaddon'),
				'type' => \Elementor\Controls_Manager::TEXT,
				'default' => esc_html__('View Project', 'rsaddon'),
				'placeholder' => esc_html__('Button Title', 'rsaddon'),
				'condition' => [
					'btn__show_hide' => 'yes'
				],
			]
		);
		$this->add_control(
			'btn__icon',
			[
				'label' => esc_html__('Icon', 'rsaddon'),
				'type' => \Elementor\Controls_Manager::ICONS,
				'default' => [
					'value' => 'fas fa-star',
					'library' => 'fa-solid',
				],
				'condition' => [
					'btn__show_hide' => 'yes'
				],
			]
		);

$this->add_control(
			'number_show_hide',
			[
				'label' => esc_html__('Number Enable?', 'rsaddon'),
				'type' => Controls_Manager::SWITCHER,
				'label_on' => esc_html__('Show', 'rsaddon'),
				'label_off' => esc_html__('Hide', 'rsaddon'),
				'return_value' => 'yes',
				'default' => 'yes',
				'separator' => 'before',
				'condition' => ['portfolio_slider_style' => '2']
			]
		);

$this->add_control(
			'clip_path',
			[
				'label' => esc_html__('Clip Path ON/OFF?', 'rsaddon'),
				'type' => \Elementor\Controls_Manager::SWITCHER,
				'label_on' => esc_html__('Show', 'rsaddon'),
				'label_off' => esc_html__('Hide', 'rsaddon'),
				'return_value' => 'yes',
				'default' => 'no',
				'condition' => ['portfolio_slider_style' => '4']
			]
		);

$this->end_controls_section();

$this->start_controls_section(
			'content_slider',
			[
				'label' => esc_html__('Slider Settings', 'rsaddon'),
				'tab' => Controls_Manager::TAB_CONTENT,
			]
		);
		$this->add_control(
			'col_lg',
			[
				'label'   => esc_html__('Desktops > 1199px', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 3,
				'options' => [
					'1' => esc_html__('1 Column', 'rsaddon'),
					'2' => esc_html__('2 Column', 'rsaddon'),
					'3' => esc_html__('3 Column', 'rsaddon'),
					'4' => esc_html__('4 Column', 'rsaddon'),
					'5' => esc_html__('5 Column', 'rsaddon'),
					'6' => esc_html__('6 Column', 'rsaddon'),
				],
				'separator' => 'before',

]
		);
		$this->add_control(
			'col_lg_2',
			[
				'label'   => esc_html__('Desktops < 1199px', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 3,
				'options' => [
					'1' => esc_html__('1 Column', 'rsaddon'),
					'2' => esc_html__('2 Column', 'rsaddon'),
					'3' => esc_html__('3 Column', 'rsaddon'),
					'4' => esc_html__('4 Column', 'rsaddon'),
					'5' => esc_html__('5 Column', 'rsaddon'),
					'6' => esc_html__('6 Column', 'rsaddon'),
				],
				'separator' => 'before',

]
		);
		$this->add_control(
			'col_md',
			[
				'label'   => esc_html__('Desktops > 991px', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 3,
				'options' => [
					'1' => esc_html__('1 Column', 'rsaddon'),
					'2' => esc_html__('2 Column', 'rsaddon'),
					'3' => esc_html__('3 Column', 'rsaddon'),
					'4' => esc_html__('4 Column', 'rsaddon'),
					'6' => esc_html__('6 Column', 'rsaddon'),
				],
				'separator' => 'before',
			]
		);
		$this->add_control(
			'col_sm',
			[
				'label'   => esc_html__('Tablets > 767px', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 2,
				'options' => [
					'1' => esc_html__('1 Column', 'rsaddon'),
					'2' => esc_html__('2 Column', 'rsaddon'),
					'3' => esc_html__('3 Column', 'rsaddon'),
					'4' => esc_html__('4 Column', 'rsaddon'),
					'6' => esc_html__('6 Column', 'rsaddon'),
				],
				'separator' => 'before',

]
		);

$this->add_control(
			'col_xs',
			[
				'label'   => esc_html__('Tablets < 768px', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 1,
				'options' => [
					'1' => esc_html__('1 Column', 'rsaddon'),
					'2' => esc_html__('2 Column', 'rsaddon'),
					'3' => esc_html__('3 Column', 'rsaddon'),
					'4' => esc_html__('4 Column', 'rsaddon'),
					'6' => esc_html__('6 Column', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slides_ToScroll',
			[
				'label'   => esc_html__('Slide To Scroll', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 2,
				'options' => [
					'1' => esc_html__('1 Item', 'rsaddon'),
					'2' => esc_html__('2 Item', 'rsaddon'),
					'3' => esc_html__('3 Item', 'rsaddon'),
					'4' => esc_html__('4 Item', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_dots',
			[
				'label'   => esc_html__('Navigation Dots', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'false',
				'options' => [
					'true' => esc_html__('Enable', 'rsaddon'),
					'false' => esc_html__('Disable', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_dots_style',
			[
				'label'   => esc_html__('Dots Style', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'default',
				'options' => [
					'default' => esc_html__('Default', 'rsaddon'),
					'2' => esc_html__('Style 2', 'rsaddon'),
				],
				'condition' => [
					'slider_dots' => 'true',
				]
			]

);
		$this->add_control(
			'slider_nav',
			[
				'label'   => esc_html__('Navigation Nav', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'false',
				'options' => [
					'true' => esc_html__('Enable', 'rsaddon'),
					'false' => esc_html__('Disable', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_autoplay',
			[
				'label'   => esc_html__('Autoplay', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'false',
				'options' => [
					'true' => esc_html__('Enable', 'rsaddon'),
					'false' => esc_html__('Disable', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_autoplay_speed',
			[
				'label'   => esc_html__('Autoplay Slide Speed', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 3000,
				'options' => [
					'1000' => esc_html__('1 Seconds', 'rsaddon'),
					'2000' => esc_html__('2 Seconds', 'rsaddon'),
					'3000' => esc_html__('3 Seconds', 'rsaddon'),
					'4000' => esc_html__('4 Seconds', 'rsaddon'),
					'5000' => esc_html__('5 Seconds', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_stop_on_hover',
			[
				'label'   => esc_html__('Stop on Hover', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'false',
				'options' => [
					'true' => esc_html__('Enable', 'rsaddon'),
					'false' => esc_html__('Disable', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_interval',
			[
				'label'   => esc_html__('Autoplay Interval', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 3000,
				'options' => [
					'5000' => esc_html__('5 Seconds', 'rsaddon'),
					'4000' => esc_html__('4 Seconds', 'rsaddon'),
					'3000' => esc_html__('3 Seconds', 'rsaddon'),
					'2000' => esc_html__('2 Seconds', 'rsaddon'),
					'1000' => esc_html__('1 Seconds', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_loop',
			[
				'label'   => esc_html__('Loop', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'false',
				'options' => [
					'true' => esc_html__('Enable', 'rsaddon'),
					'false' => esc_html__('Disable', 'rsaddon'),
				],
				'separator' => 'before',

]

);
		$this->add_control(
			'slider_centerMode',
			[
				'label'   => esc_html__('Center Mode', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => 'false',
				'options' => [
					'true' => esc_html__('Enable', 'rsaddon'),
					'false' => esc_html__('Disable', 'rsaddon'),
				],
				'separator' => 'before',
			]
		);
		$this->add_control(
			'slider_centers_pad_xl',
			[
				'label'   => esc_html__('Center Mode Padding (XL)', 'rsaddon'),
				'type' => Controls_Manager::TEXT,
				'default' => '',
				'separator' => 'before',
				'condition' => [
					'slider_centerMode' => 'true',
				]
			]
		);
		$this->add_control(
			'slider_centers_pad_lg',
			[
				'label'   => esc_html__('Center Mode Padding (LG)', 'rsaddon'),
				'type' => Controls_Manager::TEXT,
				'default' => '',
				'separator' => 'before',
				'condition' => [
					'slider_centerMode' => 'true',
				]
			]
		);
		$this->add_control(
			'slider_centers_pad_md',
			[
				'label'   => esc_html__('Center Mode Padding (MD)', 'rsaddon'),
				'type' => Controls_Manager::TEXT,
				'default' => '',
				'separator' => 'before',
				'condition' => [
					'slider_centerMode' => 'true',
				]
			]
		);
		$this->add_responsive_control(
			'item_gap_custom',
			[
				'label' => esc_html__('Item Gap', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['%', 'px', 'custom'],
				'show_label' => true,
				'range' => [
					'px' => [
						'max' => 100,
					],
				],
				'default' => [
					'size' => 15,
				],

'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .grid-item' => 'padding:0 {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'item_gap_custom_margin',
			[
				'label' => esc_html__('Item Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%', 'custom'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .grid-item' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',

],
			]
		);

$this->end_controls_section();

$this->start_controls_section(
			'section_slider_style',
			[
				'label' => esc_html__('General Section', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);
		$this->add_responsive_control(
			'align',
			[
				'label' => esc_html__('Alignment', 'rsaddon'),
				'type' => Controls_Manager::CHOOSE,
				'options' => [
					'left' => [
						'title' => esc_html__('Left', 'rsaddon'),
						'icon' => 'eicon-text-align-left',
					],
					'center' => [
						'title' => esc_html__('Center', 'rsaddon'),
						'icon' => 'eicon-text-align-center',
					],
					'right' => [
						'title' => esc_html__('Right', 'rsaddon'),
						'icon' => 'eicon-text-align-right',
					],
				],
				'toggle' => true,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item' => 'text-align: {{VALUE}};'
				],
			]
		);
		$this->add_responsive_control(
			'item_margin',
			[
				'label' => esc_html__('Item Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'item_padding',
			[
				'label' => esc_html__('Item Padding', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'item_border_radius',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'item_border',
				'selector' => '
						{{WRAPPER}} .rs-portfolio .portfolio-item',
			]
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			[
				'name' => 'item_box_shadow',
				'exclude' => [
					'box_shadow_position',
				],
				'selector' => '{{WRAPPER}} .rs-portfolio .portfolio-item',
			]
		);

$this->end_controls_section();

// image section start
		$this->start_controls_section(
			'section_slider_style_image',
			[
				'label' => esc_html__('Image Style', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);
		$this->add_responsive_control(
			'image_wrapper_width',
			[
				'label'      => esc_html__('Image Wrapper Width', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-img' => 'width: {{SIZE}}{{UNIT}}; flex: 0 0 {{SIZE}}{{UNIT}}; min-width: auto !important;',
				],
			]
		);
		$this->add_responsive_control(
			'image__width',
			[
				'label'      => esc_html__('Image Width', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-img img' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_responsive_control(
			'image_wrapper_margin',
			[
				'label' => esc_html__('Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-img' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'image_wrapper_padding',
			[
				'label' => esc_html__('Padding', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-img' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'image_wrapper_border_radius',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-img, {{WRAPPER}} .rs-portfolio-style5 .portfolio-item:hover .portfolio-img::before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}; overflow: hidden;',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'image_wrapper_border',
				'selector' => '
						{{WRAPPER}} .rs-portfolio .portfolio-img',
			]
		);
		$this->add_control(
			'image_hover_overlay_color_heading',
			[
				'label' => esc_html__('Image Hover Overlay Background', 'rsaddon'),
				'type' => \Elementor\Controls_Manager::HEADING,
				'separator' => 'before',
			]
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name' => 'image_hover_overlay_color',
				'types' => ['classic', 'gradient'],
				'selector' => '
						{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-img .img-overlay',
			]
		);
		$this->add_responsive_control(
			'image_opacity',
			[
				'label' => esc_html__( 'Overlay Opacity', 'rsaddon' ),
				'type' => Controls_Manager::SLIDER,
				'show_label' => true,
				'size_units' => [ 'px' ],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => 0.1,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-img .img-overlay' => 'opacity: {{SIZE}};',                   
				],
				'condition' => ['portfolio_slider_style' => '4']
			]
		);

$this->add_responsive_control(
			'image_hover_opacity',
			[
				'label' => esc_html__( 'Overlay Opacity Hover', 'rsaddon' ),
				'type' => Controls_Manager::SLIDER,
				'show_label' => true,
				'size_units' => [ 'px' ],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => 0.1,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item:hover .portfolio-img .img-overlay' => 'opacity: {{SIZE}};',
				],
				'condition' => ['portfolio_slider_style' => '4']
			]
		);
		$this->end_controls_section();
		// image section end

$this->start_controls_section(
			'section_slider_style_title',
			[
				'label' => esc_html__('Title Style', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);
		
			$this->add_control(
				'title_hover_line_color',
				[
					'label' => esc_html__( 'Line Color', 'prelements' ),
					'type' => Controls_Manager::COLOR,
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio-style4 .portfolio-item .portfolio-content .p-title a' => 'background-image: linear-gradient(to bottom, {{VALUE}} 0%, {{VALUE}} 100%);',
					], 
					'condition' => ['portfolio_slider_style' => '4'] 
							
				]
			);
			
			$this->add_group_control(
				Group_Control_Typography::get_type(),
				[
					'name' => 'title_typography',
					'label' => esc_html__('Title Typography', 'rsaddon'),
					'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .p-title a,{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .p-title',
				]
			);
			$this->add_responsive_control(
				'title_margin',
				[
					'label' => esc_html__('Title Margin', 'rsaddon'),
					'type' => Controls_Manager::DIMENSIONS,
					'size_units' => ['px', 'em', '%'],
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					],
				]
			);
			$this->add_responsive_control(
				'title_padding',
				[
					'label' => esc_html__('Title Padding', 'rsaddon'),
					'type' => Controls_Manager::DIMENSIONS,
					'size_units' => ['px', 'em', '%'],
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
						'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					],
				]
			);
			$this->add_responsive_control(
				'title_border_radius',
				[
					'label' => esc_html__('Border Radius', 'rsaddon'),
					'type' => Controls_Manager::DIMENSIONS,
					'size_units' => ['px', 'em', '%'],
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
						'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					],
				]
			);

$this->add_control(
				'title_hover_color_based_on',
				[
					'label' => esc_html__( 'Hover Based On', 'rsaddon' ),
					'type' => Controls_Manager::SELECT,
					'default' => 'normal',
					'options' => [
						'normal' => esc_html__( 'Normal', 'rsaddon' ),
						'box' => esc_html__( 'Box', 'rsaddon' ),
					]
				]
			);
			$this->start_controls_tabs( 'title_hover_normal_style_tabs' );
				$this->start_controls_tab(
					'title_style_normal_tab',
					[
						'label' => esc_html__( 'Normal', 'rsaddon' ),
					]
				);
					$this->add_control(
						'title_color',
						[
							'label' => esc_html__('Title Color', 'rsaddon'),
							'type' => Controls_Manager::COLOR,
							'selectors' => [
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title a' => 'color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title' => 'color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .p-title a' => 'color: {{VALUE}};',
							],
						]
					);
					$this->add_control(
						'title_bg_color',
						[
							'label' => esc_html__('Background Color', 'rsaddon'),
							'type' => Controls_Manager::COLOR,
							'selectors' => [
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title a' => 'background-color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title' => 'background-color: {{VALUE}};',
							],
						]
					);
				$this->end_controls_tab();
				$this->start_controls_tab(
					'title_style_hover_tab',
					[
						'label' => esc_html__( 'Hover', 'rsaddon' ),
					]
				);
					$this->add_control(
						'title_color_hover',
						[
							'label' => esc_html__('Title Hover Color', 'rsaddon'),
							'type' => Controls_Manager::COLOR,
							'selectors' => [
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title a:hover' => 'color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title:hover' => 'color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio-style4 .portfolio-item .portfolio-content:hover .p-title a' => 'color: {{VALUE}};',
							],
							'condition' => [
								'title_hover_color_based_on!' => 'box'
							]
						]
					);
					$this->add_control(
						'box_hover_title_color',
						[
							'label' => esc_html__('Box Hover Title Color', 'rsaddon'),
							'type' => Controls_Manager::COLOR,
							'selectors' => [
								'{{WRAPPER}} .rs-portfolio .portfolio-item:hover .p-title a' => 'color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio .portfolio-item:hover .p-title' => 'color: {{VALUE}};',
								'{{WRAPPER}} .rs-portfolio-style4 .portfolio-item:hover .portfolio-content .p-title a' => 'color: {{VALUE}};',
							],
							'condition' => [
								'title_hover_color_based_on' => 'box'
							]
						]
					);
					$this->add_control(
						'title_bg_color_hover',
						[
							'label' => esc_html__('Background Color Hover', 'rsaddon'),
							'type' => Controls_Manager::COLOR,
							'selectors' => [
								'{{WRAPPER}} .rs-portfolio .portfolio-item .p-title a:hover' => 'background-color: {{VALUE}};',
							],
							'condition' => [
								'title_hover_color_based_on!' => 'box'
							]
						]
					);
					$this->add_control(
						'box_hover_title_bg_color',
						[
							'label' => esc_html__('Box Hover Title Bg Color', 'rsaddon'),
							'type' => Controls_Manager::COLOR,
							'selectors' => [
								'{{WRAPPER}} .rs-portfolio .portfolio-item:hover .p-title a' => 'background-color: {{VALUE}};',
							],
							'condition' => [
								'title_hover_color_based_on' => 'box'
							]
						]
					);
				$this->end_controls_tab();
			$this->end_controls_tabs();
		$this->end_controls_section();

// Description Style Start
		$this->start_controls_section(
			'section_description_style',
			[
				'label' => esc_html__('Description Style', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
				'condition' => [
					'desc_show_hide' => 'yes'
				]
			]
		);
			$this->add_group_control(
				Group_Control_Typography::get_type(),
				[
					'name' => 'desc_typography',
					'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .content-details .desc',
				]
			);
			$this->add_control(
				'desc_text_color',
				[
					'label' => esc_html__( 'Color', 'rsaddon' ),
					'type' => Controls_Manager::COLOR,
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .content-details .desc' => 'color: {{VALUE}}',
					],
				]
			);
			$this->add_control(
				'desc_text_color_hover',
				[
					'label' => esc_html__( 'Color (Hover)', 'rsaddon' ),
					'type' => Controls_Manager::COLOR,
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .content-details .desc' => 'color: {{VALUE}}',
					],
				]
			);
			$this->add_responsive_control(
				'desc_text_margin',
				[
					'label' => esc_html__( 'Margin', 'rsaddon' ),
					'type' => Controls_Manager::DIMENSIONS,
					'size_units' => [ 'px', '%', 'custom' ],
					'selectors' => [
						'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .content-details .desc' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					],
				]
			);
		$this->end_controls_section();
		// Description Style End

$this->start_controls_section(
			'section_slider_style_category',
			[
				'label' => esc_html__('Category Style', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name' => 'cat_typography',
				'label' => esc_html__('Typography', 'rsaddon'),
				'selector' => '{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a',
				'condition' => [
					'cat_show_hide' => 'yes'
				]
			]
		);
		
		$this->add_responsive_control(
			'category_border_radius',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'category_margin',
			[
				'label' => esc_html__('Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'category_padding',
			[
				'label' => esc_html__('Padding', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);

$this->add_control(
			'category_hover_color_based_on',
			[
				'label' => esc_html__( 'Hover Based On', 'rsaddon' ),
				'type' => Controls_Manager::SELECT,
				'default' => 'normal',
				'options' => [
					'normal' => esc_html__( 'Normal', 'rsaddon' ),
					'box' => esc_html__( 'Box', 'rsaddon' ),
				],
				'condition' => [
					'cat_show_hide' => 'yes'
				]
			]
		);
		$this->start_controls_tabs( 'category_hover_normal_style_tabs' );
		
			$this->start_controls_tab(
				'category_style_normal_tab',
				[
					'label' => esc_html__( 'Normal', 'rsaddon' ),
				]
			);
				$this->add_control(
					'category_color',
					[
						'label' => esc_html__('Color', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a' => 'color: {{VALUE}};',
						],
						'condition' => [
							'cat_show_hide' => 'yes'
						]
					]
				);
				$this->add_control(
					'category_bg_color',
					[
						'label' => esc_html__('Background Color', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a' => 'background-color: {{VALUE}};',
						],
						'condition' => [
							'cat_show_hide' => 'yes'
						]
					]
				);
		
			$this->end_controls_tab();
			$this->start_controls_tab(
				'category_style_hover_tab',
				[
					'label' => esc_html__( 'Hover', 'rsaddon' ),
				]
			);

$this->add_control(
					'category_color_hover',
					[
						'label' => esc_html__('Color (Hover)', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a:hover' => 'color: {{VALUE}};',
							'{{WRAPPER}} .rs-portfolio-style4 .portfolio-item .portfolio-content:hover .p-category a' => 'color: {{VALUE}};',
						],
						'condition' => [
							'cat_show_hide' => 'yes',
							'category_hover_color_based_on!' => 'box'
						]
					]
				);
				$this->add_control(
					'box_hover_category_color',
					[
						'label' => esc_html__('Box Hover Category Color', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio .portfolio-item:hover .portfolio-content .p-category a' => 'color: {{VALUE}};',
							'{{WRAPPER}} .rs-portfolio-style4 .portfolio-item:hover .portfolio-content .p-category a' => 'color: {{VALUE}};',
						],
						'condition' => [
							'cat_show_hide' => 'yes',
							'category_hover_color_based_on' => 'box'
						]
					]
				);
				$this->add_control(
					'category_bg_color_hover',
					[
						'label' => esc_html__('Background Color (Hover)', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio .portfolio-item .portfolio-content .p-category a:hover' => 'background-color: {{VALUE}};',
						],
						'condition' => [
							'cat_show_hide' => 'yes',
							'category_hover_color_based_on!' => 'box'
						]
					]
				);
				$this->add_control(
					'box_hover_category_bg_color',
					[
						'label' => esc_html__('Box Hover Category Bg Color', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio .portfolio-item:hover .portfolio-content .p-category a' => 'background-color: {{VALUE}};',
						],
						'condition' => [
							'cat_show_hide' => 'yes',
							'category_hover_color_based_on' => 'box'
						]
					]
				);
		
			$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();

$this->start_controls_section(
			'section_slider_style_content',
			[
				'label' => esc_html__('Content Style', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);

$this->add_responsive_control(
            'box_horizontal_align',
            [
                'label' => esc_html__( 'Box Style (Inline / Block)', 'rsaddon' ),
                'type' => Controls_Manager::CHOOSE,
                'options' => [
                    'flex' => [
                        'title' => esc_html__( 'Inline', 'rsaddon' ),
                        'icon' => 'eicon-post-list',
                    ],
                    'block' => [
                        'title' => esc_html__( 'Block', 'rsaddon' ),
                        'icon' => 'eicon-posts-grid',
                    ],
                ],
				'default' => 'block',
                'toggle' => true,
                'selectors' => [
                    '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'display: {{VALUE}};',
                ],
				'separator' => 'before',
				'condition' => [
					'portfolio_slider_style' => '4'
				]
            ]
        );
		$this->add_responsive_control(
            'box_vertical_align',
            [
                'label' => esc_html__( 'Vertical Align', 'rsaddon' ),
                'type' => Controls_Manager::CHOOSE,
                'options' => [
                    'flex-start' => [
                        'title' => esc_html__( 'Top', 'rsaddon' ),
                        'icon' => 'eicon-align-start-v',
                    ],
                    'center' => [
                        'title' => esc_html__( 'Middle', 'rsaddon' ),
                        'icon' => 'eicon-align-center-v',
                    ],
                    'flex-end' => [
                        'title' => esc_html__( 'Bottom', 'rsaddon' ),
                        'icon' => 'eicon-align-end-v',
                    ],
                ],
				'default' => 'flex-start',
				'condition' => [
					'box_horizontal_align' => 'flex',
				],
                'toggle' => true,
                'selectors' => [
                    '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'align-items: {{VALUE}};',
                ],
            ]
        );

$this->add_responsive_control(
            'box_column_align',
            [
                'label' => esc_html__( 'Column Direction', 'rsaddon' ),
                'type' => Controls_Manager::CHOOSE,
                'options' => [
                    'row' => [
                        'title' => esc_html__( 'Row', 'rsaddon' ),
                        'icon' => 'eicon-justify-start-h',
                    ],
                    'row-reverse' => [
                        'title' => esc_html__( 'Row Reverse', 'rsaddon' ),
                        'icon' => 'eicon-wrap',
                    ],
                    'column' => [
                        'title' => esc_html__( 'Column', 'rsaddon' ),
                        'icon' => 'eicon-justify-start-v',
                    ],
                    'column-reverse' => [
                        'title' => esc_html__( 'Column Reverse', 'rsaddon' ),
                        'icon' => 'eicon-wrap',
                    ],
                ],
				'default' => 'row',
				'condition' => [
					'box_horizontal_align' => 'flex',
				],
                'toggle' => true,
                'selectors' => [
                    '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'flex-direction: {{VALUE}};',
                ],
            ]
        );

$this->add_responsive_control(
            'flex_box_h_align',
            [
                'label' => esc_html__( 'Horizontal Align', 'rsaddon' ),
                'type' => Controls_Manager::CHOOSE,
                'options' => [
                    'flex-start' => [
                        'title' => esc_html__( 'Start', 'rsaddon' ),
                        'icon' => 'eicon-align-start-h',
                    ],
                    'center' => [
                        'title' => esc_html__( 'Center', 'rsaddon' ),
                        'icon' => 'eicon-align-center-h',
                    ],
                    'flex-end' => [
                        'title' => esc_html__( 'End', 'rsaddon' ),
                        'icon' => 'eicon-align-end-h',
                    ],
                    'space-between' => [
                        'title' => esc_html__( 'Space Between', 'rsaddon' ),
                        'icon' => 'eicon-justify-space-between-h',
                    ],
                ],
				'default' => 'flex-start',
				'condition' => [
					'box_horizontal_align' => 'flex',
				],
                'toggle' => true,
                'selectors' => [
                    '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'justify-content: {{VALUE}};',
                ],
            ]
        );

$this->add_responsive_control(
			'services_flex_gap',
			[
				'label' => esc_html__('Flex Gap', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['%', 'px'],
				'show_label' => true,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'gap: {{SIZE}}{{UNIT}};',
				],
				'condition' => [
					'box_horizontal_align' => 'flex',
				]
			]
		);

$this->add_responsive_control(
			'content_opacity',
			[
				'label' => esc_html__( 'Content Opacity', 'rsaddon' ),
				'type' => Controls_Manager::SLIDER,
				'show_label' => true,
				'size_units' => [ 'px' ],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => 0.1,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'opacity: {{SIZE}};',                   
				],
				'condition' => ['portfolio_slider_style' => '4']
			]
		);

$this->add_responsive_control(
			'content_hover_opacity',
			[
				'label' => esc_html__( 'Content Opacity (Hover / Active)', 'rsaddon' ),
				'type' => Controls_Manager::SLIDER,
				'show_label' => true,
				'size_units' => [ 'px' ],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => 0.1,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content, {{WRAPPER}} .rs-portfolio-slider .slick-active.slick-center .portfolio-item .portfolio-content' => 'opacity: {{SIZE}};',
				],
				'condition' => ['portfolio_slider_style' => '4']
			]
		);

$this->add_responsive_control(
			'content_align',
			[
				'label' => esc_html__('Alignment', 'rsaddon'),
				'type' => Controls_Manager::CHOOSE,
				'options' => [
					'left' => [
						'title' => esc_html__('Left', 'rsaddon'),
						'icon' => 'eicon-text-align-left',
					],
					'center' => [
						'title' => esc_html__('Center', 'rsaddon'),
						'icon' => 'eicon-text-align-center',
					],
					'right' => [
						'title' => esc_html__('Right', 'rsaddon'),
						'icon' => 'eicon-text-align-right',
					],
				],
				'toggle' => true,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content, {{WRAPPER}} .rs-portfolio.swiper .content-details' => 'text-align: {{VALUE}};'
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_width',
			[
				'label'      => esc_html__('Width', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details' => 'width: {{SIZE}}{{UNIT}}; flex: 0 0 {{SIZE}}{{UNIT}}; min-width: auto !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_margin',
			[
				'label' => esc_html__('Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_padding',
			[
				'label' => esc_html__('Padding', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_border_radius',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		
		$this->add_control(
			'content_position_options_heading',
			[
				'label' => esc_html__('Content Wrapper Position', 'rsaddon'),
				'type' => Controls_Manager::HEADING,
			]
		);
		$this->add_responsive_control(
			'content_position_options',
			[
				'label'   => esc_html__('Position', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Defalut', 'rsaddon'),
					'absolute' => esc_html__('Absolute', 'rsaddon'),
					'relative' => esc_html__('Relative', 'rsaddon'),
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content' => 'position: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio.swiper .content-details' => 'position: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .portfolio-content' => 'position: {{VALUE}};'
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_left',
			[
				'label'      => esc_html__('Left', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative']
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details,
					{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .portfolio-content' => 'left: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_left_hover',
			[
				'label'      => esc_html__('Left (Hover)', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative'],
					'portfolio_slider_style' => '4'
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content' => 'left: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_right',
			[
				'label'      => esc_html__('Right', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative']
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details,
					{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .portfolio-content' => 'right: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_right_hover',
			[
				'label'      => esc_html__('Right (Hover)', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative'],
					'portfolio_slider_style' => '4'
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content' => 'right: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_top',
			[
				'label'      => esc_html__('Top', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative']
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details,
					{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .portfolio-content' => 'top: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_top_hover',
			[
				'label'      => esc_html__('Top (hover)', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative'],
					'portfolio_slider_style' => '4'
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content' => 'top: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_bottom',
			[
				'label'      => esc_html__('Bottom', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative']
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content,
					{{WRAPPER}} .rs-portfolio.swiper .content-details,
					{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .portfolio-content' => 'bottom: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_bottom_hover',
			[
				'label'      => esc_html__('Bottom (Hover)', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative'],
					'portfolio_slider_style' => '4'
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content' => 'bottom: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);
		$this->add_responsive_control(
			'content_wrapper_position_bottom_center_active',
			[
				'label'      => esc_html__('Bottom (Center Active)', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'condition' => [
					'content_position_options' => ['absolute', 'relative'],
					'portfolio_slider_style' => '4',
					'slider_centerMode' => 'true'
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .slick-active.slick-center .portfolio-item .portfolio-content' => 'bottom: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);

$this->start_controls_tabs( 'content_wrapper_style_tabs' );
			$this->start_controls_tab(
				'content_wrapper_style_normal_tab',
				[
					'label' => esc_html__( 'Normal', 'rsaddon' ),
				]
			);
				$this->add_group_control(
					Group_Control_Background::get_type(),
					[
						'name' => 'content_wrapper_bg',
						'types' => ['classic', 'gradient'],
						'selector' => '
							{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content',
					]
				);
				$this->add_group_control(
					Group_Control_Border::get_type(),
					[
						'name' => 'content_wrapper_border',
						'selector' => '
							{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content',
					]
				);
				$this->add_group_control(
					Group_Control_Box_Shadow::get_type(),
					[
						'name' => 'content_wrapper_box_shadow',
						'exclude' => [
							'box_shadow_position',
						],
						'selector' => '
							{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content',
					]
				);
			$this->end_controls_tab();
			$this->start_controls_tab(
				'content_wrapper_style_hover_tab',
				[
					'label' => esc_html__( 'Hover', 'rsaddon' ),
				]
			);
				$this->add_group_control(
					Group_Control_Background::get_type(),
					[
						'name' => 'content_wrapper_bg_hover',
						'types' => ['classic', 'gradient'],
						'selector' => '
							{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content',
					]
				);
				$this->add_control(
					'content_wrapper_border_color_hover',
					[
						'label' => esc_html__('Border Color', 'rsaddon'),
						'type' => Controls_Manager::COLOR,
						'selectors' => [
							'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content' => 'border-color: {{VALUE}};',
						],
					]
				);
				$this->add_group_control(
					Group_Control_Box_Shadow::get_type(),
					[
						'name' => 'content_wrapper_box_shadow_hover',
						'exclude' => [
							'box_shadow_position',
						],
						'selector' => '
							{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .portfolio-content',
					]
				);
			$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();

// Arrow Section Start
		$this->start_controls_section(
			'section_slider_style_arrow_ontrol',
			[
				'label' => esc_html__('Arrow Control', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
				'condition' => [
					'slider_nav' => 'true'
				]
			]
		);

// positioning start
		$this->add_control(
			'arrow_position_maker',
			[
				'label' => esc_html__('Arrow Position Style', 'rsaddon'),
				'type' => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Default', 'rsaddon'),
					'custom' => esc_html__('Custom', 'rsaddon'),
				],
			]
		);
		$this->add_responsive_control(
			'arrow_prev_x_select',
			[
				'label' => esc_html__('Prev Position X', 'rsaddon'),
				'type' => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Default', 'rsaddon'),
					'left' => esc_html__('Left', 'rsaddon'),
					'right' => esc_html__('Right', 'rsaddon'),
				],
				'condition' => [
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_prev_left_position',
			[
				'label' => esc_html__('Prev Left Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-prev, {{WRAPPER}} .swiper .swiper-button-prev' => 'left: {{SIZE}}{{UNIT}}; right: unset;',
				],
				'condition' => [
					'arrow_prev_x_select' => 'left',
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_prev_right_position',
			[
				'label' => esc_html__('Prev Right Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-prev, {{WRAPPER}} .swiper .swiper-button-prev' => 'right: {{SIZE}}{{UNIT}}; left: unset;',
				],
				'condition' => [
					'arrow_prev_x_select' => 'right',
					'arrow_position_maker' => 'custom'
				]
			]
		);

$this->add_responsive_control(
			'arrow_prev_y_select',
			[
				'label' => esc_html__('Prev Position Y', 'rsaddon'),
				'type' => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Default', 'rsaddon'),
					'top' => esc_html__('Top', 'rsaddon'),
					'bottom' => esc_html__('Bottom', 'rsaddon'),
				],
				'condition' => [
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_prev_top_position',
			[
				'label' => esc_html__('Prev Top Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-prev, {{WRAPPER}} .swiper .swiper-button-prev' => 'top: {{SIZE}}{{UNIT}}; bottom: unset;',
				],
				'condition' => [
					'arrow_prev_y_select' => 'top',
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_prev_bottom_position',
			[
				'label' => esc_html__('Prev Bottom Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-prev, {{WRAPPER}} .swiper .swiper-button-prev' => 'bottom: {{SIZE}}{{UNIT}}; top: unset;',
				],
				'condition' => [
					'arrow_prev_y_select' => 'bottom',
					'arrow_position_maker' => 'custom'
				]
			]
		);

$this->add_responsive_control(
			'arrow_next_x_select',
			[
				'label' => esc_html__('Next Position X', 'rsaddon'),
				'type' => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Default', 'rsaddon'),
					'left' => esc_html__('Left', 'rsaddon'),
					'right' => esc_html__('Right', 'rsaddon'),
				],
				'condition' => [
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_next_left_position',
			[
				'label' => esc_html__('Next Left Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-next, {{WRAPPER}} .swiper .swiper-button-next' => 'left: {{SIZE}}{{UNIT}}; right: unset;',
				],
				'condition' => [
					'arrow_next_x_select' => 'left',
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_next_right_position',
			[
				'label' => esc_html__('Next Right Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-next, {{WRAPPER}} .swiper .swiper-button-next' => 'right: {{SIZE}}{{UNIT}}; left: unset;',
				],
				'condition' => [
					'arrow_next_x_select' => 'right',
					'arrow_position_maker' => 'custom'
				]
			]
		);

$this->add_responsive_control(
			'arrow_next_y_select',
			[
				'label' => esc_html__('Next Position Y', 'rsaddon'),
				'type' => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Default', 'rsaddon'),
					'top' => esc_html__('Top', 'rsaddon'),
					'bottom' => esc_html__('Bottom', 'rsaddon'),
				],
				'condition' => [
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_next_top_position',
			[
				'label' => esc_html__('Next Top Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-next, {{WRAPPER}} .swiper .swiper-button-next' => 'top: {{SIZE}}{{UNIT}}; bottom: unset;',
				],
				'condition' => [
					'arrow_next_y_select' => 'top',
					'arrow_position_maker' => 'custom'
				]
			]
		);
		$this->add_responsive_control(
			'arrow_next_bottom_position',
			[
				'label' => esc_html__('Next Bottom Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-sliders .slick-next, {{WRAPPER}} .swiper .swiper-button-next' => 'bottom: {{SIZE}}{{UNIT}}; top: unset;',
				],
				'condition' => [
					'arrow_next_y_select' => 'bottom',
					'arrow_position_maker' => 'custom'
				]
			]
		);
		// positioning end

$this->add_control(
			'arrow_after_hr',
			[
				'type' => \Elementor\Controls_Manager::DIVIDER,
			]
		);

$this->add_responsive_control(
			'navigation_arrow_width',
			[
				'label' => esc_html__('Arrow Width', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next,
					{{WRAPPER}} .swiper .swiper-button-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-next' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'navigation_arrow_height',
			[
				'label' => esc_html__('Arrow Height', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next,
					{{WRAPPER}} .swiper .swiper-button-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-next' => 'height: {{SIZE}}{{UNIT}}; line-height: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'navigation_arrow_line_height',
			[
				'label' => esc_html__('Arrow Line Height', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next,
					{{WRAPPER}} .swiper .swiper-button-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-next' => 'line-height: {{SIZE}}{{UNIT}} !important;',
				],
			]
		);

$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name' => 'nav_icon_typography',
				'label' => esc_html__('Icon Typography', 'rsaddon'),
				'selector' => '
					{{WRAPPER}} .swiper .swiper-button-next,
					{{WRAPPER}} .swiper .swiper-button-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-prev::before,
					{{WRAPPER}} .rs-addon-sliders .slick-next::before
				',
			]
		);

$this->add_control(
			'arrow_border_radius_',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%'],
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next,
					{{WRAPPER}} .swiper .swiper-button-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-next' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_control(
			'arrow_border_padding_',
			[
				'label' => esc_html__('Padding', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%'],
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next,
					{{WRAPPER}} .swiper .swiper-button-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-prev,
					{{WRAPPER}} .rs-addon-sliders .slick-next' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);

// Arrow Hover Normal Tab Start
		$this->start_controls_tabs('_tabs_slider_arrow');
		// Normal Bullet Start
		$this->start_controls_tab(
			'slider_arrow_normal_tab',
			[
				'label' => esc_html__('Normal', 'rsaddon'),
			]
		);
		$this->add_control(
			'navigation_arrow_color',
			[
				'label' => esc_html__('Icon Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next,
							{{WRAPPER}} .swiper .swiper-button-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-prev::before,
							{{WRAPPER}} .rs-addon-sliders .slick-next::before' => 'color: {{VALUE}};',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name' => 'navigation_arrow_background',
				'types' => ['classic', 'gradient'],
				'selector' => '
							{{WRAPPER}} .swiper .swiper-button-next,
							{{WRAPPER}} .swiper .swiper-button-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-next
						',
			]
		);

$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'nav_arrow_border',
				'selector' => '
							{{WRAPPER}} .swiper .swiper-button-next,
							{{WRAPPER}} .swiper .swiper-button-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-next
						',
			]
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			[
				'name' => 'arrow_shadow_custom',
				'selector' => '
							{{WRAPPER}} .swiper .swiper-button-next,
							{{WRAPPER}} .swiper .swiper-button-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-prev,
							{{WRAPPER}} .rs-addon-sliders .slick-next
						',
			]
		);
		$this->end_controls_tab();

// Hover Bullet Start
		$this->start_controls_tab(
			'slider_arrow_hover_tab',
			[
				'label' => esc_html__('Hover', 'rsaddon'),
			]
		);
		$this->add_control(
			'navigation_arrow_color_hover',
			[
				'label' => esc_html__('Icon Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next:hover,
							{{WRAPPER}} .swiper .swiper-button-prev:hover,
							{{WRAPPER}} .rs-addon-sliders .slick-prev:hover::before,
							{{WRAPPER}} .rs-addon-sliders .slick-next:hover::before' => 'color: {{VALUE}};',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name' => 'navigation_arrow_background_hover',
				'types' => ['classic', 'gradient'],
				'selector' => '
							{{WRAPPER}} .swiper .swiper-button-next:hover,
							{{WRAPPER}} .swiper .swiper-button-prev:hover,
							{{WRAPPER}} .rs-addon-sliders .slick-prev:hover,
							{{WRAPPER}} .rs-addon-sliders .slick-next:hover
						',
			]
		);
		$this->add_control(
			'nav_arrow_border_hover',
			[
				'label' => esc_html__('Border Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .swiper .swiper-button-next:hover,
							{{WRAPPER}} .swiper .swiper-button-prev:hover,
							{{WRAPPER}} .rs-addon-sliders .slick-prev:hover,
							{{WRAPPER}} .rs-addon-sliders .slick-next:hover' => 'border-color: {{VALUE}};',
				],
			]
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		// Arrow Hover Normal Tab End
		$this->end_controls_section();
		// Arrow Style End

// Bullet Style Start
		$this->start_controls_section(
			'section_slider_style_dots_ontrol',
			[
				'label' => esc_html__('Dots Control', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
				'condition' => [
					'slider_dots' => 'true'
				]
			]
		);
		$this->add_responsive_control(
			'bullet_alignment_dots',
			[
				'label' => esc_html__('Alignment', 'rsaddon'),
				'type' => Controls_Manager::CHOOSE,
				'options' => [
					'left' => [
						'title' => esc_html__('Left', 'rsaddon'),
						'icon' => 'eicon-text-align-left',
					],
					'center' => [
						'title' => esc_html__('Center', 'rsaddon'),
						'icon' => 'eicon-text-align-center',
					],
					'right' => [
						'title' => esc_html__('Right', 'rsaddon'),
						'icon' => 'eicon-text-align-right',
					],
					'justify' => [
						'title' => esc_html__('Justify', 'rsaddon'),
						'icon' => 'eicon-text-align-justify',
					],
				],
				'toggle' => true,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider ul.slick-dots' => 'text-align: {{VALUE}}'
				],
			]
		);

$this->add_control(
			'_hr',
			[
				'type' => Controls_Manager::DIVIDER,
				'style' => 'thick',
			]
		);

$this->add_control(
			'bullet_item_options',
			[
				'label' => esc_html__('Bullet Item Style', 'rsaddon'),
				'type' => Controls_Manager::HEADING,
			]
		);
		$this->add_control(
			'dots__margin',
			[
				'label' => esc_html__('Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li' => 'Margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);

$this->start_controls_tabs('_tabs_slider_dots');

// Normal Bullet Start
		$this->start_controls_tab(
			'slider_dots_normal_tab',
			[
				'label' => esc_html__('Normal', 'rsaddon'),
			]
		);
		$this->add_control(
			'navigation_dot_inner_color',
			[
				'label' => esc_html__('Inner Dot Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'condition' => [
					'slider_dots_style' => '2',
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:after' => 'background: {{VALUE}}',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_inner_dot_height_custom',
			[
				'label' => esc_html__('Inner Dot Height', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:after' => 'height: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_responsive_control(
			'bullet_inner_dot_normal_width_custom',
			[
				'label' => esc_html__('Inner Dot Width', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:after' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_inner_dot_border_radius',
			[
				'label' => esc_html__('Inner Dot Radius', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:after' => 'border-radius: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name'     => 'navigation_dot_icon_background',
				'selector' => '{{WRAPPER}} .rs-addon-slider .slick-dots li button',
			]
		);

$this->add_responsive_control(
			'bullet_height_custom',
			[
				'label' => esc_html__('Bullet Height', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button' => 'height: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_responsive_control(
			'bullet_normal_width_custom',
			[
				'label' => esc_html__('Bullet Width', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_control(
			'bullet_border_radius_custom',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);

$this->add_group_control(
			Group_Control_Border::get_type(),
			[
				'name' => 'bullet_border_custom',
				'selector' => '{{WRAPPER}} .rs-addon-slider .slick-dots li button',
			]
		);

$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			[
				'name' => 'bullet_shadow_custom',
				'selector' => '{{WRAPPER}} .rs-addon-slider .slick-dots li button'
			]
		);

$this->end_controls_tab();
		// Normal Bullet End

// Active Bullet Start
		$this->start_controls_tab(
			'slider_dots_active_tab',
			[
				'label' => esc_html__('Active', 'rsaddon'),
			]
		);
		$this->add_control(
			'navigation_dot_inner_color_active',
			[
				'label' => esc_html__('Inner Dot Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'condition' => [
					'slider_dots_style' => '2',
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:hover:after,
					{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button:after' => 'background: {{VALUE}}',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_inner_dot_height_custom_active',
			[
				'label' => esc_html__('Inner Dot Height', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:hover:after,
					{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button:after' => 'height: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_responsive_control(
			'bullet_inner_dot_active_width_custom',
			[
				'label' => esc_html__('Inner Dot Width', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:hover:after,
					{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button:after' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name'     => 'navigation_dot_icon_background_active',
				'selector' => '{{WRAPPER}} .rs-addon-slider .slick-dots li button:hover, {{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button',
			]
		);

$this->add_responsive_control(
			'bullet_active_width_custom',
			[
				'label' => esc_html__('Bullet Width', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_active_height_custom',
			[
				'label' => esc_html__('Bullet Height', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px'],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button' => 'height: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_active_scale_custom',
			[
				'label' => esc_html__('Bullet Scale', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1000,
						'step' => 0.1,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button' => 'transform: scale({{SIZE}})',
				],
			]
		);

$this->add_control(
			'navigation_dot_active_border_color',
			[
				'label' => esc_html__('Border Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots li button:hover' => 'border-color: {{VALUE}};',
					'{{WRAPPER}} .rs-addon-slider .slick-dots li.slick-active button' => 'border-color: {{VALUE}};',

],
			]
		);

$this->end_controls_tab();
		$this->end_controls_tabs();
		// Active Bullet End

$this->add_responsive_control(
			'bullet_spacing_custom',
			[
				'label' => esc_html__('Top Gap', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'show_label' => true,
				'range' => [
					'px' => [
						'max' => 100,
					],
				],
				'default' => [
					'size' => 25,
				],
				'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots' => 'margin-bottom: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_spacing_custom_position',
			[
				'label' => esc_html__('Top Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'em', 'rem', 'custom'],
				'show_label' => true,
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => -1000,
						'max' => 1000,
					],
				],
				'separator' => 'before',
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots' => 'top: {{SIZE}}{{UNIT}}; bottom:unset;',
				],
			]
		);
		$this->add_responsive_control(
			'bullet_spacing_custom_position_bottom',
			[
				'label' => esc_html__('Bottom Position', 'rsaddon'),
				'type' => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'em', 'rem', 'custom'],
				'show_label' => true,
				'range' => [
					'px' => [
						'min' => -1000,
						'max' => 1000,
					],
					'%' => [
						'min' => -1000,
						'max' => 1000,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-addon-slider .slick-dots' => 'bottom: {{SIZE}}{{UNIT}}; top: unset;',
				],
			]
		);
		$this->end_controls_section();
		// Bullet Style End

// Button Style Start
		$this->start_controls_section(
			'btn_style',
			[
				'label' => esc_html__('Button Style', 'rsaddon'),
				'tab' => Controls_Manager::TAB_STYLE,
				'condition' => [
					'btn__show_hide' => 'yes'
				],
			]
		);

$this->add_control(
			'btn_top_line_color',
			[
				'label' => esc_html__('Button Border Top Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon' => 'border-top: 1px solid {{VALUE}};',
				],
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);

$this->add_responsive_control(
			'button_width',
			[
				'label'      => esc_html__('Button Width', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon .prs_btn' => 'width: {{SIZE}}{{UNIT}};display:flex;align-items:center;justify-content:center;',
				],
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);

$this->add_responsive_control(
			'button_height',
			[
				'label'      => esc_html__('Button Height', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon .prs_btn' => 'height: {{SIZE}}{{UNIT}};',
				],
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);

$this->add_responsive_control(
			'button_svgwidth',
			[
				'label'      => esc_html__('Button SVg Width', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn .btn_icon_2 svg' => 'width: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn .btn_icon_1 svg' => 'width: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 svg' => 'width: {{SIZE}}{{UNIT}};',
				],
			]
		);

$this->add_responsive_control(
			'button_svgheight',
			[
				'label'      => esc_html__('Button SVg Height', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn .btn_icon_2 svg' => 'height: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn .btn_icon_1 svg' => 'height: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 svg' => 'height: {{SIZE}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'button_position_options',
			[
				'label'   => esc_html__('Position', 'rsaddon'),
				'type'    => Controls_Manager::SELECT,
				'default' => '',
				'options' => [
					'' => esc_html__('Defalut', 'rsaddon'),
					'absolute' => esc_html__('Absolute', 'rsaddon'),
					'relative' => esc_html__('Relative', 'rsaddon'),
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .p-icon' => 'position: {{VALUE}};',
				],
			]
		);

$this->add_responsive_control(
			'button_top_normal_position',
			[
				'label'      => esc_html__('Button Top Position', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon' => 'top: {{SIZE}}{{UNIT}};bottom:unset;',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn' => 'right: {{SIZE}}{{UNIT}};left:unset;',
				],
			]
		);
		$this->add_responsive_control(
			'button_bottom_normal_position',
			[
				'label'      => esc_html__('Button Bottom Position', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon' => 'bottom: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn' => 'bottom: {{SIZE}}{{UNIT}};',
				],
			]
		);
		
		$this->add_responsive_control(
			'button_bottom_position',
			[
				'label'      => esc_html__('Button Hover Bottom Position', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item:hover .p-icon' => 'bottom: {{SIZE}}{{UNIT}};',
				],
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);

$this->add_responsive_control(
			'button_right_normal_position',
			[
				'label'      => esc_html__('Button Right Position', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon' => 'right: {{SIZE}}{{UNIT}};left:unset;',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn' => 'right: {{SIZE}}{{UNIT}};left:unset;',
				],
			]
		);
		$this->add_responsive_control(
			'button_left_normal_position',
			[
				'label'      => esc_html__('Button Left Position', 'rsaddon'),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => ['px', '%', 'custom'],
				'range' => [
					'%' => [
						'min' => 0,
						'max' => 100,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon' => 'left: {{SIZE}}{{UNIT}};right:unset;',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn' => 'left: {{SIZE}}{{UNIT}};right:unset;',
				],
			]
		);
		$this->add_responsive_control(
			'button_opacity',
			[
				'label' => esc_html__( 'Button Opacity', 'rsaddon' ),
				'type' => Controls_Manager::SLIDER,
				'show_label' => true,
				'size_units' => [ 'px' ],
				'range' => [
					'px' => [
						'min' => 0,
						'max' => 1,
						'step' => 0.1,
					],
				],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon' => 'opacity: {{SIZE}};',                   
				],
				'condition' => ['portfolio_slider_style' => '4']
			]
		);
		$this->start_controls_tabs(
			'btn__style_tabs'
		);
		$this->start_controls_tab(
			'btn__style_normal_tab',
			[
				'label' => esc_html__('Normal', 'rsaddon'),
			]
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name' => 'btn_typography',
				'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn,{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text,{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn .pbtn_text',
			]
		);
		$this->add_control(
			'btn_text_color',
			[
				'label' => esc_html__('Text Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn .pbtn_text' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn svg' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn svg path' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 svg' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 svg path' => 'fill: {{VALUE}};',
				],
			]
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name' => 'btn_bg',
				'label' => esc_html__('Background', 'rsaddon'),
				'types' => ['classic', 'gradient'],
				'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn,{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text,{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn span.pbtn_icon,{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn .pbtn_text',
			]
		);
		$this->add_control(
			'button_brder_radius',
			[
				'label' => esc_html__('Border Radius', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);
		$this->add_control(
			'button__margin',
			[
				'label' => esc_html__('Margin', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style4.rs-portfolio-slider .portfolio-item .p-icon' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);
		$this->add_responsive_control(
			'button__padding',
			[
				'label' => esc_html__('Padding', 'rsaddon'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn span.pbtn_icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
					'{{WRAPPER}} .rs-portfolio-style4.rs-portfolio-slider .portfolio-item .p-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				],
			]
		);

$this->add_group_control(
			\Elementor\Group_Control_Border::get_type(),
			[
				'name' => 'portfolio__border',
				'selector' => '{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn,{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text,{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn,{{WRAPPER}} .rs-portfolio-style4.rs-portfolio-slider .portfolio-item .p-icon',
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);
		$this->add_control(
			'btn__icon_bg_color',
			[
				'label' => esc_html__('Icon BG Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon .btn_icon_1' => 'background-color: {{VALUE}};',
				],
				'condition' => ['portfolio_slider_style' => '2']
			]
		);
		$this->add_control(
			'btn__icon_color',
			[
				'label' => esc_html__('Svg Icon Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon .btn_icon_1 svg' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon .btn_icon_1 svg path' => 'fill: {{VALUE}};',
				],
				'condition' => ['portfolio_slider_style' => '2']
			]
		);

$this->end_controls_tab();
		$this->start_controls_tab(
			'btn__style_hover_tab',
			[
				'label' => esc_html__('Hover', 'rsaddon'),
			]
		);

$this->add_group_control(
			Group_Control_Background::get_type(),
			[
				'name' => 'btn__hover_bg',
				'label' => esc_html__('Background', 'rsaddon'),
				'types' => ['classic', 'gradient'],
				'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn:hover,{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text:hover,{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn:hover span.pbtn_icon,{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn:hover .pbtn_text',
			]
		);
		$this->add_control(
			'btn__hover_text_color',
			[
				'label' => esc_html__('Text Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn:hover' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text:hover' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn:hover svg' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style1 .portfolio-item .p-icon a.prs_btn:hover svg path' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn:hover .pbtn_text' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn:hover .pbtn_icon svg' => 'color: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style5.rs-portfolio-slider .portfolio-item .p-icon2 a.prs_btn:hover .pbtn_icon svg path' => 'color: {{VALUE}};',
				],
			]
		);
		$this->add_group_control(
			\Elementor\Group_Control_Border::get_type(),
			[
				'name' => 'portfolio_hover_border',
				'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .p-icon a.prs_btn:hover,{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon a.prs_btn .btn_text',
				'condition' => ['portfolio_slider_style!' => '5']
			]
		);

$this->add_control(
			'btn__icon_hover_bg_color',
			[
				'label' => esc_html__('Icon HOver BG Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon .btn_icon_1:hover' => 'background-color: {{VALUE}};',
				],
				'condition' => ['portfolio_slider_style' => '2']
			]
		);

$this->add_control(
			'btn__icon_hover_color',
			[
				'label' => esc_html__('Hover Icon Color', 'rsaddon'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon .btn_icon_1:hover svg' => 'fill: {{VALUE}};',
					'{{WRAPPER}} .rs-portfolio-style2 .portfolio-item .p-icon .btn_icon_1:hover svg path' => 'fill: {{VALUE}};',
				],
				'condition' => ['portfolio_slider_style' => '2']
			]
		);

$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		// Button Style Ens

// number Style

$this->start_controls_section(
			'section_number_style',
			[
				'label' => esc_html__('Number Style', 'prelements'),
				'tab' => Controls_Manager::TAB_STYLE,
				'condition' => [
					'number_show_hide' => 'yes',
					'portfolio_slider_style' => '2'
				]
			]
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			[
				'name' => 'number_typography',
				'label' => esc_html__('Number Typography', 'prelements'),
				'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .numbering span',
			]
		);
		$this->add_control(
			'number_color',
			[
				'label' => esc_html__('Number Color', 'prelements'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .numbering span' => 'color: {{VALUE}};',
				],
			]
		);

$this->add_control(
			'number_fill_stroke_color',
			[
				'label' => esc_html__('Number Stroke Fill Color', 'prelements'),
				'type' => Controls_Manager::COLOR,
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .numbering span' => '-webkit-text-fill-color: {{VALUE}};',
				],
			]
		);

$this->add_group_control(
            \Elementor\Group_Control_Text_Stroke::get_type(),
            [
                'name' => 'number_text_stroke',
                'selector' => '{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .numbering span',
            ]
        );
		$this->add_responsive_control(
			'number_margin',
			[
				'label' => esc_html__('Number Margin', 'prelements'),
				'type' => Controls_Manager::DIMENSIONS,
				'size_units' => ['px', 'em', '%'],
				'selectors' => [
					'{{WRAPPER}} .rs-portfolio-slider .portfolio-item .portfolio-content .numbering span' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}!important;',
				],
			]
		);

// Controls For Style 4

$this->end_controls_section();
	}

/**
	 * Render rsgallery widget output on the frontend.
	 *
	 * Written in PHP and used to generate the final HTML.
	 *
	 * @since 1.0.0
	 * @access protected
	 */
	protected function render()
	{

$settings              = $this->get_settings_for_display();
		$slidesToShow          = !empty($settings['col_lg']) ? $settings['col_lg'] : 3;
		$autoplaySpeed         = $settings['slider_autoplay_speed'];
		$number_show_hide      = $settings['number_show_hide'];
		$interval              = $settings['slider_interval'];
		$slidesToScroll        = $settings['slides_ToScroll'];
		$slider_autoplay       = $settings['slider_autoplay'] === 'true' ? 'true' : 'false';
		$pauseOnHover          = $settings['slider_stop_on_hover'] === 'true' ? 'true' : 'false';
		$sliderDots            = $settings['slider_dots'] == 'true' ? 'true' : 'false';
		$sliderNav             = $settings['slider_nav'] == 'true' ? 'true' : 'false';
		$infinite              = $settings['slider_loop'] === 'true' ? 'true' : 'false';
		$centerMode            = $settings['slider_centerMode'] === 'true' ? 'true' : 'false';
		$col_lg                = $settings['col_lg'];
		$col_md                = $settings['col_md'];
		$col_sm                = $settings['col_sm'];
		$col_xs                = $settings['col_xs'];
		$col_lg_2                = $settings['col_lg_2'];
		$slider_centers_pad_xl = !empty($settings['slider_centers_pad_xl']) ? $settings['slider_centers_pad_xl'] : '400px';
		$slider_centers_pad_lg = !empty($settings['slider_centers_pad_lg']) ? $settings['slider_centers_pad_lg'] : '250px';
		$slider_centers_pad_md = !empty($settings['slider_centers_pad_md']) ? $settings['slider_centers_pad_md'] : '100px';

$overlay_show_hide = $settings['overlay_show_hide'] ?? '';
		$clip_path = $settings['clip_path'];

$unique = rand(2012, 35120);

if ( is_rtl() ) {
            $rtl= 'true';
        } else {
            $rtl= 'false';
        }

$slider_conf = compact('slidesToShow', 'autoplaySpeed', 'interval', 'slidesToScroll', 'slider_autoplay', 'pauseOnHover', 'sliderDots', 'sliderNav', 'infinite', 'centerMode', 'col_lg', 'col_md', 'col_sm', 'col_xs', 'slider_centers_pad_xl', 'slider_centers_pad_lg', 'slider_centers_pad_md', 'col_lg_2');
?>

<div class="rsaddon-unique-slider rs-addon-slider rs-portfolio-slider rs-portfolio rs-portfolio-style<?php echo esc_attr($settings['portfolio_slider_style']); ?> slider-style-<?php echo esc_attr($settings['portfolio_slider_style']); ?>  overlay-<?php echo esc_attr($overlay_show_hide); ?> <?php if($clip_path == 'yes') echo "clip-path-enable";?>">

<div id="rsaddon-slick-slider-<?php echo esc_attr($unique); ?>" class="rs-addon-sliders slick-dots-<?php echo esc_attr($settings['slider_dots_style']); ?>">
				<?php 
				if ('1' == $settings['portfolio_slider_style']) {
					include plugin_dir_path(__FILE__) . "/style1.php";
				} elseif ('2' == $settings['portfolio_slider_style']) {
					include plugin_dir_path(__FILE__) . "/style2.php";
				} elseif ('3' == $settings['portfolio_slider_style']) {
					include plugin_dir_path(__FILE__) . "/style3.php";
				} elseif ('4' == $settings['portfolio_slider_style']) {
					include plugin_dir_path(__FILE__) . "/style4.php";
				} 
				else {
					include plugin_dir_path(__FILE__) . "/style5.php";
				}
				?>
			</div>
			<div class="rsaddon-slider-conf wpsisac-hide" data-conf="<?php echo htmlspecialchars(json_encode($slider_conf)); ?>"></div>
		</div>
		<script type="text/javascript">
			jQuery(document).ready(function() {
				jQuery('#rsaddon-slick-slider-<?php echo esc_attr($unique); ?>').each(function(index) {
					var slider_id = jQuery(this).attr('id');
					var slider_conf = jQuery.parseJSON(jQuery(this).closest('.rsaddon-unique-slider').find('.rsaddon-slider-conf').attr('data-conf'));

if (typeof(slider_id) != 'undefined' && slider_id != '') {
						jQuery('#' + slider_id ).not('.slick-initialized').slick({
							slidesToShow: parseInt(slider_conf.col_lg),
							centerMode: (slider_conf.centerMode) == "true" ? true : false,
							dots: (slider_conf.sliderDots) == "true" ? true : false,
							arrows: (slider_conf.sliderNav) == "true" ? true : false,
							autoplay: (slider_conf.slider_autoplay) == "true" ? true : false,
							slidesToScroll: parseInt(slider_conf.slidesToScroll),
							centerPadding: slider_conf.slider_centers_pad_xl,
							autoplaySpeed: parseInt(slider_conf.autoplaySpeed),
							pauseOnHover: (slider_conf.pauseOnHover) == "true" ? true : false,
							infinite: true,
							loop: (slider_conf.slider_loop) == "true" ? true : false,
							rtl: <?php echo $rtl; ?>,
							responsive: [{
									breakpoint: 1200,
									settings: {
										slidesToShow: parseInt(slider_conf.col_md),
										slidesToScroll: 1,
									}
								},
								{
									breakpoint: 1199,
									settings: {
										slidesToShow: parseInt(slider_conf.col_lg_2),
										centerPadding: slider_conf.slider_centers_pad_xl,
									}
								},
								{
									breakpoint: 992,
									settings: {
										slidesToShow: parseInt(slider_conf.col_sm),
										slidesToScroll: 1,
										centerPadding: slider_conf.slider_centers_pad_lg,
									}
								},
								{
									breakpoint: 768,
									settings: {
										arrows: false,
										slidesToShow: parseInt(slider_conf.col_xs),
										slidesToScroll: 1,
										centerPadding: slider_conf.slider_centers_pad_md,
									}
								},
								{
									breakpoint: 600,
									settings: {
										slidesToShow: 1,
										arrows: false,
										slidesToScroll: 1,
										centerPadding: '0px',
									}
								}
							]
						});
					}

});
			});
		</script>

<?php 
			if ('5' == $settings['portfolio_slider_style']) { ?>
			<script type="text/javascript">
				document.addEventListener("DOMContentLoaded", function() {
					var tooltipTriggers = document.querySelectorAll(".rs-portfolio-style5 .portfolio-item");
					tooltipTriggers.forEach(function(element) {
						element.addEventListener("mousemove", myFunction);
					});
					function myFunction(e) {
						var x = e.clientX;
						var y = e.clientY;
						var tooltipTrigger = e.currentTarget;
						var tooltip = tooltipTrigger.querySelector(".rs-portfolio-style5 .portfolio-content");
						var triggerRect = tooltipTrigger.getBoundingClientRect();
						var offsetX = x - triggerRect.left;
						var offsetY = y - triggerRect.top;
						var tooltipRect = tooltip.getBoundingClientRect();
						var triggerWidth = triggerRect.width;
						var triggerHeight = triggerRect.height;
						var tooltipWidth = tooltipRect.width;
						var tooltipHeight = tooltipRect.height;
						var buffer = 200;
						var maxX = triggerWidth - tooltipWidth + buffer;
						var maxY = triggerHeight - tooltipHeight + buffer;
						var left = Math.min(Math.max(x - triggerRect.left - tooltipWidth / 2, -buffer), maxX);
						var top = Math.min(Math.max(y - triggerRect.top - tooltipHeight / 2, -buffer), maxY);
						tooltip.style.left = left + "px";
						tooltip.style.top = top + "px";
					}
				});
			</script>
		<?php } ?>
<?php
	}
	public function getCategories()
	{
		$cat_list = [];
		if (post_type_exists('portfolios')) {
			$terms = get_terms(array(
				'taxonomy'    => 'portfolios-category',
				'hide_empty'  => true
			));

foreach ($terms as $post) {
				$cat_list[$post->slug]  = [$post->name];
			}
		}
		return $cat_list;
	}
}