<!DOCTYPE HTML>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>
    <style type="text/css">
        table {
            page-break-inside: auto
        }

        tr {
            page-break-inside: avoid;
            page-break-after: auto
        }

        thead {
            display: table-header-group
        }

        tfoot {
            display: table-footer-group
        }
    </style>
</head>

<body onload="window.print()" onfocus="window.close()">

    <style>
          /* @page {
            size: 80 mm;
        } */
        @media print {

            html, body {
                /* width: 100%; */
                /* height: 100px; */

            }
            thead th {
                font-size: 75px !important;
                border: 5px solid #ddd;
            }

            button {
                visibility: hidden;
            }

            table {
                /* width: ; */
            }


            table,
            tr,
            thead th,
            td {
                font-size: 10px !important;
                padding: 5px !important;
                border: none;
                border-collapse: collapse;

            }
            .center{
                text-align: center;
                vertical-align: middle;
            }
            .bigfont{
                font-size: 150px;
            }
            .midiumfont{
                font-size: 50px;
            }
            .smallfont{
                font-size: 40px;
            }
            .verysmallfont{
                font-size: 30px;
            }
            .bold{
                font-weight: bold;
            }
            hr {
                display: block;
                height: 5px;
                background: transparent;
                width: 100%;
                border: none;
                border-top: solid 1px #aaa;
            }
        }
    </style>
    <div>
        <div>

            <div>
                <div>
                    <div>
                        <div>

                            <button type="button" onclick="window.print()">Print
                                <i class="fa fa-print"></i>
                            </button>
                        </div>

                        <table style="">
                            <tbody>
                                <tr>
                                    <td colspan="" class="center bold" style="font-size: 50px">
                                        <img src="{{ asset('storage/company/' . $company_info->img_url ?? '') }}" alt="" style="width: 50px; height: 50px;">
                                    </td>
                                </tr>
                                <tr>
                                    <td class="center verysmallfont" style="font-size: 50px">
                                        {{ $company_info->name }}
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" class="center verysmallfont">{{ $company_info->address }}</td>
                                </tr>
                                <tr>
                                    <td colspan="2" class="center verysmallfont">{{ $company_info->mobile ?? '' }}</td>
                                </tr>
                                <tr>
                                    <td colspan="1" class="center smallfont">MR ID : {{ $billpayment->money_receipt_number ?? '' }}</td>
                                </tr>
                                <tr>
                                    <td colspan="2">
                                        <hr >
                                    </td>
                                </tr>
                                <tr>
                                    <td class="smallfont">CID : {{ $billpayment->clients->id ?? '' }}  / Date : {{ $billpayment->created_at->format('d-m-Y') }}</td>
                                </tr>
                                <tr>
                                    <td colspan="1" class="smallfont">Name : {{ $billpayment->clientsinfo->clients_name ?? '' }}</td>
                                </tr>
                                <tr>
                                    <td colspan="1" class="smallfont">Userid : {{ $billpayment->clients->userid ?? '' }}</td>
                                </tr>
                                <tr>
                                    <td colspan="1" class="smallfont ">Contact : {{ $billpayment->clientsinfo->contact_no ?? '' }}</td>
                                </tr>
                                <tr>
                                    <td class="smallfont ">Description : {{ $billpayment->description }}</td>
                                </tr>
                                <tr>
                                    <td colspan="1" class="smallfont " >Paid Amount : {{ $billpayment->paid_amount }}</td>
                                </tr>
                                <tr>
                                    <td colspan="1" class="smallfont " >Due Amount : {{ $billpayment->clients->customerAccount->dueAmount ?? '' }}</td>
                                </tr>
                                @if ($billpayment->discount_amount > 0)
                                    <tr>
                                        <td colspan="1" class="smallfont " >Discount Amount : {{ $billpayment->discount_amount }}</td>
                                    </tr>
                                @endif
                                <tr>
                                    <td colspan="1" class="smallfont">Collect By : {{ $billpayment->employee->name ?? '' }}</td>
                                </tr>
                                <tr>
                                    <td colspan="2" >
                                        <hr >
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" class="smallfont bold center">
                                        Powerd By : https://yetfix.com/
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script type="text/javascript">
        window.onload = function() {
            window.print();
        }
        window.onfocus = function() {
            window.close();
        }
    </script>
</body>

</html>
