From 47df9253f940bd903821e1322df1bc844033e5a4 Mon Sep 17 00:00:00 2001
From: Hamza-Ayed <hamzaayedflutter@gmail.com>
Date: Sat, 9 May 2026 13:16:23 +0300
Subject: [PATCH] Update: 2026-05-09 13:16:23

---
 public/shell.php | 48 +++++++++++++++++++++++++-----------------------
 1 file changed, 25 insertions(+), 23 deletions(-)

diff --git a/public/shell.php b/public/shell.php
index 1572809..d65e547 100644
--- a/public/shell.php
+++ b/public/shell.php
@@ -2064,30 +2064,32 @@
 
                     <!-- Items Table -->
                     <div x-show="currentInvoice?.items?.length > 0"
-                        style="border:1px solid var(--border); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; max-height:300px;">
-                        <div
-                            style="padding:8px 12px; background:#f8fafc; font-size:11px; font-weight:700; color:var(--text-3); text-transform:uppercase; letter-spacing:0.06em; flex-shrink:0; position:sticky; top:0; z-index:2;">
-                            بنود الفاتورة</div>
-                        <div style="overflow-y:auto; flex:1;">
-                            <table style="width:100%; border-collapse:collapse; font-size:12px;">
-                                <thead style="position:sticky; top:0; background:white; z-index:1; box-shadow:0 1px 2px rgba(0,0,0,0.05);">
-                                    <tr>
-                                        <th style="padding:8px 12px; text-align:right; color:var(--text-3); font-size:11px; border-bottom:1px solid var(--border);">البند</th>
-                                        <th style="padding:8px 12px; text-align:center; color:var(--text-3); font-size:11px; border-bottom:1px solid var(--border);">الكمية</th>
-                                        <th style="padding:8px 12px; text-align:left; color:var(--text-3); font-size:11px; border-bottom:1px solid var(--border);">السعر</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    <template x-for="item in currentInvoice?.items" :key="item.id">
-                                        <tr style="border-bottom:1px solid #f0f4f8;">
-                                            <td style="padding:8px 12px; color:var(--text-2);" x-text="item.description"></td>
-                                            <td style="padding:8px 12px; text-align:center; color:var(--text-3); font-family:'IBM Plex Mono',monospace;" x-text="item.quantity"></td>
-                                            <td style="padding:8px 12px; text-align:left; color:var(--teal); font-family:'IBM Plex Mono',monospace;" x-text="item.unit_price"></td>
-                                        </tr>
-                                    </template>
-                                </tbody>
-                            </table>
+                        style="border:1px solid var(--border); border-radius:10px; overflow-x:auto;">
+                        <div style="padding:8px 12px; background:#f8fafc; font-size:11px; font-weight:700; color:var(--text-3); text-transform:uppercase; letter-spacing:0.06em; position:sticky; top:0; z-index:2; border-bottom:1px solid var(--border);">
+                            بنود الفاتورة
                         </div>
+                        <table style="width:100%; border-collapse:collapse; font-size:11px; min-width:320px;">
+                            <thead style="background:white;">
+                                <tr>
+                                    <th style="padding:8px 10px; text-align:right; color:var(--text-3); font-weight:600; border-bottom:1px solid var(--border);">البند</th>
+                                    <th style="padding:8px 10px; text-align:center; color:var(--text-3); font-weight:600; border-bottom:1px solid var(--border);">الكمية</th>
+                                    <th style="padding:8px 10px; text-align:left; color:var(--text-3); font-weight:600; border-bottom:1px solid var(--border);">السعر</th>
+                                    <th style="padding:8px 10px; text-align:left; color:var(--text-3); font-weight:600; border-bottom:1px solid var(--border);">الضريبة</th>
+                                    <th style="padding:8px 10px; text-align:left; color:var(--text-3); font-weight:600; border-bottom:1px solid var(--border);">الإجمالي</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <template x-for="item in currentInvoice?.items" :key="item.id">
+                                    <tr style="border-bottom:1px solid #f0f4f8;">
+                                        <td style="padding:8px 10px; color:var(--text-2);" x-text="item.description"></td>
+                                        <td style="padding:8px 10px; text-align:center; color:var(--text-3); font-family:'IBM Plex Mono',monospace;" x-text="item.quantity"></td>
+                                        <td style="padding:8px 10px; text-align:left; color:var(--teal); font-family:'IBM Plex Mono',monospace;" x-text="item.unit_price"></td>
+                                        <td style="padding:8px 10px; text-align:left; color:var(--amber); font-family:'IBM Plex Mono',monospace;" x-text="(item.tax_rate || 0) + '%'"></td>
+                                        <td style="padding:8px 10px; text-align:left; font-weight:bold; color:var(--navy); font-family:'IBM Plex Mono',monospace;" x-text="item.line_total"></td>
+                                    </tr>
+                                </template>
+                            </tbody>
+                        </table>
                     </div>
 
                     <!-- QR Code -->