Update app.py

app.py

@@ -58,29 +58,28 @@ html, body, .stApp {
 }
 
 @media (min-width: 768px) {
-    /* Reset and base styles */
+    /* Reset default margins and padding */
     html, body {
         margin: 0 !important;
         padding: 0 !important;
-        background: #f0f0f0 !important;
+        background: #f0f0f0 !important; /* رنگ پس‌زمینه خاکستری روشن */
         height: 100vh !important;
-        width: 100vw !important;
         overflow: hidden !important;
     }
-
-    /* Main container to center the mobile frame */
+    
+    /* Container for the mobile frame */
     body {
         display: flex !important;
         justify-content: center !important;
         align-items: center !important;
-        padding: 20px !important; /* فضای اطراف کادر موبایل */
+        background: #f0f0f0 !important; /* مطمئن شوید این رنگ با رنگ پس‌زمینه کادر موبایل متفاوت نیست */
     }
-
-    /* Mobile frame styling - now perfectly centered */
+    
+    /* Mobile frame styling */
     [data-testid="stAppViewContainer"] {
         width: 475px !important;
         height: 667px !important;
-        margin: 0 !important; /* حذف margin اتوماتیک */
+        margin: 0 auto !important;  
         border: 12px solid #000 !important;
         border-radius: 40px !important;
         box-shadow: 
@@ -96,12 +95,21 @@ html, body, .stApp {
         position: relative !important;
     }
 
-    /* پدینگ برای محتوای داخل کادر موبایل */
+    /* Remove any potential dark background from parent elements */
+    #root, .stApp {
+        background: transparent !important;
+        padding: 0 !important;
+        margin: 0 !important;
+    }
+
+    /* Ensure Streamlit's main container doesn't add extra space */
     [data-testid="stAppViewContainer"] > div {
-        padding: 0 5px !important; /* 5px padding راست و چپ */
+        max-width: 100% !important;
+        padding: 0 !important;
+        margin: 0 !important;
     }
 
-    /* تنظیمات اسکرولبار */
+    /* Webkit scrollbar styles */
     [data-testid="stAppViewContainer"]::-webkit-scrollbar {
         width: 6px !important;
         right: 0 !important;
@@ -119,8 +127,14 @@ html, body, .stApp {
         border-radius: 3px !important;
         margin-left: 10px !important;
     }
-
-    /* دکمه هوم مجازی */
+    
+    /* Reset direction for content */
+    [data-testid="stAppViewContainer"] > * {
+        direction: ltr !important;
+        text-align: right !important;
+    }
+    
+    /* Virtual home button */
     [data-testid="stAppViewContainer"]::after {
         content: "";
         position: absolute;
@@ -132,15 +146,6 @@ html, body, .stApp {
         background: #333;
         border-radius: 2px;
     }
-
-    /* اطمینان از نمایش صحیح محتوا */
-    [data-testid="block-container"] {
-        padding: 0 5px !important;
-    }
-    
-    .stApp > div {
-        padding: 0 5px !important;
-    }
 }
 
 /* هدر راهیار */