fix: restore missing fields and improve click resilience

src/components/admin/OrderCard.vue

@@ -18,7 +18,10 @@
       <!-- Info Column -->
       <div class="p-6 lg:w-1/2">
         <div class="flex items-center justify-between mb-4">
-          <span class="text-xl font-black text-foreground bg-primary/10 px-3 py-1 rounded-xl tracking-tight">#{{ order.id }}</span>
+          <div class="flex items-center gap-2">
+            <span class="text-xl font-black text-foreground bg-primary/10 px-3 py-1 rounded-xl tracking-tight">#{{ order.id }}</span>
+            <span class="text-[8px] font-mono text-muted-foreground">v3.0-FIX</span>
+          </div>
           <span :class="['flex items-center gap-1.5 px-3 py-1 rounded-full text-[10px] font-bold uppercase tracking-wider', statusColor]">
             <component :is="statusIcon" class="w-3.5 h-3.5" />
             {{ t("statuses." + order.status) }}
@@ -42,7 +45,9 @@
           </div>
         </div>
 
-        <div class="mt-8 grid grid-cols-2 gap-x-8 gap-y-4 border-t border-border/10 pt-6">
+        </div>
+
+        <div class="mt-8 grid grid-cols-2 gap-x-8 gap-y-4 border-t border-border/10 pt-6 px-1">
           <div v-if="order.phone" class="space-y-1">
             <div class="flex items-center justify-between">
               <span class="text-[9px] font-bold uppercase text-muted-foreground tracking-widest">{{ t("admin.fields.phone") }}</span>
@@ -71,19 +76,23 @@
              </div>
              <p class="text-xs font-medium">{{ order.delivery_type === 'cargo' ? t("admin.fields.cargo") : t("admin.fields.pickup") }}</p>
           </div>
-          <div class="space-y-1">
-            <div class="flex items-center justify-between">
-              <span class="text-[9px] font-bold uppercase text-muted-foreground tracking-widest">{{ t("admin.fields.material") }}</span>
-              <button @click.stop="$emit('edit-order', order)" class="p-1 text-primary hover:bg-primary/5 rounded"><Edit2 class="w-2.5 h-2.5" /></button>
+        </div>
+
+        <div class="mt-6 p-4 bg-primary/5 rounded-2xl border border-primary/20 space-y-4">
+          <div class="flex items-center justify-between">
+            <div class="flex flex-col">
+              <span class="text-[9px] font-bold uppercase text-primary/60 tracking-widest">{{ t("admin.fields.material") }} & {{ t("admin.fields.colors") }}</span>
+              <p class="text-sm font-bold">{{ order.material_name || '???' }} — {{ order.color_name || '???' }}</p>
             </div>
-            <p class="text-xs font-medium">{{ order.material_name || '—' }} ({{ order.color_name || '—' }})</p>
+            <button @click.stop="$emit('edit-order', order)" class="bg-primary text-primary-foreground p-3 rounded-xl shadow-lg hover:scale-105 transition-transform">
+              <Edit2 class="w-5 h-5" />
+            </button>
           </div>
-          <div class="space-y-1">
-            <div class="flex items-center justify-between">
-              <span class="text-[9px] font-bold uppercase text-muted-foreground tracking-widest">{{ t("admin.fields.quantity") }}</span>
-              <button @click.stop="$emit('edit-order', order)" class="p-1 text-primary hover:bg-primary/5 rounded"><Edit2 class="w-2.5 h-2.5" /></button>
+          <div class="flex items-center justify-between pt-4 border-t border-primary/10">
+            <div class="flex flex-col">
+              <span class="text-[9px] font-bold uppercase text-primary/60 tracking-widest">{{ t("admin.fields.quantity") }}</span>
+              <p class="text-2xl font-black text-primary">x{{ order.quantity || 1 }}</p>
             </div>
-            <p class="text-xs font-bold text-primary">x{{ order.quantity || 1 }}</p>
           </div>
         </div>