<div class="contact" [class.border-top]="borderTop">
    <kendo-avatar
    [imageSrc]="product.urlImage"
    shape="circle"
    [width]="40"
    [height]="40"
  >
  </kendo-avatar>
  <a class="contact-details" (click)="selectProduct()" > <!-- href='/#/product-list/product/{{product.idProduct}} (click)="selectProduct()"' -->
    <div class="contact-name">{{ product.title }}</div>
    <div class="contact-email">{{ product.brand }}</div>
    <div class="price">
      {{ product.salePrice | currency }}
    </div>
  </a>
  <span
    *ngIf="product.listPrice - product.salePrice > 0.01"
    class="badge rounded-pill text-white mt-2 me-2 position-absolute end-0 messages-label"
    style="opacity: 0.6; background-color: #fd7e14"
    title="{{ product.offPercent }}% de desconto sobre preço a prazo"
    >{{ product.offPercent | number: "1.0-0" }}% Off</span
  >
</div>
