UI update

app.py

@@ -89,6 +89,71 @@ Answer:"""
         logging.info("No statutes found matching the pattern in the context.")
         return "No specific statutes found in the provided context."
 
+    def format_llm_response_for_html(self, text: str) -> str:
+        """
+        Formats the LLM's raw text response for display in a Gradio HTML component,
+        converting Markdown-like elements to HTML. Handles bolding, paragraphs, and lists.
+        """
+        if not text:
+            return ""
+
+        # 1. Convert markdown bolding (**text**) to HTML <b>text</b>
+        formatted_text = re.sub(r'\*\*(.*?)\*\*', r'<b>\1</b>', text)
+
+        # Split the text into blocks based on two or more consecutive newlines
+        # This separates paragraphs and distinct list blocks.
+        blocks = re.split(r'\n\s*\n+', formatted_text.strip())
+        
+        html_output_parts = []
+
+        for block in blocks:
+            block = block.strip()
+            if not block:
+                continue
+
+            # Check if the block is a list (starts with a list marker on its first non-empty line)
+            list_lines = block.split('\n')
+            
+            is_list = False
+            list_type = None # 'ul' or 'ol'
+            
+            for line in list_lines:
+                stripped_line = line.strip()
+                if stripped_line: # Check first non-empty line
+                    if re.match(r'^[*-]\s*(.*)', stripped_line):
+                        is_list = True
+                        list_type = 'ul'
+                    elif re.match(r'^\d+\.\s*(.*)', stripped_line):
+                        is_list = True
+                        list_type = 'ol'
+                    break # Only need to check the first actual line
+
+            if is_list:
+                # Process as a list
+                list_html = f'<{list_type}>'
+                for line in list_lines:
+                    stripped_line = line.strip()
+                    if not stripped_line:
+                        continue # Skip empty lines within a list block
+                    
+                    # Extract content after the list marker
+                    if list_type == 'ul':
+                        item_content = re.sub(r'^[*-]\s*', '', stripped_line)
+                    else: # ol
+                        item_content = re.sub(r'^\d+\.\s*', '', stripped_line)
+                    
+                    list_html += f'<li>{item_content.strip()}</li>'
+                list_html += f'</{list_type}>'
+                html_output_parts.append(list_html)
+            else:
+                # Process as a paragraph
+                # Replace single newlines within the paragraph block with <br>
+                paragraph_content = block.replace('\n', '<br>')
+                html_output_parts.append(f'<p>{paragraph_content}</p>')
+        
+        return ''.join(html_output_parts)
+
+
     @lru_cache(maxsize=50)
     def process_query_cached(self, query: str, state: str, openai_api_key: str, n_results: int = 5) -> Dict[str, any]:
         logging.info(f"Processing query (cache key: '{query}'|'{state}'|key_hidden) with n_results={n_results}")
@@ -176,6 +241,8 @@ Answer:"""
                 answer_text = "<div class='error-message'><span class='error-icon'>⚠️</span>The AI model returned an empty response. This might be due to the query, context limitations, or temporary issues. Please try rephrasing your question or try again later.</div>"
             else:
                 logging.info("LLM generated answer successfully.")
+                # Apply the formatting function here to convert Markdown-like syntax to HTML
+                answer_text = self.format_llm_response_for_html(answer_text)
 
             return {"answer": answer_text, "context_used": context}
 
@@ -636,6 +703,21 @@ Answer:"""
             color: var(--text-primary);
             line-height: 1.7;
         }
+        /* Custom CSS for lists and paragraphs within response-content for better spacing */
+        .response-content p {
+            margin-bottom: 1em; /* Spacing between paragraphs */
+        }
+        .response-content ul, .response-content ol {
+            margin-bottom: 1em; /* Spacing after lists */
+            padding-left: 2em; /* Indent lists */
+        }
+        .response-content li {
+            margin-bottom: 0.5em; /* Spacing between list items */
+        }
+        .response-content li:last-child {
+            margin-bottom: 0;
+        }
+
 
         /* Error message styles */
         .error-message {