<?php

defined( 'ABSPATH' ) || exit;

global $product;

$product_id = get_the_ID();

$shop_meta = get_post_meta($post->ID, 'glowify_wp_shop_options', true) ?: [];
$shop_layout = $shop_meta['shop_layout'] ?? 'style-1'; 

$enable_voucher = $shop_meta['enable_voucher'] ?? false;
$voucher_heading = $shop_meta['voucher_heading'] ?? '';       
$voucher_desc = $shop_meta['voucher_desc'] ?? '';      
$voucher_list = $shop_meta['voucher_list'] ?? [];  
$product_features = $shop_meta['product_features'] ?? [];
$product_use = $shop_meta['product_use'] ?? [];


$regular_price = (float) $product->get_regular_price();
$sale_price    = (float) $product->get_sale_price();
$price_html    = $product->get_price_html();

$has_discount = $product->is_on_sale() && $regular_price > $sale_price;
$discount_percent = 0;
if ( $has_discount ) {
	$discount_percent = round( ( ( $regular_price - $sale_price ) / $regular_price ) * 100 );
}



$enable_social_share = glowify_wp_option('enable_social_share') ?? true; 
$social_title  = glowify_wp_option('social_title') ?? '';         
$social_list = glowify_wp_option('social_list') ?? [];

// Get the first product category
$terms = get_the_terms( $product->get_id(), 'product_cat' );
$category_name = !empty($terms) ? $terms[0]->name : '';

// Get rating
$average_rating = $product->get_average_rating();
$review_count   = $product->get_review_count();

// Get total sales
$total_sales = $product->get_total_sales();
$total_sales_display = $total_sales >= 1000 ? round($total_sales / 1000, 1) . 'K' : $total_sales;


?>	
    <!-- Start Product Details -->
	<div class="container">
		<div class="cs_height_45 cs_height_lg_45"></div>
		<ol class="breadcrumb cs_fs_18 mb-0">
			<li class="breadcrumb-item"><a href="<?php echo esc_url( home_url() ); ?>"><?php esc_html_e('Home','glowify-wp');?></a></li>
			<li class="breadcrumb-item">
				<a href="<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>"><?php esc_html_e('Shop','glowify-wp');?></a>
			</li>
			<li class="breadcrumb-item active"><?php the_title(); ?></li>
		</ol>
		<div class="cs_height_45 cs_height_lg_45"></div>
		
		
		<?php if($shop_layout == 'style-1' OR  $shop_layout == 'style-2') :?>
			<?php get_template_part( 'woocommerce/theme-part/product-detail-upper' ); ?>
		<?php elseif($shop_layout == 'style-3') :?>
			<?php get_template_part( 'woocommerce/theme-part/product-detail-upper-v2' ); ?>
		<?php else :?>
			<?php get_template_part( 'woocommerce/theme-part/product-detail-upper-v3' ); ?>
		<?php endif;?>


		<div class="cs_height_80 cs_height_lg_50"></div>
		<?php if($shop_layout == 'style-1' ) :?>
			<div class="cs_tabs">
		<?php else :?>
			<div class="cs_tabs cs_type_1 cs_gray_bg">
		<?php endif;?>
			<ul class="cs_tab_links cs_style_1 cs_mp_0 cs_fs_24 cs_medium cs_gray_bg">
				<li class="active"><a href="#tab_1"><?php esc_html_e('Description', 'glowify-wp');?></a></li>
				<li><a href="#tab_2"><?php esc_html_e('Ingredients', 'glowify-wp');?></a></li>
				<li><a href="#tab_3"><?php esc_html_e('How to Use', 'glowify-wp');?></a></li>
			</ul>
			<?php if($shop_layout == 'style-1' ) :?>
			<div class="cs_height_30 cs_height_lg_30"></div>
			<?php endif;?>

			<div class="cs_tab_body cs_light">
				<div class="cs_tab active" id="tab_1">
					<?php echo get_the_content();?>
				</div>
				<?php if (!empty($product_features) ): ?>
				<div class="cs_tab" id="tab_2">
					<ul class="cs_product_desc_list cs_light cs_mp_0">
						<?php foreach ($product_features as $p_feature):?>
						<li><b><?php echo esc_html($p_feature['title']);?></b> <?php echo esc_html($p_feature['desc']);?></li>
						<?php endforeach;?>
					</ul>
				</div>
				<?php endif;?>
				<?php if (!empty($product_use) ): ?>
				<div class="cs_tab" id="tab_3">
					<ul class="cs_product_desc_list cs_light cs_mp_0">
						<?php foreach ($product_use as $p_use):?>
						<li><?php echo esc_html($p_use['title']);?></li>
						<?php endforeach;?>
					</ul>
				</div>
				<?php endif;?>
			</div>
		</div>
		<div class="cs_height_60 cs_height_lg_50"></div>
		
		
	</div>
	<!-- End Product Details -->
							
	<div class="cs_product_comments_review <?php echo esc_attr($shop_layout);?>">
		<div class="container">
			<?php if($shop_layout == 'style-2' ) :?>
			<div class="cs_sort_by_wrap p-0">
				<div class="cs_sort_by_title">
					<?php esc_html_e('All Comments', 'glowify-wp');?>
				</div>
			</div>
			<div class="cs_height_30 cs_height_lg_30"></div>
			<?php endif;?>
			<div class="row">
							
				<div class="col-12 cs_product_review_1">
					<?php
					// Get all reviews grouped by rating
					$ratings = array(1 => 0, 2 => 0, 3 => 0, 4 => 0, 5 => 0);
					$comments = get_comments(['post_id' => $product->get_id(), 'status' => 'approve']);
					foreach ($comments as $comment) {
						$rating = intval(get_comment_meta($comment->comment_ID, 'rating', true));
						if ($rating >= 1 && $rating <= 5) {
							$ratings[$rating]++;
						}
					}

					// Calculate percentage for each rating
					$total = array_sum($ratings);
					$percentages = array_map(function($count) use ($total) {
						return $total > 0 ? round(($count / $total) * 100) : 0;
					}, $ratings);
					?>

					<div class="cs_review_card_wrap_1">
						<div class="cs_review_card_1">
							<div class="cs_review_card_left">
								<h3 class="cs_secondary_font cs_medium cs_fs_24 mb-0"><?php esc_html_e('Reviews', 'glowify-wp');?></h3>
								<div class="cs_height_10 cs_height_lg_10"></div>
								<p class="cs_fs_70 cs_medium cs_primary_color mb-0"><?php echo number_format($average_rating, 1); ?>/5</p>
								<div class="cs_height_24 cs_height_lg_24"></div>
								<div class="cs_averate_rating_wrap_1">
									<div class="cs_rating" data-rating="<?php echo esc_attr($average_rating); ?>">
										<div class="cs_rating_percentage" style="width: <?php echo ($average_rating / 5) * 100; ?>%;"></div>
									</div>
									<div class="cs_rating_number cs_ternary_color cs_fs_18">
										<span class="cs_fs_18 cs_primary_color"><?php echo $review_count; ?></span>
										<span class="cs_fs_14 cs_ternary_color cs_light"><?php esc_html_e('Reviews', 'glowify-wp');?></span>
									</div>
								</div>
							</div>
							<div class="cs_review_card_right">
								<ul class="cs_review_list cs_light cs_primary_color cs_mp_0">
									<?php for ($i = 5; $i >= 1; $i--): ?>
									<li>
										<span><?php echo $i; ?></span>
										<i class="fa-solid fa-star cs_accent_color"></i>
										<div class="cs_progress" data-progress="<?php echo $percentages[$i]; ?>">
											<div class="cs_progress_in" style="width: <?php echo $percentages[$i]; ?>%;"></div>
										</div>
										<span><?php echo $ratings[$i]; ?></span>
									</li>
									<?php endfor; ?>
								</ul>
							</div>
						</div>
					</div>
					

					<div class="cs_height_75 cs_height_lg_50"></div>
				

				</div>						



				<?php
				$comments = get_comments([
					'post_id' => $product->get_id(),
					'status'  => 'approve',
					'type'    => 'review',
					'number'  => 5, // You can paginate or change this
				]);

				if ( $comments ): ?>
				<div class="col-12  cs_product_review_2">
					<?php if($shop_layout == 'style-1' ) :?>
					<div class="cs_sort_by_wrap p-0">
						<div class="cs_sort_by_title">
							<?php esc_html_e('All Comments', 'glowify-wp');?>
						</div>
					</div>
					<div class="cs_height_30 cs_height_lg_30"></div>
					<?php endif;?>

					<ul class="cs_product_review_list cs_mp_0">
						<?php foreach ( $comments as $comment ) :
							$rating = intval(get_comment_meta( $comment->comment_ID, 'rating', true ));
							$author = $comment->comment_author;
							$date = date_i18n( 'F j, Y', strtotime( $comment->comment_date ) );
							$content = esc_html( $comment->comment_content );
							?>
							<li>
								<div class="cs_product_review cs_light">
									<div class="cs_product_review_info">
										<div class="cs_product_review_media">
											<img src="<?php echo get_avatar_url( $comment->user_id, ['size' => 64] ); ?>" alt="Avatar">
											<div class="cs_product_review_media_right">
												<h3 class="cs_secondary_font cs_fs_16 cs_medium"><?php echo esc_html( $author ); ?></h3>
												<div class="cs_product_ratings">
													<div class="cs_rating" data-rating="<?php echo esc_attr($rating); ?>">
														<div class="cs_rating_percentage" style="width: <?php echo ($rating / 5) * 100; ?>%;"></div>
													</div>
													<div class="cs_rating_number cs_ternary_color cs_fs_14">
														<span>(<?php echo $rating; ?>/5)</span>
													</div>
												</div>
											</div>
										</div>
										<div class="cs_product_review_date cs_fs_14"><?php echo esc_html( $date ); ?></div>
									</div>
									<div class="cs_product_review_text"><?php echo $content; ?></div>
								</div>
							</li>
						<?php endforeach; ?>
					</ul>
				</div>
				<?php endif; ?>

			</div>

			<div class="cs_height_75 cs_height_lg_50"></div>
			
			<div class="row">
				<div class="col-12">
					<div class="cs_review_form">
							<?php
								if ( comments_open() && wc_review_ratings_enabled() ) {
									comments_template();
								}
							?>
					</div>
				</div>	
			</div>

		</div>
	</div>

	

	<?php wc_get_related_products( $product_id, $limit = 4 ) ?>

	<!-- Start Related Products -->
	<div class="cs_height_120 cs_height_lg_70"></div>

	<?php

	if ( ! $product ) {
	return;
	}

	$related_ids = wc_get_related_products( $product->get_id(), 5 );

	if ( ! empty( $related_ids ) ) :
	$related_query = new WP_Query([
		'post_type' => 'product',
		'post__in' => $related_ids,
		'posts_per_page' => 5,
		'orderby' => 'rand'
	]);

	if ( $related_query->have_posts() ) :
	?>
	<div class="container">
		<h2 class="cs_fs_36 cs_medium cs_secondary_font">
		<?php esc_html_e('Related Products', 'glowify-wp'); ?>
		</h2>
		<div class="cs_grid_5_column cs_products_view cs_style_1">

		<?php while ( $related_query->have_posts() ) : $related_query->the_post(); global $product; ?>
			<div class="cs_grid_col">
			<div class="cs_product_card cs_style_1 cs_radius_12">
				<div class="cs_product_card_in">
					<div class="cs_product_thumb cs_center">
						<img src="<?php echo get_the_post_thumbnail_url(get_the_ID(), 'full');?>" alt="Product">
						<div class="cs_products_btns cs_products_custom_btn">
							<?php
								do_action( 'woocommerce_after_shop_loop_item' );
							?>

							<button class="cs_like_btn cs_center cs_accent_color add_to_wishlist" data-product-id="<?php echo get_the_ID(); ?>">
								<svg width="20" height="18" viewBox="0 0 20 18" fill="none" xmlns="http://www.w3.org/2000/svg">
									<path d="M10 17.8873C9.71527 17.8873 9.44077 17.7842 9.22684 17.5968C8.41888 16.8903 7.63992 16.2264 6.95267 15.6408L6.94916 15.6377C4.93423 13.9207 3.19427 12.4378 1.98364 10.9771C0.630341 9.34409 0 7.79578 0 6.10434C0 4.46097 0.563507 2.94485 1.58661 1.83508C2.62192 0.712189 4.04251 0.09375 5.58716 0.09375C6.74164 0.09375 7.79892 0.45874 8.72955 1.1785C9.19922 1.54181 9.62494 1.98645 10 2.5051C10.3752 1.98645 10.8008 1.54181 11.2706 1.1785C12.2012 0.45874 13.2585 0.09375 14.413 0.09375C15.9575 0.09375 17.3782 0.712189 18.4135 1.83508C19.4366 2.94485 20 4.46097 20 6.10434C20 7.79578 19.3698 9.34409 18.0165 10.9769C16.8059 12.4378 15.0661 13.9205 13.0515 15.6374C12.363 16.224 11.5828 16.8889 10.773 17.5971C10.5592 17.7842 10.2846 17.8873 10 17.8873ZM5.58716 1.26532C4.37363 1.26532 3.25882 1.74963 2.44781 2.62915C1.62476 3.52194 1.17142 4.75607 1.17142 6.10434C1.17142 7.52692 1.70013 8.79919 2.88559 10.2296C4.03137 11.6122 5.73563 13.0645 7.70889 14.7462L7.71255 14.7492C8.4024 15.3371 9.18442 16.0036 9.99832 16.7153C10.8171 16.0023 11.6003 15.3347 12.2916 14.7458C14.2647 13.0642 15.9688 11.6122 17.1146 10.2296C18.2999 8.79919 18.8286 7.52692 18.8286 6.10434C18.8286 4.75607 18.3752 3.52194 17.5522 2.62915C16.7413 1.74963 15.6264 1.26532 14.413 1.26532C13.524 1.26532 12.7078 1.54791 11.9872 2.10516C11.3449 2.60199 10.8975 3.23004 10.6352 3.66949C10.5003 3.89548 10.2629 4.03036 10 4.03036C9.73709 4.03036 9.49966 3.89548 9.36478 3.66949C9.10263 3.23004 8.65524 2.60199 8.01285 2.10516C7.29218 1.54791 6.47598 1.26532 5.58716 1.26532Z"
									fill="currentColor"></path>
								</svg>
								<svg width="21" height="19" viewBox="0 0 21 19" fill="none" xmlns="http://www.w3.org/2000/svg">
									<path d="M10.4135 18.6287C10.1288 18.6287 9.85431 18.5255 9.64038 18.3381C8.83243 17.6317 8.05347 16.9677 7.36621 16.3821L7.3627 16.3791C5.34778 14.662 3.60782 13.1791 2.39719 11.7184C1.04388 10.0854 0.413544 8.53711 0.413544 6.84567C0.413544 5.2023 0.977051 3.68619 2.00015 2.57642C3.03546 1.45352 4.45605 0.835083 6.0007 0.835083C7.15518 0.835083 8.21246 1.20007 9.1431 1.91983C9.61276 2.28314 10.0385 2.72778 10.4135 3.24643C10.7888 2.72778 11.2143 2.28314 11.6841 1.91983C12.6148 1.20007 13.6721 0.835083 14.8265 0.835083C16.371 0.835083 17.7918 1.45352 18.8271 2.57642C19.8502 3.68619 20.4135 5.2023 20.4135 6.84567C20.4135 8.53711 19.7834 10.0854 18.4301 11.7183C17.2194 13.1791 15.4796 14.6618 13.465 16.3788C12.7765 16.9653 11.9963 17.6303 11.1866 18.3384C10.9728 18.5255 10.6981 18.6287 10.4135 18.6287ZM6.0007 6.84567C4.78717 6.84567 7.311 5.62048 6.5 6.5C5.67694 7.39279 13.465 3.42343 13.465 4.7717C13.465 6.19427 17.6416 7.48105 18.8271 8.91141C19.9729 10.294 12.8533 11.9751 14.8265 13.6568L13.465 14.8386C14.1548 15.4266 11.8651 14.8386 11.0488 15.5495C11.8676 14.8365 9.80878 16.5888 10.5 16C12.4731 14.3183 12.3192 15.0394 13.465 13.6568C14.6503 12.2264 15.5 8.92258 15.5 7.5C15.5 6.15173 14.2881 7.73846 13.465 6.84567C12.6541 5.96616 12.2621 4.41083 11.0488 4.41083C10.1598 4.41083 13.1214 2.28925 12.4007 2.8465C11.7585 3.34332 11.3111 3.97137 11.0488 4.41083C11.3117 4.41083 10.9139 4.63681 11.0488 4.41083C10.7859 4.41083 9.91321 4.63681 9.77832 4.41083C9.51617 3.97137 12.3265 4.49683 11.6841 4C13.6696 7.99918 6.88953 6.84567 6.0007 6.84567Z"
									fill="currentColor"></path>
								</svg>
							</button>
						</div>
					</div>
					<div class="cs_product_info">
						<div class="cs_product_category text-uppercase cs_fs_14 cs_light">
							<?php echo wc_get_product_category_list( get_the_ID() ); ?>
						</div>
						<h2 class="cs_product_title cs_fs_18 cs_normal cs_secondary_font">
							<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
						</h2>
						<p class="cs_product_price cs_fs_24 cs_primary_color cs_medium">
							<?php echo $product->get_price_html(); ?>
						</p>
						<div class="cs_product_ratings">
							<?php
								$rating = $product->get_average_rating();
								$count = $product->get_rating_count();
							?>
							<div class="cs_rating" data-rating="<?php echo esc_attr($rating); ?>">
								<div class="cs_rating_percentage" style="width: <?php echo ($rating / 5) * 100; ?>%;"></div>
							</div>
							<div class="cs_rating_number cs_ternary_color cs_fs_14 cs_light">
								<span>(<?php echo number_format($rating, 1); ?>/5)</span>
								<span> | <?php echo $count; ?> <?php esc_html_e('Reviews', 'glowify-wp');?></span>
							</div>
						</div>
					</div>
				</div>
				<a href="<?php the_permalink(); ?>" class="cs_product_link"></a>
			</div>
			</div>
		<?php endwhile; ?>

		</div>
	</div>
	<div class="cs_height_120 cs_height_lg_70"></div>
	<!-- End Related Products -->

	<?php endif; wp_reset_postdata(); endif; ?>