Update app.py

app.py

@@ -8,8 +8,16 @@ import os
 import json
 import random
 
+
+
 # تنظیمات اولیه
-st.set_page_config(layout="wide", page_title="راهیار - تحلیل انصاف قیمتی", page_icon="🚖")
+
+st.set_page_config(
+    layout="wide",  # حالت گسترده برای همه دستگاه‌ها
+    page_title="راهیار - تحلیل انصاف قیمتی", 
+    page_icon="🚖",
+    initial_sidebar_state="auto"  # تنظیم خودکار وضعیت نوار کناری
+)
 
 # ========== تنظیمات دیتا ==========
 SHEET_ID = "1mmdWAyOCYq4yXMgP53Duq712AnlqZWLkfIo76JqM7wM"
@@ -106,38 +114,62 @@ st.markdown("""
         padding-right: 15px;
         border-right: 3px solid #6a0dad;
     }
+      /* تنظیمات پایه برای همه دستگاه‌ها */
+    * {
+        font-family: 'Vazir', sans-serif !important;
+        text-align: right !important;
+        direction: rtl !important;
+        box-sizing: border-box !important;
+    }
+
+    /* تنظیمات مخصوص موبایل */
+    @media only screen and (max-width: 768px) {
+        .rahyar-price {
+            font-size: 24px !important;  /* کاهش اندازه فونت قیمت در موبایل */
+        }
+        .price-container {
+            padding: 10px !important;  /* کاهش padding در موبایل */
+        }
+        .folium-map {
+            height: 300px !important;  /* کاهش ارتفاع نقشه در موبایل */
+        }
+    }
+
+    /* تنظیمات مخصوص دسکتاپ */
+    @media only screen and (min-width: 769px) {
+        .folium-map {
+            height: 400px !important;  /* ارتفاع ثابت برای دسکتاپ */
+        }
+    }
 </style>
 """, unsafe_allow_html=True)
 
 # ========== توابع اصلی ==========
+
 def create_ride_map():
-    """ایجاد نقشه سفر با Folium"""
-    # مختصات تهران (میدان ونک تا میدان تجریش)
     start_point = [35.7698, 51.4116]  # میدان ونک
     end_point = [35.8044, 51.4258]    # میدان تجریش
     
     m = folium.Map(location=[35.7871, 51.4187], zoom_start=13)
     
     # اضافه کردن مبدأ و مقصد
-    folium.Marker(
-        start_point,
-        popup="<b>مبدأ:</b> میدان ونک",
-        icon=folium.Icon(color="green", icon="flag", prefix="fa")
-    ).add_to(m)
-    
-    folium.Marker(
-        end_point,
-        popup="<b>مقصد:</b> میدان تجریش",
-        icon=folium.Icon(color="red", icon="flag", prefix="fa")
-    ).add_to(m)
+    folium.Marker(start_point, popup="مبدأ: میدان ونک", icon=folium.Icon(color="green")).add_to(m)
+    folium.Marker(end_point, popup="مقصد: میدان تجریش", icon=folium.Icon(color="red")).add_to(m)
     
     # خط مسیر
-    folium.PolyLine(
-        [start_point, end_point],
-        color="#6a0dad",
-        weight=3,
-        opacity=1
-    ).add_to(m)
+    folium.PolyLine([start_point, end_point], color="#6a0dad", weight=3).add_to(m)
+    
+    # تنظیمات واکنش‌گرا برای نقشه
+    m.get_root().width = "100%"
+    m.get_root().height = "100%"
+    m.get_root().add_child(folium.Element("""
+        <style>
+            .folium-map {
+                width: 100% !important;
+                height: 100% !important;
+            }
+        </style>
+    """))
     
     return m
 
@@ -302,14 +334,13 @@ def map_view():
     folium_static(create_ride_map(), width=800, height=400)
     
     st.markdown(f"""
-    <div class="price-container">
-        <div style="display: flex; justify-content: space-between; align-items: center;">
-            <span>راهیار <span class="rahyar-badge">به صرفه</span></span>
-            <span class="rahyar-price">{st.session_state.price:,} تومان</span>
-        </div>
+<div class="price-container" style="width: 100%;">
+    <div style="display: flex; justify-content: space-between; align-items: center;">
+        <span>راهیار <span class="rahyar-badge">به صرفه</span></span>
+        <span class="rahyar-price">{st.session_state.price:,} تومان</span>
     </div>
-    """, unsafe_allow_html=True)
-    
+</div>
+""", unsafe_allow_html=True)
     show_explanation(st.session_state.scenario_type)
     
     if st.button("درخواست راهیار", key="request_btn", type="primary"):