@using Website.Client.Shared.Components.Badges
<div class="col bg-light rounded border-2 border @GetClass()" style="width: 350px; height: 150px; margin: 10px 10px 10px 10px;">
    <div class="d-flex align-items-center text-center" style="margin-top: -20px;">
        <div class="position-relative">
            <div class="weapon">
                <a href="/products/@Product.Id">
                    <img src="api/images/@Product.ImageId" width="85" height="85" class="rounded" />
                </a>            
            </div>
        </div>
        <div class="ms-1 text-center w-100" style="margin-bottom: -20px;">
            <div class="d-flex align-items-center justify-content-center">
                <a class="ms-2  text-decoration-none" href="/products/@Product.Id">
                    @Product.Name
                </a>
            </div>
            <div>
                <small class="text-muted">
                    Author: <a class="text-decoration-none" href="/users/@Seller.Id">@Seller.Name</a><VerifiedSellerBadge Seller="Seller" />
                </small> <br />
            </div>
            <div style="margin-top: -5px;">
                <ProductRating Product="Product" />
            </div>
        </div>

    </div>
    <div>
        <div class="mt-auto" style="height: 50px;">
            <small style="vertical-align: middle;">@Product.GetDescription()</small>
        </div>

        <div class="d-flex align-items-center justify-content-between mt-auto">
            <div>
                <small class="text-muted">
                    @if (Product.IsLoaderEnabled)
                    {
                        <span><i class="fas fa-server"></i> @Product.ServersCount</span>
                    } else
                    {
                        <span><i class="fas fa-download"></i> @Product.TotalDownloadsCount</span>
                    }
                </small>
            </div>
            <div>
                @if (Product.IsLoaderEnabled)
                {
                    <span class="small text-loader fw-bold">
                        Loader Required
                    </span>
                }
            </div>
            <div class="text-muted">
                <ProductPrice Product="Product" SingleLine="true" UsePricePrefix="true" />
            </div>
        </div>
    </div>
</div>

@code {
    [Parameter]
    public MProduct Product { get; set; }

    [Parameter]
    public Seller Seller { get; set; }

    public string GetClass()
    {
        if (Product.IsLoaderEnabled)
        {
            return "border-loader";
        }

        return string.Empty;
    }
}
