Update app.py

app.py

@@ -137,6 +137,13 @@ h1 {
     text-align: center;
     margin-bottom: 20px;
 }
+.input-group, .output-group {
+    border: 1px solid #e0e0e0;
+    border-radius: 10px;
+    padding: 20px;
+    margin-bottom: 20px;
+    background-color: #f9f9f9;
+}
 .input-box, .output-box {
     border: 1px solid #bdc3c7;
     border-radius: 5px;
@@ -159,34 +166,21 @@ h1 {
 .submit-btn:hover {
     background-color: #3498db;
 }
-.gr-form {
-    border: 1px solid #e0e0e0;
-    border-radius: 10px;
-    padding: 20px;
-    margin-bottom: 20px;
-    background-color: #f9f9f9;
-}
-.gr-box {
-    border: 1px solid #e0e0e0;
-    border-radius: 10px;
-    padding: 20px;
-    margin-bottom: 20px;
-    background-color: #ffffff;
-}
 """
 
-    
+# ... (keep the helper functions as before)
+
 # Gradio Interface
 with gr.Blocks(css=css) as demo:
     gr.Markdown("# VLM Captioner + Prompt Enhancer + SD3 Image Generator")
     
     with gr.Row():
         with gr.Column(scale=1):
-            with gr.Box():
+            with gr.Group(elem_classes="input-group"):
                 input_image = gr.Image(label="Input Image for VLM", elem_classes="input-box")
                 use_vlm = gr.Checkbox(label="Use VLM Captioner", value=False)
             
-            with gr.Box():
+            with gr.Group(elem_classes="input-group"):
                 text_prompt = gr.Textbox(label="Text Prompt", elem_classes="input-box")
                 use_enhancer = gr.Checkbox(label="Use Prompt Enhancer", value=False)
                 model_choice = gr.Radio(["Medium", "Long"], label="Enhancer Model", value="Long")
@@ -203,9 +197,10 @@ with gr.Blocks(css=css) as demo:
             generate_btn = gr.Button("Generate Image", elem_classes="submit-btn")
         
         with gr.Column(scale=1):
-            output_image = gr.Image(label="Generated Image", elem_classes="output-box")
-            final_prompt = gr.Textbox(label="Final Prompt Used", elem_classes="output-box")
-            used_seed = gr.Number(label="Seed Used", elem_classes="output-box")
+            with gr.Group(elem_classes="output-group"):
+                output_image = gr.Image(label="Generated Image", elem_classes="output-box")
+                final_prompt = gr.Textbox(label="Final Prompt Used", elem_classes="output-box")
+                used_seed = gr.Number(label="Seed Used", elem_classes="output-box")
     
     generate_btn.click(
         fn=process_workflow,