<?php
/** About Elementor widget. */
defined( 'ABSPATH' ) || exit;

class Shabnam_Elementor_About extends Shabnam_Elementor_Widget_Base {
	public function get_name() { return 'shabnam-muchwow-about'; }
	public function get_title() { return __( 'درباره ما MuchWOW', 'shabnam-muchwow' ); }
	public function get_icon() { return 'eicon-info-box'; }

	protected function register_controls() {
		$this->start_controls_section( 'content', array( 'label' => __( 'محتوا', 'shabnam-muchwow' ) ) );
		$this->add_control( 'label', array( 'label' => __( 'برچسب', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXT, 'default' => 'داستان ما' ) );
		$this->add_control( 'title', array( 'label' => __( 'عنوان', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXT, 'default' => 'درباره ' . get_bloginfo( 'name' ) . ' 🚀' ) );
		$this->add_control( 'description_one', array( 'label' => __( 'متن اول', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXTAREA, 'default' => 'توکن ' . get_bloginfo( 'name' ) . ' از دل فرهنگ میم متولد شد تا نمادی از قدرت جامعه و خلاقیت در دنیای رمزارزها باشد!' ) );
		$this->add_control( 'description_two', array( 'label' => __( 'متن دوم', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXTAREA, 'default' => 'ما فقط یک میم‌کوین دیگر نیستیم؛ جنبشی هستیم که با انرژی جامعه‌ای از باورمندان و رویاپردازان رشد می‌کند! 🌟' ) );
		$this->add_control( 'image', array( 'label' => __( 'تصویر', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::MEDIA, 'default' => array( 'url' => shabnam_asset_uri( 'images/home-one/01.svg' ) ) ) );
		$this->end_controls_section();
		$this->shabnam_register_common_style_controls();
	}

	protected function render() {
		$s = $this->get_settings_for_display();
		foreach ( array( 'label', 'title', 'description_one', 'description_two' ) as $key ) { $this->add_inline_editing_attributes( $key, 'basic' ); }
		?>
		<div class="about section panel overflow-hidden shabnam-elementor-section" id="about"><div class="section-outer panel pt-6 sm:pt-8 lg:pt-9 xl:pt-10"><div class="container sm:max-w-md xl:max-w-lg"><div class="section-inner panel">
		<div class="section-header panel sm:max-w-500px xl:max-w-650px mx-auto mb-4 sm:mb-8 xl:mb-9 text-center" data-anime="onview: -300; targets: &gt;*; translateY: [24, 0]; opacity: [0, 1]; delay: anime.stagger(100, {start: 200});">
		<div class="category"><div class="rotate-2"><span class="fs-5 xl:fs-4 text-secondary fw-bold" <?php echo $this->get_render_attribute_string( 'label' ); ?>><?php echo esc_html( $s['label'] ); ?></span></div></div>
		<div class="title"><h2 class="h5 sm:h3 xl:h2 mb-0 mt-2 text-white text-uppercase ls-0 -rotate-1" <?php echo $this->get_render_attribute_string( 'title' ); ?>><?php echo esc_html( $s['title'] ); ?></h2></div>
		<div class="desc mt-3 sm:mt-4"><p class="fs-6 sm:fs-5 xl:fs-4 mb-2" <?php echo $this->get_render_attribute_string( 'description_one' ); ?>><?php echo esc_html( $s['description_one'] ); ?></p><p class="fs-6 sm:fs-5 xl:fs-4" <?php echo $this->get_render_attribute_string( 'description_two' ); ?>><?php echo esc_html( $s['description_two'] ); ?></p></div>
		</div>
		<div class="section-content" data-anime="onview: -200; translateY: [48, 0]; opacity: [0, 1]; delay: 200;"><img alt="تصویر" src="<?php echo esc_url( $this->shabnam_media_url( $s['image'], shabnam_asset_uri( 'images/home-one/01.svg' ) ) ); ?>"/></div>
		</div></div></div></div>
		<?php
	}
}
