@extends('layout.main')
@section('main-section')
<script>
   function printDiv(divId) {
    var printContents = document.getElementById(divId).innerHTML;
    var originalContents = document.body.innerHTML;

    document.body.innerHTML = printContents;

    window.print();

    document.body.innerHTML = originalContents;
   }

document.addEventListener("DOMContentLoaded", function () {
    const gregDate = document.getElementById("greg-date").innerText.trim();

    fetch(`https://api.aladhan.com/v1/gToH?date=${gregDate}`)
        .then(res => res.json())
        .then(data => {
            if (data.code === 200) {
                const hijri = data.data.hijri;
                document.getElementById("hijri-date").innerText =
                    `${hijri.day} ${hijri.month.en} ${hijri.year} `;
            } else {
                document.getElementById("hijri-date").innerText = "N/A";
            }
        })
        .catch(() => {
            document.getElementById("hijri-date").innerText = "N/A";
        });
});

</script>

<style>
.table-fixed {
    table-layout: fixed;
    width: 100%;
}

.table-fixed th {
    text-align: center;
    width: 25%;
}

.table-fixed td {
    text-align: center;
    width: 25%;
    word-wrap: break-word;
}
@media print {

    @page {
        size: A4;
        margin: 0.1mm;   /* control page margins here */
    }

    html, body {
        width: 280mm;
        height: auto;
        margin: 0 !important;
        padding: 0 !important;
        font-family: 'Times New Roman', Times, serif !important;
    }

    body * {
        visibility: hidden;
    }

    #printableArea, #printableArea * {
        visibility: visible;
    }

    #printableArea {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        transform: scale(1);   /* adjust if needed */
        transform-origin: top left;
    }

    .invoice-actions {
        display: none !important;
    }
}
</style>

<!-- Content wrapper -->
<div class="content-wrapper" style="font-family: 'Times New Roman', Times, serif">
<!-- Content -->
<div class="container-xxl flex-grow-1 container-p-y">
<div class="row invoice-preview">
<!-- Invoice -->
<div class="col-xl-9 col-md-8 col-12 mb-md-0 mb-6" id="printableArea">
<div class="card invoice-preview-card p-sm-12 p-6">
   <div class="card-body invoice-preview-header rounded">
      <div
         class="d-flex justify-content-between flex-xl-row flex-md-column flex-sm-row flex-column align-items-xl-center align-items-md-start align-items-sm-center align-items-start">
         <div class="mb-xl-0 mb-6 text-heading">
                <img src="{{url('assets/headerlogo.png')}}" width="100%" />

         </div>
      </div>
   </div>
   <div class="col-12" style="text-align: center;">
               <h5><b><u>WITHOUT PREJUDICE</u></b></h5>
               <!--<h4>Survey Report – Motor Accidental Loss </h4>-->
               <p class="fs-4">Motor Survey Preliminary Report</p>
               <b><span style="border:solid; padding-top:5px; padding-bottom:5px; padding-right:30px; padding-left:30px; font-size:20px">CLAIM / LOSS # {{ $assignInfo->_LossBenefitNo }}</span></b>
               <p></p>
    </div>
   <div class="d-flex justify-content-between align-items-start mb-3">
                        <!-- Left -->
                        <h5 class="mb-0">
                           <b> Reference # {{ $assignInfo->_ReferenceNo }}</b>
                        </h5>

                       <div class="text-end">
                        <div class="fw-medium fs-5">
                            <span><b>Report Date:</b></span>
                            <span id="greg-date">
                                {{ $assignInfo->created_at->format('d-m-Y') }}
                            </span>
                        </div>
                        <div class="text-muted fs-5">
                            Hijri:
                            <span id="hijri-date">Loading...</span>
                        </div>
                    </div>
                    </div>
   @foreach ($attend as $att)
   @foreach ($plr as $p)
   <div class="row">
      <div class="col-12">
         <div class="table-responsive">
            <table class="table table-sm table-centered table-striped table-bordered table-fixed">
               <tbody>
                  <tr>
                        <td colspan="4" style="font-size: 20px; text-align:center;">
                            <strong>Policy Details:</strong>
                        </td>
                    </tr>
                  <tr>
                     <td class="fw-bold">Client:</td>
                     <td>{{$assignInfo->_Client}}</td>
                     <td class="fw-bold">Branch:</td>
                     <td>{{$assignInfo->_ClientBranch}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Insured's Name:</td>
                     <td>{{$assignInfo->_InsuredParticipant}}</td>
                     <td class="fw-bold">Insured's Contact:</td>
                     <td>{{$assignInfo->_ContactDetails}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Valid From:</td>
                        <td>{{ \Carbon\Carbon::parse($p->_PolicyIssueDate)->format('d-m-Y') }}</td>
                     <td class="fw-bold">Valid Upto:</td>
                        <td>{{ \Carbon\Carbon::parse($p->_PolicyExpiryDate)->format('d-m-Y') }}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Policy #:</td>
                     <td>{{$assignInfo->_PolicyPMDNo}}</td>
                     <td class="fw-bold">CV4 Applicable:</td>
                     <td>{{$p->_CV4}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Sum Insured:</td>
                     <td>{{number_format($p->_SumInsured)}}</td>
                     <td class="fw-bold">Market Value:</td>
                     <td>{{ number_format($p->_MarketValue) }}</td>
                  </tr>
                  <tr>
                        <td colspan="4" style="font-size: 20px; text-align:center;">
                            <strong>Particulars of Vehicle:</strong>
                        </td>
                    </tr>

                  <tr>
                     <td class="fw-bold">Make:</td>
                     <td>{{$assignInfo->_Make}}</td>
                     <td class="fw-bold">Vehicle Type:</td>
                     <td>	{{$assignInfo->_BodyType}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Registration #:</td>
                     <td>{{$assignInfo->_RegNo}}</td>
                     <td class="fw-bold">Model:</td>
                     <td>{{$assignInfo->_YearOfManf}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Engine #:</td>
                     <td>{{$assignInfo->_EngineNo}}</td>
                     <td class="fw-bold">Chassis #:</td>
                     <td>{{$assignInfo->_ChassisNo}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Color:</td>
                     <td>{{$assignInfo->_Colour}}</td>
                     <td class="fw-bold">Odometer Reading:</td>
                     <td>{{$att->_OdometreReading}}</td>
                  </tr>
                  <tr>
                        <td colspan="4" style="font-size: 20px; text-align:center;">
                            <strong>Particulars of Driver:</strong>
                        </td>
                    </tr>
                    <tr>
                        <td class="fw-bold">Driver Name </td>
                        <td>{{$p->_DriverName}}</td>
                        <td class="fw-bold">Driver Status</td>
                        <td>
                            {{ empty($p->_LicenseNo) ? 'Unlicensed' : 'Licensed' }}
                        </td>
                     </tr>
                     <tr>
                        <td class="fw-bold">License No. </td>
                        <td>
                            {{ $p->_LicenseNo 
                                ? ($p->_LicenseNo) 
                                : '-' 
                            }}
                        </td>    
                        <td class="fw-bold">License Expiry Date</td>
<td>
    {{ $p->_LicenseExpiryDate 
        ? \Carbon\Carbon::parse($p->_LicenseExpiryDate)->format('d-m-Y') 
        : '-' 
    }}
</td>                     </tr>

                  <tr>
                        <td colspan="4" style="font-size: 20px; text-align:center;">
                            <strong>Particulars of Loss:</strong>
                        </td>
                    </tr>
                  <tr>
                     <td class="fw-bold">Loss Number:</td>
                     <td>{{$assignInfo->_LossBenefitNo}}</td>
                     <td class="fw-bold">Date of Loss:</td>
                     <td>{{ \Carbon\Carbon::parse($att->_DateOfLoss)->format('d-m-Y') }}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Date of Intimation:</td>
                        <td>{{ \Carbon\Carbon::parse($assignInfo->_DateOfIntimation)->format('d-m-Y') }}</td>
                     <td class="fw-bold">Date of Survey:</td>
                        <td>{{ \Carbon\Carbon::parse($att->_DateOfSurvey)->format('d-m-Y') }}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Place of Loss:</td>
                     <td>{{$p->_PlaceOfLoss}}</td>
                     <td class="fw-bold">Police Report (if any)</td>
                     <td>{{$p->_PoliceFIRReport}}</td>
                  </tr>
                  <tr>
                     <td class="fw-bold">Workshop:</td>
                     <td>{{$assignInfo->_Workshop}}</td>
                     <td class="fw-bold">Repairers' Estimate:</td>
                    <td>
                        Rs. {{ $att->_RepairerEstimate }}
                        ({{ count($addparts) == 0 ? 'only' : 'plus parts' }})
                    </td>
                  </tr>

                @if($p->_Lumpsum > 0)
                <tr>
                    <td class="fw-bold">Lump Sum:</td>
                    <td>{{ $p->_Lumpsum }}</td>
                </tr>
                @endif

               </tbody>
            </table>
            <table class="table">
               <tr>
                  <td>
                     <span style="font-size:16px;"><b>Circumstances of Loss</b></span>
                     <p> {{$p->_CircumstancesOfLoss}} </p>
                  </td>
               </tr>
            </table>
            <div class="col-lg-12">
               <br>
               <span><img src="{{url('assets/Stamp.png')}}"  style="width:50px; position: relative; top:-30px; float: right;"/></span>
               <span style="float: right; font-size=8px; "><strong>Continued on next page...</strong></span>
            </div>
            <br><br><br>
            <div id="page2">
               <div class="col-lg-12">
                  <span style="float: right;"><img src="{{url('assets/logofinal.jpg')}}" width="80" height="80" /></span>
                  <br><br><br><br>
                  <span style="float: right; margin-right:3%;">Page 2</span>
               </div>
               <table>
                  <tr>
                     <td><strong>Our Ref. #</strong></td>
                     <td><strong>{{$assignInfo->_ReferenceNo}}</strong></td>
                  </tr>
               </table>
               <table class="table-sm table table-centered table-striped">
                  <tr style="text-align: center; border: solid;">
                     <th><u>DESCRIPTION</u></th>
                     <th><u>REPAIRERS' ESTIMATE</u></th>
                     <th><u>OUR ASSESSMENT</u></th>
                  </tr>
                  @foreach ($addlabour as $all)
                  @endforeach
                  <tr>
                     <td><strong>Labour Charges</strong></td>
                     <td style="text-align: center;">{{ number_format($att->_RepairerEstimate) }}</td>
                     <td style="text-align: center;">{{ number_format($att->_AssessedLabour) }}</td>
                  </tr>
                  @foreach ($addlabour as $al)
                  <tr>
                     <td>{{$al->_LabourName}} - {{ $al->_Type }}</td>
                     <td style="text-align: center;">-</td>
                     <td style="text-align: center;">-</td>
                  </tr>
                  @endforeach
                  <tr style="border:solid;">
                     <td style="float: right;"><strong>Labour Charges:	</strong></td>
                     <td style="text-align: center;">{{ number_format($att->_RepairerEstimate) }}</td>
                     <td style="text-align: center;">{{ number_format($att->_AssessedLabour) }}</td>
                  </tr>
                  <tr>
                     <td><strong>Replacement Parts <span style="float:right;">(Rate of Dep.)</span></strong></td>
                     <td style="text-align: center;"><b>Quantity</b></td>
                     <td style="text-align: center;"><b>Price</b></td>
                  </tr>
                  @foreach ($addparts as $key => $ap)
                  @if($ap->_PriceInRs > 0)
                  <tr>
                     <td> {{$ap->_PartName}}<span style="float:right;">({{$ap->_Depreciation}}% - Rs. {{$ap->_PriceInRs * $ap->_Depreciation / 100}}) </span> </td>
                     <td style="text-align: center;">{{$ap->_Quantity}}</td>
                     <td style="text-align: center;">{{number_format($ap->_PriceInRs)}}</td>
                  </tr>
                  @elseif($ap->_PartName != "Nil")
                  <tr>
                     <td> {{$ap->_PartName}}<span style="float:right;">({{$ap->_Depreciation}}% - Rs. {{$ap->_PriceInRs * $ap->_Depreciation / 100}}) </span> </td>
                     <td style="text-align: center;">{{$ap->_Quantity}}</td>
                     <td style="text-align: center;">{{number_format($ap->_PriceInRs)}}</td>
                  </tr>
                  @endif
                  @endforeach
                  @if($addpartssum > 0)
                  <tr style="border: solid;">
                     <td style="float: right;"><strong>Cost of Parts :	</strong></td>
                     <td style="text-align: center;"></td>
                     <td style="text-align: center;">{{ number_format($addpartssum)  }}</td>
                  </tr>
                  @endif
               </table>
               <table class="table-sm table table-centered table-striped">
                   <tr>
                           <td><b>SUMMARY OF LOSS: </b></td>
                           <td>Labour Charges:</td>
                           <td style="text-align: center;"> {{ number_format($att->_AssessedLabour)  }}</td>
                           <td></td>
                    </tr>
                                       @if ($p->_SalesTaxLabourPercentage > 0)
                    <tr>
                       <td></td>
                       <td><b>Add:</b> Provincial Sales Tax: ({{ $p->_SalesTaxLabourPercentage }}%) </td>
                       <td style="text-align: center;"> + {{ number_format($labourchargesafterdis  * $p->_SalesTaxLabourPercentage /100) }}</td>
                       <td></td>
                    </tr>
                    @endif
                                      <tr>
                           <td></td>
                           <td><b>Total Labour Charges: <b/></td>
                           <td></td>
                           <td style="text-align: center;"><b>{{ number_format($labourchargesafterdis * $p->_SalesTaxLabourPercentage /100 +  $labourchargesafterdis)  }}</b></td>
                        </tr>
                  <!--<tr>-->
                  <!--   <td></td>-->
                  <!--   <td> </td>-->
                  <!--   <td style="text-align: center;"></td>-->
                  <!--</tr>-->
                  @if($addpartssum > 0)
                  <tr>
                           <td></td>
                           <td>Cost of Parts</td>
                           <td style="text-align: center;">{{ number_format($addpartssum)  }}</td>
                           <td></td>
                        </tr>
                  @endif
                                    @if($ap->_Depreciation > 0)
                  <tr>
                       <td></td>
                       <td><b>Less: </b>Total Depreciation ({{ $ap->_Depreciation }}%) </td>
                       <td style="text-align: center;">- {{ number_format($partsafterdis * $ap->_Depreciation / 100)}}</td>
                       <td></td>
                    </tr>
                  @endif
                                    @if($totalcostpartsafterDep > 0)
                  <tr>
                           <td></td>
                           <td>Cost of Parts after Depreciation</td>
                           <td style="text-align: center;">{{ number_format($totalcostpartsafterDep) }}</td>
                           <td></td>
                        </tr>
                  @endif
                                    @if($gst2 > 0)
                  <tr>
                   <td></td>
                   <td><b>Add: </b> GST on Parts {{ $p->_GSTonPartsPercentage }}% (+)</td>
                   <td style="text-align: center;">+ {{ number_format($gst2) }}</td>
                   <td></td>
                </tr>
                  @endif
                  @if($totalcostpartsafterDep + $gst > 0)
                  <tr>
                            <td></td>
                            <td class="fw-bold">Total Parts Charges:</td>
                            <td></td>
                            <td class="fw-bold text-center border-bottom">
                                + {{ number_format($totalcostpartsafterDep + $gst2) }}
                            </td>
                        </tr>
                  @endif
                   @if($totalcostpartsafterDep + $gst2 > 0)
                    <tr>
                       <td></td>
                       <td><b>TOTAL COST OF LABOUR & PARTS :</b></td>
                       <td></td>
                       <td style="text-align: center;"><b>{{ number_format($totalcostpartsafterDep + $gst2 +($labourchargesafterdis * $p->_SalesTaxLabourPercentage /100 +  $labourchargesafterdis))}}</b></td>
                    </tr>
                    @endif
                                      @if (
                        ($totalcostpartsafterDep
                        + $gst2
                        + ($labourchargesafterdis * $p->_SalesTaxLabourPercentage / 100 + $labourchargesafterdis))
                        != ($grand1 + $grand2)
                    )
                        <tr>
                            <td></td>
                            <td><strong>GRAND TOTAL: </strong></td>
                            <td></td>
                            <td style="text-align: center;">
                                <b>{{ number_format($grand1 + $grand2) }}</b>
                            </td>
                        </tr>
                    @endif

                                    @if ($p->_UnderInsurancePercentage > 0)
                  <tr>
                           <td></td>
                           <td><b>Less: </b>Under Insurance ({{ $p->_UnderInsurancePercentage }}%)</td>
                           <td style="text-align: center;"> - {{ number_format($underInsur) }}</td>
                           <td> </td>
                        </tr>
                  @endif
                   @if (
                        ($totalcostpartsafterDep
                        + $gst2
                        + ($labourchargesafterdis * $p->_SalesTaxLabourPercentage / 100 + $labourchargesafterdis))
                        != ($grand1 + $grand2)
                    )
                  <tr>
                     <td></td>
                     <td><strong>Net Assesed Amount: </strong></td>
                     <td></td>
                     <td style="text-align: center;"><b>{{ number_format($grand - $underInsur) }}</b></td>
                  </tr>
                   @endif
                  @if($p->_Deductible > 0)
                  <tr>
                   <td></td>
                   <td><b>Less: </b>Deductible: </td>
                   <td style="text-align: center;"> - {{number_format($p->_Deductible)}} </td>
                   <td></td>
                </tr>
                  @endif
                  <tr style="border: solid;">
                     <td></td>
                     <td><strong>@if($p->_Lumpsum > 0) Lump Sum : @else NET ADJUSTED AMOUNT : @endif</strong></td>
                     <td></td>
                     <td style="text-align: center;"><b>@if($p->_Lumpsum > 0) {{$p->_Lumpsum}} @else {{ number_format($grand - $underInsur - $p->_Deductible) }} @endif</b></td>
                  </tr>
               </table>
               <p></p>
               <div class="col-lg-12">
                  <h5>Further Remarks : </h5>
                  <p>{{ $p->_Remarks }}</p>
               </div>
            </div>
            <!-- end row -->
            @endforeach
            @endforeach
            <div class="row">
               <div class="col-sm-6">
                  <div class="">
                     <p><b>Authorized Surveying Officer : </b> {{$assignInfo->_AssignTeamMember}}</p>
                     <p><b>PLR Issued By : </b> <span class="">{{$assignInfo->_UserEmail}}</span></p>
                  </div>
               </div>
               <!-- end col -->
            </div>
            <hr class="mt-0 mb-6" />
            <div class="card-body p-0">
               <div class="row">
                  <div class="col-12">
                  </div>
               </div>
            </div>
         </div>
      </div>
      <!-- /Invoice -->
      <!-- Invoice Actions -->
      <div class="col-xl-3 col-md-4 col-12 invoice-actions">
         <div class="card">
            <div class="card-body">
               <button
                  class="btn btn-primary d-grid w-100 mb-4"
                  data-bs-toggle="offcanvas"
                  data-bs-target="#sendInvoiceOffcanvas">
               <span class="d-flex align-items-center justify-content-center text-nowrap"
                  ><i class="icon-base ti tabler-send icon-xs me-2"></i>Send Invoice</span
                  >
               </button>
               <button class="btn btn-label-secondary d-grid w-100 mb-4">Download</button>
               <div class="d-flex mb-4">
                  <a
                     class="btn btn-label-secondary d-grid w-100 me-4"
                     target=""
                     onclick="window.print()">
                  Print
                  </a>
                  <a href="./app-invoice-edit.html" class="btn btn-label-secondary d-grid w-100"> Edit </a>
               </div>
               <button
                  class="btn btn-success d-grid w-100"
                  data-bs-toggle="offcanvas"
                  data-bs-target="#addPaymentOffcanvas">
               <span class="d-flex align-items-center justify-content-center text-nowrap"
                  ><i class="icon-base ti tabler-currency-dollar icon-xs me-2"></i>Add Payment</span
                  >
               </button>
            </div>
         </div>
      </div>
      <!-- /Invoice Actions -->
   </div>
   <!-- Offcanvas -->
   <!-- Send Invoice Sidebar -->
   <div class="offcanvas offcanvas-end" id="sendInvoiceOffcanvas" aria-hidden="true">
      <div class="offcanvas-header mb-6 border-bottom">
         <h5 class="offcanvas-title">Send Invoice</h5>
         <button
            type="button"
            class="btn-close text-reset"
            data-bs-dismiss="offcanvas"
            aria-label="Close"></button>
      </div>
      <div class="offcanvas-body pt-0 flex-grow-1">
         <form>
            <div class="mb-6">
               <label for="invoice-from" class="form-label">From</label>
               <input
                  type="text"
                  class="form-control"
                  id="invoice-from"
                  value="shelbyComapny@email.com"
                  placeholder="company@email.com" />
            </div>
            <div class="mb-6">
               <label for="invoice-to" class="form-label">To</label>
               <input
                  type="text"
                  class="form-control"
                  id="invoice-to"
                  value="qConsolidated@email.com"
                  placeholder="company@email.com" />
            </div>
            <div class="mb-6">
               <label for="invoice-subject" class="form-label">Subject</label>
               <input
                  type="text"
                  class="form-control"
                  id="invoice-subject"
                  value="Invoice of purchased Admin Templates"
                  placeholder="Invoice regarding goods" />
            </div>
            <div class="mb-6">
               <label for="invoice-message" class="form-label">Message</label>
               <textarea class="form-control" name="invoice-message" id="invoice-message" cols="3" rows="8">
               Dear Queen Consolidated,
               Thank you for your business, always a pleasure to work with you!
               We have generated a new invoice in the amount of $95.59
               We would appreciate payment of this invoice by 05/11/2021</textarea
                  >
            </div>
            <div class="mb-6">
               <span class="badge bg-label-primary">
               <i class="icon-base ti tabler-link icon-xs"></i>
               <span class="align-middle">Invoice Attached</span>
               </span>
            </div>
            <div class="mb-6 d-flex flex-wrap">
               <button type="button" class="btn btn-primary me-4" data-bs-dismiss="offcanvas">Send</button>
               <button type="button" class="btn btn-label-secondary" data-bs-dismiss="offcanvas">Cancel</button>
            </div>
         </form>
      </div>
   </div>
   <!-- /Send Invoice Sidebar -->
   <!-- Add Payment Sidebar -->
   <div class="offcanvas offcanvas-end" id="addPaymentOffcanvas" aria-modal="true" role="dialog">
      <div class="offcanvas-header border-bottom">
         <h5 class="offcanvas-title">Add Payment</h5>
         <button
            type="button"
            class="btn-close text-reset"
            data-bs-dismiss="offcanvas"
            aria-label="Close"></button>
      </div>
      <div class="offcanvas-body flex-grow-1">
         <div class="d-flex justify-content-between bg-lighter p-2 mb-4">
            <p class="mb-0">Invoice Balance:</p>
            <p class="fw-medium mb-0">$5000.00</p>
         </div>
         <form>
            <div class="mb-6">
               <label class="form-label" for="invoiceAmount">Payment Amount</label>
               <div class="input-group">
                  <span class="input-group-text">$</span>
                  <input
                     type="text"
                     id="invoiceAmount"
                     name="invoiceAmount"
                     class="form-control invoice-amount"
                     placeholder="100" />
               </div>
            </div>
            <div class="mb-6">
               <label class="form-label" for="payment-date">Payment Date</label>
               <input id="payment-date" class="form-control invoice-date" type="text" />
            </div>
            <div class="mb-6">
               <label class="form-label" for="payment-method">Payment Method</label>
               <select class="form-select" id="payment-method">
                  <option value="" selected disabled>Select payment method</option>
                  <option value="Cash">Cash</option>
                  <option value="Bank Transfer">Bank Transfer</option>
                  <option value="Debit Card">Debit Card</option>
                  <option value="Credit Card">Credit Card</option>
                  <option value="Paypal">Paypal</option>
               </select>
            </div>
            <div class="mb-6">
               <label class="form-label" for="payment-note">Internal Payment Note</label>
               <textarea class="form-control" id="payment-note" rows="2"></textarea>
            </div>
            <div class="mb-6 d-flex flex-wrap">
               <button type="button" class="btn btn-primary me-4" data-bs-dismiss="offcanvas">Send</button>
               <button type="button" class="btn btn-label-secondary" data-bs-dismiss="offcanvas">Cancel</button>
            </div>
         </form>
      </div>
   </div>
   <!-- /Add Payment Sidebar -->
   <!-- /Offcanvas -->
</div>
<!-- / Content -->
@endsection('main-section')