diff --git a/pos.php b/pos.php
index 1e43f58..28d4491 100644
--- a/pos.php
+++ b/pos.php
@@ -157,39 +157,47 @@ require __DIR__ . '/includes/header.php';
 .products-grid {
     flex: 1;
     overflow-y: auto;
-    padding-right: 0.5rem;
+    padding: 0.25rem 0.5rem 0.5rem 0;
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
-    gap: 1.25rem;
+    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
+    gap: 1rem;
     align-content: start;
 }
 .product-card {
     background: #fff;
-    border-radius: 12px;
+    border-radius: 16px;
     overflow: hidden;
-    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
+    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
     cursor: pointer;
-    transition: all 0.2s;
-    border: 1px solid transparent;
+    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
+    border: 1px solid #dbe4f0;
     position: relative;
     user-select: none;
+    display: flex;
+    flex-direction: column;
+    min-height: 252px;
+    color: #1f2937;
+}
+.product-card[hidden] {
+    display: none !important;
 }
 .product-card:hover {
     transform: translateY(-3px);
-    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
-    border-color: #0dcaf0;
+    box-shadow: 0 14px 28px rgba(13, 110, 253, 0.12);
+    border-color: #0d6efd;
 }
 .product-card:active {
-    transform: translateY(0);
+    transform: translateY(-1px);
 }
 .product-img-wrapper {
-    height: 120px;
+    height: 132px;
     width: 100%;
-    background: #f8f9fa;
+    background: linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
     display: flex;
     align-items: center;
     justify-content: center;
     overflow: hidden;
+    border-bottom: 1px solid #edf2f7;
 }
 .product-img {
     width: 100%;
@@ -197,25 +205,41 @@ require __DIR__ . '/includes/header.php';
     object-fit: cover;
 }
 .product-placeholder {
-    font-size: 2rem;
-    color: #dee2e6;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 0.35rem;
+    color: #98a2b3;
+    font-size: 1.9rem;
+}
+.product-placeholder-label {
+    font-size: 0.78rem;
+    font-weight: 700;
+    letter-spacing: 0.01em;
+    color: #6b7280;
 }
 .product-info {
-    padding: 0.75rem;
-    text-align: center;
+    padding: 0.85rem;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    text-align: left;
+    gap: 0.45rem;
+    flex: 1;
 }
 .product-badges {
     display: flex;
-    justify-content: center;
+    justify-content: flex-start;
     gap: 0.35rem;
     flex-wrap: wrap;
-    margin-bottom: 0.4rem;
+    margin-bottom: 0.1rem;
 }
 .product-badge {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    padding: 0.15rem 0.5rem;
+    padding: 0.18rem 0.5rem;
     border-radius: 999px;
     font-size: 0.72rem;
     font-weight: 700;
@@ -230,37 +254,41 @@ require __DIR__ . '/includes/header.php';
     color: #6c757d;
 }
 .product-title {
-    font-size: 0.9rem;
-    font-weight: 600;
-    margin-bottom: 0.35rem;
-    color: #212529;
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
+    font-size: 0.95rem;
+    font-weight: 700;
+    color: #1f2937;
+    line-height: 1.35;
+    min-height: 2.6em;
+    max-height: 2.6em;
     overflow: hidden;
-    line-height: 1.25;
-    min-height: 2.5em;
     word-break: break-word;
 }
 .product-meta {
     display: flex;
     flex-direction: column;
-    gap: 0.15rem;
-    margin-bottom: 0.5rem;
+    gap: 0.2rem;
+    color: #667085;
+    margin-bottom: auto;
+    width: 100%;
 }
 .product-sku,
 .product-created {
-    font-size: 0.76rem;
-    color: #6c757d;
-    line-height: 1.2;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
+    font-size: 0.78rem;
+    line-height: 1.25;
+    word-break: break-word;
 }
 .product-price {
-    font-weight: 700;
+    font-weight: 800;
     color: #0d6efd;
     font-size: 1.05rem;
+    margin-top: 0.15rem;
+}
+[dir="rtl"] .product-info {
+    align-items: flex-end;
+    text-align: right;
+}
+[dir="rtl"] .product-badges {
+    justify-content: flex-end;
 }
 
 /* Cart Styles */
@@ -422,8 +450,17 @@ require __DIR__ . '/includes/header.php';
         <div class="products-grid" id="productsGrid">
             <?php foreach ($catalog as $sku => $item):
                 $itemSkuRaw = (string) $sku;
-                $itemNameRaw = (string) (current_lang() === 'ar' ? $item['name_ar'] : $item['name_en']);
-                $searchTextRaw = $itemNameRaw . ' ' . $itemSkuRaw;
+                $primaryNameRaw = trim((string) (current_lang() === 'ar' ? ($item['name_ar'] ?? '') : ($item['name_en'] ?? '')));
+                $fallbackNameRaw = trim((string) (current_lang() === 'ar' ? ($item['name_en'] ?? '') : ($item['name_ar'] ?? '')));
+                $itemNameRaw = $primaryNameRaw !== ''
+                    ? $primaryNameRaw
+                    : ($fallbackNameRaw !== '' ? $fallbackNameRaw : ('SKU ' . $itemSkuRaw));
+                $searchBits = [
+                    (string) ($item['name_ar'] ?? ''),
+                    (string) ($item['name_en'] ?? ''),
+                    $itemSkuRaw,
+                ];
+                $searchTextRaw = implode(' ', array_filter($searchBits, static fn($value) => trim((string) $value) !== ''));
                 $searchText = function_exists('mb_strtolower')
                     ? mb_strtolower($searchTextRaw, 'UTF-8')
                     : strtolower($searchTextRaw);
@@ -440,11 +477,14 @@ require __DIR__ . '/includes/header.php';
                 <div class="product-card" data-sku="<?= $itemSku ?>" data-name="<?= $itemName ?>" data-price="<?= $itemPrice ?>" data-cat="<?= $itemCat ?>" data-search="<?= h($searchText) ?>" data-created="<?= h($createdAtRaw) ?>" onclick="addToCart('<?= $itemSku ?>')">
                     <div class="product-img-wrapper">
                         <?php if (!empty($imageUrl)):
-                            $imgAlt = h(tr('صورة المنتج', 'Product Image'));
+                            $imgAlt = $itemName;
                         ?>
                             <img src="<?= $imageUrl ?>" alt="<?= $imgAlt ?>" class="product-img" loading="lazy">
                         <?php else: ?>
-                            <i class="bi bi-image product-placeholder" aria-hidden="true"></i>
+                            <div class="product-placeholder" aria-hidden="true">
+                                <i class="bi bi-image"></i>
+                                <span class="product-placeholder-label"><?= h(tr('بدون صورة', 'No image')) ?></span>
+                            </div>
                         <?php endif; ?>
                     </div>
                     <div class="product-info">
@@ -740,7 +780,7 @@ function applyFilters() {
         const matchesSearch = q === '' || searchable.includes(q);
         const matchesCat = (activeCat === 'all' || cat === activeCat);
         
-        card.style.display = (matchesSearch && matchesCat) ? 'block' : 'none';
+        card.hidden = !(matchesSearch && matchesCat);
     });
 }