Update app.py

app.py

@@ -16,37 +16,97 @@ st.set_page_config(
 # Custom CSS for better styling with Renesistech branding
 st.markdown("""
 <style>
+    /* Global Styles */
     .stApp {
-        max-width: 1200px;
+        max-width: 1400px;
         margin: 0 auto;
+        background-color: #ffffff;
+        font-family: 'Inter', sans-serif;
+    }
+    
+    /* Header Styles */
+    .renesistech-header {
+        background: linear-gradient(to right, #f8f9fa, #ffffff);
+        padding: 2rem;
+        margin-bottom: 2rem;
+        box-shadow: 0 4px 6px rgba(0,0,0,0.05);
+        text-align: center;
+        border-bottom: 1px solid #eaeaea;
+    }
+    
+    /* Main Content Styles */
+    .stButton > button {
+        background-color: #007bff;
+        color: white;
+        padding: 0.75rem 2rem;
+        border-radius: 8px;
+        border: none;
+        font-weight: 600;
+        transition: all 0.3s ease;
     }
+    
+    .stButton > button:hover {
+        background-color: #0056b3;
+        transform: translateY(-2px);
+    }
+    
+    /* Upload Box Styles */
     .upload-box {
-        border: 2px dashed #4c4c4c;
-        border-radius: 10px;
-        padding: 20px;
+        border: 2px dashed #e0e0e0;
+        border-radius: 12px;
+        padding: 2rem;
         text-align: center;
-        margin: 10px 0;
+        margin: 1rem 0;
+        background-color: #fafafa;
+        transition: all 0.3s ease;
     }
-    .output-box {
-        border: 1px solid #e0e0e0;
-        border-radius: 10px;
-        padding: 20px;
-        margin: 20px 0;
+    
+    .upload-box:hover {
+        border-color: #007bff;
         background-color: #f8f9fa;
     }
-    .renesistech-header {
+    
+    /* Output Box Styles */
+    .output-box {
+        border: 1px solid #eaeaea;
+        border-radius: 12px;
+        padding: 2rem;
+        margin: 2rem 0;
         background-color: #ffffff;
-        padding: 20px;
-        margin-bottom: 30px;
-        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-        text-align: center;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
     }
+    
+    /* Footer Styles */
     .renesistech-footer {
-        background-color: #f8f9fa;
-        padding: 20px;
+        background: linear-gradient(to right, #f8f9fa, #ffffff);
+        padding: 2rem;
         text-align: center;
-        border-top: 1px solid #e0e0e0;
-        margin-top: 40px;
+        border-top: 1px solid #eaeaea;
+        margin-top: 3rem;
+    }
+    
+    /* Typography Improvements */
+    h1, h2, h3, .stMarkdown p {
+        color: #2c3e50;
+        letter-spacing: -0.5px;
+    }
+    
+    .stTextArea textarea {
+        border-radius: 8px;
+        border: 1px solid #eaeaea;
+        padding: 1rem;
+        font-size: 1rem;
+    }
+    
+    .stTextArea textarea:focus {
+        border-color: #007bff;
+        box-shadow: 0 0 0 2px rgba(0,123,255,0.25);
+    }
+    
+    /* Image Display Improvements */
+    .stImage img {
+        border-radius: 12px;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
     }
 </style>
 """, unsafe_allow_html=True)
@@ -118,7 +178,13 @@ if st.button("Generate Try-On", type="primary"):
     else:
         try:
             with st.spinner("🔄 Processing virtual try-on..."):
-                output_path = virtual_try_on(garment_url, person_url, garment_desc)
+                # Read the image data from the temporary files
+                with open(garment_url, 'rb') as f:
+                    garment_data = f.read()
+                with open(person_url, 'rb') as f:
+                    person_data = f.read()
+                    
+                output_path = virtual_try_on(garment_data, person_data, garment_desc)
                 
                 # Display result in a styled box
                 st.markdown("<div class='output-box'>", unsafe_allow_html=True)