Update app.py

app.py

@@ -16,8 +16,9 @@ import tempfile
 load_dotenv()
 openai.api_key = os.getenv("OPENAI_API_KEY")
 google_api_key = os.getenv("GOOGLE_API_KEY")
-os.environ["GOOGLE_APPLICATION_CREDENTIALS"] = "botidinamix-g.json"
 
+os.environ["GOOGLE_APPLICATION_CREDENTIALS"] = "botidinamix-g.json"
+project_id = os.getenv("GOOGLE_PROJECT_ID")
 
 
 # Configuración de Streamlit
@@ -27,69 +28,97 @@ st.set_page_config(page_title="Asistente Teológico", page_icon="📖")
 st.markdown(
     """
     <style>
-        @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
+        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
+
         body {
-            background-color: #000000;
+            background-color: #1C1C1C;
             color: #ECF0F1;
             background-image: url('https://s1.1zoom.me/big0/395/Fields_Sunrises_and_499477.jpg');
             background-size: cover;
-            font-family: 'Roboto', sans-serif;
+            font-family: 'Poppins', sans-serif;
         }
+
         .stButton>button {
-            background-color: #4CAF50;
-            color: white;
-            border-radius: 10px;
+            background-color: #007BFF;
+            color: #FFD700;
+            border: none;
+            border-radius: 8px;
             font-size: 16px;
-            padding: 10px 20px;
+            padding: 12px 24px;
+            cursor: pointer;
+            transition: background-color 0.3s, transform 0.3s;
         }
+        .stButton>button:hover {
+            background-color: #0056b3;
+            transform: scale(1.05);
+        }
+
         .stTextInput>div>div>input {
-            border: 1px solid #4CAF50;
-            border-radius: 10px;
+            border: 2px solid #FFD700;
+            border-radius: 8px;
             font-size: 16px;
             padding: 10px;
+            background-color: #000000;
+            color: #ECF0F1;
         }
+
         .stMarkdown>div>p {
-            color: black;
-            max-height: 300px;
-            overflow-y: auto;
+            color: #D0D3D4;
             font-size: 16px;
+            line-height: 1.6;
         }
+
         .stMarkdown>h1, .stMarkdown>h2, .stMarkdown>h3, .stMarkdown>h4, .stMarkdown>h5, .stMarkdown>h6 {
-            color: white;
+            color: #FF6F61;
+            font-family: 'Poppins', sans-serif;
             font-weight: bold;
-            font-style: italic;
+            text-transform: uppercase;
         }
+
         .stAudio {
             margin-top: 20px;
-            border: 2px solid #4CAF50;
+            border: 2px solid #FF6F61;
             border-radius: 10px;
         }
+
         .stFileUploader>div>div>input {
-            border: 1px solid #4CAF50;
-            border-radius: 10px;
+            border: 2px solid #FFD700;
+            border-radius: 8px;
             font-size: 16px;
+            padding: 10px;
+            background-color: #000000;
+            color: #ECF0F1;
         }
+
         .spinner {
             border: 8px solid #f3f3f3;
-            border-top: 8px solid #4CAF50;
+            border-top: 8px solid #FF6F61;
             border-radius: 50%;
             width: 60px;
             height: 60px;
             animation: spin 1s linear infinite;
         }
+
         @keyframes spin {
             0% { transform: rotate(0deg); }
             100% { transform: rotate(360deg); }
         }
+
         .video-container {
-            border: 3px solid blue;
-            background-color: gold;
+            border: 3px solid #FF6F61;
+            background-color: #1C1C1C;
             padding: 10px;
             border-radius: 10px;
             margin-bottom: 20px;
         }
+
         .assistant-response {
             font-size: 16px;
+            color: #D0D3D4;
+            background-color: #2E2E2E;
+            padding: 10px;
+            border-radius: 8px;
+            border: 1px solid #FF6F61;
         }
     </style>
     """,