<?php
/**
 * DS FAQ + Support Widget
 */

namespace dreamsalonelementor\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;

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

class DSFaqSupport extends Widget_Base {

    public function get_name() {
        return 'dreamsalon-ds-faq-support';
    }

    public function get_title() {
        return __('DS FAQ & Support', 'dreamsalon_elementor');
    }

    public function get_icon() {
        return 'eicon-help-o';
    }

    public function get_categories() {
        return ['dreamsalon'];
    }

    protected function _register_controls() {

        /* ---------------------- FAQ SECTION ---------------------- */
        $this->start_controls_section('faq_section', [
            'label' => __('FAQ Section', 'dreamsalon_elementor'),
        ]);

        $this->add_control('faq_title', [
            'label' => __('FAQ Title', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXT,
            'default' => 'Frequently Asked Questions',
        ]);

        $this->add_control('faq_subtitle', [
            'label' => __('FAQ Subtitle', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXTAREA,
            'default' => 'Connecting Needs with Offers for the Professional Salon Services.',
        ]);

        $repeater = new Repeater();

        $repeater->add_control('question', [
            'label' => __('Question', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXT,
            'default' => 'How do I book a service?',
        ]);

        $repeater->add_control('answer', [
            'label' => __('Answer', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXTAREA,
            'default' => 'To book a service, browse through the available salons or services, select your preferred option, choose a date and time, and follow the checkout process to confirm your booking.',
        ]);

        $this->add_control('faq_items', [
            'label' => __('FAQ Items', 'dreamsalon_elementor'),
            'type' => Controls_Manager::REPEATER,
            'fields' => $repeater->get_controls(),
            'title_field' => '{{{ question }}}',
            'default' => [
                [
                    'question' => 'How do I book a service?',
                    'answer' => 'To book a service, browse through the available salons or services, select your preferred option, choose a date and time, and follow the checkout process to confirm your booking.',
                ],
                [
                    'question' => 'What services do you offer?',
                    'answer' => 'We offer a wide range of services including haircuts, styling, coloring, facials, manicures, pedicures, waxing, bridal makeup, and more. Visit our Services page for full details.',
                ],
                [
                    'question' => 'Do I need to make an appointment?',
                    'answer' => 'While walk-ins are welcome, we recommend booking an appointment in advance to ensure your preferred time and stylist are available.',
                ],
                [
                    'question' => 'Do you offer home services?',
                    'answer' => 'Some locations may offer home service for select treatments. Contact us to inquire about availability and pricing.',
                ],
                [
                    'question' => 'Can I reschedule or cancel my appointment?',
                    'answer' => 'Yes, you can reschedule or cancel up to 24 hours before your appointment. Please contact us as soon as possible if you need to make changes.',
                ],
            ],
        ]);

        $this->end_controls_section();


        /* ---------------------- SUPPORT SECTION ---------------------- */
        $this->start_controls_section('support_section', [
            'label' => __('Support Section', 'dreamsalon_elementor'),
        ]);

        $this->add_control('support_title', [
            'label' => __('Support Title', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXT,
            'default' => 'We Are Here to Support You',
        ]);

        $this->add_control('support_description', [
            'label' => __('Support Description', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXTAREA,
            'default' => 'Customer support is our highest priority. We\'re here to answer all your questions',
        ]);

        $this->add_control('button_text', [
            'label' => __('Button Text', 'dreamsalon_elementor'),
            'type' => Controls_Manager::TEXT,
            'default' => 'Get 14 Days Free Trial',
        ]);

        $this->add_control('button_url', [
            'label' => __('Button URL', 'dreamsalon_elementor'),
            'type' => Controls_Manager::URL,
            'default' => ['url' => '#'],
        ]);

        // Background Images
        $this->add_control('bg_image_three', [
            'label' => __('Background Image 1', 'dreamsalon_elementor'),
            'type' => Controls_Manager::MEDIA,
            'description' => 'Background image that appears on the left',
        ]);

        $this->add_control('bg_image_four', [
            'label' => __('Background Image 2', 'dreamsalon_elementor'),
            'type' => Controls_Manager::MEDIA,
            'description' => 'Background image that appears in the middle',
        ]);

        $this->add_control('bg_image_five', [
            'label' => __('Background Image 3', 'dreamsalon_elementor'),
            'type' => Controls_Manager::MEDIA,
            'description' => 'Background image that appears on the right',
        ]);

        // Support Images
        $this->add_control('support_image_one', [
            'label' => __('Support Image 1', 'dreamsalon_elementor'),
            'type' => Controls_Manager::MEDIA,
            'description' => 'Main support image',
        ]);

        $this->add_control('support_image_two', [
            'label' => __('Support Image 2', 'dreamsalon_elementor'),
            'type' => Controls_Manager::MEDIA,
            'description' => 'Secondary support image',
        ]);

        $this->add_control('support_image_three', [
            'label' => __('Support Image 3', 'dreamsalon_elementor'),
            'type' => Controls_Manager::MEDIA,
            'description' => 'Tertiary support image',
        ]);

        $this->end_controls_section();
    }


    protected function render() {
        $s = $this->get_settings_for_display();
?>

<!-- FAQ Section -->
<div class="contact-faq-section">
    <div class="container">

        <!-- Section Header -->
        <div class="section-header text-center">
            <h2 class="section-title"><?php echo esc_html($s['faq_title']); ?></h2>
            <p><?php echo esc_html($s['faq_subtitle']); ?></p>
        </div>
        <!-- Section Header End -->

        <!-- start row -->
        <div class="row contact-us-faq">

            <div class="col-lg-8 mx-auto">
                <div class="accordion faq-accordion" id="accordionFaq">
                    <?php
                    $i = 1;
                    if (!empty($s['faq_items'])):
                        foreach ($s['faq_items'] as $item):
                            $id = 'faq-' . $this->get_id() . '-' . $i;
                            $show = ($i === 1) ? 'show' : '';
                            $collapsed = ($i === 1) ? '' : 'collapsed';
                    ?>
                    <div class="accordion-item mb-3 <?php echo ($i === 1) ? 'show' : ''; ?>">
                        <h2 class="accordion-header">
                            <button class="accordion-button <?php echo esc_attr($collapsed); ?>" type="button" data-bs-toggle="collapse" data-bs-target="#<?php echo esc_attr($id); ?>" aria-expanded="<?php echo ($i === 1) ? 'true' : 'false'; ?>" aria-controls="<?php echo esc_attr($id); ?>">
                                <?php echo esc_html($item['question']); ?>
                            </button>
                        </h2>
                        <div id="<?php echo esc_attr($id); ?>" class="accordion-collapse collapse <?php echo esc_attr($show); ?>" data-bs-parent="#accordionFaq">
                            <div class="accordion-body">
                                <p class="mb-0"><?php echo esc_html($item['answer']); ?></p>
                            </div>
                        </div>
                    </div>
                    <?php
                            $i++;
                        endforeach;
                    endif;
                    ?>
                </div>
            </div> <!-- end col -->

        </div>
        <!-- end row -->

        <!-- Support -->
        <div class="support-wrap position-relative">
            <!-- Background Images -->
            <?php if (!empty($s['bg_image_three']['url'])): ?>
                <img src="<?php echo esc_url($s['bg_image_three']['url']); ?>" alt="contact-us-bg-03" class="img-fluid contact-us-bg-three d-none d-lg-flex">
            <?php endif; ?>
            
            <?php if (!empty($s['bg_image_four']['url'])): ?>
                <img src="<?php echo esc_url($s['bg_image_four']['url']); ?>" alt="contact-us-bg-04" class="img-fluid contact-us-bg-four d-none d-lg-flex">
            <?php endif; ?>
            
            <?php if (!empty($s['bg_image_five']['url'])): ?>
                <img src="<?php echo esc_url($s['bg_image_five']['url']); ?>" alt="contact-us-bg-05" class="img-fluid contact-us-bg-five d-none d-lg-flex">
            <?php endif; ?>

            <!-- start row -->
            <div class="row position-relative z-1">

                <div class="col-lg-6">
                    <h1 class="mb-2"><?php echo esc_html($s['support_title']); ?></h1>
                    <p class="text-white mb-4"><?php echo esc_html($s['support_description']); ?></p>
                    <?php if (!empty($s['button_text'])): ?>
                        <a href="<?php echo esc_url($s['button_url']['url']); ?>" class="btn btn-white border d-inline-flex align-items-center">
                            <?php echo esc_html($s['button_text']); ?> 
                            <i class="ti ti-chevron-right ms-1"></i>
                        </a>
                    <?php endif; ?>
                </div><!-- end col -->

                <div class="col-lg-6 d-none d-lg-flex">
                    <div class="contact-us-item-five">
                        <?php if (!empty($s['support_image_one']['url'])): ?>
                            <img src="<?php echo esc_url($s['support_image_one']['url']); ?>" alt="contact-us-01" class="img-fluid contact-us-img-one">
                        <?php endif; ?>
                        
                        <?php if (!empty($s['support_image_two']['url'])): ?>
                            <img src="<?php echo esc_url($s['support_image_two']['url']); ?>" alt="contact-us-02" class="img-fluid contact-us-img-two">
                        <?php endif; ?>
                        
                        <?php if (!empty($s['support_image_three']['url'])): ?>
                            <img src="<?php echo esc_url($s['support_image_three']['url']); ?>" alt="contact-us-03" class="img-fluid contact-us-img-three">
                        <?php endif; ?>
                    </div>
                </div><!-- end col -->

            </div>
            <!-- end row -->

        </div>
        <!-- Support End -->

    </div>
</div>
<!-- FAQ Section End -->



<?php
    }
}