<div class="bestseller-section">
    <h2 class="bestseller-header"><?= ucfirst(lang($is_mobile ? 'header_newarrivals' : 'header_bestseller')); ?></h2>
    <div class="product-grid">
        <?php
        $products_to_display = $is_mobile ? $new_products : $top_seller_products;
        $counter = 0;
        $max = $is_mobile ? 5 : 7;
        foreach ($products_to_display as $product):
            if ($counter >= $max) break;
        ?>
            <div class="product-card">
                <a href="<?= base_url('product/' . $product['alias']) ?>" class="product-link">
                    <div class="product-image-container">
                        <div class="image-wrapper">
                            <?php if ($product['is_completely_sold_out']): ?>
                                <div class="soldout-wrapper">
                                    <img class="soldout-image" src="<?= base_url() . 'assets/frontend/img/soldout-new.png'; ?>" alt="Sold Out">
                                </div>
                            <?php elseif ($product['has_badges'] && !empty($product['badges'])): ?>
                                <div class="product-badges-container">
                                    <?php foreach ($product['badges'] as $badge): ?>
                                        <div class="product-badge priority-<?= $badge['priority'] ?> <?= $badge['css_class'] ?>"
                                            style="<?= $badge['style'] ?>">

                                            <?php if ($badge['has_icon'] && !empty($badge['icon'])): ?>
                                                <span class="badge-icon emoji"><?= $badge['icon'] ?></span>
                                            <?php endif; ?>

                                            <span class="badge-text"><?= htmlspecialchars($badge['name']) ?></span>
                                        </div>
                                    <?php endforeach; ?>
                                </div>
                            <?php endif; ?>

                            <img src="<?= base_url('uploads/product/' . $product['image']) ?>" alt="<?= $product['title'] ?>" class="product-image first_image" loading="lazy">
                            <img src="<?= base_url('uploads/product/' . $product['image_secondary']) ?>" alt="<?= $product['title'] ?>" class="product-image secondary-image" loading="lazy">
                        </div>
                    </div>
                    <div class="product-info">
                        <h3 class="product-title"><?= htmlspecialchars($product['title'], ENT_QUOTES, 'UTF-8') ?></h3>
                        <div class="product-price">
                            <div class="price-row">
                                <span class="current-price <?= $product['is_discounted'] ? 'discounted price-highlight' : '' ?>">
                                    IDR <?= number_format($product['current_price'], 0, ',', '.') ?>
                                </span>

                                <?php if (!empty($product['msrp_price'])): ?>
                                    <span class="msrp-price">
                                        MSRP: IDR <?= number_format($product['msrp_price'], 0, ',', '.') ?>
                                    </span>
                                <?php elseif ($product['original_price']): ?>
                                    <span class="original-price">
                                        IDR <?= number_format($product['original_price'], 0, ',', '.') ?>
                                    </span>
                                <?php endif; ?>
                            </div>

                            <?php if ($product['original_price']): ?>
                                <div class="savings-amount">
                                    <?= ucfirst(lang('save_up_to')) ?><?= number_format($product['savings_amount'], 0, ',', '.') ?> (<?= $product['discount_percentage'] ?>%)
                                </div>
                            <?php endif; ?>
                        </div>
                        <div class="rating-section">
                            <i class="fas fa-star"></i>
                            <span class="review-text"><?= $product['average_rating'] ?? '0'; ?> | <?= $product['total_reviews'] ?? '0'; ?> Reviews</span>
                        </div>
                </a>
                <form class="wishlist-form" data-is-wishlisted="<?= $product['is_wishlisted'] ? 'true' : 'false' ?>">
                    <input type="hidden" name="<?= $this->security->get_csrf_token_name(); ?>" value="<?= $this->security->get_csrf_hash(); ?>" />
                    <input type="hidden" name="product_id" value="<?= $product['id'] ?>">
                    <input type="hidden" name="product_detail_id" value="<?= $product['id_detail'] ?>">
                    <input type="hidden" name="variant" value="<?= $product['variants'][0] ?? 'No variants' ?>">
                    <button type="submit" class="wishlist-button">
                        <div class="heart-container">
                            <i class="<?= $product['is_wishlisted'] ? 'fas fa-heart filled-heart' : 'far fa-heart outline-heart' ?> active"></i>
                        </div>
                    </button>
                </form>
            </div>
            <form class="add-to-cart-form">
                <input type="hidden" name="<?= $this->security->get_csrf_token_name(); ?>" value="<?= $this->security->get_csrf_hash(); ?>" />
                <input type="hidden" name="product_id" value="<?= $product['id'] ?>">
                <input type="hidden" name="product_detail_id" value="<?= $product['id_detail'] ?>">
                <input type="hidden" name="product_variant" value="<?= $product['variants'][0] ?? 'No variants' ?>">
                <input type="hidden" name="product_name" value="<?= htmlspecialchars($product['title'], ENT_QUOTES, 'UTF-8') ?>">
                <input type="hidden" name="product_image" value="<?= base_url('uploads/product/' . $product['image']) ?>">
                <input type="hidden" name="qty" value="1">
                <input type="hidden" name="price" value="<?= $product['current_price'] ?>">
                <input type="hidden" name="attribute_detail_id" value="<?= $product['attribute_detail_id'] ?>">
                <input type="hidden" name="sku" value="<?= $product['sku'] ?>">
                <button type="submit" class="add-to-cart-button">
                    <i data-feather="shopping-cart" class="shopping-cart-icon"></i>
                    Add to Cart
                </button>
            </form>
    </div>
<?php
            $counter++;
        endforeach;
?>
<?php
$site_lang = $this->session->userdata('site_lang');
$image_src = ($site_lang == 'english')
    ? 'https://storage.googleapis.com/laciasmara-photos/laciaasmara_assets/laciasmara_best_seller/see-all-eng.webp'
    : 'https://storage.googleapis.com/laciasmara-photos/laciaasmara_assets/laciasmara_best_seller/see-all-eng.webp';
$alt_text = ($site_lang == 'english') ? 'See All' : 'Lihat Semua';
$onclick_function = $is_mobile ? 'redirectToNewArrivals()' : 'redirectToBestSeller()';
?>
<div class="product-card see-all-button" onclick="<?= $onclick_function ?>">
    <img src="<?= $image_src ?>" alt="<?= $alt_text ?>" class="see-all-image">
</div>
</div>
</div>