@if(isset($invoice) && count($invoice))
@foreach($invoice as $key => $value)
    
<div class="buttonhover-box brdrno ">

   <div class="producthover-box" id="addinvoice" style="display: block;" wfd-invisible="true">
  @if ($loop->first)
       <h4 style="display: block;" id="addToInvoiceDiv" class="font-15 font-bold text-blue mt-4 mb-4" wfd-invisible="true">Add to invoice</h4>

        @endif

      <div class="row invoiceProductDiv  product_div_{{$value->id ?? ""}} ">
         <div class="col-lg-12 col-md-12">
            <div class="productbox-cartarea ">
            <input type="hidden" name="product_ids[]" value="{{$value->id ?? ""}}" class="product_ids">
               <a class="  remove_product" data-id="{{$value->id ?? ""}}"><img src="{{asset("assets/images/close-img.svg")}}" alt="" class="img-fluid closeimg mCS_img_loaded"></a>
               <div class="row align-items-center">
                  <div class="col-sm-3 syruptop"> <img 
                  style="width: 100px !important;"
                   src="{{$value->file ?? ""}}" 
                   class="mCS_img_loaded" alt="..."> 
                   </div>
                  <div class="col-sm-9 pl-xl-0">
                     <div class="singlebox-text">
                        <div class="row">
                           <div class="col-sm-9">
                              <h5 class="mt-0 font-15 text-left">{{$value->product_name ?? ""}} </h5>
                           </div>
                           <div class="col-sm-3">
                              <div class="addcart-rarea">
                                 <h5 class="font-15">${{number_format($value->total, 2)}}</h5>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="singlebox-text">
                        <div class="row">
                           <div class="col-sm-8">
                              <h5 class="mt-0 font-400 text-left">Item code: {{$value->product_code ?? ""}}</h5>
                           </div>
                           <div class="col-sm-4">
                              <div class="addcart-rarea">
                                 <h5 class="font-400 ">Repeats: <span>{{ucwords($value->repeats_allowed ?? "")}}</span></h5>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="singlebox-text">
                        <div class="row">
                           <div class="col-sm-9">
                              <p class="mb-0">{{$value->suggested_use ?? ""}}</p>
                           </div>
                           <div class="col-sm-3">
                              <div class="addcart-rarea">
                                 <h5 class="font-400">Qty: <span>{{$value->quantity ?? ""}}</span></h5>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

@endforeach
@endif


@if(isset($recommended) && count($recommended))
@foreach($recommended as $key => $value)
<div class="buttonhover-box brdrno">

   <div class="producthover-box" id="addinvoice" style="display: block;" wfd-invisible="true">
     @if ($loop->first)
      <h4 style="display: block;" id="addToInvoiceDiv" class="font-15 font-bold text-blue mt-4 mb-4" wfd-invisible="true">Recommend to client</h4>
      @endif
      <div class="row invoiceProductDiv  product_div_{{$value->id ?? ""}} ">
         <div class="col-lg-12 col-md-12">
            <div class="productbox-cartarea ">
            <input type="hidden" name="product_ids[]" value="{{$value->id ?? ""}}" class="product_ids">
               <a class="  remove_product" data-id="{{$value->id}}"><img src="{{asset("assets/images/close-img.svg")}}" alt="" class="img-fluid closeimg mCS_img_loaded"></a>
               <div class="row align-items-center">
                  <div class="col-sm-3 syruptop"> <img 
                  style="width: 100px !important;"
                   src="{{$value->file ?? ""}}" 
                   class="mCS_img_loaded" alt="..."> 
                   </div>
                  <div class="col-sm-9 pl-xl-0">
                     <div class="singlebox-text">
                        <div class="row">
                           <div class="col-sm-9">
                              <h5 class="mt-0 font-15 text-left">{{$value->product_name ?? ""}} </h5>
                           </div>
                           <div class="col-sm-3">
                              <div class="addcart-rarea">
                                 <h5 class="font-15"> ${{number_format($value->total, 2)}}</h5>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="singlebox-text">
                        <div class="row">
                           <div class="col-sm-8">
                              <h5 class="mt-0 font-400 text-left">Item code: {{$value->product_code ?? ""}}</h5>
                           </div>
                           <div class="col-sm-4">
                              <div class="addcart-rarea">
                                 <h5 class="font-400 ">Repeats: <span>{{ucwords($value->repeats_allowed ?? "")}}</span></h5>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="singlebox-text">
                        <div class="row">
                           <div class="col-sm-9">
                              <p class="mb-0">{{$value->suggested_use ?? ""}}</p>
                           </div>
                           <div class="col-sm-3">
                              <div class="addcart-rarea">
                                 <h5 class="font-400">Qty: <span>{{$value->quantity ?? ""}}</span></h5>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>

@endforeach
@endif