<?php
/**
 * Template Style 2: Minimalist Vertical Card Showcase
 *
 * @package AffiStyle
 */

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

$affistyle_is_preview = ! empty( $data['is_preview'] );
$affistyle_box_id     = isset( $id ) ? absint( $id ) : ( isset( $data['id'] ) ? absint( $data['id'] ) : get_the_ID() );

$affistyle_title = isset( $data['title_1'] ) ? $data['title_1'] : ( isset( $data['title'] ) ? $data['title'] : ( ! empty( $title_1 ) ? $title_1 : '' ) );
if ( empty( $affistyle_title ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_title = get_the_title( $affistyle_box_id );
}
if ( empty( $affistyle_title ) ) {
	$affistyle_title = __( 'Product Headline', 'affistyle' );
}

$affistyle_image_url = isset( $data['image_1'] ) ? $data['image_1'] : ( isset( $data['image_url'] ) ? $data['image_url'] : ( ! empty( $image_1 ) ? $image_1 : '' ) );
if ( empty( $affistyle_image_url ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_image_url = get_post_meta( $affistyle_box_id, '_affistyle_image_1', true );
	if ( empty( $affistyle_image_url ) ) {
		$affistyle_image_url = get_post_meta( $affistyle_box_id, '_affistyle_image_url', true );
	}
}

$affistyle_description = isset( $data['description'] ) ? $data['description'] : ( isset( $description ) ? $description : '' );
if ( empty( $affistyle_description ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_description = get_post_meta( $affistyle_box_id, '_affistyle_description_1', true );
	if ( empty( $affistyle_description ) ) {
		$affistyle_description = get_post_meta( $affistyle_box_id, '_affistyle_description', true );
	}
}

$affistyle_destination = ! empty( $data['destination'] ) ? $data['destination'] : ( ! empty( $destination ) ? $destination : '' );
if ( empty( $affistyle_destination ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_destination = class_exists( 'AffiStyle_Cloaking' )
		? AffiStyle_Cloaking::get_cloaked_url( $affistyle_box_id, 1 )
		: get_post_meta( $affistyle_box_id, '_affistyle_destination', true );
	if ( empty( $affistyle_destination ) ) {
		$affistyle_destination = get_post_meta( $affistyle_box_id, '_affistyle_url_default', true );
	}
}
if ( empty( $affistyle_destination ) ) {
	$affistyle_destination = '#';
}

$affistyle_button_text = ! empty( $data['button_text'] ) ? $data['button_text'] : ( ! empty( $button_text ) ? $button_text : '' );
if ( empty( $affistyle_button_text ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_button_text = get_post_meta( $affistyle_box_id, '_affistyle_button_text_1', true );
	if ( empty( $affistyle_button_text ) ) {
		$affistyle_button_text = get_post_meta( $affistyle_box_id, '_affistyle_button_text', true );
	}
}
if ( empty( $affistyle_button_text ) ) {
	$affistyle_button_text = __( 'Claim Deal', 'affistyle' );
}

$affistyle_badge_text = isset( $data['badge_text'] ) ? $data['badge_text'] : ( isset( $badge_text ) ? $badge_text : '' );
if ( empty( $affistyle_badge_text ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_badge_text = get_post_meta( $affistyle_box_id, '_affistyle_badge_text_1', true );
	if ( empty( $affistyle_badge_text ) ) {
		$affistyle_badge_text = get_post_meta( $affistyle_box_id, '_affistyle_badge_text', true );
	}
}

$affistyle_bg_color = ! empty( $data['bg_color'] ) ? $data['bg_color'] : ( ! empty( $bg_color ) ? $bg_color : '' );
if ( empty( $affistyle_bg_color ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_bg_color = get_post_meta( $affistyle_box_id, '_affistyle_bg_color', true );
}
if ( empty( $affistyle_bg_color ) ) {
	$affistyle_bg_color = '#ffffff';
}

$affistyle_btn_color = ! empty( $data['btn_color'] ) ? $data['btn_color'] : ( ! empty( $btn_color ) ? $btn_color : '' );
if ( empty( $affistyle_btn_color ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_btn_color = get_post_meta( $affistyle_box_id, '_affistyle_btn_color', true );
}
if ( empty( $affistyle_btn_color ) ) {
	$affistyle_btn_color = '#2563eb';
}

$affistyle_price = isset( $data['price_1'] ) ? $data['price_1'] : ( isset( $data['price'] ) ? $data['price'] : ( ! empty( $price_1 ) ? $price_1 : '' ) );
if ( empty( $affistyle_price ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_price = get_post_meta( $affistyle_box_id, '_affistyle_price_1', true );
	if ( empty( $affistyle_price ) ) {
		$affistyle_price = get_post_meta( $affistyle_box_id, '_affistyle_price', true );
	}
}

// Rating extraction & badge logic.
if ( $affistyle_is_preview ) {
	$affistyle_show_rating = isset( $data['show_rating'] ) ? ( '1' === (string) $data['show_rating'] || true === $data['show_rating'] ) : true;
} else {
	$affistyle_show_rating_meta = $affistyle_box_id ? get_post_meta( $affistyle_box_id, '_affistyle_show_rating_1', true ) : '';
	if ( '' === $affistyle_show_rating_meta && $affistyle_box_id ) {
		$affistyle_show_rating_meta = get_post_meta( $affistyle_box_id, '_affistyle_show_rating', true );
	}
	$affistyle_show_rating = isset( $show_rating ) ? (bool) $show_rating : ( isset( $data['show_rating'] ) ? (bool) $data['show_rating'] : ( '' === $affistyle_show_rating_meta || '1' === (string) $affistyle_show_rating_meta ) );
}

$affistyle_rating_score = isset( $data['rating_score'] ) ? floatval( $data['rating_score'] ) : ( isset( $rating_score ) ? floatval( $rating_score ) : 0.0 );
if ( empty( $affistyle_rating_score ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_rating_score = floatval( get_post_meta( $affistyle_box_id, '_affistyle_rating_score_1', true ) );
	if ( empty( $affistyle_rating_score ) ) {
		$affistyle_rating_score = floatval( get_post_meta( $affistyle_box_id, '_affistyle_rating_score', true ) );
	}
}

$affistyle_review_count = isset( $data['review_count'] ) ? $data['review_count'] : ( isset( $review_count ) ? $review_count : '' );
if ( empty( $affistyle_review_count ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_review_count = get_post_meta( $affistyle_box_id, '_affistyle_review_count_1', true );
	if ( empty( $affistyle_review_count ) ) {
		$affistyle_review_count = get_post_meta( $affistyle_box_id, '_affistyle_review_count', true );
	}
}

// Pros extraction.
$affistyle_raw_pros = isset( $data['pros'] ) ? $data['pros'] : ( ! empty( $pros ) ? $pros : ( ! empty( $pros_1 ) ? $pros_1 : '' ) );
if ( empty( $affistyle_raw_pros ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_raw_pros = get_post_meta( $affistyle_box_id, '_affistyle_pros_1', true );
	if ( empty( $affistyle_raw_pros ) ) {
		$affistyle_raw_pros = get_post_meta( $affistyle_box_id, '_affistyle_pros', true );
	}
}
$affistyle_pros_list = array();
if ( is_array( $affistyle_raw_pros ) ) {
	$affistyle_pros_list = array_filter( array_map( 'trim', $affistyle_raw_pros ) );
} elseif ( ! empty( $affistyle_raw_pros ) ) {
	$affistyle_pros_list = array_filter( array_map( 'trim', explode( "\n", $affistyle_raw_pros ) ) );
}

// Cons extraction.
$affistyle_raw_cons = isset( $data['cons'] ) ? $data['cons'] : ( ! empty( $cons ) ? $cons : ( ! empty( $cons_1 ) ? $cons_1 : '' ) );
if ( empty( $affistyle_raw_cons ) && ! $affistyle_is_preview && $affistyle_box_id ) {
	$affistyle_raw_cons = get_post_meta( $affistyle_box_id, '_affistyle_cons_1', true );
	if ( empty( $affistyle_raw_cons ) ) {
		$affistyle_raw_cons = get_post_meta( $affistyle_box_id, '_affistyle_cons', true );
	}
}
$affistyle_cons_list = array();
if ( is_array( $affistyle_raw_cons ) ) {
	$affistyle_cons_list = array_filter( array_map( 'trim', $affistyle_raw_cons ) );
} elseif ( ! empty( $affistyle_raw_cons ) ) {
	$affistyle_cons_list = array_filter( array_map( 'trim', explode( "\n", $affistyle_raw_cons ) ) );
}

// Compliance Attributes (Direct Safe Extraction).
$affistyle_link_target = class_exists( 'AffiStyle_Compliance' )
	? AffiStyle_Compliance::get_link_target( $affistyle_box_id )
	: '_blank';
$affistyle_link_rel    = class_exists( 'AffiStyle_Compliance' )
	? AffiStyle_Compliance::get_rel_attributes( $affistyle_box_id )
	: 'nofollow sponsored noopener';

$affistyle_sponsored_meta = $affistyle_box_id ? get_post_meta( $affistyle_box_id, '_affistyle_sponsored', true ) : '';
$affistyle_show_sponsored = isset( $data['sponsored'] ) ? ( '1' === (string) $data['sponsored'] || true === $data['sponsored'] ) : ( '' === $affistyle_sponsored_meta || '1' === (string) $affistyle_sponsored_meta );

$affistyle_card_data = isset( $data ) && is_array( $data ) ? $data : array(
	'id'           => $affistyle_box_id,
	'title'        => $affistyle_title,
	'image_url'    => $affistyle_image_url,
	'description'  => $affistyle_description,
	'destination'  => $affistyle_destination,
	'button_text'  => $affistyle_button_text,
	'badge_text'   => $affistyle_badge_text,
	'pros'         => $affistyle_pros_list,
	'cons'         => $affistyle_cons_list,
	'rating_score' => $affistyle_rating_score,
	'review_count' => $affistyle_review_count,
	'show_rating'  => $affistyle_show_rating,
);
?>

<div class="affistyle-card-wrapper affistyle-card-style-2 affistyle-card-lift"
	data-box-id="<?php echo esc_attr( $affistyle_box_id ); ?>"
	style="background: <?php echo esc_attr( $affistyle_bg_color ); ?>; border: 1px solid #e2e8f0; border-radius: 24px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); width: 100%; max-width: 420px; margin: 24px auto; overflow: hidden; box-sizing: border-box; font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; position: relative;">

	<!-- Top Image Header with Light Background & Top-Right Rating Badge -->
	<div style="background: #f4f7fa; padding: 24px; min-height: 220px; display: flex; align-items: center; justify-content: center; position: relative;"
		class="affistyle-zoom-media">
		<!-- Top Right Rating Badge -->
		<?php if ( $affistyle_show_rating && ! empty( $affistyle_rating_score ) ) : ?>
			<div style="position: absolute; top: 12px; right: 12px; z-index: 5;">
				<span
					style="background: #ffffff; border: 1px solid #e2e8f0; color: #0f172a; font-size: 11.5px; font-weight: 800; padding: 4px 10px; border-radius: 20px; display: inline-flex; align-items: center; gap: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.06);">
					<span style="color: #f59e0b;">★</span>
					<span><?php echo esc_html( number_format( $affistyle_rating_score, 1 ) ); ?></span>
					<?php if ( ! empty( $affistyle_review_count ) ) : ?>
						<span
							style="color: #64748b; font-size: 10.5px; font-weight: 500;">(<?php echo esc_html( $affistyle_review_count ); ?>)</span>
					<?php endif; ?>
				</span>
			</div>
		<?php endif; ?>

		<!-- Product Image -->
		<?php if ( ! empty( $affistyle_image_url ) ) : ?>
			<img src="<?php echo esc_url( $affistyle_image_url ); ?>" alt="<?php echo esc_attr( $affistyle_title ); ?>"
				style="max-height: 180px; max-width: 100%; object-fit: contain; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.08));" />
		<?php else : ?>
			<span class="dashicons dashicons-format-image" style="font-size: 48px; width: 48px; height: 48px; color: #94a3b8; display: flex; align-items: center; justify-content: center; opacity: 0.5;"></span>
		<?php endif; ?>
	</div>

	<!-- Card Body Content -->
	<div style="padding: 24px 20px; text-align: center;">

		<!-- Badge Text Pill (e.g. EDITOR'S CHOICE) -->
		<?php if ( ! empty( $affistyle_badge_text ) ) : ?>
			<div style="margin-bottom: 12px;">
				<span
					style="background: #ef4444; color: #ffffff; font-size: 10.5px; font-weight: 800; padding: 5px 14px; border-radius: 12px; text-transform: uppercase; letter-spacing: 0.05em; display: inline-block;">
					<?php echo esc_html( $affistyle_badge_text ); ?>
				</span>
			</div>
		<?php endif; ?>

		<!-- Product Title -->
		<h3 class="affistyle-card-title"
			style="font-size: 19px; font-weight: 900; color: #0f172a; margin: 0 0 10px 0; line-height: 1.35; letter-spacing: -0.3px;">
			<?php echo esc_html( $affistyle_title ); ?>
		</h3>

		<!-- Product Description -->
		<?php if ( ! empty( $affistyle_description ) ) : ?>
			<p class="affistyle-card-description"
				style="font-size: 13px; color: #64748b; line-height: 1.55; margin: 0 0 20px 0;">
				<?php echo esc_html( $affistyle_description ); ?>
			</p>
		<?php endif; ?>

		<!-- Pros Section -->
		<?php if ( ! empty( $affistyle_pros_list ) ) : ?>
			<div
				style="background: #ffffff; border: 1.5px solid #86efac; border-radius: 16px; padding: 16px; margin-bottom: 16px; position: relative; text-align: left;">
				<div style="text-align: center; margin-bottom: 12px;">
					<span
						style="background: #10b981; color: #ffffff; font-size: 10px; font-weight: 800; padding: 4px 12px; border-radius: 14px; display: inline-flex; align-items: center; gap: 4px; text-transform: uppercase; letter-spacing: 0.05em;">
						<span>✓</span>
						<span><?php esc_html_e( 'PROS', 'affistyle' ); ?></span>
					</span>
				</div>
				<div style="display: flex; flex-direction: column; gap: 8px;">
					<?php foreach ( $affistyle_pros_list as $affistyle_p_item ) : ?>
						<div
							style="display: flex; align-items: flex-start; gap: 8px; font-size: 13px; font-weight: 600; color: #1e293b; line-height: 1.4;">
							<span style="color: #16a34a; font-weight: 800;">✓</span>
							<span><?php echo esc_html( $affistyle_p_item ); ?></span>
						</div>
					<?php endforeach; ?>
				</div>
			</div>
		<?php endif; ?>

		<!-- Cons Section -->
		<?php if ( ! empty( $affistyle_cons_list ) ) : ?>
			<div
				style="background: #ffffff; border: 1.5px solid #fca5a5; border-radius: 16px; padding: 16px; margin-bottom: 20px; position: relative; text-align: left;">
				<div style="text-align: center; margin-bottom: 12px;">
					<span
						style="background: #ef4444; color: #ffffff; font-size: 10px; font-weight: 800; padding: 4px 12px; border-radius: 14px; display: inline-flex; align-items: center; gap: 4px; text-transform: uppercase; letter-spacing: 0.05em;">
						<span>✕</span>
						<span><?php esc_html_e( 'CONS', 'affistyle' ); ?></span>
					</span>
				</div>
				<div style="display: flex; flex-direction: column; gap: 8px;">
					<?php foreach ( $affistyle_cons_list as $affistyle_c_item ) : ?>
						<div
							style="display: flex; align-items: flex-start; gap: 8px; font-size: 13px; font-weight: 600; color: #1e293b; line-height: 1.4;">
							<span style="color: #dc2626; font-weight: 800;">✕</span>
							<span><?php echo esc_html( $affistyle_c_item ); ?></span>
						</div>
					<?php endforeach; ?>
				</div>
			</div>
		<?php endif; ?>

		<!-- Price Display -->
		<?php
		$affistyle_show_price_meta = $affistyle_box_id ? get_post_meta( $affistyle_box_id, '_affistyle_show_price', true ) : '';
		$affistyle_show_price      = isset( $show_price ) ? (bool) $show_price : ( isset( $data['show_price'] ) ? ( '1' === (string) $data['show_price'] || true === $data['show_price'] ) : ( '' === $affistyle_show_price_meta || '1' === (string) $affistyle_show_price_meta ) );
		if ( $affistyle_show_price && ! empty( $affistyle_price ) ) :
			?>
			<div class="affistyle-price-badge-vertical">
				<span class="affistyle-price-label"><?php esc_html_e( 'Price:', 'affistyle' ); ?></span>
				<span class="affistyle-price-value"><?php echo esc_html( $affistyle_price ); ?></span>
			</div>
		<?php endif; ?>

		<!-- CTA Button & Multi-Retailer Area -->
		<div style="margin-top: 10px;">
			<?php
			$affistyle_has_multi = class_exists( 'AffiStyle_Pro_Multi_Retailer' ) && AffiStyle_Pro_Multi_Retailer::has_multi_retailers( $affistyle_box_id, 1 );
			if ( $affistyle_has_multi ) :
				AffiStyle_Pro_Multi_Retailer::render_retailer_buttons( $affistyle_box_id, 1 );
			elseif ( ! empty( $affistyle_destination ) ) :
				?>
				<a href="<?php echo esc_url( $affistyle_destination ); ?>"
					class="affistyle-card-button affistyle-btn affistyle-btn-primary affistyle-track-click"
					data-post-id="<?php echo esc_attr( $affistyle_box_id ); ?>"
					data-box-id="<?php echo esc_attr( $affistyle_box_id ); ?>" data-product="1"
					style="background: <?php echo esc_attr( $affistyle_btn_color ); ?>; color: #ffffff; font-weight: 800; font-size: 14px; padding: 13px 24px; border-radius: 12px; width: 100%; display: block; text-align: center; text-decoration: none; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15); box-sizing: border-box; transition: all 0.2s ease;"
					target="<?php echo esc_attr( $affistyle_link_target ); ?>"
					rel="<?php echo esc_attr( $affistyle_link_rel ); ?>">
					<span><?php echo esc_html( $affistyle_button_text ); ?></span>
				</a>
			<?php endif; ?>
		</div>

		<?php if ( $affistyle_show_sponsored ) : ?>
			<!-- Sponsored Tag -->
			<div style="margin-top: 14px;">
				<span class="affistyle-card-sponsored"
					style="font-size: 10px; font-weight: 800; color: #94a3b8; text-transform: uppercase; letter-spacing: 0.08em;">
					<?php esc_html_e( 'SPONSORED', 'affistyle' ); ?>
				</span>
			</div>
		<?php endif; ?>
	</div>

	<?php
	if ( class_exists( 'AffiStyle_User_Rating' ) && isset( $affistyle_card_data ) ) {
		AffiStyle_User_Rating::render_schema_json_ld( $affistyle_card_data );
	}
	?>

</div>