Update app.py

app.py

@@ -19,7 +19,218 @@ SHEET_NAME = "Condition1"
 # ========== استایل‌های سفارشی یکپارچه ==========
 st.markdown("""
 <style>
-/* تنظیمات برای موبایل */
+@font-face {
+    font-family: 'B Nazanin';
+    src: url('https://cdn.jsdelivr.net/gh/rastikerdar/fonts@master/fonts/B%20Nazanin/B%20Nazanin.woff') format('woff');
+}
+
+:root {
+    --primary: #6a0dad;
+    --text: #333333;
+    --background: #ffffff;
+    --border: #dddddd;
+    --input-bg: #ffffff;
+    --secondary-bg: #f8f9fa;
+    --green: #f0ff0;
+    --dgreen: #006400;
+}
+
+* {
+    font-family: 'B Nazanin', 'B Nazanin Bold', sans-serif !important;
+    text-align: right !important;
+    direction: rtl !important;
+}
+
+/* تنظیمات اصلی */
+body, .stApp, [data-testid="stAppViewContainer"] {
+    background-color: var(--background) !important;
+    color: var(--text) !important;
+}
+
+/* هدر راهیار */
+.rahyar-title {
+    color: var(--primary) !important;
+    margin: 0 !important;
+}
+
+.rahyar-subtitle {
+    color: var(--primary) !important;
+    margin: 0 !important;
+    font-size: 14px !important;
+}
+
+/* توضیحات */
+.explanation-title {
+    color: var(--primary) !important;
+    font-weight: bold !important;
+    margin: 20px 0 10px 0 !important;
+    font-size: 18px !important;
+}
+
+.explanation-item {
+    background-color: var(--secondary-bg) !important;
+    border-radius: 8px !important;
+    padding: 12px 15px !important;
+    margin: 8px 0 !important;
+    border-right: 3px solid var(--primary) !important;
+}
+
+/* استایل‌های ورودی */
+.stTextInput input, 
+.stNumberInput input, 
+.stSelectbox select,
+.stTextArea textarea,
+.stDateInput input,
+.stTimeInput input,
+.stMultiSelect div[role="combobox"],
+div[data-testid="stVerticalBlock"] > div[data-testid="stHorizontalBlock"] > div > div > div > div > input,
+div[data-baseweb="select"] > div:first-child {
+    color: var(--text) !important;
+    background-color: var(--input-bg) !important;
+    border: 1px solid var(--primary) !important;
+    border-radius: 6px !important;
+    min-height: 40px !important;
+    transition: all 0.2s ease !important;
+}
+
+/* استایل برای حالت hover و focus */
+.stTextInput input:hover,
+.stNumberInput input:hover,
+.stSelectbox select:hover,
+.stTextArea textarea:hover,
+.stDateInput input:hover,
+.stTimeInput input:hover,
+.stMultiSelect div[role="combobox"]:hover,
+.stTextInput input:focus,
+.stNumberInput input:focus,
+.stSelectbox select:focus,
+.stTextArea textarea:focus,
+.stDateInput input:focus,
+.stTimeInput input:focus {
+    border-color: var(--primary) !important;
+    box-shadow: 0 0 0 3px rgba(106, 13, 173, 0.15) !important;
+    outline: none !important;
+}
+
+/* استایل لیبل‌ها */
+.stTextInput > label,
+.stNumberInput > label,
+.stSelectbox > label,
+.stRadio > label,
+.stSlider > label {
+    color: var(--text) !important;
+    font-weight: bold !important;
+    margin-bottom: 8px !important;
+    font-size: 14px !important;
+}
+
+/* استایل placeholder */
+::placeholder {
+    color: var(--text) !important;
+    opacity: 0.5 !important;
+}
+
+/* استایل‌های خاص Selectbox */
+div[data-baseweb="select"] > div:first-child {
+    -webkit-appearance: none !important;
+    -moz-appearance: none !important;
+    appearance: none !important;
+    background-image: none !important;
+}
+
+/* برای اینترنت اکسپلورر */
+div[data-baseweb="select"] > div:first-child::-ms-expand {
+    display: none !important;
+}
+
+div[data-baseweb="select"] {
+    position: relative !important;
+}
+
+div[data-baseweb="select"]::after {
+    content: "▼";
+    position: absolute;
+    left: 8px;
+    top: 50%;
+    transform: translateY(-50%);
+    color: var(--primary);
+    background-color: white !important;
+    font-size: 14px;
+    pointer-events: none;
+}
+
+/* استایل‌های Number Input */
+.stNumberInput button {
+    color: var(--primary) !important;
+    background-color: transparent !important;
+    border: none !important;
+    width: 30px !important;
+    font-weight: bold !important;
+}
+
+.stNumberInput button:hover {
+    background-color: #f0e6ff !important;
+}
+
+/* دکمه‌ها */
+.stButton>button, 
+[data-testid="baseButton-primary"],
+.accept-btn,
+div[data-testid="stVerticalBlock"] > div[data-testid="stHorizontalBlock"] > div > div > button {
+    background-color: var(--primary) !important;
+    color: white !important;
+    border: none !important;
+    border-radius: 8px !important;
+    padding: 10px 20px !important;
+    font-weight: bold !important;
+    transition: all 0.3s ease !important;
+}
+
+.stButton>button:hover, 
+[data-testid="baseButton-primary"]:hover,
+.accept-btn:hover,
+div[data-testid="stVerticalBlock"] > div[data-testid="stHorizontalBlock"] > div > div > button:hover {
+    background-color: #5a0a96 !important;
+    transform: translateY(-1px) !important;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
+}
+
+/* استایل تضمینی برای رادیو باتن���ها */
+.stRadio > div > div > div > div > div > label,
+.stRadio > div > div > div > div > label,
+.stRadio > div > div > div > label,
+.stRadio > div > div > label,
+.stRadio > div > label,
+.stRadio > label {
+    color: #000000 !important;
+}
+
+.stRadio span {
+    color: #000000 !important;
+}
+
+/* استایل برای هشدارها */
+.stAlert .st-ae {
+    border-right: 4px solid #ffc107 !important;
+    background-color: #fff3cd !important;
+    border-radius: 8px !important;
+    padding: 16px !important;
+    color: #856404 !important;
+}
+
+.stAlert .st-af {
+    color: #ffc107 !important;
+    font-size: 20px !important;
+}
+
+.stAlert .st-ag {
+    color: #856404 !important;
+    font-family: 'B Nazanin' !important;
+    font-size: 14px !important;
+    margin-right: 8px !important;
+}
+
+/* استایل موبایل */
 @media (max-width: 768px) {
     /* اجبار نمایش تمام صفحه به اندازه موبایل */
     html, body, .stApp {
@@ -33,20 +244,6 @@ st.markdown("""
         height: 300px !important; /* ارتفاع نقشه در موبایل */
     }
 
-    /* تغییرات برای بخش‌های مختلف برای موبایل */
-    .stTextInput input, 
-    .stNumberInput input, 
-    .stSelectbox select,
-    .stTextArea textarea,
-    .stDateInput input,
-    .stTimeInput input,
-    .stMultiSelect div[role="combobox"],
-    div[data-testid="stVerticalBlock"] > div[data-testid="stHorizontalBlock"] > div > div > div > div > input,
-    div[data-baseweb="select"] > div:first-child {
-        font-size: 14px !important;
-        padding: 12px !important;
-    }
-
     /* دکمه‌ها برای موبایل */
     .stButton>button, 
     [data-testid="baseButton-primary"] {
@@ -100,52 +297,8 @@ st.markdown("""
     .stSelectbox [role="listbox"] {
         font-size: 16px !important;
     }
-
-    /* تنظیمات مخصوص موبایل برای آیتم‌ها */
-    @media (max-width: 768px) {
-        .stAlert .st-ae {
-            padding: 12px !important;
-            font-size: 13px !important;
-        }
-
-        /* فرم‌ها در موبایل */
-        .stTextInput>label,
-        .stNumberInput>label,
-        .stSelectbox>label {
-            font-size: 14px !important;
-            padding: 4px 0 !important;
-        }
-
-        .stTextInput input,
-        .stNumberInput input,
-        .stSelectbox select {
-            font-size: 16px !important;
-            padding: 12px !important;
-            height: auto !important;
-        }
-
-        .stButton>button {
-            font-size: 14px !important;
-            padding: 8px 16px !important;
-        }
-
-        .stMarkdown h3 {
-            font-size: 16px !important;
-        }
-
-        .stMarkdown p {
-            font-size: 13px !important;
-        }
-
-        .stSelectbox [role="listbox"] {
-            font-size: 16px !important;
-        }
-    }
 }
-
 </style>
-
-<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
 """, unsafe_allow_html=True)