@props(['product'])

<div class="product-box product-card-fixed">
    <div class="img-wrapper">
        <div class="front">
            <a href="{{ route('product.show', $product->id) }}"><img src="{{ $product->image_path }}" class="img-fluid product-image-fixed" alt="{{ $product->title }}"></a>
            <div>
                <a href="#" data-bs-toggle="modal" data-bs-target="#quick-view" class="add_hover add_search" title="Quick View">
                    <i class="ti-search" aria-hidden="true"></i>
                </a>
                <a href="#" title="Wish list" class="add_hover add_wish"><i class="ti-heart" aria-hidden="true"></i></a>
                <a href="#" title="Add to cart" class="add_hover"><i class="ti-shopping-cart" aria-hidden="true"></i></a>
            </div>
        </div>
    </div>
    <div class="product-detail product-detail-fixed">
        <div class="rating">
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
            <i class="fa fa-star"></i>
        </div>
        <a href="{{ route('product.show', $product->id) }}"><h6 class="product-title-fixed">{{ Str::limit($product->title, 35) }}</h6></a>
        <p class="product-description-fixed">
            {{ Str::limit($product->description, 80) }}
        </p>
        <h4>${{ $product->default_price }}</h4>
    </div>
</div>