<?php
namespace EcafeAddons\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Utils;
use Elementor\Group_Control_Typography;
use Elementor\Core\Schemes\Typography;
use Elementor\Scheme_Color;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Text_Shadow;

use EcafeAddons\EcafeElementLoad;

if ( ! defined( 'ABSPATH' ) ) {
	exit; // Exit if accessed directly.
}

class Ecafe_Service_Lists extends Widget_Base {

	public function get_name() {
		return 'ecafe-service-lists';
	}

	public function get_title() {
		return esc_html__( 'Service Lists', 'essential-classy-addons-for-elementor' );
	}

	public function get_icon() {
		return 'ecafe-ele-back-icon ecafe-service-lists';
	}

	public function get_categories() {
		return array( 'essential' );
	}

	public function get_keywords() {
		return array( 'service lists', 'lists', 'info lists', 'service portfolio' );
	}

	public function get_script_depends() {
		return array( 'ecafe-service-lists' );
	}

	public function get_custom_help_url() {
		return 'https://store.kapasias.com/helpdesk/';
	}

	public function has_widget_inner_wrapper(): bool {
		return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
	}

	protected function register_controls() {

		$this->start_controls_section(
			'contentSection',
			array(
				'label' => esc_html__( 'Service Lists', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_CONTENT,
			)
		);
		$this->add_control(
			'slTitle',
			array(
				'label'       => esc_html__( 'Title', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => esc_html__( 'Title', 'essential-classy-addons-for-elementor' ),
				'dynamic'     => array(
					'active' => true,
				),
				'label_block' => true,
			)
		);
		$this->add_control(
			'slTitleTag',
			array(
				'label'   => esc_html__( 'Tag', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'div',
				'options' => \EcafeHelper::getHtmlTag( 'a' ),
			)
		);
		$this->add_control(
			'slTitleTagLink',
			array(
				'label'       => esc_html__( 'Link', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::URL,
				'dynamic'     => array( 'active' => true ),
				'placeholder' => esc_html__( '#', 'essential-classy-addons-for-elementor' ),
				'default'     => array(
					'url' => '#',
				),
				'condition'   => array(
					'slTitleTag' => 'a',
				),
			)
		);
		$this->add_control(
			'infoTitleUnderlineEffect',
			array(
				'label'     => esc_html__( 'Underline Text Effect', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SWITCHER,
				'label_on'  => esc_html__( 'Enable', 'essential-classy-addons-for-elementor' ),
				'label_off' => esc_html__( 'Disable', 'essential-classy-addons-for-elementor' ),
				'default'   => 'no',
			)
		);
		$this->add_control(
			'gutEffectType',
			array(
				'label'     => esc_html__( 'Effect', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'effect1',
				'options'   => array(
					'effect1'  => esc_html__( 'Effect 1', 'essential-classy-addons-for-elementor' ),
					'effect2'  => esc_html__( 'Effect 2', 'essential-classy-addons-for-elementor' ),
					'effect3'  => esc_html__( 'Effect 3', 'essential-classy-addons-for-elementor' ),
					'effect4'  => esc_html__( 'Effect 4', 'essential-classy-addons-for-elementor' ),
					'effect5'  => esc_html__( 'Effect 5', 'essential-classy-addons-for-elementor' ),
					'effect6'  => esc_html__( 'Effect 6', 'essential-classy-addons-for-elementor' ),
					'effect7'  => esc_html__( 'Effect 7', 'essential-classy-addons-for-elementor' ),
					'effect8'  => esc_html__( 'Effect 8', 'essential-classy-addons-for-elementor' ),
					'effect9'  => esc_html__( 'Effect 9', 'essential-classy-addons-for-elementor' ),
					'effect10' => esc_html__( 'Effect 10', 'essential-classy-addons-for-elementor' ),
					'effect11' => esc_html__( 'Effect 11', 'essential-classy-addons-for-elementor' ),
					'effect12' => esc_html__( 'Effect 12', 'essential-classy-addons-for-elementor' ),
					'effect13' => esc_html__( 'Effect 13', 'essential-classy-addons-for-elementor' ),
					'effect14' => esc_html__( 'Effect 14', 'essential-classy-addons-for-elementor' ),
					'effect15' => esc_html__( 'Effect 15', 'essential-classy-addons-for-elementor' ),
					'effect16' => esc_html__( 'Effect 16', 'essential-classy-addons-for-elementor' ),
					'effect17' => esc_html__( 'Effect 17', 'essential-classy-addons-for-elementor' ),
					'effect18' => esc_html__( 'Effect 18', 'essential-classy-addons-for-elementor' ),
					'effect19' => esc_html__( 'Effect 19', 'essential-classy-addons-for-elementor' ),
					'effect20' => esc_html__( 'Effect 20', 'essential-classy-addons-for-elementor' ),
				),
				'condition' => array(
					'infoTitleUnderlineEffect' => 'yes',
				),
			)
		);
		$this->add_control(
			'slContent',
			array(
				'label'      => esc_html__( 'Content', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::WYSIWYG,
				'default'    => esc_html__( 'Content', 'essential-classy-addons-for-elementor' ),
				'show_label' => false,
				'dynamic'    => array(
					'active' => true,
				),
			)
		);
		$this->add_control(
			'slIconImage',
			array(
				'label'   => esc_html__( 'Source', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'icon',
				'options' => array(
					'icon'  => esc_html__( 'Icon', 'essential-classy-addons-for-elementor' ),
					'image' => esc_html__( 'Image', 'essential-classy-addons-for-elementor' ),
				),
			)
		);
		$this->add_control(
			'slIcon',
			array(
				'label'     => esc_html__( 'Icon', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::ICONS,
				'default'   => array(
					'value'   => 'fas fa-plus',
					'library' => 'solid',
				),
				'condition' => array(
					'slIconImage' => 'icon',
				),
			)
		);
		$this->add_control(
			'slImage',
			array(
				'label'     => esc_html__( 'Image', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::MEDIA,
				'default'   => array(
					'url' => \Elementor\Utils::get_placeholder_image_src(),
				),
				'condition' => array(
					'slIconImage' => 'image',
				),
			)
		);
		$repeater = new \Elementor\Repeater();
		$repeater->add_control(
			'slTitle',
			array(
				'label'       => esc_html__( 'List Title', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => esc_html__( 'List', 'essential-classy-addons-for-elementor' ),
				'dynamic'     => array(
					'active' => true,
				),
				'label_block' => true,
			)
		);
		$repeater->add_control(
			'slTitleLink',
			array(
				'label'       => esc_html__( 'Link', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::URL,
				'dynamic'     => array( 'active' => true ),
				'placeholder' => esc_html__( '#', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'slItems',
			array(
				'label'       => '',
				'type'        => Controls_Manager::REPEATER,
				'fields'      => $repeater->get_controls(),
				'default'     => array(
					array(
						'slTitle' => esc_html__( 'List #1', 'essential-classy-addons-for-elementor' ),
					),
					array(
						'slTitle' => esc_html__( 'List #2', 'essential-classy-addons-for-elementor' ),
					),
					array(
						'slTitle' => esc_html__( 'List #3', 'essential-classy-addons-for-elementor' ),
					),
				),
				'title_field' => '{{{ slTitle }}}',
			)
		);
		$this->end_controls_section();

		/*Tilt Effect Options*/
		include ECAFE_PATH . 'element/widgets/ecafe-tilt-options.php';

		/*Tippy Tooltip Options*/
		include ECAFE_PATH . 'element/widgets/ecafe-tippy-options.php';

		/*Notice panel*/
		$ecwidgetdemolink = esc_url( 'https://ecaddons.com/elements/service-lists/' );
		$ecwidgetdoclink  = esc_url( 'https://ecaddons.com/docs/service-lists-widget-tutorial/' );
		include ECAFE_PATH . 'element/widgets/ecafe-widgetpanel-help.php';

		/*icon image style start*/
		$this->start_controls_section(
			'sectionIconImageStyling',
			array(
				'label' => esc_html__( 'Icon/Image', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_control(
			'iiIconHeading',
			array(
				'label' => esc_html__( 'Icon', 'essential-classy-addons-for-elementor' ),
				'type'  => Controls_Manager::HEADING,
			)
		);
		$this->add_responsive_control(
			'iiIconSize',
			array(
				'label'      => esc_html__( 'Size', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 300,
					),
				),
				'default'    => array(
					'unit' => 'px',
					'size' => 30,
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image i' => 'font-size: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image svg' => 'width: {{SIZE}}{{UNIT}};height: {{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsiiIconStyle' );
		$this->start_controls_tab(
			'tabiiIconN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iiIconColorN',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image i' => 'color: {{VALUE}};',
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image svg' => 'fill: {{VALUE}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabiiIconH',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iiIconColorH',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-ia-icon-image i' => 'color: {{VALUE}};',
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-ia-icon-image svg' => 'fill: {{VALUE}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->add_control(
			'iiIconBoxHeading',
			array(
				'label'     => esc_html__( 'Icon/Image Box', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::HEADING,
				'separator' => 'before',
			)
		);
		$this->add_responsive_control(
			'iiIconWidth',
			array(
				'label'      => esc_html__( 'Width', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 300,
					),
				),
				'default'    => array(
					'unit' => 'px',
					'size' => 100,
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image' => 'width: {{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'iiIconHeight',
			array(
				'label'      => esc_html__( 'Height', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 300,
					),
				),
				'default'    => array(
					'unit' => 'px',
					'size' => 100,
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image' => 'height: {{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsiiboxStyle' );
		$this->start_controls_tab(
			'tabiiboxN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iiboxShadow',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image',
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iiboxBackground',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iiboxBorder',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image',
			)
		);
		$this->add_responsive_control(
			'iiboxBr',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-ia-icon-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabhiiboxH',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iiboxShadowH',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-ia-icon-image',
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iiboxBackgroundH',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-ia-icon-image',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iiboxBorderH',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-ia-icon-image',
			)
		);
		$this->add_responsive_control(
			'iiboxBrH',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-ia-icon-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*icon image style end*/

		/*title style start*/
		$this->start_controls_section(
			'sectionTitleStyling',
			array(
				'label' => esc_html__( 'Title', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'iitPadding',
			array(
				'label'      => esc_html__( 'Padding', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'iitMargin',
			array(
				'label'      => esc_html__( 'Margin', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'iitTypography',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title',
			)
		);
		$this->start_controls_tabs( 'tabsiitStyle' );
		$this->start_controls_tab(
			'tabiitN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iitColor',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iitBackground',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iitBorder',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title',
			)
		);
		$this->add_responsive_control(
			'iitBr',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iitShadow',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title',
			)
		);
		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'iitTextShadow',
				'label'    => esc_html__( 'Text Shadow', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-title',
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabiitH',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iitColorH',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iitBackgroundH',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iitBorderH',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title',
			)
		);
		$this->add_responsive_control(
			'iitBrH',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iitShadowH',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title',
			)
		);
		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'iitTextShadowH',
				'label'    => esc_html__( 'Text Shadow', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title',
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*title style end*/

		/*title underline*/
		$this->start_controls_section(
			'titleUnderlineStyling',
			array(
				'label'     => esc_html__( 'Title Underline Effect', 'essential-classy-addons-for-elementor' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array(
					'infoTitleUnderlineEffect' => 'yes',
				),
			)
		);
		$this->add_responsive_control(
			'gut128Start',
			array(
				'label'      => esc_html__( 'Starting Visibility', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-size: {{SIZE}}% 100%;',
				),
				'condition'  => array(
					'gutEffectType' => array( 'effect1', 'effect2', 'effect8' ),
				),
			)
		);
		$this->add_responsive_control(
			'gut34679_14Start',
			array(
				'label'      => esc_html__( 'Starting Visibility', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-size: 100% {{SIZE}}%;',
				),
				'condition'  => array(
					'gutEffectType' => array( 'effect3', 'effect4', 'effect6', 'effect7', 'effect9', 'effect10', 'effect11', 'effect12', 'effect13', 'effect14' ),
				),
			)
		);
		$this->add_responsive_control(
			'gut5CenterStart',
			array(
				'label'      => esc_html__( 'Center Starting Visibility', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-size: {{SIZE}}% {{SIZE}}%;',
				),
				'condition'  => array(
					'gutEffectType' => 'effect5',
				),
			)
		);
		$this->add_responsive_control(
			'gut15_20Start',
			array(
				'label'      => esc_html__( 'Starting Visibility', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 100,
					),
				),
				'default'    => array(
					'unit' => '%',
					'size' => 10,
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-size:{{SIZE}}% {{gut15_20Height.SIZE}}px;',
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title' => 'background-size:100% {{gut15_20Height.SIZE}}px !important;',
				),
				'condition'  => array(
					'gutEffectType' => array( 'effect15', 'effect16', 'effect17', 'effect18', 'effect19', 'effect20' ),
				),
			)
		);
		$this->add_responsive_control(
			'gut15_20Height',
			array(
				'label'      => esc_html__( 'Height', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 100,
					),
				),
				'default'    => array(
					'unit' => '%',
					'size' => 5,
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-size:{{gut15_20Start.SIZE}}% {{SIZE}}px;',
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-title' => 'background-size:100% {{SIZE}}px !important;',
				),
				'condition'  => array(
					'gutEffectType' => array( 'effect15', 'effect16', 'effect17', 'effect18', 'effect19', 'effect20' ),
				),
			)
		);
		$this->add_control(
			'gut1267Deg',
			array(
				'label'     => esc_html__( 'Deg (0 - 360)', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::NUMBER,
				'min'       => 0,
				'max'       => 360,
				'step'      => 1,
				'default'   => 120,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image: linear-gradient({{VALUE}}deg,{{gut1267Color1.VALUE}},{{gut1267Color2.VALUE}});',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect1', 'effect2', 'effect6', 'effect7' ),
				),
			)
		);
		$this->add_control(
			'gut1267Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient({{gut1267Deg.VALUE}}deg,{{VALUE}},{{gut1267Color2.VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect1', 'effect2', 'effect6', 'effect7' ),
				),
			)
		);
		$this->add_control(
			'gut1267Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient({{gut1267Deg.VALUE}}deg,{{gut1267Color1.VALUE}},{{VALUE}});',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect1', 'effect2', 'effect6', 'effect7' ),
				),
			)
		);
		$this->add_control(
			'gut3Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to top,{{VALUE}},{{gut3Color2.VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => 'effect3',
				),
			)
		);
		$this->add_control(
			'gut3Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to top,{{gut3Color1.VALUE}},{{VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => 'effect3',
				),
			)
		);
		$this->add_control(
			'gut4Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to bottom,{{VALUE}},{{gut4Color2.VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => 'effect4',
				),
			)
		);
		$this->add_control(
			'gut4Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to bottom,{{gut4Color1.VALUE}},{{VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => 'effect4',
				),
			)
		);
		$this->add_control(
			'gut5Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:radial-gradient(circle,{{VALUE}} 0%,{{gut5Color2.VALUE}} 100%)',
				),
				'condition' => array(
					'gutEffectType' => 'effect5',
				),
			)
		);
		$this->add_control(
			'gut5Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:radial-gradient(circle,{{gut5Color1.VALUE}} 0%,{{VALUE}} 100%)',
				),
				'condition' => array(
					'gutEffectType' => 'effect5',
				),
			)
		);
		$this->add_control(
			'gut8Deg',
			array(
				'label'     => esc_html__( 'Deg (0 - 360)', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::NUMBER,
				'min'       => 0,
				'max'       => 360,
				'step'      => 1,
				'default'   => 135,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image: linear-gradient({{VALUE}}deg,{{gut8Color1.VALUE}},{{gut8Color2.VALUE}},{{gut8Color1.VALUE}},{{gut8Color2.VALUE}});',
				),
				'condition' => array(
					'gutEffectType' => 'effect8',
				),
			)
		);
		$this->add_control(
			'gut8Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient({{gut8Deg.VALUE}}deg,{{VALUE}},{{gut8Color2.VALUE}},{{VALUE}},{{gut8Color2.VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => 'effect8',
				),
			)
		);
		$this->add_control(
			'gut8Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient({{gut8Deg.VALUE}}deg,{{gut8Color1.VALUE}},{{VALUE}},{{gut8Color1.VALUE}},{{VALUE}});',
				),
				'condition' => array(
					'gutEffectType' => 'effect8',
				),
			)
		);
		$this->add_control(
			'gut9Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to top,{{VALUE}} 5px,{{gut9Color2.VALUE}} 5px)',
				),
				'condition' => array(
					'gutEffectType' => 'effect9',
				),
			)
		);
		$this->add_control(
			'gut9Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to top,{{gut9Color1.VALUE}} 5px,{{VALUE}} 5px)',
				),
				'condition' => array(
					'gutEffectType' => 'effect9',
				),
			)
		);
		$this->add_control(
			'gut10Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to bottom,{{VALUE}} 5px,{{gut10Color2.VALUE}} 5px)',
				),
				'condition' => array(
					'gutEffectType' => 'effect10',
				),
			)
		);
		$this->add_control(
			'gut10Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to bottom,{{gut10Color1.VALUE}} 5px,{{VALUE}} 5px)',
				),
				'condition' => array(
					'gutEffectType' => 'effect10',
				),
			)
		);
		$this->add_control(
			'gut11Color1',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to right,{{VALUE}} 100%,transparent 0)',
				),
				'condition' => array(
					'gutEffectType' => 'effect11',
				),
			)
		);
		$this->add_control(
			'gut12Color1',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to left,{{VALUE}} 100%,transparent 0)',
				),
				'condition' => array(
					'gutEffectType' => 'effect12',
				),
			)
		);
		$this->add_control(
			'gut1314Color1',
			array(
				'label'     => esc_html__( 'Color 1', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to top,{{VALUE}},{{gut1314Color2.VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect13', 'effect14' ),
				),
			)
		);
		$this->add_control(
			'gut1314Color2',
			array(
				'label'     => esc_html__( 'Color 2', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#e130e480',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to top,{{gut1314Color1.VALUE}},{{VALUE}})',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect13', 'effect14' ),
				),
			)
		);
		$this->add_control(
			'gut15161819Color1',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to right,{{VALUE}} 100%,transparent 0)',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect15', 'effect16', 'effect18', 'effect19' ),
				),
			)
		);
		$this->add_control(
			'gut1720Color1',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#deff1380',
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-title' => 'background-image:linear-gradient(to left,{{VALUE}} 100%,transparent 0)',
				),
				'condition' => array(
					'gutEffectType' => array( 'effect17', 'effect20' ),
				),
			)
		);
		$this->end_controls_section();
		/*title underline*/

		/*content style start*/
		$this->start_controls_section(
			'sectionContentStyling',
			array(
				'label' => esc_html__( 'Content', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'iicPadding',
			array(
				'label'      => esc_html__( 'Padding', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'iicMargin',
			array(
				'label'      => esc_html__( 'Margin', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'iicTypography',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents,
				{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents p',
			)
		);
		$this->start_controls_tabs( 'tabsiicStyle' );
		$this->start_controls_tab(
			'tabiicN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iicColor',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iicBackground',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iicBorder',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents',
			)
		);
		$this->add_responsive_control(
			'iicBr',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iicShadow',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents',
			)
		);
		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'iicTextShadow',
				'label'    => esc_html__( 'Text Shadow', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-contents',
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabiicH',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iicColorH',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-contents' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iicBackgroundH',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-contents',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iicBorderH',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-contents',
			)
		);
		$this->add_responsive_control(
			'iicBrH',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-contents' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iicShadowH',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-contents',
			)
		);
		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'iicTextShadowH',
				'label'    => esc_html__( 'Text Shadow', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover .eca-service-lists-contents',
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*content style end*/

		/*seprator style start*/
		$this->start_controls_section(
			'sectionSepratorStyling',
			array(
				'label' => esc_html__( 'Seprator Line', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_control(
			'sepColor',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-icon-image:after' => 'background-color: {{VALUE}};',
				),
			)
		);
		$this->add_responsive_control(
			'sepWidth',
			array(
				'label'      => esc_html__( 'Width', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 10,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-icon-image:after' => 'width:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->end_controls_section();
		/*seprator style end*/

		/*listdots style start*/
		$this->start_controls_section(
			'sectionListDotsStyling',
			array(
				'label' => esc_html__( 'List Dots', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'ListDotsLeft',
			array(
				'label'      => esc_html__( 'Left Offset', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%' ),
				'range'      => array(
					'px' => array(
						'min' => -500,
						'max' => 500,
					),
					'%'  => array(
						'min'  => -100,
						'max'  => 100,
						'step' => 1,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before' => 'left:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'ListDotsWidth',
			array(
				'label'      => esc_html__( 'Width', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 300,
					),
					'%'  => array(
						'min'  => 1,
						'max'  => 100,
						'step' => 1,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before' => 'width:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'ListDotsHeight',
			array(
				'label'      => esc_html__( 'Height', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 300,
					),
					'%'  => array(
						'min'  => 1,
						'max'  => 100,
						'step' => 1,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before' => 'height:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsListDotsStyle' );
		$this->start_controls_tab(
			'tabListDotsN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'ldbg',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'ldbrdr',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before',
			)
		);
		$this->add_responsive_control(
			'ldBr',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'ldShadow',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:before',
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabListDotsH',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'ldbgH',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover:before',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'ldbrdrH',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover:before',
			)
		);
		$this->add_responsive_control(
			'ldBrH',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover:before' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'ldShadowH',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover:before',
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*listdots style end*/

		/*list style start*/
		$this->start_controls_section(
			'sectionListStyling',
			array(
				'label' => esc_html__( 'List', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'listpadding',
			array(
				'label'      => esc_html__( 'Padding', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'listGap',
			array(
				'label'      => esc_html__( 'Gap', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 1,
						'max' => 100,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:not(:last-child)' => 'margin-bottom:{{SIZE}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'listTypography',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list,
				{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list a',
			)
		);
		$this->start_controls_tabs( 'tabsiilistStyle' );
		$this->start_controls_tab(
			'tabiilistN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iilistColor',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list,
				{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list a' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iilistBackground',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iilistBorder',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list',
			)
		);
		$this->add_responsive_control(
			'iilistBr',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iilistShadow',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list',
			)
		);
		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'iilistTextShadow',
				'label'    => esc_html__( 'Text Shadow', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list,
				{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list a',
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabiilistH',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'iilistColorH',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover,
				{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover a' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'iilistBackgroundH',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'iilistBorderH',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover',
			)
		);
		$this->add_responsive_control(
			'iilistBrH',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'iilistShadowH',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover',
			)
		);
		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'iilistTextShadowH',
				'label'    => esc_html__( 'Text Shadow', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover,
				{{WRAPPER}} .eca-service-lists-wrapper li.eca-service-lists-list:hover a',
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*list style end*/

		/*list box style start*/
		$this->start_controls_section(
			'sectionListBoxStyling',
			array(
				'label' => esc_html__( 'List Box', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'ListBoxMargin',
			array(
				'label'      => esc_html__( 'Margin', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper ul.eca-service-lists-lists' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'crMaxWidth',
			array(
				'label'      => esc_html__( 'Content Max. Width', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( '%' ),
				'default'    => array(
					'unit' => '%',
					'size' => 50,
				),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper .eca-service-lists-content' => 'max-width: {{SIZE}}%;',
				),
			)
		);
		$this->end_controls_section();
		/*list box style end*/

		/*box style start*/
		$this->start_controls_section(
			'sectionBoxStyling',
			array(
				'label' => esc_html__( 'Box', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'boxPadding',
			array(
				'label'      => esc_html__( 'Padding', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_responsive_control(
			'boxMargin',
			array(
				'label'      => esc_html__( 'Margin', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsBoxtyle' );
		$this->start_controls_tab(
			'tabBoxNorm',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'boxBgNorm',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'boxBorderNorm',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper',
			)
		);
		$this->add_responsive_control(
			'boxBrNorm',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'boxShadowNorm',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper',
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabBoxHover',
			array(
				'label' => esc_html__( 'Hover', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'boxBgHover',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'boxBorderHover',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover',
			)
		);
		$this->add_responsive_control(
			'boxBrHover',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .eca-service-lists-wrapper:hover' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'boxShadowHover',
				'selector' => '{{WRAPPER}} .eca-service-lists-wrapper:hover',
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();
		$this->end_controls_section();
		/*box style end*/
	}

	protected function render() {

		$settings    = $this->get_settings_for_display();
		$slTitle     = ! empty( $settings['slTitle'] ) ? $settings['slTitle'] : '';
		$slTitleTag  = ! empty( $settings['slTitleTag'] ) ? $settings['slTitleTag'] : 'div';
		$slContent   = ! empty( $settings['slContent'] ) ? '<div class="eca-service-lists-contents">' . wp_kses_post( $settings['slContent'] ) . '</div>' : '';
		$slIconImage = ! empty( $settings['slIconImage'] ) ? $settings['slIconImage'] : 'icon';

		$sl_icon = '';
		if ( $slIconImage ) {
			if ( ! empty( $settings['slIcon'] ) && $slIconImage == 'icon' ) {
				ob_start();
				\Elementor\Icons_Manager::render_icon( $settings['slIcon'], array( 'aria-hidden' => 'true' ) );
				$icons_loop = ob_get_contents();
				ob_end_clean();

				if ( ! empty( $icons_loop ) ) {
					$sl_icon .= '<div class="eca-service-lists-icon-image"><span class="eca-ia-icon-image icon">' . $icons_loop . '</span></div>';
				}
			}

			if ( ! empty( $settings['slImage']['id'] ) && $slIconImage == 'image' ) {
				$image_id  = $settings['slImage']['id'];
				$image_src = wp_get_attachment_image_src( $image_id, 'full' );

				$sl_icon .= '<div class="eca-service-lists-icon-image"><img src="' . esc_url( $image_src[0] ) . '" class="eca-ia-icon-image image"></div>';
			}
		}

		$sl_title = '';
		if ( ! empty( $slTitle ) ) {
			$infoTitleUnderlineEffect = isset( $settings['infoTitleUnderlineEffect'] ) ? $settings['infoTitleUnderlineEffect'] : '';
			$gutEffectType            = ! empty( $settings['gutEffectType'] ) ? $settings['gutEffectType'] : '';
			$utc                      = '';
			if ( $infoTitleUnderlineEffect == 'yes' && ! empty( $gutEffectType ) ) {
				$utc = ' ec-gut-underline ec-gut-' . esc_attr( $settings['gutEffectType'] );
			}
			if ( $slTitleTag == 'a' && ! empty( $settings['slTitleTagLink']['url'] ) ) {
				$this->add_link_attributes( 'slTitleTagLink', $settings['slTitleTagLink'] );
				$this->add_render_attribute( 'slTitleTagLink', 'class', 'eca-service-lists-title ' . esc_attr( $utc ) );

				$sl_title = '<' . \EcafeHelper::check_and_validate_html_tag( $slTitleTag ) . ' ' . $this->get_render_attribute_string( 'slTitleTagLink' ) . '>' . esc_html( $slTitle ) . '</' . \EcafeHelper::check_and_validate_html_tag( $slTitleTag ) . '>';
			} else {
				$sl_title = '<' . \EcafeHelper::check_and_validate_html_tag( $slTitleTag ) . ' class="eca-service-lists-title ' . esc_attr( $utc ) . '">' . esc_html( $slTitle ) . '</' . \EcafeHelper::check_and_validate_html_tag( $slTitleTag ) . '>';
			}
		}

		$tiltclass  = '';
		$tiltrender = '';
		if ( isset( $settings['tiltEffect'] ) && $settings['tiltEffect'] === 'yes' ) {
			/*Tilt Effect Render*/
			include ECAFE_PATH . 'element/widgets/ecafe-tilt-render.php';
		}
		$tippyclass  = '';
		$tippyrender = '';
		if ( isset( $settings['tippyTooltip'] ) && $settings['tippyTooltip'] === 'yes' ) {
			/*Tippy Tooltip Render*/
			include ECAFE_PATH . 'element/widgets/ecafe-tippy-render.php';
		}
		$output      = '<div class="eca-service-lists-wrapper ' . esc_attr( $tiltclass ) . ' ' . esc_attr( $tippyclass ) . '" ' . $tiltrender . ' ' . $tippyrender . '>';
			$output .= $sl_icon;
			$output .= '<div class="eca-service-lists-content">';
		if ( $sl_title || $slContent ) {
			$output .= '<div class="eca-service-lists-title-desc">';
		}
					$output .= $sl_title;
					$output .= $slContent;

		if ( $sl_title || $slContent ) {
			$output .= '</div>';
		}

		if ( ! empty( $settings['slItems'] ) ) {
			$output .= '<ul class="eca-service-lists-lists">';
			foreach ( $settings['slItems'] as $index => $item ) {

				if ( ! empty( $item['slTitleLink']['url'] ) ) {
					$output .= '<li class="eca-service-lists-list"><a href="' . esc_url( $item['slTitleLink']['url'] ) . '" >' . esc_attr( $item['slTitle'] ) . '</a></li>';
				} else {
					$output .= '<li class="eca-service-lists-list">' . esc_attr( $item['slTitle'] ) . '</li>';
				}
			}
			$output .= '</ul>';
		}
			$output .= '</div>';
			$output .= '</div>';
			echo wp_kses_normalize_entities( $output );
	}
}
