<?php
/**
 * Advanced Nested Accordion widget.
 *
 * @package IMPACT_WIDGETS_ELEMENTOR
 */

namespace ImpactAddons\ImpactWidgetsForElementor\Widgets;

use Elementor\Controls_Manager;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Typography;
use Elementor\Icons_Manager;
use Elementor\Modules\NestedElements\Base\Widget_Nested_Base;
use Elementor\Modules\NestedElements\Controls\Control_Nested_Repeater;
use Elementor\Plugin as Elementor_Plugin;
use Elementor\Repeater;
use Elementor\Utils;

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

class Advanced_Nested_Accordion extends Widget_Nested_Base {
	private ?bool $optimized_markup = null;
	private string $widget_container_selector = '';

	protected function is_dynamic_content(): bool {
		return true;
	}

	public function get_name(): string {
		return 'impact_widgets_elementor_advanced-nested-accordion';
	}

	public function get_title(): string {
		return esc_html__( 'Advanced Nested Accordion', 'impact-widgets-for-elementor' );
	}

	public function get_icon(): string {
		return 'eicon-accordion';
	}

	public function get_categories(): array {
		return array( 'impact-widgets-elementor' );
	}

	public function get_keywords(): array {
		return array( 'nested', 'accordion', 'container', 'toggle' );
	}

	public function get_style_depends(): array {
		return array( 'impact_widgets_elementor_advanced-nested-accordion' );
	}

	public function get_script_depends(): array {
		return array( 'impact_widgets_elementor_advanced-nested-accordion' );
	}

	public function show_in_panel(): bool {
		return true;
	}

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

	protected function item_content_container( int $index ): array {
		return array(
			'elType'   => 'container',
			'settings' => array(
				'_title'        => sprintf(
					/* translators: %d: item number. */
					__( 'Item #%d Content', 'impact-widgets-for-elementor' ),
					$index
				),
				'content_width' => 'full',
			),
		);
	}

	protected function get_default_children_elements(): array {
		return array(
			$this->item_content_container( 1 ),
			$this->item_content_container( 2 ),
			$this->item_content_container( 3 ),
		);
	}

	protected function get_default_repeater_title_setting_key(): string {
		return 'item_title';
	}

	protected function get_default_children_title(): string {
		/* translators: %d: item number. */
		return esc_html__( 'Item #%d', 'impact-widgets-for-elementor' );
	}

	protected function get_default_children_placeholder_selector(): string {
		return '.iaew-advanced-nested-accordion';
	}

	protected function get_default_children_container_placeholder_selector(): string {
		return '.iaew-advanced-nested-accordion__item';
	}

	protected function get_html_wrapper_class(): string {
		return 'elementor-widget-impact_widgets_elementor-advanced-nested-accordion';
	}

	protected function register_controls() {
		if ( null === $this->optimized_markup ) {
			$this->optimized_markup          = Elementor_Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' ) && ! $this->has_widget_inner_wrapper();
			$this->widget_container_selector = $this->optimized_markup ? '' : ' > .elementor-widget-container';
		}

		$this->start_controls_section(
			'section_layout',
			array(
				'label' => esc_html__( 'Layout', 'impact-widgets-for-elementor' ),
			)
		);

		$repeater = new Repeater();

		$repeater->add_control(
			'item_title',
			array(
				'label'       => esc_html__( 'Title', 'impact-widgets-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => esc_html__( 'Accordion Item', 'impact-widgets-for-elementor' ),
				'placeholder' => esc_html__( 'Accordion Item', 'impact-widgets-for-elementor' ),
				'label_block' => true,
				'dynamic'     => array(
					'active' => true,
				),
			)
		);

		$repeater->add_control(
			'item_subtitle',
			array(
				'label'       => esc_html__( 'Subtitle', 'impact-widgets-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => '',
				'placeholder' => esc_html__( 'Optional subtitle', 'impact-widgets-for-elementor' ),
			)
		);

		$repeater->add_control(
			'element_css_id',
			array(
				'label'   => esc_html__( 'CSS ID', 'impact-widgets-for-elementor' ),
				'type'    => Controls_Manager::TEXT,
				'default' => '',
				'dynamic' => array(
					'active' => true,
				),
			)
		);

		$this->add_control(
			'items',
			array(
				'label'       => esc_html__( 'Accordion Items', 'impact-widgets-for-elementor' ),
				'type'        => Control_Nested_Repeater::CONTROL_TYPE,
				'fields'      => $repeater->get_controls(),
				'default'     => array(
					array(
						'item_title'    => esc_html__( 'Icon Box Item', 'impact-widgets-for-elementor' ),
						'item_subtitle' => esc_html__( 'Drop widgets inside this item', 'impact-widgets-for-elementor' ),
					),
					array(
						'item_title'    => esc_html__( 'Gallery Item', 'impact-widgets-for-elementor' ),
						'item_subtitle' => esc_html__( 'Use any Elementor widgets here', 'impact-widgets-for-elementor' ),
					),
					array(
						'item_title'    => esc_html__( 'Team Item', 'impact-widgets-for-elementor' ),
						'item_subtitle' => esc_html__( 'Build custom layouts per item', 'impact-widgets-for-elementor' ),
					),
				),
				'title_field' => '{{{ item_title }}}',
				'button_text' => esc_html__( 'Add Item', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'default_state',
			array(
				'label'              => esc_html__( 'Default State', 'impact-widgets-for-elementor' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'expanded'      => esc_html__( 'First Expanded', 'impact-widgets-for-elementor' ),
					'all_collapsed' => esc_html__( 'All Collapsed', 'impact-widgets-for-elementor' ),
				),
				'default'            => 'expanded',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'max_items_expanded',
			array(
				'label'              => esc_html__( 'Max Items Expanded', 'impact-widgets-for-elementor' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'one'      => esc_html__( 'One', 'impact-widgets-for-elementor' ),
					'multiple' => esc_html__( 'Multiple', 'impact-widgets-for-elementor' ),
				),
				'default'            => 'one',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'accordion_animation',
			array(
				'label'              => esc_html__( 'Animation', 'impact-widgets-for-elementor' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'none'       => esc_html__( 'None', 'impact-widgets-for-elementor' ),
					'slide'      => esc_html__( 'Slide', 'impact-widgets-for-elementor' ),
					'fade'       => esc_html__( 'Fade', 'impact-widgets-for-elementor' ),
					'slide-fade' => esc_html__( 'Slide + Fade', 'impact-widgets-for-elementor' ),
				),
				'default'            => 'slide',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'accordion_animation_duration',
			array(
				'label'              => esc_html__( 'Animation Duration', 'impact-widgets-for-elementor' ),
				'type'               => Controls_Manager::SLIDER,
				'size_units'         => array( 'ms' ),
				'range'              => array(
					'ms' => array(
						'min'  => 100,
						'max'  => 1200,
						'step' => 50,
					),
				),
				'default'            => array(
					'size' => 300,
					'unit' => 'ms',
				),
				'selectors'          => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion' => '--iaew-ana-animation-duration: {{SIZE}}ms;',
				),
				'condition'          => array(
					'accordion_animation!' => 'none',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'accordion_animation_easing',
			array(
				'label'              => esc_html__( 'Animation Easing', 'impact-widgets-for-elementor' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'ease'          => esc_html__( 'Ease', 'impact-widgets-for-elementor' ),
					'ease-in-out'   => esc_html__( 'Ease In Out', 'impact-widgets-for-elementor' ),
					'ease-out'      => esc_html__( 'Ease Out', 'impact-widgets-for-elementor' ),
					'linear'        => esc_html__( 'Linear', 'impact-widgets-for-elementor' ),
				),
				'default'            => 'ease',
				'selectors'          => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion' => '--iaew-ana-animation-easing: {{VALUE}};',
				),
				'condition'          => array(
					'accordion_animation!' => 'none',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'icon_position',
			array(
				'label'   => esc_html__( 'Toggle Icon Position', 'impact-widgets-for-elementor' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'start',
				'options' => array(
					'start' => esc_html__( 'Start', 'impact-widgets-for-elementor' ),
					'end'   => esc_html__( 'End', 'impact-widgets-for-elementor' ),
				),
			)
		);

		$this->add_responsive_control(
			'header_item_position',
			array(
				'label'        => esc_html__( 'Header Item Position', 'impact-widgets-for-elementor' ),
				'type'         => Controls_Manager::CHOOSE,
				'options'      => array(
					'start'  => array(
						'title' => esc_html__( 'Start', 'impact-widgets-for-elementor' ),
						'icon'  => 'eicon-h-align-left',
					),
					'center' => array(
						'title' => esc_html__( 'Center', 'impact-widgets-for-elementor' ),
						'icon'  => 'eicon-h-align-center',
					),
					'end'    => array(
						'title' => esc_html__( 'End', 'impact-widgets-for-elementor' ),
						'icon'  => 'eicon-h-align-right',
					),
					'stretch' => array(
						'title' => esc_html__( 'Stretch', 'impact-widgets-for-elementor' ),
						'icon'  => 'eicon-justify-space-between-h',
					),
				),
				'default'      => 'start',
				'toggle'       => true,
				'prefix_class' => 'iaew-advanced-nested-accordion--header-position-',
			)
		);

		$this->add_control(
			'collapsed_icon',
			array(
				'label'            => esc_html__( 'Closed Icon', 'impact-widgets-for-elementor' ),
				'type'             => Controls_Manager::ICONS,
				'fa4compatibility' => 'collapsed_icon_fa4',
				'default'          => array(
					'value'   => 'fas fa-plus',
					'library' => 'fa-solid',
				),
				'skin'             => 'inline',
				'label_block'      => false,
			)
		);

		$this->add_control(
			'expanded_icon',
			array(
				'label'            => esc_html__( 'Open Icon', 'impact-widgets-for-elementor' ),
				'type'             => Controls_Manager::ICONS,
				'fa4compatibility' => 'expanded_icon_fa4',
				'default'          => array(
					'value'   => 'fas fa-minus',
					'library' => 'fa-solid',
				),
				'skin'             => 'inline',
				'label_block'      => false,
			)
		);

		$this->end_controls_section();

		$this->register_style_controls();
	}

	private function register_style_controls(): void {
		$this->start_controls_section(
			'section_style_wrapper',
			array(
				'label' => esc_html__( 'Wrapper', 'impact-widgets-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_responsive_control(
			'items_gap',
			array(
				'label'      => esc_html__( 'Items Gap', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 0,
						'max' => 48,
					),
				),
				'default'    => array(
					'size' => 16,
					'unit' => 'px',
				),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion' => '--iaew-ana-gap: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_control(
			'accent_color',
			array(
				'label'     => esc_html__( 'Accent Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#5d5fef',
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion' => '--iaew-ana-accent: {{VALUE}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'item_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item',
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'item_border',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item',
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'item_shadow',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item',
			)
		);

		$this->add_responsive_control(
			'item_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'section_style_header',
			array(
				'label' => esc_html__( 'Header', 'impact-widgets-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_control(
			'header_title_heading',
			array(
				'label'     => esc_html__( 'Title', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::HEADING,
				'separator' => 'before',
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'header_title_typography',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__title',
			)
		);

		$this->start_controls_tabs( 'header_title_color_tabs' );

		$this->start_controls_tab(
			'header_title_color_normal_tab',
			array(
				'label' => esc_html__( 'Normal', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'header_title_color',
			array(
				'label'     => esc_html__( 'Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__title' => 'color: {{VALUE}};',
				),
			)
		);

		$this->end_controls_tab();

		$this->start_controls_tab(
			'header_title_color_expanded_tab',
			array(
				'label' => esc_html__( 'Expanded', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'header_title_expanded_color',
			array(
				'label'     => esc_html__( 'Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__title' => 'color: {{VALUE}};',
				),
			)
		);

		$this->end_controls_tab();

		$this->end_controls_tabs();

		$this->add_control(
			'header_subtitle_heading',
			array(
				'label'     => esc_html__( 'Subtitle', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::HEADING,
				'separator' => 'before',
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'subtitle_typography',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__subtitle',
			)
		);

		$this->start_controls_tabs( 'header_subtitle_color_tabs' );

		$this->start_controls_tab(
			'header_subtitle_color_normal_tab',
			array(
				'label' => esc_html__( 'Normal', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'subtitle_color',
			array(
				'label'     => esc_html__( 'Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__subtitle' => 'color: {{VALUE}};',
				),
			)
		);

		$this->end_controls_tab();

		$this->start_controls_tab(
			'header_subtitle_color_expanded_tab',
			array(
				'label' => esc_html__( 'Expanded', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'subtitle_expanded_color',
			array(
				'label'     => esc_html__( 'Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__subtitle' => 'color: {{VALUE}};',
				),
			)
		);

		$this->end_controls_tab();

		$this->end_controls_tabs();

		$this->add_control(
			'header_icon_heading',
			array(
				'label'     => esc_html__( 'Header Icon', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::HEADING,
				'separator' => 'before',
			)
		);

		$this->add_responsive_control(
			'header_icon_size',
			array(
				'label'      => esc_html__( 'Icon Size', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', 'em', 'rem' ),
				'range'      => array(
					'px' => array(
						'min' => 8,
						'max' => 80,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__icon' => 'font-size: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_responsive_control(
			'header_icon_box_size',
			array(
				'label'      => esc_html__( 'Box Size', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'range'      => array(
					'px' => array(
						'min' => 24,
						'max' => 160,
					),
				),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__icon' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}}; flex-basis: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'header_icon_border',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__icon',
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'header_icon_shadow',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__icon',
			)
		);

		$this->add_responsive_control(
			'header_icon_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__icon' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->start_controls_tabs( 'header_icon_state_tabs' );

		$this->start_controls_tab(
			'header_icon_state_normal_tab',
			array(
				'label' => esc_html__( 'Normal', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'header_normal_icon_color',
			array(
				'label'     => esc_html__( 'Icon Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__icon' => 'color: {{VALUE}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'header_normal_icon_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__icon',
			)
		);

		$this->end_controls_tab();

		$this->start_controls_tab(
			'header_icon_state_expanded_tab',
			array(
				'label' => esc_html__( 'Expanded', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_control(
			'header_expanded_icon_color',
			array(
				'label'     => esc_html__( 'Icon Color', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__icon' => 'color: {{VALUE}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'header_expanded_icon_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__icon',
			)
		);

		$this->end_controls_tab();

		$this->end_controls_tabs();

		$this->add_control(
			'header_box_heading',
			array(
				'label'     => esc_html__( 'Header Box', 'impact-widgets-for-elementor' ),
				'type'      => Controls_Manager::HEADING,
				'separator' => 'before',
			)
		);

		$this->add_responsive_control(
			'header_padding',
			array(
				'label'      => esc_html__( 'Padding', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__summary' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->start_controls_tabs( 'header_box_state_tabs' );

		$this->start_controls_tab(
			'header_box_state_normal',
			array(
				'label' => esc_html__( 'Normal', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'header_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__summary',
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'header_border',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__summary',
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'header_box_shadow',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__summary',
			)
		);

		$this->add_responsive_control(
			'header_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__summary' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->end_controls_tab();

		$this->start_controls_tab(
			'header_box_state_expanded',
			array(
				'label' => esc_html__( 'Expanded', 'impact-widgets-for-elementor' ),
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'header_expanded_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__summary',
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'header_expanded_border',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__summary',
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'header_expanded_box_shadow',
				'selector' => '{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__summary',
			)
		);

		$this->add_responsive_control(
			'header_expanded_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					'{{WRAPPER}} .iaew-advanced-nested-accordion__item.is-open .iaew-advanced-nested-accordion__summary' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->end_controls_tab();

		$this->end_controls_tabs();

		$this->end_controls_section();

		$this->start_controls_section(
			'section_style_content',
			array(
				'label' => esc_html__( 'Content Panel', 'impact-widgets-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$selector = '{{WRAPPER}} .iaew-advanced-nested-accordion__content';

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'content_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => $selector,
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'content_border',
				'selector' => $selector,
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'content_box_shadow',
				'selector' => $selector,
			)
		);

		$this->add_responsive_control(
			'content_padding',
			array(
				'label'      => esc_html__( 'Padding', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					$selector => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->add_responsive_control(
			'content_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'impact-widgets-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em', 'rem' ),
				'selectors'  => array(
					$selector => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);

		$this->end_controls_section();
	}

	protected function render() {
		$settings       = $this->get_settings_for_display();
		$items          = isset( $settings['items'] ) && is_array( $settings['items'] ) ? $settings['items'] : array();
		$default_state  = isset( $settings['default_state'] ) ? $settings['default_state'] : 'expanded';
		$icon_position  = isset( $settings['icon_position'] ) ? $settings['icon_position'] : 'start';
		$icon_position  = 'left' === $icon_position ? 'start' : $icon_position;
		$icon_position  = 'right' === $icon_position ? 'end' : $icon_position;
		$collapsed_icon = isset( $settings['collapsed_icon'] ) && is_array( $settings['collapsed_icon'] ) ? $settings['collapsed_icon'] : array();
		$expanded_icon  = isset( $settings['expanded_icon'] ) && is_array( $settings['expanded_icon'] ) ? $settings['expanded_icon'] : array();
		$animation      = isset( $settings['accordion_animation'] ) ? sanitize_key( $settings['accordion_animation'] ) : 'slide';
		if ( ! in_array( $animation, array( 'none', 'slide', 'fade', 'slide-fade' ), true ) ) {
			$animation = 'slide';
		}
		$animation_duration = 300;
		if ( ! empty( $settings['accordion_animation_duration']['size'] ) ) {
			$animation_duration = max( 0, (int) $settings['accordion_animation_duration']['size'] );
		}
		$animation_easing = isset( $settings['accordion_animation_easing'] ) ? sanitize_key( $settings['accordion_animation_easing'] ) : 'ease';
		if ( ! in_array( $animation_easing, array( 'ease', 'ease-in-out', 'ease-out', 'linear' ), true ) ) {
			$animation_easing = 'ease';
		}
		$id_int         = substr( $this->get_id_int(), 0, 3 );

		if ( empty( $items ) ) {
			return;
		}

		$this->enqueue_icon_assets();

		$this->add_render_attribute(
			'wrapper',
			array(
				'class'               => array(
					'iaew-advanced-nested-accordion',
					'iaew-advanced-nested-accordion--icon-' . sanitize_html_class( $icon_position ),
				),
				'data-default-state'  => 'expanded' === $default_state ? 'expanded' : 'all_collapsed',
				'data-max-expanded'   => isset( $settings['max_items_expanded'] ) && 'multiple' === $settings['max_items_expanded'] ? 'multiple' : 'one',
				'data-animation'      => $animation,
				'data-animation-duration' => (string) $animation_duration,
				'data-animation-easing' => $animation_easing,
				'style'               => '--iaew-ana-animation-duration:' . esc_attr( $animation_duration ) . 'ms;--iaew-ana-animation-easing:' . esc_attr( $animation_easing ) . ';',
				'aria-label'          => esc_attr__( 'Advanced nested accordion', 'impact-widgets-for-elementor' ),
			)
		);

		?>
		<div <?php $this->print_render_attribute_string( 'wrapper' ); ?>>
			<?php foreach ( $items as $index => $item ) : ?>
				<?php
				$item_key      = $this->get_repeater_setting_key( 'item_title', 'items', $index );
				$item_summary  = $this->get_repeater_setting_key( 'item_summary', 'items', $index );
				$item_id       = empty( $item['element_css_id'] ) ? 'iaew-ana-item-' . $id_int . $index : sanitize_html_class( $item['element_css_id'] );
				$is_open       = 'expanded' === $default_state && 0 === $index;
				$item_title    = isset( $item['item_title'] ) ? $item['item_title'] : '';
				$item_subtitle = isset( $item['item_subtitle'] ) ? $item['item_subtitle'] : '';

				$this->add_render_attribute(
					$item_key,
					array(
						'id'    => $item_id,
						'class' => 'iaew-advanced-nested-accordion__item',
						'open'  => $is_open ? 'open' : null,
					)
				);

				$this->add_render_attribute(
					$item_summary,
					array(
						'class'         => 'iaew-advanced-nested-accordion__summary',
						'data-index'    => $index + 1,
						'tabindex'      => 0 === $index ? 0 : -1,
						'aria-expanded' => $is_open ? 'true' : 'false',
						'aria-controls' => $item_id,
					)
				);

				ob_start();
				$this->print_child( $index, $item_id );
				$item_content = ob_get_clean();
				?>
				<details <?php echo wp_kses_post( $this->get_render_attribute_string( $item_key ) ); ?>>
					<summary <?php echo wp_kses_post( $this->get_render_attribute_string( $item_summary ) ); ?>>
						<span class="iaew-advanced-nested-accordion__header">
							<span class="iaew-advanced-nested-accordion__title"><?php echo esc_html( $item_title ); ?></span>
							<?php if ( '' !== $item_subtitle ) : ?>
								<span class="iaew-advanced-nested-accordion__subtitle"><?php echo esc_html( $item_subtitle ); ?></span>
							<?php endif; ?>
						</span>
						<span class="iaew-advanced-nested-accordion__icon" aria-hidden="true">
							<span class="iaew-advanced-nested-accordion__icon-state iaew-advanced-nested-accordion__icon-state--collapsed">
								<?php $this->render_toggle_icon( $collapsed_icon, '+' ); ?>
							</span>
							<span class="iaew-advanced-nested-accordion__icon-state iaew-advanced-nested-accordion__icon-state--expanded">
								<?php $this->render_toggle_icon( $expanded_icon, '-' ); ?>
							</span>
						</span>
					</summary>
					<?php echo $item_content; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
				</details>
			<?php endforeach; ?>
		</div>
		<?php
	}

	public function print_child( $index, $item_id = null ) {
		$children = $this->get_children();

		if ( empty( $children[ $index ] ) ) {
			return;
		}

		$add_attribute_to_container = function ( $should_render, $container ) use ( $item_id ) {
			$this->add_attributes_to_container( $container, $item_id );
			return $should_render;
		};

		add_filter( 'elementor/frontend/container/should_render', $add_attribute_to_container, 10, 3 );
		$children[ $index ]->print_element();
		remove_filter( 'elementor/frontend/container/should_render', $add_attribute_to_container );
	}

	protected function add_attributes_to_container( $container, string $item_id ): void {
		$container->add_render_attribute(
			'_wrapper',
			array(
				'class'          => 'iaew-advanced-nested-accordion__content',
				'role'           => 'region',
				'aria-labelledby'=> $item_id,
			)
		);
	}

	protected function get_initial_config(): array {
		return array_merge(
			parent::get_initial_config(),
			array(
				'support_improved_repeaters' => true,
				'target_container'           => array( '.iaew-advanced-nested-accordion' ),
				'node'                       => 'details',
				'is_interlaced'              => true,
			)
		);
	}

	protected function content_template_single_repeater_item() {
		?>
		<#
		const elementUid = view.getIDInt().toString().substring( 0, 3 ) + view.collection.length;
		const detailsKey = 'details-' + elementUid;
		const summaryKey = 'summary-' + elementUid;
		const textKey = 'text-' + elementUid;
		const subtitleKey = 'subtitle-' + elementUid;

		const detailsAttributes = {
			'id': 'iaew-ana-item-' + elementUid,
			'class': [ 'iaew-advanced-nested-accordion__item' ],
		};

		const summaryAttributes = {
			'class': [ 'iaew-advanced-nested-accordion__summary' ],
			'tabindex': -1,
			'aria-expanded': 'false',
			'aria-controls': 'iaew-ana-item-' + elementUid,
		};

		const titleAttributes = {
			'class': [ 'iaew-advanced-nested-accordion__title' ],
			'data-binding-index': view.collection.length,
			'data-binding-type': 'repeater-item',
			'data-binding-repeater-name': 'items',
			'data-binding-setting': [ 'item_title', 'element_css_id' ],
			'data-binding-config': JSON.stringify( {
				'element_css_id': {
					editType: 'attribute',
					attr: 'id',
					selector: 'details',
				},
				'item_title': {
					editType: 'text',
				},
			} ),
		};

		const subtitleAttributes = {
			'class': [ 'iaew-advanced-nested-accordion__subtitle' ],
			'data-binding-index': view.collection.length,
			'data-binding-type': 'repeater-item',
			'data-binding-repeater-name': 'items',
			'data-binding-setting': 'item_subtitle',
		};

		view.addRenderAttribute( detailsKey, detailsAttributes, null, true );
		view.addRenderAttribute( summaryKey, summaryAttributes, null, true );
		view.addRenderAttribute( textKey, titleAttributes, null, true );
		view.addRenderAttribute( subtitleKey, subtitleAttributes, null, true );
		#>
		<details {{{ view.getRenderAttributeString( detailsKey ) }}}>
			<summary {{{ view.getRenderAttributeString( summaryKey ) }}}>
				<span class="iaew-advanced-nested-accordion__header">
					<span {{{ view.getRenderAttributeString( textKey ) }}}>{{{ data.item_title }}}</span>
					<# if ( data.item_subtitle ) { #>
						<span {{{ view.getRenderAttributeString( subtitleKey ) }}}>{{{ data.item_subtitle }}}</span>
					<# } #>
				</span>
				<span class="iaew-advanced-nested-accordion__icon" aria-hidden="true">
					<span class="iaew-advanced-nested-accordion__icon-state iaew-advanced-nested-accordion__icon-state--collapsed"><i class="fas fa-plus" aria-hidden="true"></i></span>
					<span class="iaew-advanced-nested-accordion__icon-state iaew-advanced-nested-accordion__icon-state--expanded"><i class="fas fa-minus" aria-hidden="true"></i></span>
				</span>
			</summary>
		</details>
		<?php
	}

	protected function content_template() {
		?>
		<#
		const iconPosition = settings.icon_position === 'left' ? 'start' : ( settings.icon_position === 'right' ? 'end' : ( settings.icon_position || 'start' ) );
		#>
		<div class="iaew-advanced-nested-accordion iaew-advanced-nested-accordion--icon-{{ iconPosition }}" data-default-state="{{ settings.default_state || 'expanded' }}" data-max-expanded="{{ settings.max_items_expanded || 'one' }}" data-animation="{{ settings.accordion_animation || 'slide' }}" data-animation-duration="{{ settings.accordion_animation_duration && settings.accordion_animation_duration.size ? settings.accordion_animation_duration.size : 300 }}" data-animation-easing="{{ settings.accordion_animation_easing || 'ease' }}">
			<# if ( settings.items ) {
				const collapsedIcon = elementor.helpers.renderIcon( view, settings.collapsed_icon, { 'aria-hidden': true }, 'i', 'object' ) ?? '';
				const expandedIcon = '' === settings.expanded_icon.value ? collapsedIcon : elementor.helpers.renderIcon( view, settings.expanded_icon, { 'aria-hidden': true }, 'i', 'object' );
				const elementUid = view.getIDInt().toString().substring( 0, 3 );
			#>
				<# _.each( settings.items, function( item, index ) {
					const itemUid = elementUid + index;
					const detailsKey = 'details-' + itemUid;
					const summaryKey = 'summary-' + itemUid;
					const textKey = 'text-' + itemUid;
					const subtitleKey = 'subtitle-' + itemUid;
					const itemId = item.element_css_id ? item.element_css_id : 'iaew-ana-item-' + itemUid;
					const isOpen = settings.default_state === 'expanded' && 0 === index;

					view.addRenderAttribute( detailsKey, {
						'id': itemId,
						'class': [ 'iaew-advanced-nested-accordion__item' ],
					}, null, true );

					if ( isOpen ) {
						view.addRenderAttribute( detailsKey, 'open', true );
					}

					view.addRenderAttribute( summaryKey, {
						'class': [ 'iaew-advanced-nested-accordion__summary' ],
						'tabindex': 0 === index ? 0 : -1,
						'aria-expanded': isOpen ? 'true' : 'false',
						'aria-controls': itemId,
					}, null, true );

					view.addRenderAttribute( textKey, {
						'class': [ 'iaew-advanced-nested-accordion__title' ],
						'data-binding-index': index + 1,
						'data-binding-type': 'repeater-item',
						'data-binding-repeater-name': 'items',
						'data-binding-setting': [ 'item_title', 'element_css_id' ],
						'data-binding-config': JSON.stringify( {
							'element_css_id': {
								editType: 'attribute',
								attr: 'id',
								selector: 'details',
							},
							'item_title': {
								editType: 'text',
							},
						} ),
					}, null, true );

					view.addRenderAttribute( subtitleKey, {
						'class': [ 'iaew-advanced-nested-accordion__subtitle' ],
						'data-binding-index': index + 1,
						'data-binding-type': 'repeater-item',
						'data-binding-repeater-name': 'items',
						'data-binding-setting': 'item_subtitle',
					}, null, true );
				#>
					<details {{{ view.getRenderAttributeString( detailsKey ) }}}>
						<summary {{{ view.getRenderAttributeString( summaryKey ) }}}>
							<span class="iaew-advanced-nested-accordion__header">
								<span {{{ view.getRenderAttributeString( textKey ) }}}>{{{ item.item_title }}}</span>
								<# if ( item.item_subtitle ) { #>
									<span {{{ view.getRenderAttributeString( subtitleKey ) }}}>{{{ item.item_subtitle }}}</span>
								<# } #>
							</span>
							<span class="iaew-advanced-nested-accordion__icon" aria-hidden="true">
								<span class="iaew-advanced-nested-accordion__icon-state iaew-advanced-nested-accordion__icon-state--collapsed">{{{ collapsedIcon.value || '<i class=\"fas fa-plus\" aria-hidden=\"true\"></i>' }}}</span>
								<span class="iaew-advanced-nested-accordion__icon-state iaew-advanced-nested-accordion__icon-state--expanded">{{{ expandedIcon.value || '<i class=\"fas fa-minus\" aria-hidden=\"true\"></i>' }}}</span>
							</span>
						</summary>
					</details>
				<# } ); #>
			<# } #>
		</div>
		<?php
	}

	private function render_toggle_icon( array $icon_settings, string $fallback ): void {
		$has_new_icon    = ! empty( $icon_settings['value'] );
		$has_legacy_icon = ! empty( $icon_settings['icon'] );

		if ( $has_new_icon || $has_legacy_icon ) {
			Icons_Manager::render_icon(
				$icon_settings,
				array(
					'aria-hidden' => 'true',
				)
			);
			return;
		}
		?>
		<span class="iaew-advanced-nested-accordion__toggle-fallback"><?php echo esc_html( $fallback ); ?></span>
		<?php
	}

	private function enqueue_icon_assets(): void {
		if ( isset( Elementor_Plugin::$instance->icons_manager ) && method_exists( Elementor_Plugin::$instance->icons_manager, 'enqueue_fontawesome_css' ) ) {
			Elementor_Plugin::$instance->icons_manager->enqueue_fontawesome_css();
		}

		if ( wp_style_is( 'eicons', 'registered' ) ) {
			wp_enqueue_style( 'eicons' );
		}

		if ( wp_style_is( 'font-awesome-5-all', 'registered' ) ) {
			wp_enqueue_style( 'font-awesome-5-all' );
		}
	}
}
