<?php

namespace iKreateThemeElements\Modules\TeamBlock\Widgets;

// Elementor Classes
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Image_Size;
use Elementor\Icons_Manager;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Typography;
use Elementor\Core\Schemes\Color;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Text_Stroke;
use Elementor\Group_Control_Text_Shadow;
use Elementor\Group_Control_Css_Filter;
use Elementor\Utils;
use Elementor\Repeater;

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

class TeamBlock extends Widget_Base {

    /** Widget Name */
    public function get_name() {
        return 'ikreateThemes-team-block';
    }

    /** Widget Title */
    public function get_title() {
        return esc_html__('Team Block', 'business-roy');
    }

    /** Icon */
    public function get_icon() {
        return 'eicon-person';
    }

    public function get_keywords() {
		return [ 'team', 'member', 'image', 'profile', 'box' ];
	}

	public function get_script_depends() {
		return [ 'imagesloaded' ];
	}

    /** Category */
    public function get_categories() {
        return ['ikreateThemes-elements'];
    }

    /** Controls */
    protected function register_controls() {

        $this->start_controls_section(
            'team', [
                'label' => esc_html__('Member Details', 'business-roy'),
            ]
        );

            $this->add_control(
                'layout', [
                    'label' => esc_html__('Team Member Style', 'business-roy'),
                    'type' => Controls_Manager::SELECT,
                    'default' => 'style7',
                    'label_block' => true,
                    'options' => [
                        'style1' => esc_html__('Style 1', 'business-roy'),
                        'style3' => esc_html__('Style 2', 'business-roy'),
                        'style7' => esc_html__('Style 3', 'business-roy'),
                    ],
                ]
            );
            
            $this->add_responsive_control(
                'custom_height', [
                    'label' => esc_html__('Custom Image Height', 'business-roy'),
                    'type' => Controls_Manager::SWITCHER,
                    'label_on' => esc_html__('Yes', 'business-roy'),
                    'label_off' => esc_html__('No', 'business-roy'),
                    'return_value' => 'yes',
                    'default' => 'yes',
                    'condition' => ['layout' => ['style1','style3']],
                ]
            );

            $this->add_responsive_control(
                'image_height', [
                    'label' => esc_html__('Image Height', 'business-roy'),
                    'type' => Controls_Manager::SLIDER,
                    'size_units' => ['px'],
                    'range' => [
                        'px' => [
                            'min' => 320,
                            'max' => 750,
                            'step' => 10
                        ],
                    ],
                    'default' => [
                        'unit' => 'px',
                        'size' => '450',
                    ],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-member-img img' => 'height: {{SIZE}}{{UNIT}}; object-fit: cover;',
                    ],
                    'conditions' => [
                        'relation' => 'and',
                        'terms' => [
                            [
                                'name' => 'custom_height',
                                'operator' => '==',
                                'value' => 'yes',
                            ],
                            [
                                'relation' => 'or',
                                'terms' => [
                                    [
                                        'name' => 'layout',
                                        'operator' => '==',
                                        'value' => 'style1',
                                    ],
                                    [
                                        'name' => 'layout',
                                        'operator' => '==',
                                        'value' => 'style3',
                                    ],
                                ],
                            ],
                        ],
                    ]
                ]
            );

            $this->add_control(
                'header_member_image', [
                    'label' => esc_html__('Header Photo', 'business-roy'),
                    'type' => Controls_Manager::MEDIA,
                    'default' => [
                        'url' => Utils::get_placeholder_image_src(),
                    ],
                    'condition' => [
                        'layout' => ['style7'],
                    ],
                ]
            );

            $this->add_group_control(
                Group_Control_Image_Size::get_type(),[
                    'name' => 'headerthumb',
                    'default' => 'full',
                    'condition' => [
                        'header_member_image[id]!' => '',
                        'layout' => ['style7'],
                    ],
                ]
            );

            $this->add_control(
                'member_name', [
                    'label' => esc_html__('Name', 'business-roy'),
                    'type' => Controls_Manager::TEXT,
                    'label_block' => true,
                    'default' => esc_html__('John Doe', 'business-roy'),
                    'placeholder' => esc_html__('Enter the name here', 'business-roy'),
                ]
            );

            $this->add_control(
                'member_designation', [
                    'label' => esc_html__('Designations', 'business-roy'),
                    'type' => Controls_Manager::TEXT,
                    'label_block' => true,
                    'placeholder' => esc_html__('Enter the designation here', 'business-roy'),
                    'default' => esc_html__('Support Engineer', 'business-roy')
                ]
            );

            $this->add_control(
                'member_description', [
                    'label' => esc_html__('Description', 'business-roy'),
                    'type' => Controls_Manager::TEXTAREA,
                    'rows' => 5,
                    'placeholder' => esc_html__('Type the description here', 'business-roy'),
                    'default' => esc_html__('End your search here! Unlock Our Premium Themes to launch your website. All themes are user-friendly and fully customizable.', 'business-roy'),
                    'condition' => [
                        'layout' => ['style1','style3'],
                    ],
                ]
            );

            $this->add_control(
                'member_image', [
                    'label' => esc_html__('Choose Photo', 'business-roy'),
                    'type' => Controls_Manager::MEDIA,
                    'default' => [
                        'url' => Utils::get_placeholder_image_src(),
                    ],
                ]
            );

            $this->add_group_control(
                Group_Control_Image_Size::get_type(),[
                    'name' => 'thumb', // Actually its `image_size`
                    'default' => 'full',
                    'condition' => [
                        'member_image[id]!' => '',
                    ],
                ]
            );

            $this->add_control(
                'button_link', [
                    'label' => esc_html__('Button Link', 'business-roy'),
                    'type' => Controls_Manager::URL,
                    'placeholder' => esc_html__('Enter URL', 'business-roy'),
                    'default' => [
                        'url' => '#',
                        'is_external' => false,
                        'nofollow' => false,
                    ],
                ]
            );

            $repeater = new Repeater();

            $repeater->add_control(
                'social_icon_title', [
                    'label' => esc_html__('Title', 'business-roy'),
                    'type' => Controls_Manager::TEXT,
                    'label_block' => true,
                    'default' => esc_html__('Social Icon', 'business-roy'),
                ]
            );

            $repeater->add_control(
                'social_icon', [
                    'label' => esc_html__('Icon', 'business-roy'),
                    'type' => Controls_Manager::ICONS,
                    'default' => [
                        'value' => 'fab fa-facebook-f',
                        'library' => 'solid',
                    ],
                ]
            );

            $repeater->add_control(
                'social_icon_link', [
                    'label' => esc_html__('Button Link', 'business-roy'),
                    'type' => Controls_Manager::URL,
                    'placeholder' => esc_html__('Enter URL', 'business-roy'),
                    'show_external' => true,
                    'default' => [
                        'url' => '#',
                        'is_external' => true,
                        'nofollow' => true,
                    ],
                ]
            );

            $this->add_control(
                'social_icons_block', [
                    'label' => esc_html__('Social Icons', 'business-roy'),
                    'type' => Controls_Manager::REPEATER,
                    'fields' => $repeater->get_controls(),
                    'default' => [
                        [
                            'social_icon_title' => esc_html__('Facebook', 'business-roy'),
                            'social_icon' => [
                                'value' => 'fab fa-facebook-f',
                                'library' => 'solid',
                            ],
                            'social_icon_link' => '#'
                        ],
                        [
                            'social_icon_title' => esc_html__('Twitter', 'business-roy'),
                            'social_icon' => [
                                'value' => 'fab fa-x-twitter',
                                'library' => 'solid',
                            ],
                            'social_icon_link' => '#'
                        ],
                        [
                            'social_icon_title' => esc_html__('Instagram', 'business-roy'),
                            'social_icon' => [
                                'value' => 'fab fa-instagram',
                                'library' => 'solid',
                            ],
                            'social_icon_link' => '#'
                        ],
                        [
                            'social_icon_title' => esc_html__('Linkedin', 'business-roy'),
                            'social_icon' => [
                                'value' => 'fab fa-linkedin-in',
                                'library' => 'solid',
                            ],
                            'social_icon_link' => '#'
                        ],
                    ],
                    'title_field' => '{{{ social_icon_title }}}',
                ]
            );

        $this->end_controls_section();


        $this->start_controls_section(
            'settings_section', [
                'label' => esc_html__('Settings', 'business-roy'),
                'tab' => Controls_Manager::TAB_CONTENT,
            ]
        );

            $this->add_control(
                'title_html_tag', [
                    'label' => esc_html__('Title HTML Tag', 'business-roy'),
                    'type' => Controls_Manager::SELECT,
                    'label_block' => true,
                    'default' => 'h3',
                    'options' => [
                        'h1' => esc_html__('H1', 'business-roy'),
                        'h2' => esc_html__('H2', 'business-roy'),
                        'h3' => esc_html__('H3', 'business-roy'),
                        'h4' => esc_html__('H4', 'business-roy'),
                        'h5' => esc_html__('H5', 'business-roy'),
                        'h6' => esc_html__('H6', 'business-roy'),
                        'div' => esc_html__('div', 'business-roy'),
                        'span' => esc_html__('span', 'business-roy'),
                        'p' => esc_html__('p', 'business-roy')
                    ],
                ]
            );

        $this->end_controls_section();

        //(Style)
        $this->start_controls_section(
            'general_style', [
                'label' => esc_html__('General Styles', 'business-roy'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

            $this->add_control(
                'background_color', [
                    'label' => esc_html__('Background Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'condition' => [
                        'layout' => ['style1','style7']
                    ],
                    'default' => '',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-member-wrapper.style1,
                        {{WRAPPER}} .iktheme-team-member-wrapper.style2,
                        {{WRAPPER}} .iktheme-team-member-wrapper.style7' => 'background-color: {{VALUE}}',
                    ],
                ]
            );

            $this->add_control(
                'overlay_color', [
                    'label' => esc_html__('Overlay BG Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'condition' => [
                        'layout' => ['style3','style7']
                    ],
                    'default' => 'rgba(255,255,255,0.9)',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-member-wrapper.style3 .iktheme-team-top-content .iktheme-team-title, 
                        {{WRAPPER}} .iktheme-team-member-wrapper.style3 .iktheme-team-buttom-content,
                        {{WRAPPER}} .style7 .iktheme-team-buttom-content' => 'background-color: {{VALUE}}',
                    ],
                ]
            );

            $this->add_responsive_control(
                'layout_position',[
                    'label' => esc_html__( 'Position', 'business-roy' ),
                    'type' => Controls_Manager::CHOOSE,
                    'default' => 'above',
                    'options' => [
                        'left' => [
                            'title' => esc_html__( 'Left', 'business-roy' ),
                            'icon' => 'eicon-h-align-left',
                        ],
                        'above' => [
                            'title' => esc_html__( 'Above', 'business-roy' ),
                            'icon' => 'eicon-v-align-top',
                        ],
                        'right' => [
                            'title' => esc_html__( 'Right', 'business-roy' ),
                            'icon' => 'eicon-h-align-right',
                        ],
                        'below' => [
                            'title' => esc_html__( 'Below', 'business-roy' ),
                            'icon' => 'eicon-v-align-bottom',
                        ],
                    ],
                    'selectors_dictionary' => [
                        'above' => 'flex-direction: column;',
                        'below' => 'flex-direction: column-reverse;',
                        'left' => 'flex-direction: row;',
                        'right' => 'flex-direction: row-reverse;',
                    ],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-member-wrapper' => '{{VALUE}}',
                    ],
                    'condition' => [
                        'layout' => ['style1'],
                    ]
                ]
            );

            $this->add_responsive_control(
                'content_vertical_alignment',[
                    'label' => esc_html__( 'Vertical Alignment', 'business-roy' ),
                    'type' => Controls_Manager::CHOOSE,
                    'options' => [
                        'top' => [
                            'title' => esc_html__( 'Top', 'business-roy' ),
                            'icon' => 'eicon-v-align-top',
                        ],
                        'middle' => [
                            'title' => esc_html__( 'Middle', 'business-roy' ),
                            'icon' => 'eicon-v-align-middle',
                        ],
                        'bottom' => [
                            'title' => esc_html__( 'Bottom', 'business-roy' ),
                            'icon' => 'eicon-v-align-bottom',
                        ],
                    ],
                    'default' => 'middle',
                    'toggle' => false,
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-buttom-content' => 'justify-content:{{VALUE}};',
                    ],
                    'selectors_dictionary' => [
                        'top' => 'flex-start',
                        'middle' => 'center',
                        'bottom' => 'flex-end',
                    ],
                    'conditions' => [
                        'relation' => 'and',
                        'terms' => [
                            [
                                'name' => 'layout',
                                'operator' => '==',
                                'value' => 'style1',
                            ],
                            [
                                'relation' => 'or',
                                'terms' => [
                                    [
                                        'name' => 'layout_position',
                                        'operator' => '==',
                                        'value' => 'left',
                                    ],
                                    [
                                        'name' => 'layout_position',
                                        'operator' => '==',
                                        'value' => 'right',
                                    ],
                                ],
                            ],
                        ],
                    ],
                ]
            );

            $this->add_responsive_control(
                'text_align',[
                    'label' => esc_html__( 'Alignment', 'business-roy' ),
                    'type' => Controls_Manager::CHOOSE,
                    'default' => 'center',
                    'options' => [
                        'start' => [
                            'title' => esc_html__( 'Left', 'business-roy' ),
                            'icon' => 'eicon-text-align-left',
                        ],
                        'center' => [
                            'title' => esc_html__( 'Center', 'business-roy' ),
                            'icon' => 'eicon-text-align-center',
                        ],
                        'end' => [
                            'title' => esc_html__( 'Right', 'business-roy' ),
                            'icon' => 'eicon-text-align-right',
                        ],
                    ],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-buttom-content' => 'align-items: {{VALUE}}; text-align: {{VALUE}};',
                    ],
                ]
            );

            $this->add_responsive_control(
                'item_space',[
                    'label' => esc_html__( 'Content Spacing', 'business-roy' ),
                    'type' => Controls_Manager::SLIDER,
                    'size_units' => [ 'px', 'em', 'rem', 'custom' ],
                    'range' => [
                        'px' => [
                            'max' => 100,
                        ],
                        'em' => [
                            'min' => 0,
                            'max' => 10,
                        ],
                        'rem' => [
                            'min' => 0,
                            'max' => 10,
                        ],
                    ],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-buttom-content' => 'gap: {{SIZE}}{{UNIT}};',
                    ],
                ]
            );

            $this->add_responsive_control(
                'item_padding', [
                    'label' => esc_html__('Padding', 'business-roy'),
                    'type' => Controls_Manager::DIMENSIONS,
                    'size_units' => ['px', '%', 'em'],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-member-wrapper.style1 .iktheme-team-buttom-content,
                        {{WRAPPER}} .iktheme-team-member-wrapper.style2,
                        {{WRAPPER}} .iktheme-team-member-wrapper.style3 .iktheme-team-buttom-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                    ],
                    'condition' => [
                        'layout' => ['style1','style3']
                    ],
                ]
            );

            $this->add_responsive_control(
                'item_radius', [
                    'label' => esc_html__('Radius', 'business-roy'),
                    'type' => Controls_Manager::DIMENSIONS,
                    'size_units' => ['px', '%', 'em'],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-member-wrapper,
                        {{WRAPPER}} .iktheme-team-member-wrapper.style7' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                    ]
                ]
            );

            $this->add_group_control(
                Group_Control_Box_Shadow::get_type(),[
                    'name' => 'item_box_shadow',
                    'selector' => '{{WRAPPER}} .iktheme-team-member-wrapper.style1,
                                   {{WRAPPER}} .iktheme-team-member-wrapper.style2,
                                   {{WRAPPER}} .iktheme-team-member-wrapper.style7',
                    'condition' => [
                        'layout' => ['style1','style7']
                    ],
                ]
            );

        $this->end_controls_section();

        $this->start_controls_section(
            'name_style', [
                'label' => esc_html__('Name', 'business-roy'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

            $this->add_control(
                'name_color', [
                    'label' => esc_html__('Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'default' => '',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-title, {{WRAPPER}} .iktheme-team-title a' => 'color: {{VALUE}}',
                    ],
                ]
            );

            $this->add_group_control(
                Group_Control_Typography::get_type(), [
                    'name' => 'name_typography',
                    'label' => esc_html__('Typography', 'business-roy'),
                    'selector' => '{{WRAPPER}} .iktheme-team-title',
                ]
            );

            $this->add_group_control(
                Group_Control_Text_Stroke::get_type(),[
                    'name' => 'text_stroke',
                    'selector' => '{{WRAPPER}} .iktheme-team-title',
                ]
            );

            $this->add_group_control(
                Group_Control_Text_Shadow::get_type(),[
                    'name' => 'title_shadow',
                    'selector' => '{{WRAPPER}} .iktheme-team-title',
                ]
            );

            $this->add_control(
                'name_margin', [
                    'label' => esc_html__('Margin', 'business-roy'),
                    'type' => Controls_Manager::DIMENSIONS,
                    'allowed_dimensions' => 'vertical',
                    'size_units' => ['px', '%', 'em'],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-title' => 'margin: {{TOP}}{{UNIT}} 0 {{BOTTOM}}{{UNIT}} 0;',
                    ],
                ]
            );

        $this->end_controls_section();

        $this->start_controls_section(
            'designation_style', [
                'label' => esc_html__('Designation', 'business-roy'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

            $this->add_control(
                'designation_color', [
                    'label' => esc_html__('Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'default' => '',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-designation' => 'color: {{VALUE}}',
                    ],
                ]
            );

            $this->add_group_control(
                Group_Control_Typography::get_type(), [
                    'name' => 'designation_typography',
                    'label' => esc_html__('Typography', 'business-roy'),
                    'selector' => '{{WRAPPER}} .iktheme-team-designation',
                ]
            );

            $this->add_group_control(
                Group_Control_Text_Stroke::get_type(),[
                    'name' => 'designation_stroke',
                    'selector' => '{{WRAPPER}} .iktheme-team-designation',
                ]
            );

            $this->add_group_control(
                Group_Control_Text_Shadow::get_type(),[
                    'name' => 'designation_shadow',
                    'selector' => '{{WRAPPER}} .iktheme-team-designation',
                ]
            );

            $this->add_responsive_control(
                'designation_margin', [
                    'label' => esc_html__('Margin', 'business-roy'),
                    'type' => Controls_Manager::DIMENSIONS,
                    'allowed_dimensions' => 'vertical',
                    'size_units' => ['px', '%', 'em'],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-designation' => 'margin: {{TOP}}{{UNIT}} 0 {{BOTTOM}}{{UNIT}} 0;',
                    ],
                ]
            );

        $this->end_controls_section();

        $this->start_controls_section(
            'content_style', [
                'label' => esc_html__('Short Detail', 'business-roy'),
                'tab' => Controls_Manager::TAB_STYLE,
                'condition' => [
                    'layout' => ['style3']
                ]
            ]
        );

            $this->add_control(
                'content_color', [
                    'label' => esc_html__('Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'default' => '',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-description' => 'color: {{VALUE}}',
                    ],
                ]
            );

            $this->add_group_control(
                Group_Control_Typography::get_type(), [
                    'name' => 'content_typography',
                    'label' => esc_html__('Typography', 'business-roy'),
                    'selector' => '{{WRAPPER}} .iktheme-team-description',
                ]
            );

            $this->add_responsive_control(
                'content_margin', [
                    'label' => esc_html__('Margin', 'business-roy'),
                    'type' => Controls_Manager::DIMENSIONS,
                    'allowed_dimensions' => 'vertical',
                    'size_units' => ['px', '%', 'em'],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-description' => 'margin: {{TOP}}{{UNIT}} 0 {{BOTTOM}}{{UNIT}} 0;',
                    ],
                ]
            );

        $this->end_controls_section();

        $this->start_controls_section(
            'social_style', [
                'label' => esc_html__('Social Icons', 'business-roy'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

            $this->add_responsive_control(
                'icon_size', [
                    'label' => esc_html__('Icon Size', 'business-roy'),
                    'type' => Controls_Manager::SLIDER,
                    'size_units' => ['px'],
                    'range' => [
                        'px' => [
                            'min' => 10,
                            'max' => 100,
                            'step' => 1,
                        ]
                    ],
                    'default' => [
                        'unit' => 'px',
                        'size' => 20,
                    ],
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-socialicon-wrap .elementor-icon' => 'font-size: {{SIZE}}{{UNIT}};',
                        '{{WRAPPER}} .iktheme-team-socialicon-wrap a' =>  'width: calc({{SIZE}}{{UNIT}} + 20px); height: calc({{SIZE}}{{UNIT}} + 20px);',
                    ],
                ]
            );

            $this->add_control(
                'social_bg_color', [
                    'label' => esc_html__('Background Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'default' => '',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-socialicon-wrap a' => 'background-color: {{VALUE}}',
                    ],
                ]
            );

            $this->add_control(
                'social_color', [
                    'label' => esc_html__('Color', 'business-roy'),
                    'type' => Controls_Manager::COLOR,
                    'default' => '',
                    'selectors' => [
                        '{{WRAPPER}} .iktheme-team-socialicon-wrap .elementor-icon' => 'color: {{VALUE}}; fill: {{VALUE}};',
                    ],
                ]
            );

            $this->add_group_control(
                Group_Control_Border::get_type(), [
                    'name' => 'social_border',
                    'selector' => '{{WRAPPER}} .iktheme-team-socialicon-wrap a',
                    'separator' => 'before',
                ]
            );

        $this->end_controls_section();


        // Hover Effects Design
		$this->start_controls_section(
			'hover_effects',[
				'label' => esc_html__( 'Hover Effects', 'business-roy' ),
				'tab' => Controls_Manager::TAB_STYLE,
			]
		);

            $this->add_control(
            	'transformation',[
            		'label' => esc_html__( 'Hover Animation', 'business-roy' ),
            		'type' => Controls_Manager::SELECT,
                    'label_block' => true,
            		'options' => [
            			'' => 'None',
            			'zoom-in' => 'Zoom In',
            			'zoom-out' => 'Zoom Out',
            			'move-left' => 'Move Left',
            			'move-right' => 'Move Right',
            			'move-up' => 'Move Up',
            			'move-down' => 'Move Down',
            		],
            		'default' => 'zoom-in',
            		'prefix_class' => 'ikreatethemes-bg-transform ikreatethemes-bg-transform-',
            	]
            );

            $this->start_controls_tabs( 'bg_effects_tabs' );

                $this->start_controls_tab( 'normal',[
                        'label' => esc_html__( 'Normal', 'business-roy' ),
                    ]
                );

                    $this->add_control(
                        'bg_overlay_color',[
                            'label' => esc_html__( 'Overlay Color', 'business-roy' ),
                            'type' => Controls_Manager::COLOR,
                            'selectors' => [
                                '{{WRAPPER}} .iktheme-team-member-img::after' => 'background-color: {{VALUE}}',
                            ],
                        ]
                    );

                    $this->add_group_control(
                        Group_Control_Css_Filter::get_type(),[
                            'name' => 'bg_filters',
                            'selector' => '{{WRAPPER}} .iktheme-team-member-img',
                        ]
                    );

                    $this->add_control(
                        'overlay_blend_mode',[
                            'label' => esc_html__( 'Blend Mode', 'business-roy' ),
                            'type' => Controls_Manager::SELECT,
                            'label_block' => true,
                            'options' => [
                                '' => esc_html__( 'Normal', 'business-roy' ),
                                'multiply' => 'Multiply',
                                'screen' => 'Screen',
                                'overlay' => 'Overlay',
                                'darken' => 'Darken',
                                'lighten' => 'Lighten',
                                'color-dodge' => 'Color Dodge',
                                'color-burn' => 'Color Burn',
                                'soft-light' => 'Soft Light',
                                'difference' => 'Differency',
                                'exclusion' => 'Exclusive',
                                'plus-darker' => 'Plus Darker',
                                'plus-lighter' => 'Plus Lighter',
                                'hue' => 'Hue',
                                'saturation' => 'Saturation',
                                'color' => 'Color',
                                'exclusion' => 'Exclusion',
                                'luminosity' => 'Luminosity',
                            ],
                            'selectors' => [
                                '{{WRAPPER}} .iktheme-team-member-img' => 'mix-blend-mode: {{VALUE}}',
                            ],
                        ]
                    );

                $this->end_controls_tab();

                $this->start_controls_tab( 'hover',[
                        'label' => esc_html__( 'Hover', 'business-roy' ),
                    ]
                );

                    $this->add_control(
                        'overlay_color_hover',[
                            'label' => esc_html__( 'Overlay Color', 'business-roy' ),
                            'type' => Controls_Manager::COLOR,
                            'selectors' => [
                                '{{WRAPPER}} .iktheme-team-top-content:hover .iktheme-team-member-img::after' => 'background-color: {{VALUE}}',
                            ],
                        ]
                    );

                    $this->add_group_control(
                        Group_Control_Css_Filter::get_type(),[
                            'name' => 'bg_filters_hover',
                            'selector' => '{{WRAPPER}} .iktheme-team-top-content:hover .iktheme-team-member-img',
                        ]
                    );

                    $this->add_control(
                        'effect_duration',[
                            'label' => esc_html__( 'Transition Duration', 'business-roy' ) . ' (ms)',
                            'type' => Controls_Manager::SLIDER,
                            'render_type' => 'template',
                            'default' => [
                                'size' => 1500,
                            ],
                            'range' => [
                                'px' => [
                                    'min' => 0,
                                    'max' => 3000,
                                    'step' => 100,
                                ],
                            ],
                            'selectors' => [
                                '{{WRAPPER}} .iktheme-team-member-img' => 'transition-duration: {{SIZE}}ms',
                            ],
                            'separator' => 'before',
                        ]
                    );

                $this->end_controls_tab();

            $this->end_controls_tabs();

	    $this->end_controls_section();
    }

    /** Render Layout */
    protected function render() {

        $settings = $this->get_settings_for_display();

        $layout = $settings['layout'];
        
        $wrapper_tag = 'div';
        $button_tag = 'a';
        $title_tag = Utils::validate_html_tag( $settings['title_html_tag'] );

        $this->add_render_attribute('wrapper', 'class', [
                'iktheme-team-member-wrapper',
                $layout,
            ]
        );
        $this->add_render_attribute( 'top_content', 'class', ['iktheme-team-top-content'] );
        $this->add_render_attribute( 'buttom_content', 'class', ['iktheme-team-buttom-content'] );
        $this->add_render_attribute( 'image_wrap', 'class', ['iktheme-team-member-img','ikreatethemes-bg'] );
        $this->add_render_attribute( 'title', 'class', ['iktheme-team-title'] );
        $this->add_render_attribute( 'button_link', 'class', ['iktheme-team-link'] );
        $this->add_link_attributes( 'button_link', $settings['button_link'] );
        $this->add_render_attribute( 'designation', 'class', ['iktheme-team-designation'] );
        $this->add_render_attribute( 'description', 'class', ['iktheme-team-description'] );
        $this->add_render_attribute( "social_icon", 'class', ['elementor-icon'] );
        
        ?>
        <<?php Utils::print_validated_html_tag( $wrapper_tag ); ?> <?php $this->print_render_attribute_string( 'wrapper' ); ?>>
            
            <figure <?php $this->print_render_attribute_string( 'top_content' ); ?>>
                <?php if( (!empty( $layout ) && $layout == 'style7')): ?>
                    <div class="ikthemes-team-image-header">
                        <<?php Utils::print_validated_html_tag( $wrapper_tag ); ?> <?php $this->print_render_attribute_string( 'image_wrap' ); ?>>
                            <?php Group_Control_Image_Size::print_attachment_image_html($settings, 'headerthumb', 'header_member_image'); ?>
                        </<?php Utils::print_validated_html_tag( $wrapper_tag ); ?>>
                    </div>
                <?php endif; ?>

                <div class="ikthemes-team-image-wrap">
                    <<?php Utils::print_validated_html_tag( $wrapper_tag ); ?> <?php $this->print_render_attribute_string( 'image_wrap' ); ?>>
                        <?php Group_Control_Image_Size::print_attachment_image_html($settings, 'thumb', 'member_image'); ?>
                    </<?php Utils::print_validated_html_tag( $wrapper_tag ); ?>>
                </div>
                <?php if( !empty( $layout ) && $layout == 'style3' ): ?>
                    <?php if ( ! empty( $settings['member_name'] ) ) : ?>
                        <<?php Utils::print_validated_html_tag( $title_tag ); ?> <?php $this->print_render_attribute_string( 'title' ); ?>>
                            <<?php Utils::print_validated_html_tag( $button_tag ); ?> <?php $this->print_render_attribute_string( 'button_link' ); ?>>
                                <?php $this->print_unescaped_setting( 'member_name' ); ?>
                            </<?php Utils::print_unescaped_internal_string( $button_tag ); ?>>
                        </<?php Utils::print_validated_html_tag( $title_tag ); ?>>
                    <?php endif; ?>
                <?php endif; ?>
            </figure>

            <div <?php $this->print_render_attribute_string( 'buttom_content' ); ?>>
                <div class="iktheme-team-title-wrap">
                    <?php if ( ! empty( $settings['member_name'] ) ) : ?>
                        <<?php Utils::print_validated_html_tag( $title_tag ); ?> <?php $this->print_render_attribute_string( 'title' ); ?>>
                            <<?php Utils::print_validated_html_tag( $button_tag ); ?> <?php $this->print_render_attribute_string( 'button_link' ); ?>>
                                <?php $this->print_unescaped_setting( 'member_name' ); ?>
                            </<?php Utils::print_unescaped_internal_string( $button_tag ); ?>>
                        </<?php Utils::print_validated_html_tag( $title_tag ); ?>>
                    <?php endif; ?>
                    <?php if ( ! empty( $settings['member_designation'] ) ) : ?>
                        <div <?php $this->print_render_attribute_string( 'designation' ); ?>>
                            <?php $this->print_unescaped_setting( 'member_designation' ); ?>
                        </div>
                    <?php endif; ?>
                </div>
                    
                <?php if ( ! empty( $settings['member_description'] ) ) : ?>
                    <div <?php $this->print_render_attribute_string( 'description' ); ?>>
                        <?php $this->print_unescaped_setting( 'member_description' ); ?>
                    </div>
                <?php endif; ?>

                <div class="iktheme-team-socialicon-wrap">
                    <?php
                        foreach ($settings['social_icons_block'] as $key => $social_icon):

                        $this->add_link_attributes( "social_link_{$key}", $social_icon['social_icon_link'] );
                        $this->add_render_attribute( "social_link_{$key}", 'class', ['iktheme-social-item-link'] );
                    ?>
                        <<?php Utils::print_validated_html_tag( $button_tag ); ?> <?php $this->print_render_attribute_string( "social_link_{$key}" ); ?>>
                            <div <?php $this->print_render_attribute_string( 'social_icon' ); ?>>
                                <?php Icons_Manager::render_icon( $social_icon['social_icon'], ['aria-hidden' => 'true'] ); ?>
                            </div>
                        </<?php Utils::print_unescaped_internal_string( $button_tag ); ?>>
                    <?php endforeach; ?>
                </div>
            </div>

        </<?php Utils::print_validated_html_tag( $wrapper_tag ); ?>>

        <?php
    }

}