Update app.py

app.py

@@ -1,108 +1,120 @@
-import streamlit as st
-
-st.set_page_config(page_title="💊Prescripto AI", layout="centered")
-
+import streamlit as st 
 
 st.markdown("""
 <style>
-.prescripto-header {
-    text-align: center;
-    padding: 30px 10px;
-    background: linear-gradient(to right, #36D1DC, #5B86E5);
+.prescripto-container {
+    margin-top: 40px;
+    padding: 30px;
+    background: #f8f9fa;
     border-radius: 16px;
-    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
+    box-shadow: 0 8px 24px rgba(0,0,0,0.05);
 }
-.prescripto-header h1 {
-    color: white;
-    font-size: 3em;
-    margin-bottom: 0;
+
+.prescripto-title {
+    font-size: 28px;
+    color: #2c3e50;
+    font-weight: 700;
+    margin-bottom: 12px;
 }
-.prescripto-header h3 {
-    color: #f0f0f0;
-    margin-top: 5px;
+
+.prescripto-subtitle {
+    font-size: 17px;
+    color: #666;
+    margin-bottom: 20px;
 }
 
-.prescripto-box {
+.prescripto-features, .prescripto-ideal {
     background-color: #ffffff;
-    padding: 25px;
-    margin-top: 30px;
-    border-left: 6px solid #36D1DC;
-    border-radius: 16px;
-    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
+    padding: 20px;
+    margin-top: 20px;
+    border-radius: 12px;
+    border-left: 5px solid #36D1DC;
+    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
 }
 
-.prescripto-box p {
-    font-size: 18px;
+.prescripto-features ul, .prescripto-ideal ul {
+    list-style-type: none;
+    padding-left: 0;
 }
 
-.prescripto-box ul {
-    font-size: 16px;
-    line-height: 1.8;
-    color: #444;
+.prescripto-features li::before {
+    content: "✅ ";
+    color: #2ecc71;
 }
 
-.prescripto-creator {
-    margin-top: 40px;
+.prescripto-ideal li::before {
+    content: "💡 ";
+    color: #f39c12;
+}
+
+.prescripto-built-note {
     text-align: center;
+    font-style: italic;
+    color: #888;
+    margin-top: 25px;
+    font-size: 15px;
 }
 
-.prescripto-creator h4 {
+.creator-section {
+    margin-top: 50px;
+    text-align: center;
+    padding: 20px;
+    border-top: 1px solid #eee;
+}
+
+.creator-section h4 {
+    font-size: 20px;
     color: #36D1DC;
 }
 
-.prescripto-creator p {
-    color: #555;
+.creator-section p {
     font-size: 16px;
+    color: #555;
 }
 
-.prescripto-creator a {
-    margin: 5px;
+.creator-section a {
+    margin: 0 10px;
 }
 </style>
 """, unsafe_allow_html=True)
 
-
 st.markdown("""
-<div class="prescripto-header">
-    <h1>💊 Prescripto AI</h1>
-    <h3>Smart Prescription Reader & Medicine Assistant</h3>
-</div>
-""", unsafe_allow_html=True)
+<div class="prescripto-container">
+
+    <div class="prescripto-title">📋 Why Prescripto AI?</div>
+    <div class="prescripto-subtitle">Transform unreadable prescriptions into clear medicine insights – powered by AI.</div>
+
+    <div class="prescripto-features">
+        <ul>
+            <li>Upload any prescription photo (handwritten or typed)</li>
+            <li>Auto-extract medicine names and timings using OCR</li>
+            <li>Get dosage, side effects, and usage instructions from AI</li>
+            <li>No confusion, no guessing — stay safe and informed</li>
+        </ul>
+    </div>
 
-st.markdown("""
-<div class="prescripto-box">
-    <p><strong>🧾 Struggling to read handwritten prescriptions?</strong><br>
-    <span style='color: #555;'>Let AI extract and explain your medicine instructions clearly.</span></p>
-    
-    <ul>
-        <li>📷 Upload a photo of a doctor's prescription</li>
-        <li>🔎 Extracts medicine names and instructions using OCR + LLM</li>
-        <li>💡 Get dosage info, timings, side effects, and precautions</li>
-        <li>⚕️ Saves time, avoids confusion, and prevents medication errors</li>
-    </ul>
-
-    <p style='font-weight: 600;'>Ideal for:</p>
-    <ul>
-        <li>👵 Elderly patients needing clarity</li>
-        <li>👨‍👩‍👧‍👦 Family members managing medicines</li>
-        <li>👩‍⚕️ Caregivers, nurses, and pharmacists</li>
-        <li>📱 Anyone who wants safe and informed medicine use</li>
-    </ul>
-
-    <p style='text-align: center; font-style: italic; color: #999;'>
-        Built using EasyOCR, HuggingFace LLMs, LangChain & Streamlit
-    </p>
-</div>
-""", unsafe_allow_html=True)
+    <div class="prescripto-ideal">
+        <p style="font-weight:600; margin-bottom: 10px;">Perfect for:</p>
+        <ul>
+            <li>Senior citizens or non-medical users</li>
+            <li>Busy parents managing family health</li>
+            <li>Caregivers and healthcare workers</li>
+            <li>Anyone who wants clarity about their medication</li>
+        </ul>
+    </div>
 
+    <div class="prescripto-built-note">
+        🤖 Built with EasyOCR, HuggingFace LLMs, LangChain, and Streamlit 💙
+    </div>
 
-st.markdown("""
-<div class="prescripto-creator">
-    <h4>👩‍💻 About the Creator</h4>
+</div>
+
+<div class="creator-section">
+    <h4>👩‍💻 Meet the Creator</h4>
     <p>
         <strong>Harika Padyala</strong><br>
-        Passionate AI Developer & Data Enthusiast<br>
-        Building smart, accessible AI apps for everyone! 🚀
+        Passionate AI Innovator & Data Explorer.<br>
+        Making healthcare easier, one AI tool at a time!
     </p>
     <div>
         <a href="https://github.com/Harika22-08?tab=repositories" target="_blank">