<!DOCTYPE html>
<html>

    <head>
        <meta http-equiv='Content-Type' content='text/html; charset=UTF-8' />

        <!--<title >طباعة الفاتوره</title>-->

        <style>
            html {
                font-size: 10px;
                -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            }

            body {
                font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
                font-size: 10px;
                line-height: 1.42857143;
                color: #333;
                background-color: #fff;
            }



            @media print {
                #items th {
                    background: #c8e3f5 !important;
                }
            }

            * {
                margin: 0;
                padding: 0;
            }

            #page-wrap {
                width: 98%;
                margin: 0 auto;
            }

            table {
                border-collapse: collapse;
            }

            table td,
            table th {
                padding: 3px 11px 3px;
                vertical-align: middle;
                text-align: center;
            }

            .info-bill {
                width: 40%;

            }

            .info-table {
                width: 30%;
                float: left;
                margin-top: 2px
            }

            .info-table {
                clear: both;
                margin-top: 0 !important
            }

            .info-table .foot {
                background-color: #c8e3f5
            }

            .info-table {

                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
                margin-top: 10px
            }

            .info-table .head {
                border-bottom: 1px solid #008bd2
            }

            .info-table .head h3 {
                display: inline-block;
                border-left: 1px solid #008bd2;
                width: 30%;
                background-color: #c8e3f5;
                padding-right: 5px
            }

            .info-table .head h3 {
                background-color: transparent;
                width: 40%
            }

            .border {
                border: 1px solid #008bd2
            }

            table {
                width: 100%
            }

            #items {
                clear: both;
                width: 100%;
                margin: 0;
                border: 1px solid #9c9999;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            .red {
                background-color: #c8e3f5 !important;
                color: #000 !important;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            .red th {
                font-size: 13px
            }


            table td,
            table th {
                border: 1px solid #9c9999;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            .bill-head {
                background-color: #008bd2 !important;
                border: 1px solid #008bd2 !important;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            .bg-grey {
                background-color: #e0e0e0 !important;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            .foot-color {
                color: #008ed3;
                font-weight: bold;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            table span {
                color: #444;
                -webkit-print-color-adjust: exact;
                -moz-print-color-adjust: exact;
                print-color-adjust: exact;
            }

            .head table td{
                text-align: right;
                border:0
            }
        </style>

        {literal}
        <script language="javascript" type="text/javascript">
            /*$(document).ready(function() {
             //window.print();

             // printDiv();
             });*/
            function printDiv() {

                var divId = document.getElementById('printdiv');
                divId.setAttribute("className", "print_section print");
                divId.setAttribute("class", "print_section print");
                window.print();
                setTimeout(window.close, 0);

                // window.close();
            }
        </script>
        {/literal}

    </head>

    <body dir='rtl' onLoad="printDiv()" id="printdiv">

        <div id="page-wrap">

            <div id="header" class="bill-head"
                 style="font-size:18px;font-weight: bold;width: 100%;text-align: center;color: white;font: bold 15px ;text-decoration: uppercase;padding:5px 0px 10px; margin-bottom: 5px">
                إذن  ص .ب من ({$sellbillData->storeName})</div>


            <div class="head" style="margin-bottom: 10px;">
                <table style="width: 20%;float:right;margin-left: 10%;text-align: start;border: 0;">
                    <tr>
                        <td>
                            <h3 style="height:24px;line-height:27px;display: inline-block;padding-right: 5px">
                                رقم الاذن: <span>{if $sellbillData->taxBillNumber >
                                    0}{$sellbillData->taxBillNumber}{else}{$sellbillData->sellbillid}{/if}</span></h3>

                        </td>

                    </tr>
                    <tr>
                        <td>
                            <h3 style="height:24px;line-height:27px;display: inline-block;padding-right: 5px">
                                العميل: <span>{$sellbillData->tempclientName}</span></h3>
                        </td>

                    </tr>
                </table>
                <table style="width: 40%;float:right;margin-left: 10%;">
                    <tr>
                        <td>
                            <h3 style="height:24px;line-height:27px;display: inline-block;padding-right: 5px">
                                التاريخ: <span> {$sellbillData->sellbillsysdate}</span></h3>
                    </tr>
                    <tr>
                        <td>
                            <h3 style="height:24px;line-height:27px;display: inline-block;padding-right: 5px">
                                العنوان: <span> {$Programsettingdata->address}</span></h3>
                        </td>
                    </tr>
                </table>
                <table style="width: 20%;float:left">
                    <tr>
                        <td>
                            <h3 style="height:24px;line-height:21px;display: inline-block;padding-right: 5px;font-size:17px">
                                {$Programsettingdata->companyname}</h3>
                        </td>
                    </tr>

                </table>


            </div>



            <div style="clear:both"></div>

            <div class="">
                <table id="items" style="margin-bottom:5px;margin-top: 20px;">

                    <thead class="red">
                        <tr>
                            <th>م </th>
                            <th>تجهيز</th>
                            <th>ملاحظات</th>
                            <th>كمية</th>
                            <th>الصنف</th>
                            <th>سعر الوحدة</th>
                            <th>الاضافه%</th>
                            <th>الخصم %</th>
                            <th>تحميل</th>
                        <tr>
                    </thead>
                    <tbody>
                        {foreach $sellbilldetailData as $sellbilldetail}
                        <tr class="item-row">
                            <td class=""><span>{$sellbilldetail@index+1}</span></td>
                            <td class=""><span></span></td>
                            <td><span>{$sellbilldetail->sellbilldetailtotalpriceWritten}</span></td>
                            <td><span>{$sellbilldetail->sellbilldetailquantity}</span></td>
                            <td><span>{$sellbilldetail->productName}{if {$billsettingsData[60]->billsettingsvalue} eq 0}/
                                    {$sellbilldetail->productCatName}{/if}
                                    {if {$billsettingsData[79]->billsettingsvalue} eq 0}
                                    {if isset($sellbilldetail->sizeName) && $sellbilldetail->sizeName
                                    !=""}/{$sellbilldetail->sizeName}{/if}
                                    {if isset($sellbilldetail->colorName) && $sellbilldetail->colorName
                                    !=""}/{$sellbilldetail->colorName}{/if}
                                    {/if}

                                    {if $sellbilldetail->soldSerialsInDetails != ""} (sn: {$sellbilldetail->soldSerialsInDetails})
                                    {/if}</span></td>
                            <td><span>{$sellbilldetail->sellbilldetailprice}</span></td>
                            <td><span>{if $sellbilldetail->prosellDiscountPerType == 0}{$sellbilldetail->prosellDiscountVal}{/if}</span></td>
                            <td><span>{if $sellbilldetail->prosellDiscountPerType == 1}{$sellbilldetail->prosellDiscountVal}{/if}</span></td>
                            <td><span></span></td>
                        </tr>
                        {/foreach}



                    </tbody>

                    <tfoot>
                        <tr class="item-row">
                            <td colspan="3"><span></span></td>
                            <td
                                style="background-color:#f5f5f5;-webkit-print-color-adjust: exact; -moz-print-color-adjust: exact; print-color-adjust: exact;">
                                <span>{$sellbillData->sellQuantity}</span></td>
                            <td style="background-color:#f5f5f5;-webkit-print-color-adjust: exact; -moz-print-color-adjust: exact; print-color-adjust: exact;"
                                colspan="2"><span>{$totalWritten}</span></td>
                            <td style="background-color:#f5f5f5;-webkit-print-color-adjust: exact; -moz-print-color-adjust: exact; print-color-adjust: exact;"
                                colspan="3"><span>{$sellbillData->sellbillaftertotalbill}</span></td>
                        </tr>
                    </tfoot>

                </table>



                <div style="margin-top: 30px;">

                    <div class="" style="width: 33%;text-align: center;float: right;">
                        <h2>تجهيز</h2>
                    </div>
                    <div class="" style="width: 33%;text-align: center;float: right;">
                        <h2>مراجعة</h2>
                    </div>
                    <div class="" style="width: 33%;text-align: center;float: right;">
                        <h2>تحميل</h2>
                    </div>

                </div>

            </div>



        </div>



        <div id="terms" style="position: fixed;
             bottom: 0px;
             margin-top: 30px;
             margin-left: 10px;
             width: 97%;
             text-align: center;
             color: #444;
             font-size: 12px;
             text-decoration: uppercase;
             padding: 4px 0px 17px;
             margin-bottom: 0;
             display: flex;
             justify-content: space-between;">
            <div></div>
            <h4 class="display:inline-block">1/1</h4>

            <h4 style="text-align: left;color:#676767">    وقت الطباعة <br><span>2:00 PM</span> </h4>
        </div>

    </div>

</body>

</html>