In moblie view, the task list stays on top

app.py

@@ -19,14 +19,7 @@ css = """
 with gr.Blocks(css=css) as demo:
 
     with gr.Row():
-        # Main content
-        with gr.Column(scale=3):
-            gr.Markdown("### 🧠 تجربة منصة الصحة النفسية", elem_classes="rtl")
-            text_input = gr.Textbox(label="أدخل النص هنا لتحليله", lines=7, elem_classes="rtl")
-            analyze_btn = gr.Button("ابدأ التحليل", elem_classes="rtl")
-            output = gr.Textbox(label="النتيجة", elem_classes="rtl")
-
-        # Sidebar
+        # Sidebar (moved above main content in mobile)
         with gr.Column(scale=1):
             with gr.Group(elem_classes="sidebar-box rtl"):
                 gr.Markdown("### القائمة الجانبية", elem_classes="rtl")
@@ -51,6 +44,13 @@ with gr.Blocks(css=css) as demo:
                         elem_classes="rtl"
                     )
 
+        # Main content
+        with gr.Column(scale=3):
+            gr.Markdown("### 🧠 تجربة منصة الصحة النفسية", elem_classes="rtl")
+            text_input = gr.Textbox(label="أدخل النص هنا لتحليله", lines=7, elem_classes="rtl")
+            analyze_btn = gr.Button("ابدأ التحليل", elem_classes="rtl")
+            output = gr.Textbox(label="النتيجة", elem_classes="rtl")
+
     # Toggle logic for classification box
     def toggle_classification(task_choice):
         return gr.update(visible=(task_choice == "classification"))