<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<title>فاتورة</title>
<style>
    @page {
        size: A4;
        margin: 20mm;
    }
    body {
        font-family: "Tahoma", Arial, sans-serif;
        font-size: 14px;
        direction: rtl;
        line-height: 1.6;
    }
    .invoice-container {
        width: 94%;
        margin: auto;
        padding: 20px;
    }
    header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
    header img {
        height: 80px;
    }
    .title {
        font-size: 20px;
        font-weight: bold;
    }
    .details {
        display: flex;
        justify-content: space-between;
        margin-bottom: 15px;
    }
    .details div {
        width: 48%;
    }
    table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 15px;
    }
    table th, table td {
        border: 1px solid #000;
        padding: 6px;
        text-align: center;
    }
    table th {
        background-color: #f0f0f0;
    }
    .totals {
        width: 30%;
        margin-right: auto;
        padding-top: 10px;
        font-size: 14px;
        line-height: 1.8;
    }
    .totals-row {
        display: flex;
        justify-content: space-between;
    }
    .totals-row strong {
        font-weight: bold;
    }
    /*.footer {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 20px;
    }*/
    .footer img {
        text-align: center;
        height: 80px;
        margin: 0 auto;
    }
</style>
{literal}
<script language="javascript" type="text/javascript">
    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);
    }
</script>
{/literal}

</head>
<body onLoad="printDiv()" id="printdiv">

<div class="invoice-container">
    <header>
       
        <div>
             <div class="title">فاتورة</div>
            <strong>{$Programsettingdata->companyname}</strong><br>
            الرقم الضريبي: {$Programsettingdata->taxcard}<br>
            رقم الهاتف: {$Programsettingdata->phone}<br>
            البريد: {$Programsettingdata->email}
        </div>
         <div>
            <img src="../views/default/images/upload/{$Programsettingdata->logo}" alt="Logo"  width="200px">
           
        </div>
    </header>

    <div class="details">
        <div>
            <strong>فاتورة إلى:</strong><br>
            {$sellbillData->tempclientName}<br>
            الرقم الضريبي:  {$clientdata->taxnumber}
        </div>
        <div>
            رقم الفاتورة: {if $sellbillData->taxBillNumber >
                0}{$sellbillData->taxBillNumber}{else}{$sellbillData->sellbillid}{/if}<br>
            التاريخ: {$sellbillData->sellbillsysdate}<br>
            تاريخ الاستحقاق: {$sellbillData->collectionDate}<br>
            حالة: {if $sellbillData->sellbilltotalpayed == 0}غير مدفوعة {else if $sellbillData->sellbilltotalbill == $sellbillData->sellbilltotalpayed }مدفوعة {else}مدفوعة جزئيا {/if}
        </div>
    </div>

    <table>
        <thead>
            <tr>
                <th>رقم</th>
                <th>الصنف</th>
                <th>الكمية</th>
                <th>سعر الوحدة</th>
                <th>الضريبة</th>
                <th>خصم</th>
                <th>الإجمالي</th>
            </tr>
        </thead>
        <tbody>
            {foreach $sellbilldetailData as $sellbilldetail}
            <tr>
                <td>{$sellbilldetail@index+1}</td>
                <td>{$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}
                </td>
                <td>{$sellbilldetail->sellbilldetailquantity}</td>
                <td>{$sellbilldetail->sellbilldetailprice}</td>
                <td> --- </td>
                <td>{$discountvalue}{if $sellbillData->sellbilldiscounttype eq
                    2}(%{$sellbillData->sellbilldiscount}){/if}</td>
                <td>{$sellbilldetail->sellbilldetailtotalprice}</td>
            </tr>
            {/foreach}
            
        </tbody>
    </table>

   <div class="totals">
    <div class="totals-row">
        <span><strong>الإجمالي</strong></span>
        <span><strong>{$sellbillData->sellbilltotalbill} ر.س</strong></span>
    </div>
    <div class="totals-row">
        <span>طريقة الدفع:</span>
        <span>{if $sellbillData->cashPayed > 0}نقدا {/if}{if $sellbillData->cashPayed >0 && $sellbillData->visaPayed > 0} + {/if}{if $sellbillData->visaPayed > 0}فيزا {/if}</span>
    </div>
    <div class="totals-row">
        <span>المبلغ المدفوع:</span>
        <span>{$sellbillData->sellbilltotalpayed} ر.س</span>
    </div>
    <div class="totals-row">
        <span>المبلغ المستحق:</span>
        <span>{$sellbillData->sellbilltotalbill - $sellbillData->sellbilltotalpayed} ر.س</span>
    </div>
</div>

    <div class="footer">
        {if $qrerp > 1}
        <div style="text-align: center;">
            {if $qrerp == 3 || $qrerp == 4}
            <img src="data:image/jpeg;base64,{$base64qr}" style="width:120px;height: 120px;" />
            {/if}
            {if $qrerp == 2 || $qrerp == 4}
            <img src="data:image/jpeg;base64,{$base64qrs}" style="width:120px;height: 120px;" />
            {/if}
        </div>
        {/if}
    </div>
</div>

</body>
</html>
