Spaces:

humanvprojectceo
/

Cafe

Running

App Files Files Community

humanvprojectceo commited on about 22 hours ago

Commit

8e11847

verified ·

1 Parent(s): 15c0e5a

Update cafe.html

Browse files

Files changed (1) hide show

cafe.html +215 -171

cafe.html CHANGED Viewed

@@ -3,12 +3,12 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Cafe AI - پنل مدیریت کافه</title>
-    <!-- لود واژه‌نامه و فوت فارسی زیبا -->
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;700&display=swap" rel="stylesheet">
-    <!-- لود کتابخانه Tailwind CSS برای استایل‌دهی مدرن -->
     <script src="https://cdn.tailwindcss.com"></script>
     <script>
         tailwind.config = {
@@ -18,12 +18,12 @@
                         sans: ['Vazirmatn', 'sans-serif'],
                     },
                     colors: {
-                        cafeDark: '#09090b',       /* مشکی بسیار تیره */
                         cafeCard: '#18181b',       /* خاکستری تیره برای کارت‌ها */
-                        cafeBorder: '#27272a',     /* رنگ حاشیه‌ها */
-                        cafeGold: '#d4af37',       /* رنگ طلایی شاخص */
-                        cafeGoldHover: '#f3cd5c',  /* طلایی روشن‌تر */
-                        cafeAccent: '#f59e0b'      /* کهربایی */
                     }
                 }
             }
@@ -34,29 +34,26 @@
             background-color: #09090b;
             color: #f4f4f5;
         }
-        /* کاستومایز کردن اسکرول‌بار برای هماهنگی با تم تاریک */
         ::-webkit-scrollbar {
-            width: 6px;
         }
         ::-webkit-scrollbar-track {
             background: #18181b;
         }
         ::-webkit-scrollbar-thumb {
             background: #3f3f46;
-            border-radius: 3px;
-        }
-        ::-webkit-scrollbar-thumb:hover {
-            background: #52525b;
         }
     </style>
 </head>
-<body class="min-h-screen flex flex-col font-sans selection:bg-amber-500 selection:text-black">
-    <!-- هدر اصلی پنل مدیریت -->
-    <header class="border-b border-cafeBorder bg-cafeCard/80 backdrop-blur sticky top-0 z-50 px-4 py-3 md:px-8">
         <div class="max-w-7xl mx-auto flex items-center justify-between">
             <div class="flex items-center gap-3">
-                <!-- لوگوی اختصاصی فنجان قهوه هوشمند (SVG) -->
                 <svg class="w-8 h-8 text-cafeGold" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                     <path d="M17 8h1a4 4 0 1 1 0 8h-1" />
                     <path d="M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4Z" />
@@ -65,119 +62,118 @@
                     <line x1="14" y1="2" x2="14" y2="4" />
                 </svg>
                 <div>
-                    <h1 class="text-lg font-bold tracking-wide text-white flex items-center gap-2">
-                        پنل مدیریت <span class="text-cafeGold">Cafe AI</span>
                     </h1>
-                    <p class="text-[10px] text-zinc-400">سیستم نظارت بر سفارشات و هوش مصنوعی نیلا</p>
                 </div>
             </div>
-            <div class="flex items-center gap-4">
-                <span class="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-emerald-500/10 text-emerald-400 border border-emerald-500/20">
-                    <span class="w-1.5 h-1.5 rounded-full bg-emerald-400 animate-pulse"></span>
-                    سیستم فعال است
                 </span>
             </div>
         </div>
     </header>
-    <!-- بدنه اصلی چیدمان دو ستونه -->
     <main class="flex-1 max-w-7xl w-full mx-auto p-4 md:p-6 lg:p-8 grid grid-cols-1 lg:grid-cols-12 gap-6">
-        <!-- ستون سمت راست: مدیریت سفارشات فعال و بارگذاری منو (عرض: ۷ از ۱۲) -->
         <section class="lg:col-span-7 flex flex-col gap-6">
-            <!-- بخش سفارش‌های زنده -->
-            <div class="bg-cafeCard border border-cafeBorder rounded-xl p-5 shadow-2xl">
                 <div class="flex items-center justify-between mb-4 border-b border-cafeBorder pb-3">
-                    <h2 class="text-base font-bold text-white flex items-center gap-2">
                         <svg class="w-5 h-5 text-cafeGold" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" />
                         </svg>
-                        سفارشات جاری آشپزخانه
                     </h2>
-                    <button onclick="fetchActiveOrders()" class="text-xs text-zinc-400 hover:text-cafeGold flex items-center gap-1 transition-all">
-                        <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M4 4v5h.582m15.356 2A8.001 8.001 0 1121.21 15H15" />
                         </svg>
-                        بروزرسانی دستی
                     </button>
                 </div>
-                <!-- لیست سفارشات -->
-                <div id="ordersContainer" class="space-y-4 max-h-[400px] overflow-y-auto pr-1">
-                    <!-- حالت بارگذاری اولیه یا خالی بودن -->
-                    <div class="text-center py-12 text-zinc-500">
-                        در حال بارگذاری سفارشات جاری...
                     </div>
                 </div>
             </div>
-            <!-- بخش بارگذاری و استخراج منو -->
-            <div class="bg-cafeCard border border-cafeBorder rounded-xl p-5 shadow-2xl">
-                <h2 class="text-base font-bold text-white mb-4 flex items-center gap-2 border-b border-cafeBorder pb-3">
                     <svg class="w-5 h-5 text-cafeGold" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12" />
                     </svg>
-                    بارگذاری و به‌روزرسانی هوشمند منو
                 </h2>
-                <p class="text-xs text-zinc-400 mb-4 leading-relaxed">
-                    تصویر منو یا فایل لیست قیمت‌ها را آپلود کنید. دستیار هوشمند نیلا، آیتم‌ها، قیمت‌ها و توضیحات را استخراج کرده و جهت تایید نهایی به شما نمایش می‌دهد.
                 </p>
-                <!-- باکس آپلود فایل -->
-                <div class="border-2 border-dashed border-cafeBorder hover:border-cafeGold/50 rounded-lg p-6 text-center cursor-pointer transition-all bg-cafeDark/30" onclick="document.getElementById('menuFileInput').click()">
                     <input type="file" id="menuFileInput" class="hidden" accept="image/*,application/pdf" onchange="uploadMenuFile(event)">
-                    <div class="flex flex-col items-center gap-2">
-                        <svg class="w-8 h-8 text-zinc-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z" />
                         </svg>
-                        <span class="text-sm text-zinc-300">انتخاب تصویر منو یا فایل متنی</span>
-                        <span class="text-[10px] text-zinc-500">فرمت‌های مجاز: تصاویر (PNG, JPG) یا PDF</span>
                     </div>
                 </div>
-                <!-- اسپینر در حال بارگذاری تحلیل مدل -->
-                <div id="uploadLoader" class="hidden mt-4 text-center py-6 bg-cafeDark/50 rounded-lg border border-cafeBorder">
-                    <div class="inline-block animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-cafeGold mb-2"></div>
-                    <p class="text-xs text-cafeGold">نیلا در حال پردازش سند و استخراج ساختار منو است. لطفاً شکیبا باشید...</p>
                 </div>
-                <!-- ویرایشگر منوی استخراج شده -->
-                <div id="menuEditorContainer" class="hidden mt-6 space-y-4 border-t border-cafeBorder pt-4">
-                    <h3 class="text-sm font-bold text-white flex items-center gap-2 text-amber-400">
                         <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
                         </svg>
-                        بازبینی و ویرایش منوی پیشنهادی هوش مصنوعی
                     </h3>
-                    <div class="overflow-x-auto max-h-[300px] border border-cafeBorder rounded-lg">
-                        <table class="min-w-full divide-y divide-cafeBorder bg-cafeDark/40 text-xs">
                             <thead class="bg-cafeCard">
                                 <tr>
-                                    <th class="px-3 py-2 text-right font-medium text-zinc-400">نام آیتم</th>
-                                    <th class="px-3 py-2 text-right font-medium text-zinc-400">توضیحات/ترکیبات</th>
                                     <th class="px-3 py-2 text-right font-medium text-zinc-400 w-24">قیمت (تومان)</th>
-                                    <th class="px-3 py-2 text-center font-medium text-zinc-400 w-16">عملیات</th>
                                 </tr>
                             </thead>
                             <tbody id="menuEditorTableBody" class="divide-y divide-cafeBorder">
-                                <!-- سطرها داینامیک اضافه میشن -->
                             </tbody>
                         </table>
                     </div>
                     <div class="flex justify-end gap-2">
-                        <button onclick="addEmptyMenuRow()" class="px-3 py-1.5 border border-cafeBorder hover:border-zinc-500 rounded text-xs text-zinc-300 transition-all">
-                            افزودن سطر جدید
                         </button>
-                        <button onclick="saveAndPublishMenu()" class="px-4 py-1.5 bg-emerald-600 hover:bg-emerald-500 rounded text-xs font-bold text-white transition-all flex items-center gap-1.5">
                             <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
                             </svg>
-                            تایید نهایی و به‌روزرسانی زنده منو
                         </button>
                     </div>
                 </div>
@@ -185,13 +181,12 @@
             </div>
         </section>
-        <!-- ستون سمت چپ: چت همکار (ادمین) با نیلا (عرض: ۵ از ۱۲) -->
-        <section class="lg:col-span-5 flex flex-col bg-cafeCard border border-cafeBorder rounded-xl shadow-2xl h-[650px] overflow-hidden">
-            <!-- سربرگ چت -->
-            <div class="px-5 py-4 border-b border-cafeBorder flex items-center justify-between bg-cafeDark/30">
                 <div class="flex items-center gap-3">
-                    <!-- آواتار هوش مصنوعی نیلا مخصوص ادمین -->
                     <div class="w-9 h-9 rounded-full bg-cafeGold/10 border border-cafeGold/30 flex items-center justify-center">
                         <svg class="w-5 h-5 text-cafeGold" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                             <path d="M12 2a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S2 17.523 2 12A10 10 0 0 1 12 2z"/>
@@ -199,13 +194,13 @@
                         </svg>
                     </div>
                     <div>
-                        <h3 class="text-sm font-bold text-white">دستیار هوشمند کافه (Nila)</h3>
-                        <p class="text-[9px] text-emerald-400">اتصال پایدار با مدل gemini-3.1-flash-lite</p>
                     </div>
                 </div>
             </div>
-            <!-- بدنه پیام‌های چت -->
             <div id="chatMessages" class="flex-1 overflow-y-auto p-4 space-y-4">
                 <!-- پیام خوش آمدگویی پیش‌فرض -->
                 <div class="flex gap-2.5 max-w-[85%]">
@@ -215,26 +210,32 @@
                             <path d="M12 8v4l3 3"/>
                         </svg>
                     </div>
-                    <div class="bg-cafeDark/60 border border-cafeBorder text-zinc-200 text-xs rounded-2xl rounded-tr-none px-3.5 py-2.5 leading-relaxed">
-                        سلام همکار گرامی! من نیلا هستم، دستیار هوشمند شما. می‌توانید از همین‌جا با من گفتگو کنید و مواردی مثل ناموجود کردن آیتم‌ها (مثلا: "کیک شکلاتی تموم شد") یا فعال‌سازی مجدد آن‌ها را اعلام کنید تا بلافاصله روی سیستم و منوی مشتریان اعمال کنم.
                     </div>
                 </div>
             </div>
-            <!-- لودر تایپ هوش مصنوعی -->
-            <div id="chatLoader" class="hidden px-4 py-2 flex items-center gap-2 bg-cafeDark/30 text-xs text-zinc-400 border-t border-cafeBorder/50">
-                <div class="flex space-x-1 space-x-reverse">
-                    <span class="w-1.5 h-1.5 bg-cafeGold rounded-full animate-bounce" style="animation-delay: 0.1s"></span>
-                    <span class="w-1.5 h-1.5 bg-cafeGold rounded-full animate-bounce" style="animation-delay: 0.2s"></span>
-                    <span class="w-1.5 h-1.5 bg-cafeGold rounded-full animate-bounce" style="animation-delay: 0.3s"></span>
                 </div>
-                <span>نیلا در حال تفکر...</span>
             </div>
-            <!-- بخش ورودی پیام چت -->
-            <form id="chatForm" onsubmit="sendAdminMessage(event)" class="p-3 border-t border-cafeBorder bg-cafeDark/50 flex gap-2">
-                <input type="text" id="chatInput" placeholder="پیامی برای مدیریت منو بنویسید..." autocomplete="off" class="flex-1 bg-cafeCard border border-cafeBorder text-xs text-zinc-200 placeholder-zinc-500 rounded-lg px-3 py-2.5 focus:outline-none focus:border-cafeGold/60 transition-all">
-                <button type="submit" class="bg-cafeGold hover:bg-cafeGoldHover text-zinc-950 font-bold px-4 py-2 rounded-lg text-xs transition-all flex items-center justify-center flex-shrink-0">
                     <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M14 5l7 7m0 0l-7 7m7-7H3" />
                     </svg>
@@ -245,26 +246,26 @@
     </main>
-    <!-- فوتر پایین پنل -->
-    <footer class="border-t border-cafeBorder py-4 text-center text-[10px] text-zinc-600 bg-cafeDark">
         طراحی و توسعه توسط الگوریتم داده نسترن | کلیه حقوق محفوظ است © ۲۰۲۶
     </footer>
-    <!-- منطق جاوا اسکریپت و پردازش‌های API -->
     <script>
-        // آرشیو پیام‌های چت جاری با نیلا
         let chatHistory = [
-            { role: 'model', content: 'سلام همکار گرامی! من نیلا هستم، دستیار هوشمند شما در مدیریت کافه AI. چطور می‌تونم کمکتون کنم؟' }
         ];
-        // پس از لود شدن کامل صفحه کارهای اولیه را انجام می‌دهیم
         window.addEventListener('DOMContentLoaded', () => {
             fetchActiveOrders();
-            // بروزرسانی خودکار سفارشات هر ۱۰ ثانیه
             setInterval(fetchActiveOrders, 10000);
         });
-        // --- مدیریت سفارشات جاری ---
         async function fetchActiveOrders() {
             const container = document.getElementById('ordersContainer');
@@ -275,11 +276,11 @@
                 if (response.ok) {
                     if (orders.length === 0) {
                         container.innerHTML = `
-                            <div class="text-center py-16 text-zinc-500 border border-dashed border-cafeBorder rounded-xl bg-cafeDark/20">
-                                <svg class="w-10 h-10 text-zinc-600 mx-auto mb-2" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                                 </svg>
-                                در حال حاضر هیچ سفارش معلق و فعالی ثبت نشده است.
                             </div>
                         `;
                         return;
@@ -287,46 +288,44 @@
                     container.innerHTML = '';
                     orders.forEach(order => {
-                        // تولید آیتم‌های لیست سفارش
                         let itemsHtml = '';
                         order.items.forEach(item => {
                             itemsHtml += `
-                                <div class="flex items-center justify-between text-xs bg-cafeDark/50 px-3 py-2 rounded border border-cafeBorder/40">
-                                    <span class="text-zinc-200 font-bold">${item.name}</span>
-                                    <span class="text-cafeGold bg-cafeGold/10 px-2 py-0.5 rounded-full font-bold">تعداد: ${item.quantity}</span>
                                 </div>
                             `;
                         });
-                        // تبدیل زمان ثبت شده یونیکس به ساعت محلی ساده
-                        const orderTime = new Date(order.timestamp * 1000).toLocaleTimeString('fa-IR', { hour: '2-digit', minute: '2-digit' });
                         const cardHtml = `
-                            <div class="border border-cafeBorder hover:border-amber-500/30 rounded-xl p-4 bg-cafeDark/40 transition-all flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
-                                <div class="flex-1 space-y-2">
-                                    <div class="flex items-center gap-3">
-                                        <span class="text-sm font-bold text-white bg-cafeGold/10 border border-cafeGold/30 px-3 py-1 rounded-lg">میز ${order.table}</span>
-                                        <span class="text-[10px] text-zinc-500">ساعت ثبت سفارش: ${orderTime}</span>
                                     </div>
-                                    <div class="grid grid-cols-1 sm:grid-cols-2 gap-2 mt-2">
                                         ${itemsHtml}
                                     </div>
                                 </div>
-                                <button onclick="completeOrder(${order.id})" class="w-full md:w-auto px-4 py-2.5 bg-zinc-800 hover:bg-emerald-700 text-zinc-200 hover:text-white rounded-lg text-xs font-bold transition-all flex items-center justify-center gap-2 border border-zinc-700 hover:border-emerald-600 flex-shrink-0 group">
-                                    <svg class="w-4 h-4 text-zinc-400 group-hover:text-white transition-colors" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
                                         <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
                                     </svg>
-                                    آماده و تحویل داده شد
                                 </button>
                             </div>
                         `;
                         container.insertAdjacentHTML('beforeend', cardHtml);
                     });
                 } else {
-                    container.innerHTML = `<div class="text-center py-6 text-rose-500 text-xs">بروز خطا در بازیابی اطلاعات سفارشات از سرور.</div>`;
                 }
             } catch (err) {
-                container.innerHTML = `<div class="text-center py-6 text-rose-500 text-xs">خطای اتصال به سرور: ${err.message}</div>`;
             }
         }
@@ -340,64 +339,110 @@
                 const result = await response.json();
                 if (response.ok && result.success) {
-                    // بروزرسانی آنی لیست پس از ثبت اتمام سفارش
                     fetchActiveOrders();
                 } else {
-                    alert(result.error || "خطایی در تغییر وضعیت سفارش رخ داد.");
                 }
             } catch (err) {
-                alert("خطای شبکه: " + err.message);
             }
         }
-        // --- چت ادمین با هوش مصنوعی نیلا ---
         async function sendAdminMessage(e) {
             e.preventDefault();
             const input = document.getElementById('chatInput');
-            const messageText = input.value.trim();
-            if (!messageText) return;
-            // نمایش پیام ادمین در صفحه چت
-            appendChatMessage('user', messageText);
             input.value = '';
-            // افزودن به سوابق گفتگو جهت ارسال به مدل
-            chatHistory.push({ role: 'user', content: messageText });
-            // نمایش افکت در حال تفکر نیلا
-            const loader = document.getElementById('chatLoader');
-            loader.classList.remove('hidden');
             try {
                 const response = await fetch('/api/admin/chat', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({ messages: chatHistory })
                 });
                 const data = await response.json();
-                loader.classList.add('hidden');
                 if (response.ok && data.success) {
-                    appendChatMessage('model', data.response);
-                    chatHistory.push({ role: 'model', content: data.response });
                 } else {
-                    appendChatMessage('model', data.error || 'خطایی در تولید پاسخ پیش آمد. لطفاً اتصال سرور و کلید API را ارزیابی نمایید.');
                 }
             } catch (err) {
                 loader.classList.add('hidden');
-                appendChatMessage('model', 'خطا در ارتباط با سرور رخ داده است: ' + err.message);
             }
         }
         function appendChatMessage(role, content) {
             const container = document.getElementById('chatMessages');
-            let messageHtml = '';
             if (role === 'user') {
-                messageHtml = `
                     <div class="flex justify-end gap-2.5 max-w-[85%] mr-auto">
                         <div class="bg-amber-500/10 border border-amber-500/20 text-zinc-100 text-xs rounded-2xl rounded-tl-none px-3.5 py-2.5 leading-relaxed">
                             ${content}
@@ -405,7 +450,7 @@
                     </div>
                 `;
             } else {
-                messageHtml = `
                     <div class="flex gap-2.5 max-w-[85%]">
                         <div class="w-7 h-7 rounded-full bg-cafeGold/10 border border-cafeGold/30 flex items-center justify-center flex-shrink-0">
                             <svg class="w-4 h-4 text-cafeGold" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
@@ -413,30 +458,30 @@
                                 <path d="M12 8v4l3 3"/>
                             </svg>
                         </div>
-                        <div class="bg-cafeDark/60 border border-cafeBorder text-zinc-200 text-xs rounded-2xl rounded-tr-none px-3.5 py-2.5 leading-relaxed">
                             ${content}
                         </div>
                     </div>
                 `;
             }
-            container.insertAdjacentHTML('beforeend', messageHtml);
-            // اسکرول اتوماتیک به انتهای چت باکس
             container.scrollTop = container.scrollHeight;
         }
-        // --- بارگذاری تصویر منو و ویرایش هوشمند منو ---
         async function uploadMenuFile(e) {
             const file = e.target.files[0];
             if (!file) return;
             const loader = document.getElementById('uploadLoader');
-            const editorContainer = document.getElementById('menuEditorContainer');
             loader.classList.remove('hidden');
-            editorContainer.classList.add('hidden');
             const formData = new FormData();
             formData.append('file', file);
@@ -452,13 +497,13 @@
                 if (response.ok && data.success) {
                     renderMenuEditor(data.extracted_menu);
-                    editorContainer.classList.remove('hidden');
                 } else {
-                    alert(data.error || 'استخراج منو ناموفق بود.');
                 }
             } catch (err) {
                 loader.classList.add('hidden');
-                alert('خطا در بارگذاری فایل: ' + err.message);
             }
         }
@@ -468,18 +513,18 @@
             menuItems.forEach((item, index) => {
                 const row = `
-                    <tr data-index="${index}" class="hover:bg-cafeCard/40">
                         <td class="px-2 py-2">
-                            <input type="text" class="menu-name w-full bg-cafeCard border border-cafeBorder rounded px-2 py-1 text-zinc-200 focus:border-cafeGold/40 focus:outline-none" value="${item.name || ''}">
                         </td>
                         <td class="px-2 py-2">
-                            <input type="text" class="menu-desc w-full bg-cafeCard border border-cafeBorder rounded px-2 py-1 text-zinc-200 focus:border-cafeGold/40 focus:outline-none" value="${item.description || ''}">
                         </td>
                         <td class="px-2 py-2">
-                            <input type="text" class="menu-price w-full bg-cafeCard border border-cafeBorder rounded px-2 py-1 text-zinc-200 focus:border-cafeGold/40 focus:outline-none" value="${item.price || ''}">
                         </td>
                         <td class="px-2 py-2 text-center">
-                            <button onclick="removeMenuRow(this)" class="p-1 hover:text-rose-500 text-zinc-500 transition-colors">
                                 <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                                 </svg>
@@ -494,18 +539,18 @@
         function addEmptyMenuRow() {
             const tbody = document.getElementById('menuEditorTableBody');
             const row = `
-                <tr class="hover:bg-cafeCard/40">
                     <td class="px-2 py-2">
-                        <input type="text" class="menu-name w-full bg-cafeCard border border-cafeBorder rounded px-2 py-1 text-zinc-200 focus:border-cafeGold/40 focus:outline-none" placeholder="مثال: لاته">
                     </td>
                     <td class="px-2 py-2">
-                        <input type="text" class="menu-desc w-full bg-cafeCard border border-cafeBorder rounded px-2 py-1 text-zinc-200 focus:border-cafeGold/40 focus:outline-none" placeholder="شیر داغ، قهوه...">
                     </td>
                     <td class="px-2 py-2">
-                        <input type="text" class="menu-price w-full bg-cafeCard border border-cafeBorder rounded px-2 py-1 text-zinc-200 focus:border-cafeGold/40 focus:outline-none" placeholder="۷۰,۰۰۰">
                     </td>
                     <td class="px-2 py-2 text-center">
-                        <button onclick="removeMenuRow(this)" class="p-1 hover:text-rose-500 text-zinc-500 transition-colors">
                             <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                             </svg>
@@ -523,25 +568,25 @@
         async function saveAndPublishMenu() {
             const tbody = document.getElementById('menuEditorTableBody');
             const rows = tbody.querySelectorAll('tr');
-            const updatedMenu = [];
             rows.forEach(row => {
                 const name = row.querySelector('.menu-name').value.trim();
                 const description = row.querySelector('.menu-desc').value.trim();
                 const price = row.querySelector('.menu-price').value.trim();
                 if (name) {
-                    updatedMenu.push({
                         name: name,
                         description: description,
                         price: price,
-                        available: true // به طور پیش‌فرض آیتم‌های جدید را موجود ثبت می‌کنیم
                     });
                 }
             });
-            if (updatedMenu.length === 0) {
-                alert("امکان انتشار منوی خالی وجود ندارد. حداقل یک سطر با نام معتبر ثبت کنید.");
                 return;
             }
@@ -549,20 +594,19 @@
                 const response = await fetch('/api/admin/save_menu', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({ menu: updatedMenu })
                 });
                 const data = await response.json();
                 if (response.ok && data.success) {
-                    alert("منوی جدید ثبت و در لحظه برای تمامی مشتریان و دستیار نیلا فعال شد!");
                     document.getElementById('menuEditorContainer').classList.add('hidden');
-                    // به نیلا در گفتگو اطلاع می‌دهیم منو تغییر کرده است
-                    appendChatMessage('model', 'منوی جدید سیستم با موفقیت به سیستم مرکزی فرستاده و اعمال شد. از این پس منوی مشتریان را از روی پایگاه‌داده جدید پردازش خواهم کرد.');
                 } else {
-                    alert(data.error || 'خطا در ثبت منو.');
                 }
             } catch (err) {
-                alert('خطای ارتباط با سرور: ' + err.message);
             }
         }
     </script>

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Cafe AI - پنل پیشرفته مدیریت کافه</title>
+    <!-- بارگذاری قلم فارسی وزیر متین -->
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;700&display=swap" rel="stylesheet">
+    <!-- بارگذاری فریمورک سی‌اس‌اس Tailwind برای استایل‌دهی مدرن -->
     <script src="https://cdn.tailwindcss.com"></script>
     <script>
         tailwind.config = {
                         sans: ['Vazirmatn', 'sans-serif'],
                     },
                     colors: {
+                        cafeDark: '#09090b',       /* مشکی مطلق برای پس‌زمینه */
                         cafeCard: '#18181b',       /* خاکستری تیره برای کارت‌ها */
+                        cafeBorder: '#27272a',     /* خطوط راهنما */
+                        cafeGold: '#d4af37',       /* طلایی سنتی کافه */
+                        cafeGoldHover: '#f3cd5c',  /* طلایی روشن */
+                        cafeRed: '#ef4444'         /* زنگ خطر و حذف */
                     }
                 }
             }
             background-color: #09090b;
             color: #f4f4f5;
         }
+        /* تنظیمات اسکرول‌بار اختصاصی و باریک برای پنل مدیریت */
         ::-webkit-scrollbar {
+            width: 4px;
         }
         ::-webkit-scrollbar-track {
             background: #18181b;
         }
         ::-webkit-scrollbar-thumb {
             background: #3f3f46;
+            border-radius: 2px;
         }
     </style>
 </head>
+<body class="min-h-screen flex flex-col font-sans selection:bg-amber-500 selection:text-black overflow-x-hidden">
+    <!-- بخش سربرگ (Header) پنل مدیریت -->
+    <header class="border-b border-cafeBorder bg-cafeCard/70 backdrop-blur sticky top-0 z-50 px-4 py-3 md:px-8">
         <div class="max-w-7xl mx-auto flex items-center justify-between">
             <div class="flex items-center gap-3">
+                <!-- لوگوی وکتور فنجان قهوه هوشمند -->
                 <svg class="w-8 h-8 text-cafeGold" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                     <path d="M17 8h1a4 4 0 1 1 0 8h-1" />
                     <path d="M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4Z" />
                     <line x1="14" y1="2" x2="14" y2="4" />
                 </svg>
                 <div>
+                    <h1 class="text-base font-bold text-white flex items-center gap-2">
+                        پنل مدیریت ادمین <span class="text-cafeGold">Cafe AI</span>
                     </h1>
+                    <p class="text-[9px] text-zinc-500">نظارت بر سفارشات آشپزخانه و تنظیم منو با هوش مصنوعی نیلا</p>
                 </div>
             </div>
+            <div class="flex items-center gap-3">
+                <span class="inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-[10px] font-medium bg-emerald-500/10 text-emerald-400 border border-emerald-500/20">
+                    <span class="w-1 h-1 rounded-full bg-emerald-400 animate-pulse"></span>
+                    سیستم مانیتورینگ زنده
                 </span>
             </div>
         </div>
     </header>
+    <!-- چیدمان گرید دو ستونه کلی -->
     <main class="flex-1 max-w-7xl w-full mx-auto p-4 md:p-6 lg:p-8 grid grid-cols-1 lg:grid-cols-12 gap-6">
+        <!-- ستون سمت راست: لیست سفارشات فعال + ماژول آپلود منو (۷ از ۱۲) -->
         <section class="lg:col-span-7 flex flex-col gap-6">
+            <!-- باکس سفارشات در حال انتظار در آشپزخانه -->
+            <div class="bg-cafeCard border border-cafeBorder rounded-2xl p-5 shadow-xl">
                 <div class="flex items-center justify-between mb-4 border-b border-cafeBorder pb-3">
+                    <h2 class="text-sm font-bold text-white flex items-center gap-2">
                         <svg class="w-5 h-5 text-cafeGold" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-3 7h3m-3 4h3m-6-4h.01M9 16h.01" />
                         </svg>
+                        سفارشات جدید و معلق آشپزخانه
                     </h2>
+                    <button onclick="fetchActiveOrders()" class="text-[10px] text-zinc-400 hover:text-cafeGold flex items-center gap-1 transition-all">
+                        <svg class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M4 4v5h.582m15.356 2A8.001 8.001 0 1121.21 15H15" />
                         </svg>
+                        بروزرسانی وضعیت
                     </button>
                 </div>
+                <!-- ظرف دربرگیرنده کارت‌های سفارش زنده -->
+                <div id="ordersContainer" class="space-y-4 max-h-[350px] overflow-y-auto pr-1">
+                    <div class="text-center py-12 text-xs text-zinc-500">
+                        در حال بارگذاری لیست سفارشات جاری آشپزخانه...
                     </div>
                 </div>
             </div>
+            <!-- بخش بارگذاری تصویر منو و استخراج هوشمند توسط هوش مصنوعی -->
+            <div class="bg-cafeCard border border-cafeBorder rounded-2xl p-5 shadow-xl space-y-4">
+                <h2 class="text-sm font-bold text-white flex items-center gap-2 border-b border-cafeBorder pb-3">
                     <svg class="w-5 h-5 text-cafeGold" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12" />
                     </svg>
+                    استخراج منوی فیزیکی با هوش مصنوعی
                 </h2>
+                <p class="text-[11px] text-zinc-400 leading-relaxed">
+                    با بارگذاری تصویر منو یا فاکتور قیمت‌های کافه، دستیار هوشمند نیلا به صورت خودکار تمام عنوان‌ها، توضیحات و قیمت‌ها را برای شما استخراج می‌کند تا پس از بازبینی و ویرایش آن را ثبت نهایی کنید.
                 </p>
+                <!-- باکس رها کردن فایل جهت آپلود -->
+                <div class="border-2 border-dashed border-cafeBorder hover:border-cafeGold/40 rounded-xl p-6 text-center cursor-pointer transition-all bg-cafeDark/20" onclick="document.getElementById('menuFileInput').click()">
                     <input type="file" id="menuFileInput" class="hidden" accept="image/*,application/pdf" onchange="uploadMenuFile(event)">
+                    <div class="flex flex-col items-center gap-2.5">
+                        <svg class="w-8 h-8 text-zinc-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z" />
                         </svg>
+                        <span class="text-xs text-zinc-300">تصویر یا سند منو را جهت پردازش انتخاب کنید</span>
+                        <span class="text-[9px] text-zinc-500">پشتیبانی از فرمت‌های تصویری و PDF متنی</span>
                     </div>
                 </div>
+                <!-- افکت بارگذاری در زمان استخراج تصویر منو توسط مدل -->
+                <div id="uploadLoader" class="hidden text-center py-6 bg-cafeDark/40 rounded-xl border border-cafeBorder">
+                    <div class="inline-block animate-spin rounded-full h-7 w-7 border-t-2 border-b-2 border-cafeGold mb-2"></div>
+                    <p class="text-[11px] text-cafeGold">نیلا در حال تحلیل بصری و استخراج محتوای منو است. فرآیند ممکن است چند لحظه طول بکشد...</p>
                 </div>
+                <!-- ویرایشگر اقلام استخراج شده منو -->
+                <div id="menuEditorContainer" class="hidden space-y-4 border-t border-cafeBorder pt-4 transition-all">
+                    <h3 class="text-xs font-bold text-amber-400 flex items-center gap-1.5">
                         <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
                         </svg>
+                        آیتم‌های استخراج شده جهت ویرای�� و انتشار
                     </h3>
+                    <div class="overflow-x-auto max-h-[250px] border border-cafeBorder rounded-xl">
+                        <table class="min-w-full divide-y divide-cafeBorder bg-cafeDark/30 text-[11px]">
                             <thead class="bg-cafeCard">
                                 <tr>
+                                    <th class="px-3 py-2 text-right font-medium text-zinc-400">نام محصول</th>
+                                    <th class="px-3 py-2 text-right font-medium text-zinc-400">توضیحات و ترکیبات</th>
                                     <th class="px-3 py-2 text-right font-medium text-zinc-400 w-24">قیمت (تومان)</th>
+                                    <th class="px-3 py-2 text-center font-medium text-zinc-400 w-16">حذف</th>
                                 </tr>
                             </thead>
                             <tbody id="menuEditorTableBody" class="divide-y divide-cafeBorder">
+                                <!-- اقلام داینامیک اضافه خواهند شد -->
                             </tbody>
                         </table>
                     </div>
                     <div class="flex justify-end gap-2">
+                        <button onclick="addEmptyMenuRow()" class="px-3 py-1.5 border border-cafeBorder hover:border-zinc-500 rounded-lg text-[10px] text-zinc-300 transition-all">
+                            افزودن محصول جدید
                         </button>
+                        <button onclick="saveAndPublishMenu()" class="px-4 py-1.5 bg-emerald-600 hover:bg-emerald-500 rounded-lg text-[11px] font-bold text-white transition-all flex items-center gap-1.5">
                             <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
                             </svg>
+                            انتشار منوی نهایی و همگام‌سازی زنده
                         </button>
                     </div>
                 </div>
             </div>
         </section>
+        <!-- ستون سمت چپ: چت همکار با هوش مصنوعی نیلا (۵ از ۱۲) -->
+        <section class="lg:col-span-5 flex flex-col bg-cafeCard border border-cafeBorder rounded-2xl shadow-xl h-[630px] overflow-hidden">
+            <!-- هدر چت ادمین -->
+            <div class="px-5 py-4 border-b border-cafeBorder flex items-center justify-between bg-cafeDark/20">
                 <div class="flex items-center gap-3">
                     <div class="w-9 h-9 rounded-full bg-cafeGold/10 border border-cafeGold/30 flex items-center justify-center">
                         <svg class="w-5 h-5 text-cafeGold" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                             <path d="M12 2a10 10 0 0 1 10 10c0 5.523-4.477 10-10 10S2 17.523 2 12A10 10 0 0 1 12 2z"/>
                         </svg>
                     </div>
                     <div>
+                        <h3 class="text-xs font-bold text-white">دستیار هوشمند ادمین (Nila)</h3>
+                        <p class="text-[9px] text-zinc-500">مدیریت موجودی منو از طریق مکالمه زنده</p>
                     </div>
                 </div>
             </div>
+            <!-- بخش نمایش پیام‌های چت -->
             <div id="chatMessages" class="flex-1 overflow-y-auto p-4 space-y-4">
                 <!-- پیام خوش آمدگویی پیش‌فرض -->
                 <div class="flex gap-2.5 max-w-[85%]">
                             <path d="M12 8v4l3 3"/>
                         </svg>
                     </div>
+                    <div class="bg-cafeDark/50 border border-cafeBorder text-zinc-200 text-xs rounded-2xl rounded-tr-none px-3.5 py-2.5 leading-relaxed">
+                        سلام ادمین محترم! من نیلا هستم، آماده تغییر موجودی اقلام منو از طریق گفتگو. برای مثال کافیست بنویسید: "کروسان ساده تموم شد" یا "لاته رو موجود کن" تا سریعاً تغییرات روی پنل کاربری مشتریان نیز اعمال گردد.
                     </div>
                 </div>
             </div>
+            <!-- کنترلر استریمینگ و تایپ هوش مصنوعی -->
+            <div id="chatLoader" class="hidden px-4 py-2 flex items-center justify-between bg-cafeDark/30 text-[10px] text-zinc-400 border-t border-cafeBorder/50">
+                <div class="flex items-center gap-2">
+                    <div class="flex space-x-1 space-x-reverse">
+                        <span class="w-1.5 h-1.5 bg-cafeGold rounded-full animate-bounce" style="animation-delay: 0.1s"></span>
+                        <span class="w-1.5 h-1.5 bg-cafeGold rounded-full animate-bounce" style="animation-delay: 0.2s"></span>
+                        <span class="w-1.5 h-1.5 bg-cafeGold rounded-full animate-bounce" style="animation-delay: 0.3s"></span>
+                    </div>
+                    <span>نیلا در حال پردازش دستور شماست...</span>
                 </div>
+                <button onclick="stopAdminChat()" class="px-2.5 py-1 bg-rose-950/40 border border-rose-800/40 hover:bg-rose-900/60 rounded text-[9px] text-rose-400 font-bold transition-all">
+                    توقف پردازش
+                </button>
             </div>
+            <!-- بخش ورودی پیام ادمین -->
+            <form id="chatForm" onsubmit="sendAdminMessage(event)" class="p-3 border-t border-cafeBorder bg-cafeDark/40 flex gap-2">
+                <input type="text" id="chatInput" placeholder="پیامی برای مدیریت موجودی بنویسید..." autocomplete="off" class="flex-1 bg-cafeCard border border-cafeBorder text-xs text-zinc-200 placeholder-zinc-500 rounded-lg px-3.5 py-2.5 focus:outline-none focus:border-cafeGold/50 transition-all">
+                <button type="submit" id="sendBtn" class="bg-cafeGold hover:bg-cafeGoldHover text-zinc-950 font-bold px-4 py-2.5 rounded-lg text-xs transition-all flex items-center justify-center flex-shrink-0">
                     <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M14 5l7 7m0 0l-7 7m7-7H3" />
                     </svg>
     </main>
+    <!-- فوتر پایانی سایت -->
+    <footer class="border-t border-cafeBorder py-4 text-center text-[10px] text-zinc-600 bg-cafeDark/80">
         طراحی و توسعه توسط الگوریتم داده نسترن | کلیه حقوق محفوظ است © ۲۰۲۶
     </footer>
+    <!-- منطق جاوا اسکریپت برنامه ادمین -->
     <script>
         let chatHistory = [
+            { role: 'model', content: 'سلام ادمین محترم! من نیلا هستم، آماده تغییر موجودی اقلام منو از طریق گفتگو. برای مثال کافیست بنویسید: "کروسان ساده تموم شد" یا "لاته رو موجود کن" تا سریعاً تغییرات روی پنل کاربری مشتریان نیز اعمال گردد.' }
         ];
+        let abortController = null;
+        let isGenerating = false;
         window.addEventListener('DOMContentLoaded', () => {
             fetchActiveOrders();
+            // بروزرسانی اتوماتیک سفارشات در دوره‌های زمانی ۱۰ ثانیه‌ای
             setInterval(fetchActiveOrders, 10000);
         });
+        // --- مانیتورینگ سفارشات فعال ---
         async function fetchActiveOrders() {
             const container = document.getElementById('ordersContainer');
                 if (response.ok) {
                     if (orders.length === 0) {
                         container.innerHTML = `
+                            <div class="text-center py-16 text-zinc-500 border border-dashed border-cafeBorder rounded-xl bg-cafeDark/10">
+                                <svg class="w-9 h-9 text-zinc-600 mx-auto mb-2" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
                                 </svg>
+                                در حال حاضر هیچ سفارش فعالی در صف انتظار نیست.
                             </div>
                         `;
                         return;
                     container.innerHTML = '';
                     orders.forEach(order => {
                         let itemsHtml = '';
                         order.items.forEach(item => {
                             itemsHtml += `
+                                <div class="flex items-center justify-between text-[11px] bg-cafeDark/50 px-2.5 py-1.5 rounded border border-cafeBorder/40">
+                                    <span class="text-zinc-300 font-bold">${item.name}</span>
+                                    <span class="text-cafeGold bg-cafeGold/10 px-2 py-0.5 rounded font-bold">تعداد: ${item.quantity}</span>
                                 </div>
                             `;
                         });
+                        const timeString = new Date(order.timestamp * 1000).toLocaleTimeString('fa-IR', { hour: '2-digit', minute: '2-digit' });
                         const cardHtml = `
+                            <div class="border border-cafeBorder hover:border-amber-500/20 rounded-xl p-4 bg-cafeDark/30 transition-all flex flex-col md:flex-row justify-between items-start md:items-center gap-3">
+                                <div class="flex-1 space-y-2 w-full">
+                                    <div class="flex items-center justify-between md:justify-start gap-3 w-full">
+                                        <span class="text-xs font-bold text-white bg-cafeGold/10 border border-cafeGold/20 px-2.5 py-1 rounded-lg">میز شماره ${order.table}</span>
+                                        <span class="text-[9px] text-zinc-500">زمان ثبت: ${timeString}</span>
                                     </div>
+                                    <div class="grid grid-cols-1 sm:grid-cols-2 gap-1.5 mt-2">
                                         ${itemsHtml}
                                     </div>
                                 </div>
+                                <button onclick="completeOrder(${order.id})" class="w-full md:w-auto px-3.5 py-2 bg-zinc-800 hover:bg-emerald-700 text-zinc-200 hover:text-white rounded-lg text-[10px] font-bold transition-all flex items-center justify-center gap-1.5 border border-zinc-700 hover:border-emerald-600 flex-shrink-0 group">
+                                    <svg class="w-3.5 h-3.5 text-zinc-400 group-hover:text-white transition-colors" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
                                         <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
                                     </svg>
+                                    تحویل نهایی و حذف سفارش
                                 </button>
                             </div>
                         `;
                         container.insertAdjacentHTML('beforeend', cardHtml);
                     });
                 } else {
+                    container.innerHTML = `<div class="text-center py-6 text-rose-500 text-xs">خطا در دریافت لیست سفارشات از پایگاه داده.</div>`;
                 }
             } catch (err) {
+                container.innerHTML = `<div class="text-center py-6 text-rose-500 text-xs">قطع اتصال با سرور: ${err.message}</div>`;
             }
         }
                 const result = await response.json();
                 if (response.ok && result.success) {
                     fetchActiveOrders();
                 } else {
+                    alert(result.error || "تغییر وضعیت سفارش با خطا مواجه شد.");
                 }
             } catch (err) {
+                alert("خطای سیستم در برقراری ارتباط: " + err.message);
             }
         }
+        // --- مکالمه مدیریت با نیلا ---
         async function sendAdminMessage(e) {
             e.preventDefault();
+            if (isGenerating) return;
             const input = document.getElementById('chatInput');
+            const text = input.value.trim();
+            if (!text) return;
+            appendChatMessage('user', text);
             input.value = '';
+            chatHistory.push({ role: 'user', content: text });
+            isGenerating = true;
+            toggleChatLoading(true);
+            abortController = new AbortController();
             try {
                 const response = await fetch('/api/admin/chat', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ messages: chatHistory }),
+                    signal: abortController.signal
                 });
                 const data = await response.json();
+                toggleChatLoading(false);
+                isGenerating = false;
                 if (response.ok && data.success) {
+                    // شبیه‌سازی لتر به لتر پاسخ هوش مصنوعی برای انیمیشن زیباتر
+                    const botBubbleId = appendChatMessage('model', '');
+                    const botBubble = document.getElementById(botBubbleId);
+                    let i = 0;
+                    const textResponse = data.response;
+                    function typeText() {
+                        if (i < textResponse.length && !abortController.signal.aborted) {
+                            botBubble.innerText += textResponse.charAt(i);
+                            i++;
+                            document.getElementById('chatMessages').scrollTop = document.getElementById('chatMessages').scrollHeight;
+                            setTimeout(typeText, 8);
+                        } else {
+                            chatHistory.push({ role: 'model', content: textResponse });
+                        }
+                    }
+                    typeText();
                 } else {
+                    appendChatMessage('model', data.error || 'پاسخی از سمت دستیار هوشمند دریافت نشد.');
                 }
             } catch (err) {
+                toggleChatLoading(false);
+                isGenerating = false;
+                if (err.name !== 'AbortError') {
+                    appendChatMessage('model', 'خطا در شبکه رخ داده است: ' + err.message);
+                }
+            }
+        }
+        function stopAdminChat() {
+            if (abortController) {
+                abortController.abort();
+            }
+            toggleChatLoading(false);
+            isGenerating = false;
+        }
+        function toggleChatLoading(loading) {
+            const loader = document.getElementById('chatLoader');
+            const sendBtn = document.getElementById('sendBtn');
+            const input = document.getElementById('chatInput');
+            if (loading) {
+                loader.classList.remove('hidden');
+                sendBtn.disabled = true;
+                input.disabled = true;
+            } else {
                 loader.classList.add('hidden');
+                sendBtn.disabled = false;
+                input.disabled = false;
             }
         }
         function appendChatMessage(role, content) {
             const container = document.getElementById('chatMessages');
+            const bubbleId = 'bubble-admin-' + Date.now();
+            let html = '';
             if (role === 'user') {
+                html = `
                     <div class="flex justify-end gap-2.5 max-w-[85%] mr-auto">
                         <div class="bg-amber-500/10 border border-amber-500/20 text-zinc-100 text-xs rounded-2xl rounded-tl-none px-3.5 py-2.5 leading-relaxed">
                             ${content}
                     </div>
                 `;
             } else {
+                html = `
                     <div class="flex gap-2.5 max-w-[85%]">
                         <div class="w-7 h-7 rounded-full bg-cafeGold/10 border border-cafeGold/30 flex items-center justify-center flex-shrink-0">
                             <svg class="w-4 h-4 text-cafeGold" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                 <path d="M12 8v4l3 3"/>
                             </svg>
                         </div>
+                        <div id="${bubbleId}" class="bg-cafeDark/50 border border-cafeBorder text-zinc-200 text-xs rounded-2xl rounded-tr-none px-3.5 py-2.5 leading-relaxed">
                             ${content}
                         </div>
                     </div>
                 `;
             }
+            container.insertAdjacentHTML('beforeend', html);
             container.scrollTop = container.scrollHeight;
+            return bubbleId;
         }
+        // --- استخراج هوشمند و مدیریت فیزیکی منو ---
         async function uploadMenuFile(e) {
             const file = e.target.files[0];
             if (!file) return;
             const loader = document.getElementById('uploadLoader');
+            const editor = document.getElementById('menuEditorContainer');
             loader.classList.remove('hidden');
+            editor.classList.add('hidden');
             const formData = new FormData();
             formData.append('file', file);
                 if (response.ok && data.success) {
                     renderMenuEditor(data.extracted_menu);
+                    editor.classList.remove('hidden');
                 } else {
+                    alert(data.error || 'عدم توانایی مدل در استخراج اقلام منو.');
                 }
             } catch (err) {
                 loader.classList.add('hidden');
+                alert('خطا در ارسال سند: ' + err.message);
             }
         }
             menuItems.forEach((item, index) => {
                 const row = `
+                    <tr class="hover:bg-cafeCard/30 transition-colors">
                         <td class="px-2 py-2">
+                            <input type="text" class="menu-name w-full bg-cafeCard border border-cafeBorder rounded px-2.5 py-1 text-zinc-200 focus:border-cafeGold/50 focus:outline-none" value="${item.name || ''}">
                         </td>
                         <td class="px-2 py-2">
+                            <input type="text" class="menu-desc w-full bg-cafeCard border border-cafeBorder rounded px-2.5 py-1 text-zinc-200 focus:border-cafeGold/50 focus:outline-none" value="${item.description || ''}">
                         </td>
                         <td class="px-2 py-2">
+                            <input type="text" class="menu-price w-full bg-cafeCard border border-cafeBorder rounded px-2.5 py-1 text-zinc-200 focus:border-cafeGold/50 focus:outline-none" value="${item.price || ''}">
                         </td>
                         <td class="px-2 py-2 text-center">
+                            <button onclick="removeMenuRow(this)" class="p-1 text-zinc-500 hover:text-rose-500 transition-colors">
                                 <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                                 </svg>
         function addEmptyMenuRow() {
             const tbody = document.getElementById('menuEditorTableBody');
             const row = `
+                <tr class="hover:bg-cafeCard/30 transition-colors">
                     <td class="px-2 py-2">
+                        <input type="text" class="menu-name w-full bg-cafeCard border border-cafeBorder rounded px-2.5 py-1 text-zinc-200 focus:border-cafeGold/50 focus:outline-none" placeholder="نام محصول">
                     </td>
                     <td class="px-2 py-2">
+                        <input type="text" class="menu-desc w-full bg-cafeCard border border-cafeBorder rounded px-2.5 py-1 text-zinc-200 focus:border-cafeGold/50 focus:outline-none" placeholder="توضیحات کوتاه">
                     </td>
                     <td class="px-2 py-2">
+                        <input type="text" class="menu-price w-full bg-cafeCard border border-cafeBorder rounded px-2.5 py-1 text-zinc-200 focus:border-cafeGold/50 focus:outline-none" placeholder="مثال: ۵۰,۰۰۰">
                     </td>
                     <td class="px-2 py-2 text-center">
+                        <button onclick="removeMenuRow(this)" class="p-1 text-zinc-500 hover:text-rose-500 transition-colors">
                             <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                             </svg>
         async function saveAndPublishMenu() {
             const tbody = document.getElementById('menuEditorTableBody');
             const rows = tbody.querySelectorAll('tr');
+            const menuData = [];
             rows.forEach(row => {
                 const name = row.querySelector('.menu-name').value.trim();
                 const description = row.querySelector('.menu-desc').value.trim();
                 const price = row.querySelector('.menu-price').value.trim();
                 if (name) {
+                    menuData.push({
                         name: name,
                         description: description,
                         price: price,
+                        available: true
                     });
                 }
             });
+            if (menuData.length === 0) {
+                alert("منوی وارد شده نمی‌تواند کاملاً خالی باشد.");
                 return;
             }
                 const response = await fetch('/api/admin/save_menu', {
                     method: 'POST',
                     headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ menu: menuData })
                 });
                 const data = await response.json();
                 if (response.ok && data.success) {
+                    alert("منوی جدید با موفقیت ذخیره و در سیستم مرکزی فعال شد!");
                     document.getElementById('menuEditorContainer').classList.add('hidden');
+                    appendChatMessage('model', 'منوی جدید سیستم با موفقیت به سیستم مرکزی فرستاده و اعمال شد. منوی مشتریان را از روی پایگاه‌داده جدید پردازش خواهم کرد.');
                 } else {
+                    alert(data.error || 'خطا در ذخیره‌سازی منو.');
                 }
             } catch (err) {
+                alert('خطا در ارتباط با سرور جهت ذخیره منو: ' + err.message);
             }
         }
     </script>