<?php
/**
 * UX Builder element shortcode: grid_item_multiple
 *
 * Renders a grid with a section heading, background image, and 5 benefit items
 * arranged in 3 columns: [01, 05] | [02, 04] | [03].
 */

if ( ! function_exists( 'flatsome_child_grid_item_multiple_shortcode' ) ) {
	function flatsome_child_grid_item_multiple_shortcode( $atts = array() ) {
		$atts = shortcode_atts(
			array(
				'class'   => '',
				'heading' => 'Lợi ích mang lại cho doanh nghiệp',
				'img'     => 'https://invaidangquang.com/wp-content/uploads/2023/11/Group-1148-2.png',

				'num1'  => '01.',
				'text1' => 'Tiết kiệm chi phí sản xuất, chi phí nghiên cứu & phát triển mẫu',

				'num2'  => '02.',
				'text2' => 'Kiểm soát vải tồn kho dễ dàng với số lượng in từ 50m/1 mẫu',

				'num3'  => '03.',
				'text3' => 'Ra mắt bộ sưu tập đúng thời gian với sản lượng 50.000m/ngày',

				'num4'  => '04.',
				'text4' => 'Nâng cao năng lực cạnh tranh của doanh nghiệp',

				'num5'  => '05.',
				'text5' => 'Tăng hiệu quả kinh doanh với sản phẩm ra thị trường khó bắt chước',
			),
			$atts,
			'grid_item_multiple'
		);

		$uid = 'uid' . wp_rand( 10, 999 ) . uniqid( '_' );

		$wrapper_classes = array( 'zb-section__innerWrapper' );
		if ( ! empty( $atts['class'] ) ) {
			$wrapper_classes[] = $atts['class'];
		}

		$item = function ( $uid_prefix, $num, $text ) {
			return '<div id="' . esc_attr( $uid_prefix ) . '" class="zb-element zb-el-container">' .
				'<span id="' . esc_attr( $uid_prefix . '_n' ) . '" class="title_loi_ich zb-element zb-el-zionHeading">' . esc_html( $num ) . '</span>' .
				'<span id="' . esc_attr( $uid_prefix . '_t' ) . '" class="content_loi_ich zb-element zb-el-zionHeading"><strong>' . esc_html( $text ) . '</strong></span>' .
			'</div>';
		};

		return
			'<div class="' . esc_attr( implode( ' ', $wrapper_classes ) ) . '">' .

				// Heading column
				'<div id="' . esc_attr( $uid . '_h' ) . '" class="zb-column--5 zb-column zb-element zb-el-zionColumn">' .
					'<h2 id="' . esc_attr( $uid . '_htxt' ) . '" class="zb-element zb-el-zionHeading ajs__element fadeInDown animated" data-ajs-animation="fadeInDown">' . esc_html( $atts['heading'] ) . '</h2>' .
				'</div>' .

				// Empty spacer column
				'<div id="' . esc_attr( $uid . '_sp' ) . '" class="zb-column--7 zb-column zb-element zb-el-zionColumn"></div>' .

				// Main image column (background)
				'<div id="' . esc_attr( $uid . '_img' ) . '" class="zb-column--9 back_class_pos zb-column zb-element zb-el-zionColumn">' .
					'<div id="' . esc_attr( $uid . '_imgwrap' ) . '" class="zb-element zb-el-zionImage ajs__element fadeInRight animated" data-ajs-animation="fadeInRight">' .
						'<div><img loading="lazy" decoding="async" src="' . esc_url( $atts['img'] ) . '" class="attachment-full size-full" alt=""></div>' .
					'</div>' .
				'</div>' .

				// Col 1: items 01, 05
				'<div id="' . esc_attr( $uid . '_c1' ) . '" class="zb-column--3 zb-column zb-element zb-el-zionColumn ajs__element fadeInLeft animated" data-ajs-animation="fadeInLeft">' .
					$item( $uid . '_i1', $atts['num1'], $atts['text1'] ) .
					$item( $uid . '_i5', $atts['num5'], $atts['text5'] ) .
				'</div>' .

				// Col 2: items 02, 04
				'<div id="' . esc_attr( $uid . '_c2' ) . '" class="zb-column--3 zb-column zb-element zb-el-zionColumn ajs__element fadeInLeft animated" data-ajs-animation="fadeInLeft">' .
					$item( $uid . '_i2', $atts['num2'], $atts['text2'] ) .
					$item( $uid . '_i4', $atts['num4'], $atts['text4'] ) .
				'</div>' .

				// Col 3: item 03
				'<div id="' . esc_attr( $uid . '_c3' ) . '" class="zb-column--3 zb-column zb-element zb-el-zionColumn ajs__element fadeInLeft animated" data-ajs-animation="fadeInLeft">' .
					$item( $uid . '_i3', $atts['num3'], $atts['text3'] ) .
				'</div>' .

			'</div>';
	}

	add_shortcode( 'grid_item_multiple', 'flatsome_child_grid_item_multiple_shortcode' );
}
