<div class="col-12 h-card">
  <div  class="row">
      <div class="col-5">
          <img *ngIf="cardModel.imageURL" class="h-card-image" src="{{ cardModel.imageURL }}" alt="Card image cap"/>
        </div>
        <div class="col-7 h-card-content">
            <div class="white-text">
                {{ cardModel?.carName }}

                  <h3>
                    {{ cardModel?.amount | number: "1.2-2" }}
                    <span class="card-w-text-gray">{{ cardModel?.currency }}</span>
                    <span class="card-w-text-gray" *ngIf="cardModel?.selectedFinancingOption"> {{ " " + cardModel?.paymentType }} </span>
                  </h3>

                  <div class="row">
                    <div class="col-4">
                        <label>Selected Financing Option</label>
                        {{ cardModel?.selectedFinancingOption }}
                    </div>
                    <div class="col-4">
                        <label>Dealer</label>
                        {{ cardModel?.dealer }}
                    </div>
                    <div class="col-4">
                        <label>Estimated Delivery</label>
                        {{ cardModel?.estDeliveryDate | date: "dd/MMM/yyyy" }}
                    </div>
                  </div>

                <ng-container *ngIf="!cardModel.selectedFinancingOption">
                  <p class="empty-space-fill"></p>
                </ng-container>
                <div class="row">
                  <div class="col-6 col-btn">
                    <button
                      mdbBtn
                      type="button"
                      color="white"
                      outline="true"
                      mdbWavesEffect
                      class="btn-comment btn-space-right"
                      *ngIf="cardModel?.chatEnabled"
                    >
                      <i class="fa fa-comment" aria-hidden="true"></i>
                    </button>
                    <button
                      *ngIf="cardModel?.carSummaryEnabled"
                      mdbBtn
                      type="button"
                      color="white"
                      outline="true"
                      mdbWavesEffect
                      class="btn-car"
                      routerLink="{{ '/carsummary/' + cardModel.id }}"
                    >
                      <i class="fa fa-car" aria-hidden="true"></i> &nbsp; Car Summary
                    </button>
                  </div>
            
                  <div class="col-6 col-btn text-right" *ngIf="cardModel?.actionLabel">
                    <button
                      mdbBtn
                      type="button"
                      mdbWavesEffect
                      class="btn-checkout split-dropdown-button"
                      (click)="ActionMethod(cardModel?.actionMethodCallbackValues)"
                    >
                      <i [className]="cardModel?.actionIcon" aria-hidden="true"></i> &nbsp;
                      {{ cardModel?.actionLabel }}
                    </button>
                  </div>
                </div>
              </div>
          
        </div>
  </div>
  

  

</div>
