Im strugglign

app.py

@@ -13,111 +13,34 @@ st.set_page_config(
     initial_sidebar_state="expanded",
 )
 
-# Custom CSS to improve styling and responsiveness
+import streamlit as st
+from transformers import pipeline
+from PIL import Image
+from huggingface_hub import InferenceClient
+import os
+from gradio_client import Client
+
+# Set page configuration
+st.set_page_config(
+    page_title="DelishAI - Your Culinary Assistant",
+    page_icon="🍽️",
+    layout="centered",
+    initial_sidebar_state="expanded",
+)
+
+# Updated CSS function
 def local_css():
     st.markdown(
         """
-        <style>
-        /* Main layout */
-        .main { background-color: #f0f2f6; }
-
-        /* Title styling */
-        .title h1 {
-            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-            text-align: center;
-            color: #ff4b4b;
-            font-size: 3rem;
-            margin-bottom: 20px;
-        }
-
-        /* Image styling */
-        .st-image img {
-            border-radius: 15px;
-            margin-bottom: 20px;
-            max-width: 100%;
-        }
-
-        /* Sidebar styling */
-        [data-testid="stSidebar"] {
-            background-color: #ff4b4b;
-        }
-        [data-testid="stSidebar"] .css-ng1t4o { color: white; }
-        [data-testid="stSidebar"] .css-1d391kg { color: white; }
-
-        /* File uploader styling */
-        .stFileUploader {
-            border: 2px dashed #ff4b4b;
-            border-radius: 10px;
-            padding: 20px;
-            text-align: center;
-            color: #ff4b4b;
-            background-color: #ffffff;
-            font-weight: bold;
-        }
-
-        /* File uploader hover effect */
-        .stFileUploader:hover {
-            background-color: #ffe5e5;
-        }
-
-        /* Button styling */
-        .stButton>button {
-            background-color: #ff4b4b;
-            color: white;
-            border: none;
-            padding: 0.7rem 1.5rem;
-            border-radius: 5px;
-            font-size: 1.1rem;
-            font-weight: bold;
-            margin-top: 10px;
-        }
-        .stButton>button:hover {
-            background-color: #e04343;
-            color: white;
-        }
-
-        /* Headers styling */
-        h2 { color: #ff4b4b; margin-top: 30px; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
-        h3 { color: #ff4b4b; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
-
-        /* Text styling */
-        .stMarkdown p { font-size: 1.1rem; }
-
-        /* Footer styling */
-        footer { visibility: hidden; }
-
-        /* Hide sidebar on small screens */
-        @media only screen and (max-width: 600px) {
-            [data-testid="stSidebar"] { display: none; }
-            .main .block-container { padding-left: 1rem; padding-right: 1rem; }
-            .title h1 { font-size: 2rem; }
-            .stButton>button { width: 100%; }
-        }
-
-        /* Sample images grid */
-        .sample-images {
-            display: flex;
-            justify-content: center;
-            flex-wrap: wrap;
-            gap: 10px;
-        }
-        .sample-images img {
-            width: 150px;
-            height: 150px;
-            object-fit: cover;
-            border-radius: 10px;
-            cursor: pointer;
-            border: 2px solid transparent;
-        }
-        .sample-images img:hover {
-            border: 2px solid #ff4b4b;
-        }
-        </style>
+        <!-- [Insert the updated CSS code here] -->
         """, unsafe_allow_html=True
     )
 
 local_css()
 
+# Rest of your code remains the same...
+
+
 # Hugging Face API key
 API_KEY = st.secrets["HF_API_KEY"]