diff --git a/index2.html b/index2.html
index 67e6cc9..3553686 100644
--- a/index2.html
+++ b/index2.html
@@ -404,6 +404,16 @@
                 let dateStr = q.created_at || q.date || "";
                 if(dateStr && dateStr.includes('T')) dateStr = dateStr.split('T')[0].split('-').reverse().join('/');
                 
+                // 🛑 NUEVO: Lógica de colores para los estados
+                let statusBadge = "";
+                if (!q.status || q.status === 'pending') {
+                    statusBadge = `<span class="bg-amber-100 text-amber-700 px-2 py-1 rounded-md text-[8px] font-black uppercase tracking-widest flex items-center gap-1 w-fit mt-1.5 shadow-sm"><i data-lucide="clock" class="w-3 h-3"></i> Pte. Resolver</span>`;
+                } else if (q.status === 'accepted' || q.status === 'converted') {
+                    statusBadge = `<span class="bg-emerald-100 text-emerald-700 px-2 py-1 rounded-md text-[8px] font-black uppercase tracking-widest flex items-center gap-1 w-fit mt-1.5 shadow-sm"><i data-lucide="check-circle-2" class="w-3 h-3"></i> Aceptado</span>`;
+                } else if (q.status === 'rejected') {
+                    statusBadge = `<span class="bg-rose-100 text-rose-700 px-2 py-1 rounded-md text-[8px] font-black uppercase tracking-widest flex items-center gap-1 w-fit mt-1.5 shadow-sm"><i data-lucide="x-circle" class="w-3 h-3"></i> Rechazado</span>`;
+                }
+
                 html += `
                 <div onclick="openQuoteModal(${q.id})" class="bg-white p-5 rounded-[2rem] shadow-sm border ${isViewed ? 'border-slate-100' : 'border-blue-400 ring-2 ring-blue-50'} relative cursor-pointer active:scale-95 transition-all text-left">
                     ${!isViewed ? '<div class="absolute top-5 right-5 w-3 h-3 bg-red-500 rounded-full animate-pulse shadow-sm border-2 border-white"></div>' : ''}
@@ -412,9 +422,10 @@
                         <div class="w-10 h-10 rounded-xl ${isViewed ? 'bg-slate-50 text-slate-400' : 'bg-blue-50 text-blue-600'} flex items-center justify-center shrink-0">
                             <i data-lucide="file-text" class="w-5 h-5"></i>
                         </div>
-                        <div>
+                        <div class="flex-1 min-w-0">
                             <p class="text-[9px] font-black text-slate-400 uppercase tracking-widest leading-none mb-1">REF #${refStr}</p>
-                            <h3 class="font-black text-slate-800 text-sm leading-tight pr-6 truncate w-[200px]">${titleStr}</h3>
+                            <h3 class="font-black text-slate-800 text-sm leading-tight pr-6 truncate">${titleStr}</h3>
+                            ${statusBadge}
                         </div>
                     </div>