<?php

namespace Unlockafe_addons\Widgets;

use Unlockafe_addons\Traits\Utils as UnlockafeUtils;
use Unlockafe_addons\Traits\Widget_helper;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Image_Size;

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

/**
 * Video Gallery Widget
 *
 * @since 1.0.0
 */
class Video_Gallery extends Widget_Base
{
    use Widget_helper, UnlockafeUtils;

    /**
     * Retrieve the widget name.
     */
    public function get_name()
    {
        return 'unlockafe-video-gallery';
    }

    /**
     * Retrieve the widget title.
     */
    public function get_title()
    {
        return __('Video Gallery', 'unlock-addons-for-elementor');
    }

    /**
     * Retrieve the widget icon.
     */
    public function get_icon()
    {
        return 'eicon-video-playlist ulicon';
    }

    /**
     * Retrieve the list of categories.
     */
    public function get_categories()
    {
        return ['unlockafe-addons'];
    }

    /**
     * Retrieve the list of keywords.
     */
    public function get_keywords()
    {
        return ['video', 'gallery', 'youtube', 'vimeo', 'playlist', 'lightbox', 'modal'];
    }

    /**
     * Retrieve the list of scripts.
     */
    public function get_script_depends()
    {
        return ['unlockafe-video-gallery-scripts'];
    }

    /**
     * Retrieve the list of styles.
     */
    public function get_style_depends()
    {
        return ['unlockafe-video-gallery-style', 'font-awesome'];
    }

    /**
     * Register widget controls.
     */
    protected function register_controls()
    {
        $this->register_content_controls();
        $this->register_style_controls();
    }

    /**
     * Register content controls.
     */
    protected function register_content_controls()
    {
        // General Settings
        $this->start_controls_section(
            'general_section',
            [
                'label' => __('General Settings', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_CONTENT,
            ]
        );

        $this->add_control(
            'gallery_layout',
            [
                'label' => __('Layout', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SELECT,
                'options' => [
                    'grid' => __('Grid', 'unlock-addons-for-elementor'),
                    'masonry' => __('Masonry', 'unlock-addons-for-elementor'),
                    'carousel' => __('Carousel', 'unlock-addons-for-elementor'),
                ],
                'default' => 'grid',
            ]
        );

        $this->add_control(
            'columns',
            [
                'label' => __('Columns', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SELECT,
                'options' => [
                    '1' => '1',
                    '2' => '2',
                    '3' => '3',
                    '4' => '4',
                    '5' => '5',
                    '6' => '6',
                ],
                'default' => '3',
                'condition' => [
                    'gallery_layout' => ['grid', 'masonry'],
                ],
            ]
        );

        $this->add_control(
            'lightbox',
            [
                'label' => __('Open in Lightbox', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
            ]
        );

        $this->add_control(
            'autoplay',
            [
                'label' => __('Autoplay Videos', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'no',
            ]
        );

        $this->add_control(
            'show_title',
            [
                'label' => __('Show Video Title', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
            ]
        );

        $this->add_control(
            'show_duration',
            [
                'label' => __('Show Duration', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SWITCHER,
                'label_on' => __('Yes', 'unlock-addons-for-elementor'),
                'label_off' => __('No', 'unlock-addons-for-elementor'),
                'return_value' => 'yes',
                'default' => 'yes',
            ]
        );

        $this->end_controls_section();

        // Carousel Settings Section
        $this->start_controls_section(
            'carousel_section',
            [
                'label' => __('Carousel Settings', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_CONTENT,
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->add_control(
            'items_per_view',
            [
                'label' => __('Items Per View (Desktop)', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['items'],
                'range' => [
                    'items' => [
                        'min' => 1,
                        'max' => 6,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'items',
                    'size' => 3,
                ],
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->add_control(
            'items_per_view_tablet',
            [
                'label' => __('Items Per View (Tablet)', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['items'],
                'range' => [
                    'items' => [
                        'min' => 1,
                        'max' => 4,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'items',
                    'size' => 2,
                ],
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->add_control(
            'items_per_view_mobile',
            [
                'label' => __('Items Per View (Mobile)', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['items'],
                'range' => [
                    'items' => [
                        'min' => 1,
                        'max' => 3,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'items',
                    'size' => 1,
                ],
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->add_control(
            'arrow_left_margin',
            [
                'label' => __('Left Arrow Margin', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 15,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-carousel-prev' => 'left: {{SIZE}}{{UNIT}};',
                ],
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->add_control(
            'arrow_right_margin',
            [
                'label' => __('Right Arrow Margin', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 15,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-carousel-next' => 'right: {{SIZE}}{{UNIT}};',
                ],
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->end_controls_section();

        // Carousel Settings Section
        $this->start_controls_section(
            'carousel_section',
            [
                'label' => __('Carousel Settings', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_CONTENT,
                'condition' => [
                    'gallery_layout' => 'carousel',
                ],
            ]
        );

        $this->add_control(
            'items_per_view',
            [
                'label' => __('Items Per View (Desktop)', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['items'],
                'range' => [
                    'items' => [
                        'min' => 1,
                        'max' => 6,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'items',
                    'size' => 3,
                ],
            ]
        );

        $this->add_control(
            'items_per_view_tablet',
            [
                'label' => __('Items Per View (Tablet)', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['items'],
                'range' => [
                    'items' => [
                        'min' => 1,
                        'max' => 4,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'items',
                    'size' => 2,
                ],
            ]
        );

        $this->add_control(
            'items_per_view_mobile',
            [
                'label' => __('Items Per View (Mobile)', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['items'],
                'range' => [
                    'items' => [
                        'min' => 1,
                        'max' => 3,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'items',
                    'size' => 1,
                ],
            ]
        );

        $this->add_control(
            'arrow_left_margin',
            [
                'label' => __('Left Arrow Margin', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 15,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-carousel-prev' => 'left: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'arrow_right_margin',
            [
                'label' => __('Right Arrow Margin', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 100,
                        'step' => 1,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 15,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-carousel-next' => 'right: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();

        // Videos Section
        $this->start_controls_section(
            'videos_section',
            [
                'label' => __('Videos', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_CONTENT,
            ]
        );

        $repeater = new Repeater();

        $repeater->add_control(
            'video_type',
            [
                'label' => __('Video Type', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SELECT,
                'options' => [
                    'youtube' => __('YouTube', 'unlock-addons-for-elementor'),
                    'vimeo' => __('Vimeo', 'unlock-addons-for-elementor'),
                    'self_hosted' => __('Self Hosted', 'unlock-addons-for-elementor'),
                ],
                'default' => 'youtube',
            ]
        );

        $repeater->add_control(
            'youtube_url',
            [
                'label' => __('YouTube URL', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::URL,
                'placeholder' => __('https://www.youtube.com/watch?v=...', 'unlock-addons-for-elementor'),
                'default' => [
                    'url' => '',
                ],
                'condition' => [
                    'video_type' => 'youtube',
                ],
            ]
        );

        $repeater->add_control(
            'vimeo_url',
            [
                'label' => __('Vimeo URL', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::URL,
                'placeholder' => __('https://vimeo.com/...', 'unlock-addons-for-elementor'),
                'default' => [
                    'url' => '',
                ],
                'condition' => [
                    'video_type' => 'vimeo',
                ],
            ]
        );

        $repeater->add_control(
            'self_hosted_video',
            [
                'label' => __('Video File', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::MEDIA,
                'media_types' => ['video'],
                'condition' => [
                    'video_type' => 'self_hosted',
                ],
            ]
        );

        $repeater->add_control(
            'video_thumbnail',
            [
                'label' => __('Thumbnail Image', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::MEDIA,
                'default' => [
                    'url' => \Elementor\Utils::get_placeholder_image_src(),
                ],
            ]
        );

        $repeater->add_control(
            'video_title',
            [
                'label' => __('Video Title', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::TEXT,
                'default' => __('Video Title', 'unlock-addons-for-elementor'),
                'placeholder' => __('Enter video title', 'unlock-addons-for-elementor'),
                'dynamic' => [
                    'active' => true,
                ],
            ]
        );

        $repeater->add_control(
            'video_duration',
            [
                'label' => __('Duration', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::TEXT,
                'default' => '5:30',
                'placeholder' => __('e.g., 5:30', 'unlock-addons-for-elementor'),
            ]
        );

        $repeater->add_control(
            'video_category',
            [
                'label' => __('Category', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::TEXT,
                'default' => '',
                'placeholder' => __('e.g., Tutorial, Review', 'unlock-addons-for-elementor'),
            ]
        );

        $this->add_control(
            'gallery_videos',
            [
                'label' => __('Videos', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::REPEATER,
                'fields' => $repeater->get_controls(),
                'default' => [
                    [
                        'video_type' => 'youtube',
                        'youtube_url' => ['url' => 'https://www.youtube.com/watch?v=dQw4w9WgXcQ'],
                        'video_title' => __('Sample Video 1', 'unlock-addons-for-elementor'),
                        'video_duration' => '3:45',
                    ],
                    [
                        'video_type' => 'youtube',
                        'youtube_url' => ['url' => 'https://www.youtube.com/watch?v=dQw4w9WgXcQ'],
                        'video_title' => __('Sample Video 2', 'unlock-addons-for-elementor'),
                        'video_duration' => '5:20',
                    ],
                    [
                        'video_type' => 'youtube',
                        'youtube_url' => ['url' => 'https://www.youtube.com/watch?v=dQw4w9WgXcQ'],
                        'video_title' => __('Sample Video 3', 'unlock-addons-for-elementor'),
                        'video_duration' => '4:10',
                    ],
                ],
                'title_field' => '{{{ video_title }}}',
            ]
        );

        $this->end_controls_section();
    }

    /**
     * Register style controls.
     */
    protected function register_style_controls()
    {
        // Container Style
        $this->start_controls_section(
            'container_style_section',
            [
                'label' => __('Container', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_responsive_control(
            'container_gap',
            [
                'label' => __('Gap Between Videos', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 0,
                        'max' => 50,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 20,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-gallery-wrapper' => 'gap: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();

        // Video Item Style
        $this->start_controls_section(
            'video_item_style_section',
            [
                'label' => __('Video Item', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'item_border_radius',
            [
                'label' => __('Border Radius', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%'],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Box_Shadow::get_type(),
            [
                'name' => 'item_box_shadow',
                'label' => __('Box Shadow', 'unlock-addons-for-elementor'),
                'selector' => '{{WRAPPER}} .unlockafe-video-item',
            ]
        );

        $this->end_controls_section();

        // Play Button Style
        $this->start_controls_section(
            'play_button_style_section',
            [
                'label' => __('Play Button', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'play_button_size',
            [
                'label' => __('Size', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::SLIDER,
                'size_units' => ['px'],
                'range' => [
                    'px' => [
                        'min' => 30,
                        'max' => 150,
                    ],
                ],
                'default' => [
                    'unit' => 'px',
                    'size' => 80,
                ],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-play-button' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
                    '{{WRAPPER}} .unlockafe-video-play-button i' => 'font-size: {{SIZE}}{{UNIT}};',
                ],
            ]
        );

        $this->add_control(
            'play_button_color',
            [
                'label' => __('Color', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::COLOR,
                'default' => '#ffffff',
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-play-button' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_control(
            'play_button_background',
            [
                'label' => __('Background Color', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::COLOR,
                'default' => 'rgba(0, 0, 0, 0.7)',
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-play-button' => 'background-color: {{VALUE}};',
                ],
            ]
        );

        $this->end_controls_section();

        // Title Style
        $this->start_controls_section(
            'title_style_section',
            [
                'label' => __('Title', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'title_color',
            [
                'label' => __('Color', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-title' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'title_typography',
                'selector' => '{{WRAPPER}} .unlockafe-video-title',
            ]
        );

        $this->add_responsive_control(
            'title_padding',
            [
                'label' => __('Padding', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%', 'em'],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
                'separator' => 'before',
            ]
        );

        $this->add_responsive_control(
            'title_margin',
            [
                'label' => __('Margin', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::DIMENSIONS,
                'size_units' => ['px', '%', 'em'],
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ],
            ]
        );

        $this->end_controls_section();

        // Duration Style
        $this->start_controls_section(
            'duration_style_section',
            [
                'label' => __('Duration', 'unlock-addons-for-elementor'),
                'tab' => Controls_Manager::TAB_STYLE,
            ]
        );

        $this->add_control(
            'duration_color',
            [
                'label' => __('Color', 'unlock-addons-for-elementor'),
                'type' => Controls_Manager::COLOR,
                'selectors' => [
                    '{{WRAPPER}} .unlockafe-video-duration' => 'color: {{VALUE}};',
                ],
            ]
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            [
                'name' => 'duration_typography',
                'selector' => '{{WRAPPER}} .unlockafe-video-duration',
            ]
        );

        $this->end_controls_section();
    }

    /**
     * Extract video ID from URL
     */
    private function get_video_id($url, $type) {
        if (empty($url)) {
            return '';
        }

        if ($type === 'youtube') {
            preg_match('/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/', $url, $matches);
            return !empty($matches[1]) ? $matches[1] : '';
        } elseif ($type === 'vimeo') {
            preg_match('/vimeo\.com\/(?:.*\/)?(\d+)/', $url, $matches);
            return !empty($matches[1]) ? $matches[1] : '';
        }

        return '';
    }

    /**
     * Get embed URL
     */
    private function get_embed_url($url, $type, $autoplay = false) {
        $video_id = $this->get_video_id($url, $type);
        
        if (empty($video_id)) {
            return '';
        }

        if ($type === 'youtube') {
            $autoplay_param = $autoplay ? '&autoplay=1' : '';
            return 'https://www.youtube.com/embed/' . $video_id . '?rel=0&showinfo=0' . $autoplay_param;
        } elseif ($type === 'vimeo') {
            $autoplay_param = $autoplay ? '&autoplay=1' : '';
            return 'https://player.vimeo.com/video/' . $video_id . '?title=0&byline=0&portrait=0' . $autoplay_param;
        }

        return '';
    }

    /**
     * Render widget output on the frontend.
     */
    protected function render()
    {
        $settings = $this->get_settings_for_display();
        $gallery_layout = $settings['gallery_layout'] ?? 'grid';
        $columns = $settings['columns'] ?? '3';
        $lightbox = $settings['lightbox'] === 'yes';
        $autoplay = $settings['autoplay'] === 'yes';
        $show_title = $settings['show_title'] === 'yes';
        $show_duration = $settings['show_duration'] === 'yes';
        $gallery_videos = !empty($settings['gallery_videos']) ? $settings['gallery_videos'] : [];

        $wrapper_class = 'unlockafe-video-gallery-wrapper';
        $wrapper_class .= ' unlockafe-gallery-' . esc_attr($gallery_layout);
        if ($gallery_layout === 'grid' || $gallery_layout === 'masonry') {
            $wrapper_class .= ' unlockafe-gallery-cols-' . esc_attr($columns);
        }

        // Get carousel settings
        $items_per_view = !empty($settings['items_per_view']['size']) ? intval($settings['items_per_view']['size']) : 3;
        $items_per_view_tablet = !empty($settings['items_per_view_tablet']['size']) ? intval($settings['items_per_view_tablet']['size']) : 2;
        $items_per_view_mobile = !empty($settings['items_per_view_mobile']['size']) ? intval($settings['items_per_view_mobile']['size']) : 1;

        ?>
        <div class="<?php echo esc_attr($wrapper_class); ?>" 
             data-layout="<?php echo esc_attr($gallery_layout); ?>"
             data-lightbox="<?php echo $lightbox ? 'yes' : 'no'; ?>"
             data-autoplay="<?php echo $autoplay ? 'yes' : 'no'; ?>"
             data-items-per-view="<?php echo esc_attr($items_per_view); ?>"
             data-items-per-view-tablet="<?php echo esc_attr($items_per_view_tablet); ?>"
             data-items-per-view-mobile="<?php echo esc_attr($items_per_view_mobile); ?>">
            <?php if (!empty($gallery_videos)): ?>
                <?php foreach ($gallery_videos as $index => $video): 
                    $video_type = !empty($video['video_type']) ? esc_attr($video['video_type']) : 'youtube';
                    $video_url = '';
                    $embed_url = '';
                    
                    if ($video_type === 'youtube' && !empty($video['youtube_url']['url'])) {
                        $video_url = esc_url($video['youtube_url']['url']);
                        $embed_url = $this->get_embed_url($video_url, 'youtube', $autoplay);
                    } elseif ($video_type === 'vimeo' && !empty($video['vimeo_url']['url'])) {
                        $video_url = esc_url($video['vimeo_url']['url']);
                        $embed_url = $this->get_embed_url($video_url, 'vimeo', $autoplay);
                    } elseif ($video_type === 'self_hosted' && !empty($video['self_hosted_video']['url'])) {
                        $video_url = esc_url($video['self_hosted_video']['url']);
                        $embed_url = $video_url;
                    }
                    
                    $thumbnail_url = !empty($video['video_thumbnail']['url']) ? esc_url($video['video_thumbnail']['url']) : '';
                    $video_title = !empty($video['video_title']) ? esc_html($video['video_title']) : '';
                    $video_duration = !empty($video['video_duration']) ? esc_html($video['video_duration']) : '';
                    
                    if (empty($embed_url)) {
                        continue; // Skip if no valid video URL
                    }
                ?>
                    <div class="unlockafe-video-item" data-video-index="<?php echo esc_attr($index); ?>">
                        <div class="unlockafe-video-thumbnail-wrapper">
                            <?php if ($thumbnail_url): ?>
                                <img src="<?php echo $thumbnail_url; ?>" alt="<?php echo esc_attr($video_title); ?>" class="unlockafe-video-thumbnail" loading="lazy">
                            <?php else: ?>
                                <div class="unlockafe-video-thumbnail-placeholder">
                                    <i class="fas fa-video"></i>
                                </div>
                            <?php endif; ?>
                            
                            <div class="unlockafe-video-overlay">
                                <button class="unlockafe-video-play-button" data-video-url="<?php echo esc_attr($embed_url); ?>" data-video-type="<?php echo esc_attr($video_type); ?>">
                                    <i class="fas fa-play"></i>
                                </button>
                            </div>
                            
                            <?php if ($show_duration && $video_duration): ?>
                                <span class="unlockafe-video-duration"><?php echo $video_duration; ?></span>
                            <?php endif; ?>
                        </div>
                        
                        <?php if ($show_title && $video_title): ?>
                            <h3 class="unlockafe-video-title"><?php echo $video_title; ?></h3>
                        <?php endif; ?>
                    </div>
                <?php endforeach; ?>
            <?php endif; ?>
        </div>
        
        <?php if ($lightbox): ?>
            <!-- Video Lightbox Modal -->
            <div class="unlockafe-video-lightbox" id="unlockafe-video-lightbox-<?php echo esc_attr($this->get_id()); ?>">
                <div class="unlockafe-video-lightbox-overlay"></div>
                <div class="unlockafe-video-lightbox-content">
                    <button class="unlockafe-video-lightbox-close">
                        <i class="fas fa-times"></i>
                    </button>
                    <div class="unlockafe-video-lightbox-player">
                        <iframe class="unlockafe-video-iframe" src="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                    </div>
                </div>
            </div>
        <?php endif; ?>
        <?php
    }
}


