Update app.py

app.py

@@ -63,6 +63,7 @@ def render_products(products):
         url = row.get("url", "#")
         category = row.get("category", "Eco Product")
         in_stock_text = row.get("inStockText", "")
+        description = row.get("description", "No description available.")
 
         # Impact message
         impact_msg = ""
@@ -73,7 +74,7 @@ def render_products(products):
         img_html = f"<img src='{row['img_url']}' style='width:120px; height:120px; object-fit:cover; border-radius:10px;'/>" if row.get("img_url") else ""
 
         html += f"""
-        <div class="card" title="Rating: {rating}">
+        <div class="card" title="Rating: {rating}" data-desc="{description}">
             {img_html}
             <h3>{title}</h3>
             <p class="price">{price}</p>
@@ -146,8 +147,9 @@ threading.Thread(target=cycle_quotes, daemon=True).start()
 # --- Gradio UI ---
 with gr.Blocks(css="""
 body {background: #0d1117; color: #e6edf3; font-family: 'Segoe UI', sans-serif;}
-.card {backdrop-filter: blur(12px); background: rgba(255,255,255,0.05); border-radius: 16px; padding: 20px; margin: 10px; box-shadow: 0 0 15px rgba(0,255,150,0.2); transition: transform 0.2s ease; display:inline-block; vertical-align:top; width:200px; text-align:center;}
+.card {backdrop-filter: blur(12px); background: rgba(255,255,255,0.05); border-radius: 16px; padding: 20px; margin: 10px; box-shadow: 0 0 15px rgba(0,255,150,0.2); transition: transform 0.2s ease; display:inline-block; vertical-align:top; width:200px; text-align:center; position: relative;}
 .card:hover {transform: scale(1.05); box-shadow: 0 0 25px rgba(0,255,150,0.5);}
+.card:hover::after {content: attr(data-desc); position: absolute; top: 0; left: 210px; width: 250px; background: rgba(0,0,0,0.85); color: #fff; padding: 10px; border-radius: 8px; font-size: 0.85em; z-index: 10; white-space: normal; box-shadow: 0 0 10px rgba(0,255,150,0.3);}
 .price {color: #39ff14; font-weight: bold;}
 a {color: #58a6ff; text-decoration: none;}
 a:hover {text-decoration: underline;}