@extends('emails.layout.email')
   @section('content')
       <div class="row">
           <div class="col">
               <div class="body">
                   <h3 class="text-center">Apreciable estudiante: <span
                           style="color: rgb(14, 49, 129)">{{ $full_name }}</span></h3>
                   <h4 class="text-center">Se ha realizado el siguiente pago en la ventanilla:</h4>

                   <div class="text-center mx-auto" style="overflow-x:auto;">
                       <table class="text-center" style="width: 100%; max-width: 600px; border-collapse: collapse;">
                           <thead>
                               <tr>
                                   <th colspan="2" class="ead"
                                       style="background-color: #3B4C6A; color:white; border: 1px solid #ddd; border-bottom: none; padding-top: 3px; padding-bottom: 3px;">
                                       <strong>CONCEPTOS PAGADOS</strong>
                                   </th>
                               </tr>
                               <tr>
                                   <th style="font-weight: bold; width: 65%; border: 1px solid #ddd; border-top: none;">
                                       CONCEPTO</th>
                                   <th style="font-weight: bold; width: 35%; border: 1px solid #ddd; border-top: none;">
                                       TOTAL</th>
                               </tr>
                           </thead>
                           <tbody>
                               @foreach ($data as $item)
                                   <tr>
                                       <td style="width: 65%; border: 1px solid #ddd;">
                                           {{ mb_strtoupper($item['concept']) }}
                                       </td>
                                       <td style="width: 35%; border: 1px solid #ddd;">
                                           ${{ number_format($item['total'], 2) }}
                                       </td>
                                   </tr>
                               @endforeach
                           </tbody>
                       </table>
                   </div>

                   <p class="text-center" style="font-weight: bold;">Total Pagado: <span
                           style="color: green;">${{ number_format($total, 2) }}</span></p>

                   <p class="text-center" style="font-weight: bold;">Fecha y hora de la operación: <span
                           style="font-weight: normal;">{{ $sale_date }}</span>
                   </p>

                   <p class="text-center">Gracias por tu pago.</p>
               </div>
           </div>
       </div>
   @endsection