Update app.py

app.py

@@ -3,10 +3,10 @@ import numpy as np
 import plotly.express as px
 import plotly.graph_objects as go
 import gradio as gr
-from gradio.components import Plot
 
 #DATOS
 
+
 cities_data = {
     'Abancay': {
         'desempleo_trimestral': [
@@ -1151,6 +1151,7 @@ cities_data = {
 }
 
 
+
 #DATOS
 
 COLORES = {
@@ -1389,7 +1390,6 @@ with gr.Blocks(
     .card {border: 1px solid #e0e0e0; border-radius: 8px; padding: 20px; margin: 10px 0; background: white}
     .header {font-size: 28px; font-weight: bold; color: #2c3e50; margin-bottom: 20px}
     .subheader {font-size: 20px; color: #3498db; margin: 15px 0}
-    .plot-container {min-height: 500px}
     """
 ) as app:
     
@@ -1403,36 +1403,29 @@ with gr.Blocks(
     )
     
     with gr.Tab("Análisis por Ciudad"):
-        radar_plot = Plot()
-        desempleo_plot = Plot()
-        ingresos_plot = Plot()
-        informalidad_plot = Plot()
-        actividad_plot = Plot()
-        brecha_plot = Plot()
+        with gr.Column(elem_classes="card"):
+            gr.Markdown("## 📍 Indicadores Clave", elem_classes="subheader")
+            radar_plot = Plot()
         
-        gr.Markdown("## 📍 Indicadores Clave", elem_classes="subheader")
-        radar_plot.render()
+        with gr.Column(elem_classes="card"):
+            gr.Markdown("## 📈 Tendencias Principales", elem_classes="subheader")
+            with gr.Row():
+                desempleo_plot = Plot()
+                ingresos_plot = Plot()
+            with gr.Row():
+                informalidad_plot = Plot()
+                actividad_plot = Plot()
         
-        gr.Markdown("## 📈 Tendencias Principales", elem_classes="subheader")
-        with gr.Row():
-            desempleo_plot.render()
-            ingresos_plot.render()
-        with gr.Row():
-            informalidad_plot.render()
-            actividad_plot.render()
-        
-        gr.Markdown("## 📉 Brecha Salarial", elem_classes="subheader")
-        brecha_plot.render()
+        with gr.Column(elem_classes="card"):
+            gr.Markdown("## 📉 Brecha Salarial", elem_classes="subheader")
+            brecha_plot = Plot()
     
     with gr.Tab("Análisis Comparativo"):
-        global_desempleo = Plot()
-        global_ingresos = Plot()
-        global_brecha = Plot()
-        
-        gr.Markdown("## 🏙️ Comparativa entre Ciudades", elem_classes="subheader")
-        global_desempleo.render()
-        global_ingresos.render()
-        global_brecha.render()
+        with gr.Column(elem_classes="card"):
+            gr.Markdown("## 🏙️ Comparativa entre Ciudades", elem_classes="subheader")
+            global_desempleo = Plot()
+            global_ingresos = Plot()
+            global_brecha = Plot()
 
     @app.load()
     def cargar_inicial():