<?php
defined('ABSPATH') || exit;

global $product;

// Ensure $product is valid
if (!$product || !$product->is_visible()) {
    return;
}

// Get category information
$category_ids = $product->get_category_ids();
$first_category = null;

if (!empty($category_ids)) {
    $first_category_id = $category_ids[0];
    $category = get_term($first_category_id, 'product_cat');

    if (!is_wp_error($category)) {
        $first_category = [
            'title' => $category->name,
            'link' => get_term_link($first_category_id, 'product_cat')
        ];
    }
}
?>
<div class="product-tech d-flex flex-column position-relative h-100">
    <div class="bg position-absolute top-0 end-0 w-100 h-100">
        <span class="position-absolute"></span>
    </div>
    <a href="<?= get_permalink( $product->get_id() ); ?>" class="image mx-auto">
        <img src="<?php if (get_the_post_thumbnail_url()): ?><?php the_post_thumbnail_url('full'); ?><?php else: ?><?php echo wc_placeholder_img_src(); ?><?php endif; ?>"
            alt="<?php
$product_name = $product->get_name();
$show_full_titles = kaveh_get_option('kaveh_product_title_display', false);
if ($show_full_titles) {
    echo esc_attr($product_name);
} else {
    if ( wp_is_mobile() ) {
        echo esc_attr(wp_trim_words( $product_name, 5, '...' ));
    } else {
        echo esc_attr(wp_trim_words( $product_name, 8, '...' ));
    }
}
?>" width="141" height="170"
            class="d-block mx-auto w-auto">
    </a>
    <h2 class="title text-center overflow-hidden">
        <a href="<?= get_permalink( $product->get_id() ); ?>"> <?php
$product_name = $product->get_name();
$show_full_titles = kaveh_get_option('kaveh_product_title_display', false);
if ($show_full_titles) {
    echo esc_html($product_name);
} else {
    if ( wp_is_mobile() ) {
        echo wp_trim_words( $product_name, 5, '...' );
    } else {
        echo wp_trim_words( $product_name, 8, '...' );
    }
}
?> </a>
    </h2>
    <?php if ($first_category): ?>
    <a href="<?php echo esc_url($first_category['link']); ?>" class="category d-block mx-auto text-center mt-auto"> <?php echo esc_html($first_category['title']); ?> </a>
    <?php endif; ?>

    <ul class="color d-flex align-items-center justify-content-center flex-wrap">
        <li style="background-color: #6297FF;"></li>
        <li style="background-color: #676767;"></li>
        <li style="background-color: #D2E4D9;"></li>
    </ul>
    <div class="price d-flex align-items-center gap-1 gap-md-2 gap-xl-3 flex-wrap">
        <div class="d-flex flex-column">
        <?php
        // Use WooCommerce's built-in price HTML output
        $price_html = $product->get_price_html();
        // If we have price HTML (not empty)
        if ($price_html) {
            echo $price_html;
        }
        ?>
        </div>
    </div>
    <?php
$product_id = $product->get_id();
$product_type = $product->get_type();
$is_purchasable = $product->is_purchasable() && $product->is_in_stock();

// Base classes (always include these)
$add_to_cart_classes = [
    'btn-add-to-cart',
    'd-flex',
    'align-items-center',
    'justify-content-center',
    'position-absolute'
];

// Additional WooCommerce classes
$wc_classes = [
    'product_type_' . $product_type,
    $is_purchasable ? 'add_to_cart_button' : '',
    ($product_type === 'simple' && $product->supports('ajax_add_to_cart') && $is_purchasable) ? 'ajax_add_to_cart' : ''
];

// Merge all classes and remove empty ones
$all_classes = array_merge($add_to_cart_classes, array_filter($wc_classes));
?>

<a href="<?php echo esc_url($is_purchasable ? ($product_type === 'variable' ? $product->get_permalink() : $product->add_to_cart_url()) : $product->get_permalink()); ?>"
   <?php if ($is_purchasable && $product_type === 'simple') : ?>
       data-product_id="<?php echo esc_attr($product_id); ?>"
       data-product_sku="<?php echo esc_attr($product->get_sku()); ?>"
       data-quantity="1"
   <?php endif; ?>
   aria-label="<?php echo esc_attr($product->add_to_cart_description()); ?>"
   class="<?php echo esc_attr(implode(' ', $all_classes)); ?>">
    <i class="isax isax-bag lh-1"></i>
</a>
</div>