app.py

import streamlit as st
import folium
from streamlit_folium import folium_static
import streamlit.components.v1 as components
from datetime import datetime
import gspread
from google.oauth2.service_account import Credentials
import os
import json
import random
import time

# تنظیمات اولیهه

st.set\_page\_config(layout="wide", page\_title="راهیار - تحلیل انصاف قیمتی", page\_icon="🚖")

# ========== تنظیمات دیتا ==========

SHEET\_ID = "1mmdWAyOCYq4yXMgP53Duq712AnlqZWLkfIo76JqM7wM"
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;
}

/* ======== تنظیمات پایه ======== */
* {
    font-family: 'B Nazanin', 'B Nazanin Bold', sans-serif !important;
    text-align: right !important;
    direction: rtl !important;
    box-sizing: border-box !important;
}

/* تنظیمات برای موبایل و نمایش موبایل در تمام دستگاه‌ها */
html, body, .stApp {
    max-width: 768px !important; /* حداکثر عرض صفحه */
    margin: 0 auto; /* وسط‌چین کردن محتوا */
    width: 100% !important
    background-color: var(--background) !important;
    color: var(--text) !important;
}

@media (min-width: 768px) {    
    /* Container for the mobile frame */
    body {
        background: #f0f0f0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        height: 100vh !important;
        overflow: hidden !important;
    }
    
    /* Mobile frame styling */
    [data-testid="stAppViewContainer"] {
        width: 475px !important;
        height: 667px !important;
        margin: 0 auto !important; 
        border: 12px solid #000 !important;
        border-radius: 40px !important;
        box-shadow: 
            0 0 0 6px #666, 
            0 0 30px rgba(0,0,0,0.5) !important;
        background-color: var(--background) !important;
        color: var(--text) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        scrollbar-width: thin !important;
        scrollbar-color: #6a0dad #f0f0f0 !important;
        direction: rtl !important;
    }

    /* Remove any potential dark background from parent elements */
    #root, .stApp {
        background: transparent !important;
        margin: 0 auto;
    }

    /* Ensure Streamlit's main container doesn't add extra space */
    [data-testid="stAppViewContainer"] > div {
        max-width: 100% !important;
        margin: 0 auto;
    }

    /* Webkit scrollbar styles */
    [data-testid="stAppViewContainer"]::-webkit-scrollbar {
        width: 6px !important;
        right: 0 !important;
        left: auto !important;
    }
    
    [data-testid="stAppViewContainer"]::-webkit-scrollbar-track {
        background: #f0f0f0 !important;
        border-radius: 3px !important;
        margin: 10px 0 !important;
    }
    
    [data-testid="stAppViewContainer"]::-webkit-scrollbar-thumb {
        background-color: #6a0dad !important;
        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;
        bottom: 15px;
        left: 50%;
        transform: translateX(-50%);
        width: 100px;
        height: 4px;
        background: #333;
        border-radius: 2px;
    }
    /* تنظیم پدینگ عمومی با * */
    [data-testid="stAppViewContainer"] * {
        padding-right: 5px !important;
        padding-left: 8px !important;
        box-sizing: border-box !important;
    }
    
    /* استثناهای اصلی */
    [data-testid="stAppViewContainer"]::after,
    [data-testid="stAppViewContainer"]::-webkit-scrollbar,
    [data-testid="stAppViewContainer"] .stButton>button,
    [data-testid="stAppViewContainer"] .stTextInput>div>div>input,
    [data-testid="stAppViewContainer"] .stNumberInput>div>div>input,
    [data-testid="stAppViewContainer"] .stSelectbox>div>div>select,
    [data-testid="stAppViewContainer"] .stTextArea>div>textarea,
    [data-testid="stAppViewContainer"] .stDateInput>div>div>input,
    [data-testid="stAppViewContainer"] .stTimeInput>div>div>input,
    [data-testid="stAppViewContainer"] .price-container,
    [data-testid="stAppViewContainer"] .stAlert,
    [data-testid="stAppViewContainer"] .stMarkdown,
    [data-testid="stAppViewContainer"] .folium-map,
    [data-testid="stAppViewContainer"] .stRadio>div>div>div>label,
    [data-testid="stAppViewContainer"] .stCheckbox>div>div>label,
    [data-testid="stAppViewContainer"] .stSlider>div>div>div>div,
    [data-testid="stAppViewContainer"] .stMultiSelect>div>div>div {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    
    /* تنظیمات خاص برای کانتینرهای Streamlit */
    [data-testid="stAppViewContainer"] [data-testid="stVerticalBlock"]>div,
    [data-testid="stAppViewContainer"] [data-testid="stHorizontalBlock"]>div {
        padding-right: 5px !important;
        padding-left: 8px !important;
    }
    
    /* بازنشانی پدینگ برای المان‌های داخلی خاص */
    [data-testid="stAppViewContainer"] .stTextInput>div,
    [data-testid="stAppViewContainer"] .stNumberInput>div,
    [data-testid="stAppViewContainer"] .stSelectbox>div,
    [data-testid="stAppViewContainer"] .stTextArea>div,
    [data-testid="stAppViewContainer"] .stDateInput>div,
    [data-testid="stAppViewContainer"] .stTimeInput>div {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}

/* هدر راهیار */
.rahyar-title {
    color: var(--primary) !important;
    margin: 0 !important;
}

.rahyar-subtitle {
    color: var(--primary) !important;
    margin: 0 !important;
    font-size: 16px !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;
    font-size: 18px !important;
}


/* ========== استایل‌های ورودی یکپارچه ========== */
/* استایل پایه برای تمام کانتینرهای ورودی */
div[data-baseweb="select"] > div:first-child,
div[data-baseweb="input"] > div:first-child,
div[data-baseweb="textarea"] > div:first-child {
    color: var(--text) !important;
    border-radius: 6px !important;
    border: 1px solid var(--primary) !important;
    background-color: white !important;
}

/* استایل داخلی برای المان‌های ورودی */
div[data-baseweb="select"] input,
div[data-baseweb="input"] input,
div[data-baseweb="textarea"] textarea {
    color: var(--text) !important;
    background-color: white !important;
    border: none !important;
    min-height: 40px !important;
    font-family: 'B Nazanin' !important;
    direction: rtl !important;
}

/* استایل خاص برای سلکت باکس */
div[data-baseweb="select"] > div:first-child {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: none !important;
    padding-right: 30px !important; /* فضای برای فلش */
}

/* فلش سفارشی برای سلکت باکس */
div[data-baseweb="select"]::after {
    content: "▼";
    position: absolute;
    left: 7px !important;
    top: 50%;
    transform: translateY(-50%);
    color: var(--primary) !important;
    background-color: white !important; /* پسزمینه سفید برای پوشاندن فلش پیشفرض */
    font-size: 14px !important;
    pointer-events: none;
}

/* استایل dropdown */
div[data-baseweb="popover"] {
    border: 1px solid var(--primary) !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

/* آیتم‌های dropdown */
div[data-baseweb="popover"] [role="option"] {
    color: var(--text) !important;
    background-color: white !important;
    padding: 10px 12px !important;
    font-family: 'B Nazanin' !important;
    direction: rtl !important;
}

/* آیتم انتخاب شده در dropdown */
div[data-baseweb="popover"] [role="option"][aria-selected="true"] {
    background-color: #f0e6ff !important;
}

/* استایل hover برای تمام المان‌های ورودی */
div[data-baseweb="select"] > div:first-child:hover,
div[data-baseweb="input"] > div:first-child:hover,
div[data-baseweb="textarea"] > div:first-child:hover {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(106, 13, 173, 0.15) !important;
}

/* استایل focus */
div[data-baseweb="select"] > div:first-child:focus-within,
div[data-baseweb="input"] > div:first-child:focus-within,
div[data-baseweb="textarea"] > div:first-child:focus-within {
    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: 16px !important;
    display: block !important;
}

/* استایل placeholder */
::placeholder {
    color: var(--text) !important;
    opacity: 0.5 !important;
    font-family: 'B Nazanin' !important;
}

/* پاکسازی عناصر سیاه رنگ ناخواسته */
div[data-testid="stNumberInput"] > div > div:first-child,
div[data-testid="stNumberInput"] > div > div:last-child {
    background-color: transparent !important;
    border: none !important;
}

/* حذف عناصر سیاه پس‌زمینه */
div[data-testid="stNumberInput"] button > div {
    display: none !important;
}

/* حذف کامل عناصر داخلی ناخواسته */
div[data-testid="stNumberInput"] button > div,
div[data-testid="stNumberInput"] button > svg {
    display: none !important;
    visibility: hidden !important;
}

/* ایجاد آیکون‌های سفارشی با رنگ بنفش */
div[data-testid="stNumberInput"] button {
    position: relative !important;
    color: transparent !important; /* مخفی کردن متن پیش‌فرض */
}

/* دکمه سمت راست (کاهش) */
div[data-testid="stNumberInput"] button:first-child::after {
    content: "-" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: var(--primary) !important;
    font-size: 1.2rem !important;
    font-weight: bold !important;
}

/* دکمه سمت چپ (افزایش) */
div[data-testid="stNumberInput"] button:last-child::after {
    content: "+" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    color: var(--primary) !important;
    font-size: 1.2rem !important;
    font-weight: bold !important;
}

/* بازنشانی کامل استایل‌های Streamlit */
div[data-testid="stNumberInput"] button {
    all: unset !important;
    width: 36px !important;
    height: 100% !important;
    position: relative !important;
    cursor: pointer !important;
    z-index: 10 !important;
}

/* تضمین رنگ در حالت‌های مختلف */
div[data-testid="stNumberInput"] button:hover::after,
div[data-testid="stNumberInput"] button:focus::after {
    color: var(--primary) !important;
}

/* استایل hover برای دکمه‌ها */
div[data-testid="stNumberInput"] button:hover {
    background-color: #f0e6ff !important;
}

/* استایل focus */
div[data-testid="stNumberInput"] > div:focus-within {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(106, 13, 173, 0.15) !important;
    outline: none !important;
}


/* کامپوننت‌های سفارشی */
.rahyar-header {
    background-color: var(--primary) !important;
    color: white !important;
    padding: 15px !important;
    border-radius: 10px !important;
    margin-bottom: 20px !important;
    text-align: center !important;
}

.price-container {
    background-color: var(--secondary-bg) !important;
    border-radius: 10px !important;
    padding: 15px !important;
    margin: 15px 0 !important;
    border-right: 5px solid var(--primary) !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; /* افزودن transition برای انیمیشن نرم */
}

/* افکت hover برای دکمه اصلی */
.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; /* سایه بیشتر */
}

/* دکمه ثانویه (سفید با حاشیه بنفش) */
.stFormSubmitButton>button,
[data-testid="baseButton-secondary"],
.reject-btn {
    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; /* افزودن transition برای انیمیشن نرم */
}

/* افکت hover برای دکمه ثانویه */
.stFormSubmitButton>button:hover,
[data-testid="baseButton-secondary"]:hover,
.reject-btn: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;
    -webkit-text-fill-color: #000000 !important; /* برای مرورگرهای وبکیت */
    font-size: 20px !important
}

.stRadio span {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    font-size: 20px !important
}

/* اگر باز هم مشکل داشت این را اضافه کنید */
.stRadio > div > div > div > div > div > label > div:first-child,
.stRadio > div > div > div > div > label > div:first-child,
.stRadio > div > div > div > label > div:first-child,
.stRadio > div > div > label > div:first-child,
.stRadio > div > label > div:first-child,
.stRadio > label > div:first-child {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    font-size: 20px !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: 16px !important;
    margin-right: 8px !important;
}

/* حالت hover برای هشدار */
.stAlert .st-ae:hover {
    box-shadow: 0 2px 8px rgba(255, 193, 7, 0.2) !important;
    transform: translateX(2px);
    transition: all 0.3s ease;
}

/* استایل برای دکمه بستن هشدار */
.stAlert .st-ah {
    color: #856404 !important;
}

/* استایل مخصوص موبایل */
@media (max-width: 768px) {
    .stAlert .st-ae {
        padding: 12px !important;
        font-size: 15px !important;
    }
}


/* متن گزینه‌ها */
.stRadio span {
    color: #000000 !important; /* مشکی خالص */
    font-size: 20px !important;
    padding-right: 5px !important;
}

/* حالت hover */
.stRadio label:hover span {
    color: #333333 !important; /* مشکی کمی روشن‌تر */
    font-size: 20px !important;
}



/* تنظیمات مخصوص موبایل */
@media (max-width: 768px) {
    .folium-map {
        height: 300px !important;
    }
    
    /* فرم‌ها در موبایل */
    .stTextInput>label,
    .stNumberInput>label,
    .stSelectbox>label {
        font-size: 16px !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: 17px !important;
        padding: 8px 16px !important;
    }

    .stMarkdown h2 {
        font-size: 22px !important;
    }
    
    .stMarkdown h3 {
        font-size: 19px !important;
    }
    
    .stMarkdown p {
        font-size: 17px !important;
    }
    
    .stSelectbox [role="listbox"] {
        font-size: 18px !important;
    }
    .stRadio span {
        color: #000000 !important; /* مشکی خالص */
        font-size: 20px !important;
        padding-right: 5px !important;
    }
    
    /* حالت hover */
    .stRadio label:hover span {
        color: #333333 !important; /* مشکی کمی روشن‌تر */
        font-size: 20px !important;
    }
}

/* ======== تنظیمات پایه واکنش‌گرا ======== */
:root {
    /* اندازه‌های پایه بر اساس عرض 375px (آیفون X) */
    --base-font-size: 20px;
    --base-heading1-size: 24px;
    --base-heading2-size: 22px;
    --base-heading3-size: 20px;
    --base-input-font: 16px;
    --base-button-font: 16px;
}

/* ======== تنظیمات پویا بر اساس عرض دستگاه ======== */
@media (max-width: 400px) {
    :root {
        --base-font-size: 17px;
        --base-heading1-size: 22px;
        --base-heading2-size: 18px;
        --base-heading3-size: 16px;
        --base-input-font: 14px;
        --base-button-font: 14px;
    }
}

@media (min-width: 401px) and (max-width: 768px) {
    :root {
        --base-font-size: 17px;
        --base-heading1-size: 24px;
        --base-heading2-size: 20px;
        --base-heading3-size: 18px;
        --base-input-font: 16px;
        --base-button-font: 16px;
    }
}

/* ======== اعمال اندازه‌های پویا ======== */
* {
    font-size: var(--base-font-size) !important;
}

h1 {
    font-size: var(--base-heading1-size) !important;
}

h2 {
    font-size: var(--base-heading2-size) !important;
}

h3 {
    font-size: var(--base-heading3-size) !important;
}

.stTextInput input,
.stNumberInput input,
.stSelectbox select,
.stTextArea textarea {
    font-size: var(--base-input-font) !important;
}

.stButton>button {
    font-size: var(--base-button-font) !important;
}

/* ======== تنظیمات نقشه واکنش‌گرا ======== */
.folium-map {
    height: calc(100vw * 0.8) !important; /* ارتفاع متناسب با عرض */
    max-height: 400px !important;
}

/* ======== تنظیمات کانتینرها ======== */
.price-container,
.explanation-item {
    padding: calc(var(--base-font-size) * 0.8) !important;
    margin: calc(var(--base-font-size) * 0.5) 0 !important;
}

/* ======== تنظیمات دکمه‌ها ======== */
.stButton>button {
    padding: calc(var(--base-font-size) * 0.7) calc(var(--base-font-size) * 1.2) !important;
}
/* اضافه کردن این بخش جدید */
[data-testid="stAppViewContainer"] img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 auto !important;
}

/* برای تضمین نمایش در حالت موبایل شبیه‌سازی شده */
@media (min-width: 768px) {
    [data-testid="stAppViewContainer"] img {
        max-width: 200px !important;
    }
}


/* تنظیم justify برای تمام متن‌ها */
[data-testid="stAppViewContainer"] * {
    text-align: justify !important;
    text-justify: inter-word !important;
}

/* استثناها برای عناصری که نباید justify شوند */
[data-testid="stAppViewContainer"] .stRadio>label,
[data-testid="stAppViewContainer"] .stCheckbox>label,
[data-testid="stAppViewContainer"] .stSelectbox>label,
[data-testid="stAppViewContainer"] .stTextInput>label,
[data-testid="stAppViewContainer"] .stNumberInput>label,
[data-testid="stAppViewContainer"] input,
[data-testid="stAppViewContainer"] select,
[data-testid="stAppViewContainer"] textarea,
[data-testid="stAppViewContainer"] .rahyar-title,
[data-testid="stAppViewContainer"] .rahyar-subtitle {
    direction: rtl !important;
    text-align: right !important;
    text-justify: auto !important;
}

/* تنظیمات برای لیست‌ها */
[data-testid="stAppViewContainer"] ul,
[data-testid="stAppViewContainer"] ol {
    padding-right: 25px !important;
}

[data-testid="stAppViewContainer"] p:not(.stButton p):not(.stDownloadButton p):not(.stFormSubmitButton p) {
    margin-bottom: 1em !important;
    line-height: 1.8 !important;
}
</style>

""", unsafe\_allow\_html=True)

# ========== توابع اصلی ==========

def enhanced\_likert\_scale(question\_data):
"""لیکرت اسکیل با خط و نقاط - کاملاً واکنش‌گرا"""
question = question\_data\["question"]
key = question\_data\["key"]
scale = question\_data\["scale"]
labels = question\_data.get("labels", \["کاملاً مخالفم", "کاملاً موافقم"])

```
if key not in st.session_state:
    st.session_state[key] = None

# نمایش سوال
st.markdown(f"<div style='text-align:center; font-weight:bold; margin-bottom:15px;'>{question}</div>", 
            unsafe_allow_html=True)

# ایجاد خط و نقاط با HTML/CSS
scale_html = f"""
<style>
    .likert-line {{
        width: 80%;
        height: 2px;
        background: #6a0dad;
        margin: 0 auto;
        position: relative;
        display: flex;
        justify-content: space-between;
        direction: rtl; /* تغییر جهت از راست به چپ */
    }}
    .likert-dot {{
        width: 18px;  /* اندازه دکمه‌ها کوچک‌تر شد */
        height: 18px; /* اندازه دکمه‌ها کوچک‌تر شد */
        border-radius: 50%;
        background: white;
        border: 2px solid #6a0dad;
        position: relative;
        top: -9px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    }}
    .likert-dot.selected {{
        background: #6a0dad;
    }}
    .likert-labels {{
        width: 80%;
        margin: 5px auto 20px;
        display: flex;
        justify-content: space-between;
        direction: rtl; /* جهت لیبل‌ها باید از راست به چپ باشد */
    }}
    .likert-value {{
        text-align: center;
        margin-top: 10px;
        color: #6a0dad;
        font-weight: bold;
    }}
    /* مخفی کردن دکمه‌ها با اندازه کوچک */
    .likert-button {{
        visibility: hidden;
        width: 12px;
        height: 12px;
        margin: 2px; /* فاصله کم بین دکمه‌ها */
    }}
    @media (max-width: 768px) {{
        .likert-line {{
            width: 90%;
        }}
        .likert-labels {{
            width: 90%;
        }}
    }}
</style>

<div class='likert-container'>
    <div class='likert-labels'>
        <span>{labels[1]}</span>
        <span>{labels[0]}</span>
    </div>
    <div class='likert-line'>
"""

# اضافه کردن نقاط
for i in range(scale):
    value = scale - i
    is_selected = st.session_state.get(key) == value
    scale_html += f"<div class='likert-dot {'selected' if is_selected else ''}' onclick='setLikertValue({value})'></div>"

scale_html += "</div>"

# نمایش مقدار انتخاب شده
if st.session_state.get(key):
    scale_html += f"<div class='likert-value'>پاسخ شما: {st.session_state[key]}</div>"

scale_html += "</div>"

# تزریق JavaScript برای مدیریت کلیک
components.html(scale_html + """
<script>
function setLikertValue(value) {
    const streamlitDoc = window.parent.document;
    const buttons = streamlitDoc.querySelectorAll('button[data-testid="stButton"]'); // جستجوی دکمه‌ها در DOM
    buttons.forEach(btn => {
        if (btn.textContent.trim() === String(value)) {
            btn.click();  // کلیک روی دکمه مورد نظر برای انتخاب مقدار
        }
    });
}
</script>
""", height=80)

# دکمه‌های واقعی (مخفی و کوچک)
btn_cols = st.columns(scale)
for i in range(scale):
    with btn_cols[i]:
        value = scale - i
        if st.button(
            str(value),
            key=f"{key}_btn_{value}",
            type="primary" if st.session_state.get(key) == value else "secondary",
            help="این دکمه‌ها مخفی هستند"  # پیام راهنما
        ):
            st.session_state[key] = value
            st.rerun()

return st.session_state.get(key)
```

def create\_ride\_map():
"""ایجاد نقشه سفر با Folium - نسخه اصلاح شده با مناطق عمومی"""
\# نقاط تقریبی برای مناطق عمومی جنوب و غرب تهران
south\_tehran = \[35.65, 51.38]  # منطقه عمومی جنوب تهران
west\_tehran = \[35.72, 51.31]   # منطقه عمومی غرب تهران

```
# مرکز نقشه بین دو نقطه
m = folium.Map(location=[35.685, 51.315], zoom_start=11)

# ایجاد دایره برای مبدأ (جنوب تهران)
folium.Circle(
    location=south_tehran,
    radius=2500,  # شعاع 1.5 کیلومتر
    popup="<b>مبدأ:</b> منطقه جنوب تهران",
    color="#6a0dad",
    fill=True,
    fill_color="#6a0dad",
    fill_opacity=0.2,
    weight=2
).add_to(m)

# ایجاد دایره برای مقصد (غرب تهران)
folium.Circle(
    location=west_tehran,
    radius=2500,  # شعاع 1.5 کیلومتر
    popup="<b>مقصد:</b> منطقه غرب تهران",
    color="#ff0000",
    fill=True,
    fill_color="#ff0000",
    fill_opacity=0.2,
    weight=2
).add_to(m)

# خط ارتباطی بین دو منطقه
folium.PolyLine(
    [south_tehran, west_tehran],
    color="#6a0dad",
    weight=3,
    opacity=0.7,
    dash_array='5, 5'  # خط چین
).add_to(m)

return m
```

def show\_explanation(exp\_type):
"""نمایش توضیحات قیمت"""
explanations = {
"input": \[
" سطح تقاضا در منطقه: زیاد (+)",
" تعداد رانندگان فعال: کم (+)",
" زمان روز: ساعت اوج ترافیک (+)",
"شرایط جوی: هوای بارانی  (++)"
],
"counterfactual": \[
"اگر این سفر را 1 ساعت دیرتر درخواست کنید، به دلیل سطح تقاضای کمتر، رانندگان فعال بیش‌تر، زمان بهتر روز و شرایط جوی بهتر، احتمالاً قیمت حدوداً 40٪ کمتر (120 هزار تومان) خواهد بود.",
]
}

```
if exp_type != "control":
    if exp_type == "input":
        st.markdown("<p class='explanation-title'>علت قیمت گذاری:</p>", unsafe_allow_html=True)
        st.markdown("""
        <div style="direction: rtl; text-align: right;">
            <span style="font-size: 0.9em; color: #666;">(تعداد علامت + نشان دهنده شدت اثر عامل بر قیمت است)</span>
        </div>
        """, unsafe_allow_html=True)
        for item in explanations.get(exp_type, []):
            st.markdown(f"<p class='explanation-item'>• {item}</p>", unsafe_allow_html=True)
    
    elif exp_type == "counterfactual":
        st.markdown("<p class='explanation-title'>علت قیمت گذاری:</p>", unsafe_allow_html=True)
        for item in explanations.get(exp_type, []):
            st.markdown(f"<p class='explanation-item'>• {item}</p>", unsafe_allow_html=True)


        
```

def create\_likert\_question(question, key, scale\_type="5point"):
"""نمایش سوال لیکرت با اسلایدر نقطه‌ای"""
left\_label = "کاملاً مخالفم" if scale\_type == "7point" else "کاملاً مخالفم"
right\_label = "کاملاً موافقم" if scale\_type == "7point" else "کاملاً موافقم"

```
st.markdown(f"<p style='font-size:16px; margin-bottom:5px;'>{question}</p>", unsafe_allow_html=True)

max_value = 7 if scale_type == "7point" else 5

# اضافه کردن attribute برای انتخاب استایل مناسب
slider_container = st.empty()
with slider_container:
    st.markdown(f'<div data-testid="stSlider" data-discrete="{"seven-point" if scale_type=="7point" else "five-point"}">', unsafe_allow_html=True)
    value = st.slider(
        "",
        min_value=1,
        max_value=max_value,
        value=(max_value+1)//2,
        step=1,
        key=f"slider_{key}"
    )
    st.markdown('</div>', unsafe_allow_html=True)

st.markdown(
    f"""
    <div class="slider-labels">
        <span>{left_label}</span>
        <span>{right_label}</span>
    </div>
    <p style='text-align:center; color:#6a0dad; font-weight:bold;'>
        پاسخ شما: {value} ({'کاملاً مخالفم' if value==1 else 'کاملاً موافقم' if value==max_value else 'خنثی' if value==((max_value+1)//2) else 'موافقم' if value>((max_value+1)//2) else 'مخالفم'})
    </p>
    """,
    unsafe_allow_html=True
)
return value
```

# ========== توابع مدیریت داده‌ها ==========

def get\_credentials():
"""دریافت اعتبارنامه از Secrets"""
try:
service\_account\_json = os.environ.get('GCP\_SERVICE\_ACCOUNT')
if not service\_account\_json:
st.error("مقدار GCP\_SERVICE\_ACCOUNT در محیط یافت نشد")
return None

```
    service_account_info = json.loads(service_account_json)
    creds = Credentials.from_service_account_info(
        service_account_info,
        scopes=[
            "https://www.googleapis.com/auth/spreadsheets",
            "https://www.googleapis.com/auth/drive.file"
        ]
    )
    return creds
except Exception as e:
    st.error(f"خطا در دریافت اعتبارنامه: {str(e)}")
    return None
```

def save\_to\_sheet(data):
try:
creds = get\_credentials()
if not creds:
return False

```
    client = gspread.authorize(creds)
    spreadsheet = client.open_by_key(SHEET_ID)
    worksheet = spreadsheet.worksheet(SHEET_NAME)
    
    row_data = [
        data.get("start_time", ""),  # زمان شروع
        data.get("end_time", ""),  # زمان پایان
        data.get("completion_time", ""),  # مدت زمان تکمیل (ثانیه)
        data.get("scenario_type", ""),
        data.get("price", ""),
        data.get("age", ""),
        data.get("gender", ""),
        data.get("education", ""),
        data.get("ride_frequency", ""),
        data.get("related_education_job",""),
        data.get("city",""),
        data.get("user_contact", ""),
        data.get("price_accepted", ""),
        
        # سوالات توجه
        data.get("attention_check1", ""),
        data.get("attention_check2", ""),
        

        # سوالات distributive (7 گزینه‌ای)
        data.get("distributive_1", ""),
        data.get("distributive_2", ""),
        data.get("distributive_3", ""), 
        
        # سوالات procedural (7 گزینه‌ای)
        data.get("procedural_1", ""),
        data.get("procedural_2", ""),
        data.get("procedural_3", ""),
        
        # سوالات informational (5 گزینه‌ای)
        data.get("informational_1", ""),
        data.get("informational_2", ""),
        data.get("informational_3", ""),
        data.get("informational_4", ""),
        data.get("informational_5", ""),
        
        # سوالات manipulation
        data.get ("trust", ""),
        data.get("pricing_method", ""),
        data.get("price_increase", ""),
        data.get("explanation_received", ""),
        data.get("explanation_type", "")
    ]
    
    worksheet.append_row(row_data)
    return True
    
except Exception as e:
    st.error(f"خطا در ذخیره‌سازی: {str(e)}")
    return False 
```

# ========== بخش‌های فرم ==========

def welcome\_page():
"""صفحه خوشامدگویی"""
st.markdown(""" <div style="display: flex; flex-direction: column; align-items: center; background-color: #f0f2f6; border-radius: 10px; padding: 20px; gap: 15px;"> <div style="text-align: center;"> <img src="https://huggingface.co/spaces/maryamilka/surge-pricing/resolve/main/shariflogo.png" 
              alt="لوگو دانشگاه شریف" 
              style="width: 200px; height: auto; margin-bottom: 10px;"> </div> <div style="flex: 1;"> <h3>به پرسشنامه ما خوش آمدید 🌟</h3> <p>با سلام و احترام،</p> <p>از شما دعوت می‌شود در یک پژوهش دانشگاهی شرکت کنید که در قالب پایان‌نامه کارشناسی‌ارشد در دانشگاه صنعتی شریف انجام می‌شود. این تحقیق به بررسی ادراک مصرف‌کنندگان از انصاف در قیمت‌گذاریِ اپلیکیشن‌های تاکسی اینترنتی (مانند اسنپ و تپسی 🚖) می‌پردازد.</p> <p>شرکت در این مطالعه کاملاً داوطلبانه است؛ پاسخ دقیقی برای سوالات وجود ندارد و پاسخ‌های صادقانه شما فقط برای پیش‌برد اهداف علمی تحلیل خواهد شد.</p> <p>پر کردن این پرسشنامه کمتر از 5 دقیقه وقت شما را می‌گیرد و پاسخ‌های ارزشمند شما کمک شایانی به ارتقای دانش علمی خواهد کرد. پیشاپیش از مشارکت شما صمیمانه سپاسگزاریم 🙏</p> <p>برای آغاز پرسشنامه، لطفاً روی دکمه زیر کلیک کنید 👇🏻</p> </div> </div> </div>
""", unsafe\_allow\_html=True)

```
if st.button("شروع پرسشنامه", key="start_btn", type="primary"):
    st.session_state.current_page = "scenario_explanation"  
    st.session_state.start_time = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
    st.rerun()
```

def scenario\_explanation():
"""توضیح سناریو"""
col1, col2 = st.columns(\[2, 4])  # افزایش نسبت ستون اول
with col1:
st.markdown('<div style="padding-right: 25px;">', unsafe\_allow\_html=True)
try:
st.image("rahyar.png", width=80)
except:
st.image("[https://via.placeholder.com/80/6a0dad/FFFFFF?text=LOGO](https://via.placeholder.com/80/6a0dad/FFFFFF?text=LOGO)", width=80)
st.markdown('</div>', unsafe\_allow\_html=True)
with col2:
st.markdown(""" <h2 class="rahyar-title">رهیار 🚖</h2> <p class="rahyar-subtitle">همراه سفرهای درون‌شهری شما، راهی مطمئن، راهی روشن، رهیار</p>
""", unsafe\_allow\_html=True)

```
st.markdown("### سناریوی تحقیق")

st.markdown("""
<div style="background-color: #f8f9fa; padding: 15px; border-radius: 10px;">
    <p>فرض کنید در روزی از روزها شما مهمان یکی از اقوام‌تان در جنوب تهران هستید. قصد دارید برای خریدی به غرب تهران بروید...</p>
    <p> گوشی‌تان را از کیف درمی‌آورید. چشم‌تان به آیکون جدیدی می‌افتد؛ اپلیکیشنی به نام <strong>رهیار</strong> — نه اسنپ است و نه تپسی، اما خیلی شبیه آن‌هاست. رنگ بنفش جذابی دارد و شعارش توی ذهن‌تان می‌نشیند:  
    <br>«همراه سفرهای شما، راهی مطمئن، راهی روشن، رهیار»</p>
    <p>با کنجکاوی اپ را باز می‌کنید. ظاهر ساده و روانی دارد. فعلاً فقط گزینه‌ی «سفر معمولی» فعال است. خبری از امکانات اضافه مثل «سفر دو‌مسیـره»، «توقف در مسیر»، «اکوپلاس» یا «موتورسوار» نیست — اما خب، رهیار تازه‌کار است و قرار است توسعه پیدا کند!.</p>
    <p>مبدأ و مقصد را انتخاب می‌کنید و با قیمت مواجه می‌شوید.</p>
    <p>با کلیک روی «ادامه»، اطلاعات سفر را مشاهده کنید 👇🏻</p>
</div>
""", unsafe_allow_html=True)

if st.button("ادامه", key="continue_btn", type="primary"):
    st.session_state.current_page = "map_view"
    st.rerun()
```

def map\_view():
col1, col2 = st.columns(\[2, 4])  # افزایش نسبت ستون اول
with col1:
st.markdown('<div style="padding-right: 25px;">', unsafe\_allow\_html=True)
try:
st.image("rahyar.png", width=80)
except:
st.image("[https://via.placeholder.com/80/6a0dad/FFFFFF?text=LOGO](https://via.placeholder.com/80/6a0dad/FFFFFF?text=LOGO)", width=80)
st.markdown('</div>', unsafe\_allow\_html=True)
with col2:
st.markdown(""" <h2 class="rahyar-title">رهیار 🚖</h2> <p class="rahyar-subtitle">همراه سفرهای درون‌شهری شما، راهی مطمئن، راهی روشن، رهیار</p>
""", unsafe\_allow\_html=True)

```
st.markdown("""
<div style="background-color: #f8f9fa; padding: 15px; border-radius: 10px;">
    <p>مسیر سفر شما به صورت حدودی، از جنوب به غرب تهران است.</p>
    <p> با توجه به اطلاعاتی که بعد از نقشه دریافت می‌کنید، تصمیم بگیرید که سفر را می‌پذیرید را رد می‌کنید.</p>
    <p>سپس با کلیک بر دکمه مربوطه به بخش بعدی بروید.</p>
</div>
""", unsafe_allow_html=True)
st.markdown("### مسیر سفر شما")
folium_static(create_ride_map(), width=1000 if st.session_state.is_desktop else 800, 
             height=500 if st.session_state.is_desktop else 400)

# قیمت
st.markdown(f"""
<div class="price-container">
    <div style="display: flex; justify-content: space-between; align-items: center;">
        <span>رهیار <span style="background-color: #e6e6fa; color: #6a0dad; padding: 2px 8px; border-radius: 12px; font-size: 14px;">معمولی</span></span>
        <span class="rahyar-price">{st.session_state.price:,} تومان</span>
    </div>
</div>
""", unsafe_allow_html=True)

show_explanation(st.session_state.scenario_type)

# دکمه‌ها
col1, col2 = st.columns(2)
with col1:
    if st.button("درخواست سفر", key="accept_btn", use_container_width=True):
        st.session_state.price_accepted = 1
        st.session_state.current_page = "attention_check1"
        st.rerun()

with col2:
    if st.button("رد سفر", key="reject_btn", use_container_width=True):
        st.session_state.price_accepted = 0
        st.session_state.current_page = "attention_check1"
        st.rerun()
```

def attention\_check1():
"""سوال توجه اول با دکمه سبز کاملاً عملی"""
\# 1. تزریق استایل‌های سفارشی
st.markdown(""" <style>
/\* مخفی کردن دکمه پیشفرض Streamlit \*/
div\[data-testid="stButton"] > button\[kind="primary"] {
display: none !important;
} </style>
""", unsafe\_allow\_html=True)

```
st.markdown("### سوال")

answer = st.radio(
    "رنگ لوگو و تم رنگی اپلیکیشن رهیار چگونه بود؟",
    ["قرمز", "سبز", "بنفش", "آبی", "فراموش کردم"],
    index=None,
    key="att1_radio"
)

 # کامپوننت HTML با دکمه سبز اصلی
st.components.v1.html(f"""
<script>
function handleClick() {{
    // فعال کردن دکمه مخفی Streamlit
    parent.document.querySelector('div[data-testid="stButton"] > button[kind="primary"]').click();
}}
</script>

<button onclick="handleClick()" 
        style="
            background-color: #28a745 !important;
            color: white !important;
            border: none !important;
            border-radius: 8px !important;
            padding: 10px 20px !important;
            font-weight: bold !important;
            font-family: 'Vazir', sans-serif !important;
            cursor: pointer !important;
            margin-left: auto;  /* این خط برای راست‌چین کردن مهم است */
            transition: all 0.3s ease !important;
            float: right;
            margin-left: 15px;
        "
        onmouseover="this.style.backgroundColor='#218838'; this.style.boxShadow='0 4px 8px rgba(0,0,0,0.15)';"
        onmouseout="this.style.backgroundColor='#28a745'; this.style.boxShadow='0 2px 5px rgba(0,0,0,0.1)';">
    ادامه
</button>
""", height=70)


# 3. منطق اصلی دکمه (مخفی)
if st.button("ادامه", key="att1_real_btn", type="primary"):
    if answer:
        st.session_state.attention_check1 = answer
        st.session_state.current_page = "random_likert_questions"
        st.rerun()
    else:
        st.warning("لطفاً یک گزینه را انتخاب کنید")
```

def random\_likert\_questions():
"""نمایش سوالات لیکرت با دکمه‌های دایره‌ای"""
question\_groups = \[
{
"title": "عدالت توزیعی",
"key": "distributive",
"questions": \[
{
"key": "distributive\_1",
"question": "قیمتی که به شما ارائه شد، چگونه بود؟",
"scale": 7,
"labels": \["کاملاً نامنصفانه", "کاملاً منصفانه"]
},
{
"key": "distributive\_2",
"question": "قیمتی که به شما ارائه شد، چگونه بود؟",
"scale": 7,
"labels": \["کاملاً غیرمعقول", "کاملاً معقول"]
},
{
"key": "distributive\_3",
"question": "قیمتی که به شما ارائه شد، چگونه بود؟",
"scale": 7,
"labels": \["کاملاً غیرقابل قبول", "کاملاً قابل قبول"]
}
]
},
{
"title": "سوال توجه",
"key": "attention\_check",
"questions": \[
{"key": "attention\_check2", "question": "تا چه مقدار با دقت به سوالات پاسخ می‌دهید؟", "scale": 7, "labels": \["خیلی کم", "خیلی زیاد"]}
]
},
{
"title": "عدالت رویه‌ای",
"key": "procedural",
"questions": \[
{"key": "procedural\_1", "question": "فرآیند و رویه قیمت‌گذاری پلتفرم قابل قبول است", "scale": 7, "labels": \["کاملاً مخالفم", "کاملاً موافقم"]},
{"key": "procedural\_2", "question": "فرآیند و رویه قیمت‌گذاری پلتفرم منصفانه است", "scale": 7, "labels": \["کاملاً مخالفم", "کاملاً موافقم"]},
{"key": "procedural\_3", "question": "فرآیند و رویه قیمت‌گذاری پلتفرم معقول است", "scale": 7, "labels": \["کاملاً مخالفم", "کاملاً موافقم"]}
]
},
{
"title": "عدالت اطلاعاتی",
"key": "informational",
"questions": \[
{"key": "informational\_1", "question": "تا چه حد رهیار دلایل تعیین قیمت را به صورت صادقانه توضیح داد؟", "scale": 7, "labels": \["هیچ", "خیلی زیاد"]},
{"key": "informational\_2", "question": "تا چه حد رهیار عوامل مؤثر بر تعیین قیمت را به طور کامل شرح داد؟", "scale": 7, "labels": \["هیچ", "خیلی زیاد"]},
{"key": "informational\_3", "question": "تا چه حد دلایل ارائه‌شده توسط رهیار برای تعیین قیمت منطقی و قابل قبول بود؟", "scale": 7, "labels": \["هیچ", "خیلی زیاد"]},
{"key": "informational\_4", "question": "تا چه حد توضیحات درباره تعیین قیمت بلافاصله و در زمان مناسب نمایش داده شد؟", "scale": 7, "labels": \["هیچ", "خیلی زیاد"]},
{"key": "informational\_5", "question": "تا چه حد توضیحات رهیار درباره تعیین قیمت، متناسب با شرایط سفر شما بود؟", "scale": 7, "labels": \["هیچ", "خیلی زیاد"]}
]
}
]

```
# مقداردهی اولیه
if 'current_likert_group' not in st.session_state:
    st.session_state.current_likert_group = 0

current_group = question_groups[st.session_state.current_likert_group]

st.markdown(f"### {current_group['title']}")

# نمایش تمام سوالات این گروه
for question in current_group['questions']:
    answer = enhanced_likert_scale(question)
    st.session_state.answers[question["key"]] = answer

# دکمه ادامه/اتمام
button_label = "ادامه به گروه بعدی" if st.session_state.current_likert_group < len(question_groups)-1 else "اتمام پرسشنامه"

if st.button(button_label):
    # بررسی آیا همه سوالات این گروه پاسخ داده شده‌اند
    all_answered = all(
        question["key"] in st.session_state.answers and 
        st.session_state.answers[question["key"]] is not None
        for question in current_group['questions']
    )
    
    if not all_answered:
        st.error("لطفاً به تمام سوالات این بخش پاسخ دهید قبل از ادامه")
    else:
        if st.session_state.current_likert_group < len(question_groups) - 1:
            st.session_state.current_likert_group += 1
            st.rerun()
        else:
            st.session_state.current_page = "explanation_questions"
            st.rerun()
```

def explanation\_questions():
"""نمایش سوالات تکمیلی به صورت مرحله‌ای با دکمه ادامه"""
st.markdown("### 📋 سوالات تکمیلی")

```
# لیست سوالات به ترتیب نمایش
questions = [
    {
        "key": "trust",
        "label": "آیا شما به تصمیم‌گیری‌هایی که توسط هوش مصنوعی انجام می‌شود اعتماد دارید؟",
        "options": ["بله", "خیر", "نظری ندارم"],
        "required": True
    },
    {
        "key": "pricing_method",
        "label": "به نظر شما پلتفرم قیمت را چگونه تعیین می‌کند؟",
        "options": [
            "به صورت دستی توسط تیم پلتفرم",
            "به صورت خودکار توسط هوش مصنوعی و الگوریتم‌ها",
            "ترکیبی از هر دو روش",
            "نظری ندارم"
        ],
        "required": True
    },
    {
        "key": "price_increase",
        "label": "آیا به نظر شما در این سفر افزایش قیمت نسبت به حالت طبیعی وجود داشته است؟",
        "options": ["بله", "خیر", "مطمئن نیستم"],
        "required": True
    },
    {
        "key": "explanation_received",
        "label": "آیا برای قیمت پیشنهادی این سفر، توضیحی به شما ارائه شد؟",
        "options": ["بله", "خیر"],
        "required": True
    },
    {
        "key": "explanation_type",
        "label": "اگر توضیحی دریافت کردید، این توضیح بیشتر به کدام مورد شباهت داشت؟",
        "options": [
            "بر اساس عواملی که در قیمت‌گذاری لحاظ شده‌اند",
            "شامل سناریوهای جایگزین که می‌توانستند قیمت متفاوتی ایجاد کنند",
            "توضیحی دریافت نکردم"
        ],
        "required": False,
        "condition": lambda: st.session_state.get("explanation_received") == "بله"
    }
]

# مقداردهی اولیه step اگر وجود ندارد
if "explanation_step" not in st.session_state:
    st.session_state.explanation_step = 0

# اگر همه سوالات پاسخ داده شده‌اند، به صفحه بعدی برو
if st.session_state.explanation_step >= len(questions):
    st.session_state.current_page = "demographic"
    st.rerun()
    return

# دریافت سوال جاری
current_q = questions[st.session_state.explanation_step]

# بررسی شرط نمایش برای سوالات اختیاری
if "condition" in current_q and not current_q["condition"]():
    st.session_state[current_q["key"]] = "N/A"
    st.session_state.explanation_step += 1
    st.rerun()
    return

# نمایش سوال جاری
answer = st.radio(
    current_q["label"],
    current_q["options"],
    index=None,
    key=f"explanation_q_{current_q['key']}"
)

# دکمه ادامه
if st.button("ادامه", key=f"continue_{current_q['key']}"):
    if answer is None and current_q["required"]:
        st.warning("لطفاً یک گزینه را انتخاب کنید")
    else:
        # ذخیره پاسخ
        st.session_state[current_q["key"]] = answer if answer is not None else "N/A"
        
        # افزایش شماره مرحله
        st.session_state.explanation_step += 1
        
        # رفرش صفحه برای نمایش سوال بعدی
        st.rerun()
    
```

def demographic\_form():
"""فرم اطلاعات دموگرافیک"""
st.markdown("### 📝 اطلاعات دموگرافیک")
st.markdown(""" <div> <p>لطفاً اطلاعات زیر را صادقانه و به دقت وارد نمایید.</p> <p>همانطور که گفته شد،این اطلاعات کاملاً محرمانه نزد محقق خواهد ماند و در جهت اهداف پژوهشی استفاده خواهد شد.</p> </div>
""", unsafe\_allow\_html=True)

```
with st.form("demographic_form"):
    age = st.number_input("سن", min_value=18, max_value=100, value=None, placeholder="سن خود را وارد کنید")
    gender = st.selectbox("جنسیت", ["", "مرد", "زن", "سایر"], index=0)
    education = st.selectbox("تحصیلات", ["", "دیپلم", "لیسانس", "فوق لیسانس", "دکترا"], index=0)
    city = st.selectbox("لطفاً استان محل سکونت خود را انتخاب بفرمایید.", 
                      ["", "آذربایجان شرقی", "آذربایجان غربی", "اردبیل", "اصفهان", "البرز", "ایلام",
                       "بوشهر", "تهران", "چهارمحال و بختیاری", "خراسان جنوبی", "خراسان رضوی", "خراسان شمالی",
                       "خوزستان", "زنجان", "سمنان", "سیستان و بلوچستان", "فارس", "قزوین", "قم", "کردستان",
                       "کرمان", "کرمانشاه", "کهگیلویه و بویراحمد", "گلستان", "گیلان", "لرستان", "مازندران",
                       "مرکزی", "هرمزگان", "همدان", "یزد"], index=0)
    related_education_job = st.selectbox("رشته تحصیلی/شغل شما در کدام‌یک از دسته‌های زیر قرار دارد؟", 
                                      ["", "مهندسی", "درمانی", "فرهنگی", "مدیریتی (مالی)", 
                                       "مدیریتی (بازاریابی)", "مدیریتی (سایر)", "روانشناسی", 
                                       "اقتصادی", "حقوقی", "هنری", "ورزشی", "زبان", "غیره"], index=0)
    ride_frequency = st.selectbox("دفعات استفاده از سرویس‌های اشتراک سفر در ماه", 
                                ["", "هیچوقت", "کمتر از 5 بار", "5-10 بار", "بیش از 10 بار"], index=0)
    
    submitted = st.form_submit_button("ادامه")
    if submitted:
        if not all([age, gender, education, city, related_education_job, ride_frequency]):
            st.error("لطفاً تمام فیلدها را پر کنید")
        else:
            st.session_state.demographic_data = {
                "age": age,
                "gender": gender,
                "education": education,
                "city": city,
                "ride_frequency": ride_frequency,
                "related_education_job": related_education_job
            }
            st.session_state.current_page = "contact"
            st.rerun()
```

def user\_contact():
"""راه ارتباطی ساده"""
st.markdown(""" <div style="text-align: center; margin-bottom: 30px;"> <h3>📩 راه ارتباطی شما (اختیاری)</h3> <p>در صورت تمایل به شرکت در قرعه‌کشی می‌توانید آیدی تلگرام، شماره تماس یا ایمیل خود را وارد کنید:</p> </div>
""", unsafe\_allow\_html=True)

```
contact_info = st.text_input(
    "راه ارتباطی (اختیاری)",
    placeholder="مثال: @username یا 09123456789 یا example@email.com",
    key="user_contact_input"
)

if st.button("ثبت پاسخ‌ها", type="primary", key="submit_explanation"):
    st.session_state.user_contact = contact_info
    end_time = datetime.now().strftime("%Y-%m-%d %H:%M:%S")
    start_time = datetime.strptime(st.session_state.start_time, "%Y-%m-%d %H:%M:%S")
    completion_time = (datetime.now() - start_time).total_seconds()
        
    save_data = {
        "start_time": st.session_state.start_time,
        "end_time": end_time,
        "completion_time": completion_time,
        "scenario_type": st.session_state.scenario_type,
        "price": st.session_state.price,
        "user_contact": st.session_state.get("user_contact", ""),
        "price_accepted": st.session_state.get("price_accepted", 0),
        "attention_check1": st.session_state.get("attention_check1", None),
        "trust": st.session_state.trust,
        "pricing_method": st.session_state.pricing_method,
        "price_increase": st.session_state.price_increase,
        "explanation_received": st.session_state.explanation_received,
        "explanation_type": st.session_state.get("explanation_type", "N/A"),
        **st.session_state.demographic_data,
        **st.session_state.answers  # اضافه کردن تمام پاسخ‌های لیکرت
    }
        
    if save_to_sheet(save_data):
        st.session_state.current_page = "thank_you"
        st.rerun()
    else:
        st.error("خطا در ذخیره‌سازی داده‌ها. لطفاً دوباره تلاش کنید.")

            
```

def thank\_you\_page():
"""صفحه تشکر"""
st.success("""
✅ پاسخ‌های شما با موفقیت ثبت شد.
سپاسگزاریم که وقت ارزشمند خود را به این پژوهش اختصاص دادید.

```
در صورت وجود هرگونه سوال، ابهام یا پیشنهاد می‌توانید با محقق تماس بگیرید:

✉ ایمیل: maryam.ilka2000@gmail.com
""")
st.balloons()
```

# ========== مدیریت وضعیت و صفحه‌بندی ==========

def main():
\# تشخیص دستگاه
user\_agent = st.query\_params.get("user\_agent", \[""])\[0]
st.session\_state.is\_desktop = "mobile" not in user\_agent.lower()

```
if st.session_state.is_desktop:
    # اطمینان از نمایش همان حالت موبایل برای همه دستگاه‌ها
    st.session_state.is_desktop = False

if 'answers' not in st.session_state:
    st.session_state.answers = {}

if 'current_page' not in st.session_state:
    st.session_state.current_page = "welcome"
    st.session_state.scenario_type = random.choice(["control", "input", "counterfactual"])
    st.session_state.price = 200000
    st.session_state.user_contact = None
    st.session_state.demographic_data = None
    st.session_state.price_accepted = 0
    st.session_state.attention_check1 = None
    
pages = {
    "welcome": welcome_page,
    "scenario_explanation": scenario_explanation,
    "map_view": map_view,
    "attention_check1": attention_check1,
    "random_likert_questions": random_likert_questions,
    "explanation_questions": explanation_questions,
    "demographic": demographic_form,  # دموگرافیک قبل از کانتکت
    "contact": user_contact,         # کانتکت در انتها
    "thank_you": thank_you_page
}

pages[st.session_state.current_page]()
```

if **name** == "**main**":
main()