<?php
namespace AITheme\Elementor\Widgets;

use Elementor\Controls_Manager;

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

class Contact_Centered extends AI_Widget_Base {
    public function get_name() { return 'ai_contact_centered'; }
    public function get_title() { return __('Contact Centered', 'ai-theme'); }
    public function get_icon() { return 'eicon-envelope'; }
    public function get_categories() { return array('ai-theme-contact'); }

    protected function register_controls() {
        $this->start_controls_section('content_section', ['label' => __('Content', 'ai-theme'), 'tab' => Controls_Manager::TAB_CONTENT]);
        $this->add_control('title', ['label' => __('Title', 'ai-theme'), 'type' => Controls_Manager::TEXT, 'default' => __('Contact Us', 'ai-theme')]);
        $this->add_control('subtitle', ['label' => __('Subtitle', 'ai-theme'), 'type' => Controls_Manager::TEXT]);
        $this->add_control('phone', ['label' => __('Phone', 'ai-theme'), 'type' => Controls_Manager::TEXT]);
        $this->add_control('email', ['label' => __('Email', 'ai-theme'), 'type' => Controls_Manager::TEXT]);
        $this->add_control('address', ['label' => __('Address', 'ai-theme'), 'type' => Controls_Manager::TEXTAREA]);
        $this->end_controls_section();
    }

    protected function render() {
        $s = $this->get_settings_for_display();
        ?>
        <section class="ai-contact ai-contact-centered py-16" data-block-type="contact" data-block-variant="contact-centered">
            <div class="max-w-2xl mx-auto px-6">
                <div class="text-center mb-12">
                    <h2 class="ai-contact-title text-4xl mb-4"><?php echo esc_html($s['title']); ?></h2>
                    <?php if (!empty($s['subtitle'])) : ?>
                        <p class="ai-contact-subtitle text-lg"><?php echo esc_html($s['subtitle']); ?></p>
                    <?php endif; ?>
                </div>
                <div class="ai-contact-card p-8 rounded-2xl shadow-lg">
                    <div class="space-y-4">
                        <input type="text" placeholder="Your Name" class="form-input w-full" />
                        <input type="email" placeholder="Your Email" class="form-input w-full" />
                        <textarea placeholder="Your Message" rows="5" class="form-input w-full resize-none"></textarea>
                        <div class="flex items-start gap-3 p-3 bg-gray-50 rounded-lg border border-gray-200">
                            <input type="checkbox" id="privacy-policy-centered" class="mt-1 w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-2 focus:ring-blue-500 cursor-pointer" />
                            <label for="privacy-policy-centered" class="text-sm text-gray-700 cursor-pointer">
                                I agree with the <a href="/privacy-policy" target="_blank" rel="noopener noreferrer" class="text-blue-600 hover:text-blue-700 underline font-medium">Privacy Policy</a>
                                <span class="text-red-500 ml-1">*</span>
                            </label>
                        </div>
                        <button class="ai-contact-button w-full flex items-center justify-center gap-2 px-6 py-4">
                            Send Message
                        </button>
                    </div>
                </div>
            </div>
        </section>
        <?php
    }
}
