Update app.py

app.py

@@ -5,16 +5,16 @@ Text2Receipt — Hugging Face Gradio Space
 Pipeline:
   raw Hebrew note
     → fine-tuned parser (gemma-2-2b-it + LoRA)
-    → agentic clarifier  (+5% bonus — detects legally-ambiguous fields)
+    → agentic clarifier  (+5% bonus)
     → deterministic complete()  (VAT · serial · allocation number)
     → fiscal document display
     → FAISS recommender  (3 similar past receipts)
-Repos used:
+Repos:
   Dataset : yonilev/Text2Receipt
-  Model   : yonilev/Text2Receipt-parser  (LoRA adapter)
-  Space   : yonilev/Text2Receipt         (embeddings stored here)
+  Model   : yonilev/Text2Receipt-parser
+  Space   : yonilev/Text2Receipt
 """
-import os, json, re, random
+import os, json, random
 import numpy as np
 import gradio as gr
 
@@ -52,21 +52,27 @@ def _lazy_init():
                                  bnb_4bit_compute_dtype=torch.float16,
                                  bnb_4bit_use_double_quant=True)
         try:
-            base  = AutoModelForCausalLM.from_pretrained(BASE_MODEL, quantization_config=bnb,
-                        device_map="auto", torch_dtype=torch.float16, attn_implementation="eager")
+            base  = AutoModelForCausalLM.from_pretrained(
+                        BASE_MODEL, quantization_config=bnb, device_map="auto",
+                        torch_dtype=torch.float16, attn_implementation="eager")
             model = PeftModel.from_pretrained(base, MODEL_REPO)
+            print("✅ GPU: fine-tuned adapter loaded")
         except Exception as e:
-            print(f"⚠ adapter failed ({e}); base model")
-            model = AutoModelForCausalLM.from_pretrained(BASE_MODEL, quantization_config=bnb,
-                        device_map="auto", torch_dtype=torch.float16, attn_implementation="eager")
+            print(f"⚠ adapter failed ({e}); base model (GPU)")
+            model = AutoModelForCausalLM.from_pretrained(
+                        BASE_MODEL, quantization_config=bnb, device_map="auto",
+                        torch_dtype=torch.float16, attn_implementation="eager")
     else:
         try:
-            base  = AutoModelForCausalLM.from_pretrained(BASE_MODEL, device_map="cpu",
+            base  = AutoModelForCausalLM.from_pretrained(
+                        BASE_MODEL, device_map="cpu",
                         torch_dtype=torch.float32, attn_implementation="eager")
             model = PeftModel.from_pretrained(base, MODEL_REPO)
+            print("✅ CPU: fine-tuned adapter loaded")
         except Exception as e:
             print(f"⚠ adapter failed ({e}); base model (CPU)")
-            model = AutoModelForCausalLM.from_pretrained(BASE_MODEL, device_map="cpu",
+            model = AutoModelForCausalLM.from_pretrained(
+                        BASE_MODEL, device_map="cpu",
                         torch_dtype=torch.float32, attn_implementation="eager")
 
     model.eval()
@@ -78,15 +84,14 @@ def _lazy_init():
     with open("embeddings_manifest.json") as f:
         manifest = json.load(f)
 
-    faiss_mod = faiss
-    faiss_mod.normalize_L2(emb)
-    index = faiss_mod.IndexFlatIP(emb.shape[1])
+    faiss.normalize_L2(emb)
+    index = faiss.IndexFlatIP(emb.shape[1])
     index.add(emb)
 
     enc = SentenceTransformer(manifest["embed_model"], device=device)
     _STATE.update(enc=enc, index=index, store=store,
                   e5_family=manifest.get("e5_family", False), ready=True)
-    print("✅ ready —", emb.shape[0], "vectors")
+    print(f"✅ FAISS ready — {emb.shape[0]} vectors")
 
 
 # ═════════════════════════════════════════════════════════════════════════════
@@ -108,7 +113,7 @@ def _extract_json(text):
     if s < 0: return None
     depth = 0
     for i in range(s, len(text)):
-        if text[i] == "{":  depth += 1
+        if text[i] == "{":   depth += 1
         elif text[i] == "}":
             depth -= 1
             if depth == 0:
@@ -138,31 +143,32 @@ def _today(): return _dt.date.today()
 
 def _missing_fields(parse):
     if parse is None: return ["parse_failed"]
-    missing = []
-    if not parse.get("client_name", "").strip(): missing.append("client_name")
-    if not parse.get("items"):                   missing.append("items")
-    return missing
+    m = []
+    if not parse.get("client_name", "").strip(): m.append("client_name")
+    if not parse.get("items"):                   m.append("items")
+    return m
 
 def _needs_allocation_clarification(parse):
     if not parse: return False
-    subtotal  = sum(it.get("unit_price",0)*it.get("quantity",1) for it in parse.get("items",[]))
+    subtotal  = sum(it.get("unit_price", 0) * it.get("quantity", 1)
+                    for it in parse.get("items", []))
     threshold = core.allocation_threshold_for_date(_today())
     return bool(parse.get("client_is_business")) and subtotal >= threshold * 0.8
 
 def clarification_questions(parse, answers):
     missing = _missing_fields(parse)
     if "parse_failed" in missing:
-        return ["לא הצלחתי לחלץ פרטים. האם תוכל לנסח מחדש? לדוגמה: 'קיבלתי 500₪ מ[שם] על [שירות]'"]
+        return ["לא הצלחתי לחלץ פרטים. נסח מחדש — לדוגמה: 'קיבלתי 500₪ מ[שם] על [שירות]'"]
     qs = []
     if "client_name" in missing and "client_name" not in answers:
         qs.append("מה שם הלקוח?")
     if "items" in missing and "items" not in answers:
-        qs.append("מה השירות/המוצר שסופק ובאיזה מחיר?")
+        qs.append("מה השירות/המוצר ובאיזה מחיר?")
     if "doc_type" not in answers:
         if parse and _needs_allocation_clarification(parse):
             qs.append('האם להנפיק חשבונית מס/קבלה (לעסק עם מע"מ) או קבלה פשוטה?')
         elif parse and not parse.get("doc_type"):
-            qs.append("איזה מסמך לייצר? קבלה / חשבונית מס / חשבונית מס וקבלה?")
+            qs.append("איזה מסמך? קבלה / חשבונית מס / חשבונית מס וקבלה")
     return qs[:3]
 
 def apply_answers(parse, answers):
@@ -188,105 +194,137 @@ def apply_answers(parse, answers):
 # ═════════════════════════════════════════════════════════════════════════════
 def recommend(query_text, k=3):
     pref  = "query: " if _STATE["e5_family"] else ""
-    q_emb = _STATE["enc"].encode([pref + query_text], normalize_embeddings=True).astype("float32")
-    _, I  = _STATE["index"].search(q_emb, k+1)
-    results = []
+    q_emb = _STATE["enc"].encode([pref + query_text],
+                                  normalize_embeddings=True).astype("float32")
+    _, I  = _STATE["index"].search(q_emb, k + 1)
+    out = []
     for idx in I[0][:k]:
         row = _STATE["store"].iloc[int(idx)]
-        results.append({"raw_text": row["raw_text"], "category": row["category"],
-                        "doc_type_he": row["doc_type_he"], "total": float(row["total"]),
-                        "client_name": row["client_name"]})
-    return results
+        out.append({"raw_text": row["raw_text"], "category": row["category"],
+                    "doc_type_he": row["doc_type_he"], "total": float(row["total"]),
+                    "client_name": row["client_name"]})
+    return out
 
 
 # ═════════════════════════════════════════════════════════════════════════════
-# 5. Renderers
+# 5. HTML renderers
 # ═════════════════════════════════════════════════════════════════════════════
 def render_document(c):
-    issuer = c.get("issuer", {}); client = c.get("client", {}); lines = c.get("lines", [])
+    issuer  = c.get("issuer", {})
+    client  = c.get("client", {})
+    lines   = c.get("lines",  [])
     vat_pct = int(round(c.get("vat_rate", 0) * 100))
-    alloc_html = (f'<div style="background:#134e4a;border-radius:8px;padding:10px 16px;'
-                  f'margin-bottom:16px;font-size:13px;color:#99f6e4;">'
-                  f'🔖 מספר הקצאה: <strong>{c.get("allocation_number","—")}</strong></div>'
-                  if c.get("allocation_required") else "")
-    line_rows = "".join(
-        f'<tr><td style="padding:8px 4px;border-bottom:1px solid #1e293b;">{ln["description"]}</td>'
-        f'<td style="padding:8px;border-bottom:1px solid #1e293b;text-align:center;">{ln["quantity"]}</td>'
-        f'<td style="padding:8px;border-bottom:1px solid #1e293b;text-align:left;">₪{ln["unit_price"]:,.2f}</td>'
-        f'<td style="padding:8px 4px;border-bottom:1px solid #1e293b;text-align:left;font-weight:600;">₪{ln["line_total"]:,.2f}</td></tr>'
+
+    alloc = (f'<div style="background:#0d3331;border:1px solid #134e4a;border-radius:8px;'
+             f'padding:10px 16px;margin-bottom:16px;font-size:13px;color:#5eead4;">'
+             f'🔖 מספר הקצאה: <strong>{c.get("allocation_number","—")}</strong></div>'
+             if c.get("allocation_required") else "")
+
+    rows = "".join(
+        f'<tr>'
+        f'<td style="padding:10px 4px;border-bottom:1px solid #1e293b;color:#e2e8f0;">{ln["description"]}</td>'
+        f'<td style="padding:10px 8px;border-bottom:1px solid #1e293b;text-align:center;color:#94a3b8;">{ln["quantity"]}</td>'
+        f'<td style="padding:10px 8px;border-bottom:1px solid #1e293b;text-align:left;color:#94a3b8;">₪{ln["unit_price"]:,.2f}</td>'
+        f'<td style="padding:10px 4px;border-bottom:1px solid #1e293b;text-align:left;font-weight:600;color:#e2e8f0;">₪{ln["line_total"]:,.2f}</td>'
+        f'</tr>'
         for ln in lines)
+
     return f"""
-<div dir="rtl" style="font-family:'Arial Hebrew',Arial,sans-serif;color:#e2e8f0;
-     border-radius:12px;padding:24px 28px;max-width:640px;margin:8px auto;
-     background:#0f172a;border:1px solid #1e293b;">
+<div dir="rtl" style="font-family:'Segoe UI','Arial Hebrew',Arial,sans-serif;
+     background:#0f172a;color:#e2e8f0;border-radius:16px;
+     border:1px solid #1e293b;padding:28px 32px;max-width:660px;
+     margin:16px auto 0;box-shadow:0 8px 32px rgba(0,0,0,.4);">
+
   <div style="display:flex;justify-content:space-between;align-items:flex-start;
-       border-bottom:1px solid #1e293b;padding-bottom:16px;margin-bottom:20px;">
+       padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid #1e293b;">
     <div>
-      <div style="font-size:20px;font-weight:700;color:#2dd4bf;">{c.get("doc_type_he","מסמך")}</div>
-      <div style="font-size:12px;color:#64748b;margin-top:4px;">
-        מס׳ {c.get("serial_number","")} &nbsp;·&nbsp; {c.get("issue_date","")}
+      <div style="font-size:22px;font-weight:700;color:#2dd4bf;">{c.get("doc_type_he","מסמך")}</div>
+      <div style="font-size:12px;color:#475569;margin-top:5px;">
+        מס׳ <span style="color:#94a3b8;">{c.get("serial_number","")}</span>
+        &nbsp;·&nbsp; {c.get("issue_date","")}
       </div>
     </div>
     <div style="text-align:left;">
-      <div style="font-size:14px;font-weight:600;color:#e2e8f0;">{issuer.get("name","")}</div>
-      <div style="font-size:11px;color:#64748b;">ח.פ. {issuer.get("tax_id","")}</div>
-      <div style="font-size:11px;color:#64748b;">
+      <div style="font-size:15px;font-weight:600;color:#e2e8f0;">{issuer.get("name","")}</div>
+      <div style="font-size:11px;color:#475569;margin-top:3px;">ח.פ. {issuer.get("tax_id","")}</div>
+      <div style="display:inline-block;margin-top:5px;font-size:11px;
+           background:#134e4a;color:#5eead4;padding:2px 8px;border-radius:999px;">
         {"עוסק מורשה" if issuer.get("status")=="authorized_dealer" else "עוסק פטור"}
       </div>
     </div>
   </div>
-  <div style="background:#1e293b;border-radius:8px;padding:12px 16px;margin-bottom:16px;font-size:13px;">
-    <span style="color:#64748b;">לקוח: </span>
-    <strong style="color:#e2e8f0;">{client.get("name","")}</strong>
-    {"&nbsp;<span style='font-size:11px;color:#94a3b8;'>עסק</span>" if client.get("is_business") else ""}
-    {f"&nbsp;<span style='font-size:11px;color:#64748b;'>· ח.פ. {client.get('tax_id','')}</span>" if client.get("tax_id") else ""}
+
+  <div style="background:#1e293b;border-radius:10px;padding:12px 16px;
+       margin-bottom:16px;display:flex;align-items:center;gap:10px;">
+    <div style="width:32px;height:32px;border-radius:50%;background:#0d9488;
+         display:flex;align-items:center;justify-content:center;
+         font-size:14px;font-weight:700;color:#fff;flex-shrink:0;">
+      {(client.get("name","?") or "?")[0]}
+    </div>
+    <div>
+      <div style="font-size:14px;font-weight:600;color:#e2e8f0;">{client.get("name","")}</div>
+      <div style="font-size:11px;color:#64748b;margin-top:1px;">
+        {"עסק" if client.get("is_business") else "לקוח פרטי"}
+        {f" · ח.פ. {client.get('tax_id','')}" if client.get("tax_id") else ""}
+      </div>
+    </div>
   </div>
-  {alloc_html}
-  <table style="width:100%;border-collapse:collapse;font-size:13px;margin-bottom:16px;">
+
+  {alloc}
+
+  <table style="width:100%;border-collapse:collapse;font-size:13px;margin-bottom:20px;">
     <thead>
-      <tr style="color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.05em;">
-        <th style="padding:6px 4px;text-align:right;border-bottom:1px solid #1e293b;">שירות / מוצר</th>
-        <th style="padding:6px 8px;text-align:center;border-bottom:1px solid #1e293b;">כמות</th>
-        <th style="padding:6px 8px;text-align:left;border-bottom:1px solid #1e293b;">מחיר יחידה</th>
-        <th style="padding:6px 4px;text-align:left;border-bottom:1px solid #1e293b;">סה"כ</th>
+      <tr style="font-size:11px;color:#475569;letter-spacing:.06em;">
+        <th style="padding:6px 4px;text-align:right;border-bottom:1px solid #334155;font-weight:500;">פריט</th>
+        <th style="padding:6px 8px;text-align:center;border-bottom:1px solid #334155;font-weight:500;">כמות</th>
+        <th style="padding:6px 8px;text-align:left;border-bottom:1px solid #334155;font-weight:500;">מחיר</th>
+        <th style="padding:6px 4px;text-align:left;border-bottom:1px solid #334155;font-weight:500;">סה"כ</th>
       </tr>
     </thead>
-    <tbody>{line_rows}</tbody>
+    <tbody>{rows}</tbody>
   </table>
-  <div style="border-top:1px solid #1e293b;padding-top:14px;">
-    <div style="display:flex;justify-content:space-between;font-size:13px;color:#94a3b8;margin-bottom:6px;">
-      <span>סכום לפני מע"מ</span><span>₪{c.get("subtotal",0):,.2f}</span>
+
+  <div style="background:#1e293b;border-radius:10px;padding:16px 18px;">
+    <div style="display:flex;justify-content:space-between;font-size:13px;color:#64748b;margin-bottom:8px;">
+      <span>סכום לפני מע"מ</span>
+      <span style="color:#94a3b8;">₪{c.get("subtotal",0):,.2f}</span>
     </div>
-    <div style="display:flex;justify-content:space-between;font-size:13px;color:#94a3b8;margin-bottom:10px;">
-      <span>מע"מ {vat_pct}%</span><span>₪{c.get("vat_amount",0):,.2f}</span>
+    <div style="display:flex;justify-content:space-between;font-size:13px;color:#64748b;
+         padding-bottom:12px;border-bottom:1px solid #334155;margin-bottom:12px;">
+      <span>מע"מ {vat_pct}%</span>
+      <span style="color:#94a3b8;">₪{c.get("vat_amount",0):,.2f}</span>
     </div>
-    <div style="display:flex;justify-content:space-between;font-size:20px;font-weight:700;color:#2dd4bf;">
-      <span>סה"כ לתשלום</span><span>₪{c.get("total",0):,.2f}</span>
+    <div style="display:flex;justify-content:space-between;align-items:baseline;">
+      <span style="font-size:15px;font-weight:600;color:#e2e8f0;">סה"כ לתשלום</span>
+      <span style="font-size:24px;font-weight:700;color:#2dd4bf;">₪{c.get("total",0):,.2f}</span>
     </div>
-    <div style="font-size:11px;color:#475569;margin-top:8px;text-align:right;">
+    <div style="font-size:11px;color:#334155;margin-top:10px;text-align:right;">
       {core.PAYMENT_HE.get(c.get("payment_method",""),"—")}
     </div>
   </div>
 </div>"""
 
+
 def render_recommendations(recs):
     if not recs: return ""
     cards = "".join(f"""
-      <div style="background:#1e293b;border-radius:8px;padding:12px 14px;border:1px solid #334155;">
-        <div style="font-size:11px;font-weight:600;color:#2dd4bf;margin-bottom:4px;letter-spacing:.03em;">
-          {r["doc_type_he"]} · {r["category"]}
-        </div>
-        <div style="font-size:12px;color:#cbd5e1;line-height:1.5;margin-bottom:6px;">
-          {r["raw_text"][:75]}{"…" if len(r["raw_text"])>75 else ""}
-        </div>
-        <div style="font-size:11px;color:#64748b;">{r["client_name"]} · ₪{r["total"]:,.0f}</div>
-      </div>""" for r in recs)
+    <div style="background:#1e293b;border-radius:10px;padding:14px 16px;border:1px solid #334155;">
+      <div style="font-size:11px;font-weight:600;color:#2dd4bf;letter-spacing:.04em;
+           margin-bottom:6px;text-transform:uppercase;">{r["doc_type_he"]} · {r["category"]}</div>
+      <div style="font-size:12px;color:#cbd5e1;line-height:1.55;margin-bottom:8px;">
+        {r["raw_text"][:72]}{"…" if len(r["raw_text"])>72 else ""}
+      </div>
+      <div style="display:flex;justify-content:space-between;">
+        <span style="font-size:11px;color:#475569;">{r["client_name"]}</span>
+        <span style="font-size:13px;font-weight:600;color:#94a3b8;">₪{r["total"]:,.0f}</span>
+      </div>
+    </div>""" for r in recs)
+
     return f"""
-<div dir="rtl" style="font-family:Arial,sans-serif;max-width:640px;margin:4px auto 0;">
-  <div style="font-size:11px;color:#475569;margin-bottom:8px;letter-spacing:.05em;text-transform:uppercase;">
-    קבלות דומות מהמאגר
-  </div>
-  <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:8px;">{cards}</div>
+<div dir="rtl" style="font-family:'Segoe UI',Arial,sans-serif;max-width:660px;margin:8px auto 24px;">
+  <div style="font-size:11px;color:#334155;margin-bottom:10px;
+       letter-spacing:.06em;text-transform:uppercase;">מסמכים דומים מהמאגר</div>
+  <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:10px;">{cards}</div>
 </div>"""
 
 
@@ -295,183 +333,206 @@ def render_recommendations(recs):
 # ═════════════════════════════════════════════════════════════════════════════
 DEMO_ISSUER = {"name": "מים שקטים", "tax_id": "962569844", "status": "authorized_dealer"}
 
-def _run_pipeline(raw_text, chat_history, pending_parse, answers):
+def _run_pipeline(raw_text, history, pending_parse, answers):
     _lazy_init()
-    parse = model_parse(raw_text) if pending_parse is None else pending_parse
+    parse     = model_parse(raw_text) if pending_parse is None else pending_parse
     questions = clarification_questions(parse, answers)
+
     if questions:
-        q_md = "\n".join(f"**{i+1}.** {q}" for i, q in enumerate(questions))
-        return (chat_history + [{"role": "assistant",
+        q_md = "\n".join(f"{i+1}. {q}" for i, q in enumerate(questions))
+        return (history + [{"role": "assistant",
                 "content": f"יש לי כמה שאלות לפני שאפיק את המסמך:\n\n{q_md}"}],
                 "", "", parse, answers)
-    final_parse = apply_answers(parse, answers)
+
+    final = apply_answers(parse, answers)
     try:
-        completed = core.complete(DEMO_ISSUER, final_parse, _STATE["rng"])
+        completed = core.complete(DEMO_ISSUER, final, _STATE["rng"])
     except Exception as e:
-        return (chat_history + [{"role": "assistant", "content": f"שגיאה בעיבוד: {e}"}],
+        return (history + [{"role": "assistant", "content": f"שגיאה: {e}"}],
                 "", "", None, {})
-    doc_html  = render_document(completed)
-    recs_html = render_recommendations(recommend(raw_text))
-    return (chat_history + [{"role": "assistant", "content": "✅ המסמך הופק בהצלחה"}],
-            doc_html, recs_html, None, {})
 
-def _handle_answer(user_msg, chat_history, pending_parse, answers, raw_text):
-    a, low = dict(answers), user_msg.strip()
-    if any(w in low for w in ["חשבונית מס", "מס וקבלה", "מס/קבלה"]): a["doc_type"] = low
-    elif "קבלה" in low: a["doc_type"] = "receipt"
-    elif not a.get("client_name") and pending_parse and not pending_parse.get("client_name"):
-        a["client_name"] = low
-    return _run_pipeline(raw_text, chat_history + [{"role": "user", "content": user_msg}],
-                         pending_parse, a)
+    return (history + [{"role": "assistant", "content": "✅ המסמך הופק בהצלחה"}],
+            render_document(completed),
+            render_recommendations(recommend(raw_text)),
+            None, {})
+
 
 def on_submit(raw, history, pending, answers):
+    if not raw.strip():
+        return history, "", "", pending, answers
     return _run_pipeline(raw, history + [{"role": "user", "content": raw}], None, {})
 
 
+def on_answer(user_msg, history, pending, answers, raw_text):
+    if not user_msg.strip():
+        return history, "", "", pending, answers
+    a, low = dict(answers), user_msg.strip()
+    if any(w in low for w in ["חשבונית מס", "מס וקבלה", "מס/קבלה"]):
+        a["doc_type"] = low
+    elif "קבלה" in low:
+        a["doc_type"] = "receipt"
+    elif not a.get("client_name") and pending and not pending.get("client_name"):
+        a["client_name"] = low
+    return _run_pipeline(raw_text,
+                         history + [{"role": "user", "content": user_msg}],
+                         pending, a)
+
+
 # ═════════════════════════════════════════════════════════════════════════════
-# 7. UI — ChatGPT/Claude style
+# 7. UI — Gradio 6.17 compatible, ChatGPT/Claude style
 # ═════════════════════════════════════════════════════════════════════════════
 CSS = """
-* { box-sizing: border-box; }
-body, .gradio-container, .main { background: #0a0a0f !important; }
-.gradio-container { max-width: 780px !important; margin: 0 auto !important; }
+*, *::before, *::after { box-sizing: border-box; }
+
+.gradio-container {
+    max-width: 760px !important;
+    margin: 0 auto !important;
+    padding: 0 16px !important;
+    background: #0a0f1e !important;
+}
+body, .main { background: #0a0f1e !important; }
+footer { display: none !important; }
+
+.chatbot-area .bubble-wrap { gap: 12px !important; }
+
+.chatbot-area [data-testid="user"] .bubble,
+.chatbot-area .user .bubble {
+    background: #0d9488 !important;
+    color: #fff !important;
+    border-radius: 18px 18px 4px 18px !important;
+    padding: 12px 16px !important;
+    font-size: 14px !important;
+    line-height: 1.6 !important;
+    max-width: 80% !important;
+    border: none !important;
+}
 
-/* sidebar-style quick starters */
-.qs-btn {
+.chatbot-area [data-testid="bot"] .bubble,
+.chatbot-area .bot .bubble {
     background: #1e293b !important;
+    color: #e2e8f0 !important;
+    border-radius: 18px 18px 18px 4px !important;
+    padding: 12px 16px !important;
+    font-size: 14px !important;
+    line-height: 1.6 !important;
+    max-width: 80% !important;
     border: 1px solid #334155 !important;
-    color: #cbd5e1 !important;
-    border-radius: 10px !important;
-    font-size: 13px !important;
-    text-align: right !important;
-    padding: 10px 14px !important;
-    transition: background .15s, border-color .15s !important;
 }
-.qs-btn:hover { background: #273549 !important; border-color: #2dd4bf !important; }
 
-/* main input */
-.note-input textarea {
+.note-box textarea {
     background: #1e293b !important;
     color: #e2e8f0 !important;
     border: 1px solid #334155 !important;
-    border-radius: 12px !important;
+    border-radius: 14px !important;
     font-size: 15px !important;
-    padding: 14px 16px !important;
+    padding: 14px 18px !important;
     resize: none !important;
 }
-.note-input textarea:focus {
-    border-color: #2dd4bf !important;
-    box-shadow: 0 0 0 2px rgba(45,212,191,.15) !important;
+.note-box textarea:focus {
+    border-color: #0d9488 !important;
+    box-shadow: 0 0 0 3px rgba(13,148,136,.18) !important;
     outline: none !important;
 }
+.note-box label { display: none !important; }
+
+.answer-box textarea {
+    background: #1e293b !important;
+    color: #e2e8f0 !important;
+    border: 1px solid #0d9488 !important;
+    border-radius: 10px !important;
+    font-size: 14px !important;
+    padding: 10px 14px !important;
+    resize: none !important;
+}
+.answer-box label { color: #475569 !important; font-size: 11px !important; }
 
-/* send button */
-.send-btn {
+.btn-send button {
     background: #0d9488 !important;
     color: #fff !important;
     border: none !important;
-    border-radius: 10px !important;
+    border-radius: 12px !important;
     font-size: 15px !important;
     font-weight: 600 !important;
-    padding: 12px 28px !important;
-    transition: background .15s !important;
+    height: 52px !important;
 }
-.send-btn:hover { background: #0f766e !important; }
+.btn-send button:hover  { background: #0f766e !important; }
 
-/* clear button */
-.clear-btn {
+.btn-clear button {
     background: transparent !important;
-    color: #64748b !important;
+    color: #475569 !important;
     border: 1px solid #1e293b !important;
     border-radius: 10px !important;
     font-size: 13px !important;
 }
-.clear-btn:hover { border-color: #475569 !important; color: #94a3b8 !important; }
-
-/* chatbot */
-.chatbot-wrap .message-wrap { background: transparent !important; }
-.chatbot-wrap { background: transparent !important; border: none !important; }
-.chatbot-wrap .bot { background: #1e293b !important; border-radius: 12px !important;
-    color: #e2e8f0 !important; border: 1px solid #334155 !important; }
-.chatbot-wrap .user { background: #0d9488 !important; border-radius: 12px !important;
-    color: #fff !important; }
-
-/* answer input */
-.answer-input textarea {
+.btn-clear button:hover { border-color: #334155 !important; color: #94a3b8 !important; }
+
+.qs-btn button {
+    background: #111827 !important;
+    color: #94a3b8 !important;
+    border: 1px solid #1e293b !important;
+    border-radius: 10px !important;
+    font-size: 12px !important;
+    padding: 8px 12px !important;
+    width: 100% !important;
+}
+.qs-btn button:hover {
     background: #1e293b !important;
+    border-color: #0d9488 !important;
     color: #e2e8f0 !important;
-    border: 1px solid #2dd4bf !important;
-    border-radius: 10px !important;
-    font-size: 14px !important;
 }
-
-footer { display: none !important; }
-label { color: #64748b !important; font-size: 12px !important; }
 """
 
 QUICK_STARTERS = [
-    ("💼  עוסק מורשה + לקוח עסקי גדול",
-     'חברת מעגל בע"מ שילמה 36,500 ש"ח על פרויקט אתר מלא. העברה בנקאית.'),
-    ("🧾  עוסק פטור — שיעור פרטי",
-     "קיבלתי 220 שקל מדביר על שיעור שחייה פרטי, מזומן"),
-    ("📦  חשבונית מס — כמה פריטים",
-     'נועה כהן שילמה 2 × 350 ש"ח ייעוץ עסקי + 180 ש"ח הכנת מצגת'),
+    ("💼 עוסק מורשה + לקוח עסקי",  'חברת מעגל בע"מ שילמה 36,500 ש"ח על פרויקט אתר. העברה בנקאית.'),
+    ("🧾 עוסק פטור — שיעור פרטי",   "קיבלתי 220 שקל מדביר על שיעור שחייה פרטי, מזומן"),
+    ("📦 כמה פריטים",                'נועה כהן שילמה 2×350 ש"ח ייעוץ עסקי + 180 ש"ח הכנת מצגת'),
 ]
 
-with gr.Blocks(title="Text2Receipt", css=CSS) as demo:
+with gr.Blocks(title="Text2Receipt") as demo:
 
-    # ── header ────────────────────────────────────────────────────────────────
     gr.HTML("""
-    <div dir="rtl" style="text-align:center;padding:32px 0 20px;">
-      <div style="font-size:32px;margin-bottom:8px;">🧾</div>
-      <div style="font-size:26px;font-weight:700;color:#2dd4bf;letter-spacing:-.5px;">
-        Text2Receipt
-      </div>
-      <div style="font-size:13px;color:#475569;margin-top:6px;">
+    <div dir="rtl" style="text-align:center;padding:28px 0 16px;">
+      <div style="font-size:30px;margin-bottom:8px;">🧾</div>
+      <div style="font-size:26px;font-weight:700;color:#2dd4bf;letter-spacing:-.4px;">Text2Receipt</div>
+      <div style="font-size:13px;color:#334155;margin-top:6px;">
         הערת הכנסה חופשית בעברית &nbsp;→&nbsp; מסמך פיסקלי ישראלי תקין
       </div>
     </div>""")
 
-    # ── state ─────────────────────────────────────────────────────────────────
     st_parse   = gr.State(None)
     st_answers = gr.State({})
 
-    # ── chat area ─────────────────────────────────────────────────────────────
     chatbot = gr.Chatbot(
-        label="", height=280, type="messages",
-        elem_classes=["chatbot-wrap"],
-        placeholder="<div dir='rtl' style='color:#334155;text-align:center;padding:40px 0;font-size:14px;'>הקלד הערת הכנסה ולחץ שלח ↓</div>",
+        label="", height=320, elem_classes=["chatbot-area"], rtl=True,
+        placeholder="<div dir='rtl' style='color:#1e293b;text-align:center;"
+                    "padding:48px 0;font-size:14px;'>הקלד הערה ולחץ שלח</div>",
     )
 
-    # ── answer input (visible only when agent asks) ───────────────────────────
     answer_input = gr.Textbox(
-        label="תשובה לסוכן", placeholder="הקלד תשובה ולחץ Enter…",
-        lines=1, elem_classes=["answer-input"],
+        label="תשובה לסוכן ↩",
+        placeholder="ענה לשאלת הסוכן ולחץ Enter…",
+        lines=1, elem_classes=["answer-box"],
     )
 
-    # ── main input row ────────────────────────────────────────────────────────
     with gr.Row(equal_height=True):
         note_input = gr.Textbox(
-            label="", placeholder='לדוגמה: קיבלתי 1,200 ש"ח ממשה כהן על ייעוץ עסקי',
-            lines=2, scale=5, elem_classes=["note-input"], show_label=False,
+            label="", lines=2, scale=5, elem_classes=["note-box"],
+            placeholder='לדוגמה: קיבלתי 1,200 ש"ח ממשה כהן על ייעוץ עסקי',
         )
-        with gr.Column(scale=1, min_width=110):
-            submit_btn = gr.Button("שלח ⚡", variant="primary", elem_classes=["send-btn"])
-            clear_btn  = gr.Button("נקה", elem_classes=["clear-btn"])
+        with gr.Column(scale=1, min_width=100):
+            submit_btn = gr.Button("שלח ⚡", elem_classes=["btn-send"])
+            clear_btn  = gr.Button("נקה 🗑",  elem_classes=["btn-clear"])
 
-    # ── quick starters ────────────────────────────────────────────────────────
-    gr.HTML('<div dir="rtl" style="font-size:11px;color:#334155;margin:16px 0 8px;'
-            'text-transform:uppercase;letter-spacing:.06em;">דוגמאות מהירות</div>')
+    gr.HTML('<div dir="rtl" style="font-size:10px;color:#1e293b;margin:14px 0 6px;'
+            'letter-spacing:.07em;text-transform:uppercase;">דוגמאות מהירות</div>')
     with gr.Row():
-        for label, example in QUICK_STARTERS:
-            gr.Button(label, elem_classes=["qs-btn"]).click(
-                fn=lambda ex=example: ex, outputs=note_input)
+        for lbl, ex in QUICK_STARTERS:
+            gr.Button(lbl, elem_classes=["qs-btn"]).click(
+                fn=lambda e=ex: e, outputs=note_input)
 
-    # ── output ────────────────────────────────────────────────────────────────
     doc_output  = gr.HTML()
     recs_output = gr.HTML()
 
-    # ── wiring ────────────────────────────────────────────────────────────────
     submit_btn.click(
         fn=on_submit,
         inputs=[note_input, chatbot, st_parse, st_answers],
@@ -483,7 +544,7 @@ with gr.Blocks(title="Text2Receipt", css=CSS) as demo:
         outputs=[chatbot, doc_output, recs_output, st_parse, st_answers],
     )
     answer_input.submit(
-        fn=_handle_answer,
+        fn=on_answer,
         inputs=[answer_input, chatbot, st_parse, st_answers, note_input],
         outputs=[chatbot, doc_output, recs_output, st_parse, st_answers],
     )
@@ -493,4 +554,4 @@ with gr.Blocks(title="Text2Receipt", css=CSS) as demo:
     )
 
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch(css=CSS)