@include('frontend.layouts.headerlinks')
    <style>
    body {
        font-family: sans-serif;
        font-size: 10pt;
    }

    p {
        margin: 0pt;
    }

    table.items {
        border: 0.1mm solid #e7e7e7;
    }

    td {
        vertical-align: top;
    }

    .items td {
        border-left: 0.1mm solid #e7e7e7;
        border-right: 0.1mm solid #e7e7e7;
    }

    table thead td {
        text-align: center;
        border: 0.1mm solid #e7e7e7;
    }

    .items td.blanktotal {
        background-color: #EEEEEE;
        border: 0.1mm solid #e7e7e7;
        background-color: #FFFFFF;
        border: 0mm none #e7e7e7;
        border-top: 0.1mm solid #e7e7e7;
        border-right: 0.1mm solid #e7e7e7;
    }

    .items td.totals {
        text-align: right;
        border: 0.1mm solid #e7e7e7;
    }

    .items td.cost {
        text-align: "."center;
    }
    </style>

<div class="app-content content">
    <div class="content-wrapper">

      {{-- <div class="content-header row">
        <div class="content-header-left col-md-4 col-12 mb-2">
          <h4 class="content-header-title">Book for free trial</h4>
        </div>
      </div> --}}
      <div class="content-body">
          <div class="row">

            <table width="100%" style="font-family: sans-serif;" cellpadding="10">
                <tr>
                    <td width="100%" style="padding: 0px; text-align: center;">
                    <a href="#" target="_blank"><img src="{{ asset('storage/vendors/images/logo.png') }}" width="264" height="110" alt="Logo" align="center" border="0"></a>
                    </td>
                </tr>
                <tr>
                    <td width="100%" style="text-align: center; font-size: 20px; font-weight: bold; padding: 0px;">
                    INVOICE <br>
                    <span class="badge bg-success">Payment Success</span>
              
                    </td>
                </tr>
                <tr>
                <td height="10" style="font-size: 0px; line-height: 10px; height: 10px; padding: 0px;">&nbsp;</td>
                </tr>
            </table>
            <table width="100%" style="font-family: sans-serif;" cellpadding="10">
                <tr>
                    <td width="49%" style="border: 0.1mm solid #eee;">Name<br>Email<br></td>
                    <td width="2%">&nbsp;</td>
                    <td width="49%" style="border: 0.1mm solid #eee; text-align: right;"><strong>{{ $order->Customer->getFullName() ?? '' }}</strong><br>{{ $order->customer->email ?? '' }}<br><br><br></td>
                </tr>
            </table>
            <br>
            <table width="100%" style="font-family: sans-serif; font-size: 14px;" >
                <tr>
                    <td>
                        <table width="60%" align="left" style="font-family: sans-serif; font-size: 14px;" >
                            <tr>
                            <td style="padding: 0px; line-height: 20px;">&nbsp;</td>
                            </tr>
                        </table>
                        <table width="40%" align="right" style="font-family: sans-serif; font-size: 14px;" >
                            <tr>
                                <td style="border: 1px #eee solid; padding: 0px 8px; line-height: 20px;"><strong>Transaction Id</strong></td>
                                <td style="border: 1px #eee solid; padding: 0px 8px; line-height: 20px;">{{ $order->payment->txn_id }}</td>
                            </tr>
                           
                            <tr>
                                <td style="border: 1px #eee solid; padding: 0px 8px; line-height: 20px;"><strong>Invoice Date</strong></td>
                                <td style="border: 1px #eee solid; padding: 0px 8px; line-height: 20px;">{{ $order->payment->created_at }}</td>
                            </tr>
                           
                        </table>
                    </td>
                </tr>
            </table>
            <br>
            <table class="items" width="100%" style="font-size: 14px; border-collapse: collapse;" cellpadding="8">
                <thead>
                    <tr>
                        <td width="15%" style="text-align: left;"><strong>Books</strong></td>
                       
                        <td width="20%" style="text-align: left;"><strong>Amount</strong></td>
                        
                    </tr>
                </thead>
                <tbody>
                    <!-- ITEMS HERE -->
                   
                    <tr>
                        <td style="padding: 0px 7px; line-height: 20px;">{{ $order->products->books->book_name  }}</td>
                       
                        <td style="padding: 0px 7px; line-height: 20px;">{{ $order->products->books->bookPrice[0]->currency->symbol.' '.$order->products->books->bookPrice[0]->book_price  }}</td>
                        
                    </tr>
                  
                   
    
                </tbody>
            </table>
            <br>
            <table width="100%" style="font-family: sans-serif; font-size: 14px;" >
                <tr>
                    <td>
                        <table width="60%" align="left" style="font-family: sans-serif; font-size: 14px;" >
                            <tr>
                                <td style="padding: 0px; line-height: 20px;">&nbsp;</td>
                            </tr>
                        </table>
                        <table width="40%" align="right" style="font-family: sans-serif; font-size: 14px;" >
                            <tr>
                                <td style="border: 1px #eee solid; padding: 0px 8px; line-height: 20px;"><strong>Total Amount</strong></td>
                                <td style="border: 1px #eee solid; padding: 0px 8px; line-height: 20px;">{{ $order->payment->amount }}</td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            <br>
            <table width="100%" style="font-family: sans-serif; font-size: 14px;" >
                <br>
                <tr>
                    <td>
                       
                        <table width="100%" align="left" style="font-family: sans-serif; font-size: 13px; text-align: center;" >
                            <tr>
                                <td style="padding: 0px; line-height: 20px;">
                                    <strong>BooksInVideos</strong>
                                    <br>
                                    Module 103, Ground Floor, SDF Building, Sector V,
                                    Salt Lake, Kolkata - 700091
                                    <br>
                                    Email:  demo@email.com
                                </td>
                            </tr>
                        </table>
                       
                    </td>
                </tr>
                <br>
            </table>
          </div>
      </div>
    </div>
</div>

@include('frontend.layouts.footerlinks')