<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

use Sifency\Classes\Sifency_Addons_Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Background;
use Sifency\Traits\Sifency_Addons_Help_Controls;

class Sifency_Stacking_Cards extends Sifency_Addons_Widget_Base {
	use Sifency_Addons_Help_Controls;

	public function __construct( $data = array(), $args = null ) {
		parent::__construct( $data, $args );
		$this->wg_config = array(
			'name'           => 'sifency-stacking-cards',
			'title'          => 'Sifency Stacking Cards',
			'icon'           => 'eicon-clone',
			'category'       => array( 'sifency-creative-widgets' ),
			'script_depends' => array( 'gsap', 'gsap-scrolltrigger', 'sifency-stacking-card-script', 'lenis' ),
			'style_depends'  => array( 'sifency-creative-style' ),
			'keywords'       => array( 'cards', 'stacking', 'sticky', 'gsap', 'scroll effect' ),
		);
	}

	protected function register_controls() {
		$this->start_controls_section(
			'section_cards',
			array( 'label' => esc_html__( 'Cards Content', 'sifency-addons' ) )
		);

		$repeater = new Repeater();

		$repeater->add_control(
			'card_title',
			array(
				'label'       => esc_html__( 'Title', 'sifency-addons' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => esc_html__( 'Card Title', 'sifency-addons' ),
				'label_block' => true,
			)
		);

		$repeater->add_control(
			'card_desc',
			array(
				'label'   => esc_html__( 'Description', 'sifency-addons' ),
				'type'    => Controls_Manager::TEXTAREA,
				'default' => esc_html__( 'Add a brief description about this step or feature.', 'sifency-addons' ),
			)
		);

		// Individual Card Background Color
		$repeater->add_control(
			'card_bg_color',
			array(
				'label' => esc_html__( 'Background Color', 'sifency-addons' ),
				'type'  => Controls_Manager::COLOR,
			)
		);

		$this->add_control(
			'cards_list',
			array(
				'label'       => esc_html__( 'Cards', 'sifency-addons' ),
				'type'        => Controls_Manager::REPEATER,
				'fields'      => $repeater->get_controls(),
				'default'     => array(
					array( 'card_title' => 'Step 1: Discovery' ),
					array( 'card_title' => 'Step 2: Design' ),
					array( 'card_title' => 'Step 3: Development' ),
				),
				'title_field' => '{{{ card_title }}}',
			)
		);

		$this->end_controls_section();

		// --- Settings Section ---
		$this->start_controls_section(
			'section_settings',
			array( 'label' => esc_html__( 'Stacking Behavior', 'sifency-addons' ) )
		);

		$this->add_control(
			'stack_offset',
			array(
				'label'       => esc_html__( 'Top Offset (Spacing)', 'sifency-addons' ),
				'type'        => Controls_Manager::SLIDER,
				'range'       => array(
					'px' => array(
						'min'  => 0,
						'max'  => 100,
						'step' => 5,
					),
				),
				'default'     => array( 'size' => 40 ),
				'description' => 'The visible gap at the top between stacked cards.',
			)
		);

		$this->add_control(
			'enable_scale',
			array(
				'label'       => esc_html__( 'Scale Down Effect', 'sifency-addons' ),
				'type'        => Controls_Manager::SWITCHER,
				'default'     => 'yes',
				'description' => 'Older cards will shrink slightly as new cards stack over them.',
			)
		);

		$this->end_controls_section();
		$this->add_sifency_addons_help_controls();
		// --- Style Section ---
		$this->start_controls_section(
			'section_style',
			array(
				'label' => esc_html__( 'Card Styling', 'sifency-addons' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_control(
			'card_padding',
			array(
				'label'      => esc_html__( 'Padding', 'sifency-addons' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .sifency-stack-card' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
				'default'    => array(
					'top'    => '50',
					'bottom' => '50',
					'left'   => '40',
					'right'  => '40',
					'unit'   => 'px',
				),
			)
		);

		$this->add_control(
			'card_border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'sifency-addons' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .sifency-stack-card' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
				'default'    => array(
					'top'    => '24',
					'bottom' => '24',
					'left'   => '24',
					'right'  => '24',
					'unit'   => 'px',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'title_typography',
				'label'    => esc_html__( 'Title Typography', 'sifency-addons' ),
				'selector' => '{{WRAPPER}} .sifency-stack-title',
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'desc_typography',
				'label'    => esc_html__( 'Description Typography', 'sifency-addons' ),
				'selector' => '{{WRAPPER}} .sifency-stack-desc',
			)
		);

		$this->end_controls_section();
	}

	protected function render_dom( array $context ) {
		$settings   = $this->get_settings_for_display();
		$wrapper_id = esc_attr( $context['dom_id'] );
		$cards      = $settings['cards_list'];

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

		$data_attributes = array(
			'data-offset' => $settings['stack_offset']['size'] ?? 40,
			'data-scale'  => $settings['enable_scale'] === 'yes' ? 'true' : 'false',
		);

		?>
		<div id="<?php echo esc_attr( $wrapper_id ); ?>" class="sifency-stack-container"
			data-offset="<?php echo esc_attr( $data_attributes['data-offset'] ); ?>"
			data-scale="<?php echo esc_attr( $data_attributes['data-scale'] ); ?>">
			
			<div class="sifency-stack-wrapper">
				<?php foreach ( $cards as $index => $card ) : ?>
					<div class="sifency-stack-card elementor-repeater-item-<?php echo esc_attr( $card['_id'] ); ?>" 
						style="background-color: <?php echo esc_attr( $card['card_bg_color'] ); ?>;">
						
						<div class="sifency-stack-content">
							<h3 class="sifency-stack-title"><?php echo esc_html( $card['card_title'] ); ?></h3>
							<p class="sifency-stack-desc"><?php echo wp_kses_post( $card['card_desc'] ); ?></p>
						</div>
						
						<!-- Overlay for Darkening Effect -->
						<div class="sifency-stack-overlay"></div>
					</div>
				<?php endforeach; ?>
			</div>
		</div>
		<?php
	}
}
