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

class Shabnam_Elementor_Tokenomics extends Shabnam_Elementor_Widget_Base {
	public function get_name() { return 'shabnam-muchwow-tokenomics'; }
	public function get_title() { return __( 'ویژگی‌ها / Tokenomics', 'shabnam-muchwow' ); }
	public function get_icon() { return 'eicon-price-table'; }

	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' => 'اطلاعات اقتصاد توکن و کارمزدها!' ) );
		$this->add_control( 'description', array( 'label' => __( 'توضیح', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXTAREA, 'default' => 'پیش‌فروش ۴۰٪ • نقدینگی ۳۰٪ • تیم ۱۰٪ • توسعه ۱۰٪' ) );
		$r = new \Elementor\Repeater();
		$r->add_control( 'text', array( 'label' => __( 'ویژگی', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXTAREA, 'default' => '✅ ویژگی' ) );
		$this->add_control( 'features', array(
			'label' => __( 'چهار کارت ویژگی', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::REPEATER, 'fields' => $r->get_controls(),
			'default' => array(
				array( 'text' => "✅ سقف هر تراکنش:\n۱٪ از عرضه کل" ),
				array( 'text' => "✅ سقف موجودی کیف پول:\n۲٪ از عرضه کل" ),
				array( 'text' => '✅ سازوکارهای ضدنهنگ' ),
				array( 'text' => '✅ قفل نقدینگی به‌مدت یک سال' ),
			), 'title_field' => '{{{ text }}}',
		) );
		$this->add_control( 'image', array( 'label' => __( 'تصویر میانی', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::MEDIA, 'default' => array( 'url' => shabnam_asset_uri( 'images/home-one/02.svg' ) ) ) );
		$this->add_control( 'button_text', array( 'label' => __( 'متن دکمه', 'shabnam-muchwow' ), 'type' => \Elementor\Controls_Manager::TEXT, 'default' => 'مشاهده فروشگاه' ) );
		$this->shabnam_add_url_control( 'button_url', __( 'لینک دکمه', 'shabnam-muchwow' ), shabnam_shop_url() );
		$this->end_controls_section();
		$this->shabnam_register_common_style_controls();
	}

	protected function render() {
		$s = $this->get_settings_for_display();
		foreach ( array( 'label', 'title', 'description', 'button_text' ) as $key ) { $this->add_inline_editing_attributes( $key, 'basic' ); }
		$this->add_link_attributes( 'button_url', $s['button_url'] );
		$features = array_values( $s['features'] );
		while ( count( $features ) < 4 ) { $features[] = array( 'text' => '' ); }
		?>
		<div class="tokenomics section panel shabnam-elementor-section" id="tokenomics"><div class="section-outer panel py-4 sm:py-6 lg:py-8 xl:py-10"><div class="container sm:max-w-lg xl:max-w-xl"><div class="section-inner panel">
		<div class="section-header panel sm:max-w-600px xl:max-w-800px mx-auto mb-6 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>
		<h2 class="title h4 sm:h3 xl:h2 my-2 text-white text-uppercase ls-0" <?php echo $this->get_render_attribute_string( 'title' ); ?>><?php echo esc_html( $s['title'] ); ?></h2>
		<p class="desc fs-6 sm:fs-5 xl:fs-4" <?php echo $this->get_render_attribute_string( 'description' ); ?>><?php echo esc_html( $s['description'] ); ?></p>
		</div>
		<div class="section-content panel"><div class="row child-cols-12 sm:child-cols-6 lg:child-cols-3 items-center g-4 sm:g-3 xl:g-5">
		<div class="order-2 sm:order-1"><div class="panel"><div class="row child-cols-12 g-4 sm:g-8 xl:g-9" data-anime="onview: -300; targets: &gt;*; translateY: [24, 0]; opacity: [0, 1]; delay: anime.stagger(100, {start: 400});">
		<div><div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 rotate-2" style="background: linear-gradient(20deg, #ffffff17, var(--shcd-background-color, #0d042c))"><p class="fs-5 xl:fs-4"><?php echo nl2br( esc_html( $features[0]['text'] ) ); ?></p></div></div>
		<div><div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 -rotate-2" style="background: linear-gradient(20deg, #ffffff17, var(--shcd-background-color, #0d042c))"><p class="fs-5 xl:fs-4"><?php echo nl2br( esc_html( $features[1]['text'] ) ); ?></p></div></div>
		</div></div></div>
		<div class="col sm:d-none lg:d-block order-1 sm:order-2"><div class="features-image panel" data-anime="onview: -300; translateY: [24, 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/02.svg' ) ) ); ?>"/></div></div>
		<div class="order-2 sm:order-2"><div class="panel"><div class="row child-cols-12 g-4 sm:g-8 xl:g-9" data-anime="onview: -300; targets: &gt;*; translateY: [24, 0]; opacity: [0, 1]; delay: anime.stagger(100, {start: 400});">
		<div><div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 -rotate-2" style="background: linear-gradient(20deg, #ffffff17, var(--shcd-background-color, #0d042c))"><p class="fs-5 xl:fs-4"><?php echo nl2br( esc_html( $features[2]['text'] ) ); ?></p></div></div>
		<div><div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 rotate-2" style="background: linear-gradient(20deg, #ffffff17, var(--shcd-background-color, #0d042c))"><p class="fs-5 xl:fs-4"><?php echo nl2br( esc_html( $features[3]['text'] ) ); ?></p></div></div>
		</div></div></div>
		</div></div>
		<div class="section-footer panel d-flex justify-center mt-6 sm:mt-8" data-anime="onview: -100; translateY: [24, 0]; opacity: [0, 1]; delay: 200;"><a class="btn btn-md sm:btn-xl xl:btn-2xl px-4 xl:px-6 border border-3 border-black bg-gradient-45n from-secondary to-tertiary contrast-shadow -rotate-2 hover:rotate-0" <?php echo $this->get_render_attribute_string( 'button_url' ); ?> style="--shadowColor: var(--color-secondary)"><span class="text-black" <?php echo $this->get_render_attribute_string( 'button_text' ); ?>><?php echo esc_html( $s['button_text'] ); ?></span><span class="fs-4 mb-narrow">🔍</span></a></div>
		</div></div></div></div>
		<?php
	}
}
