/* ══════════════════════════════════════════════════════════════
   📱 رفتارهای اپ‌مانند — حذف حس «مرورگر وب» روی موبایل
   ══════════════════════════════════════════════════════════════
   این فایل، رفتارهای پیش‌فرض مرورگرهای موبایل که حس «داری یه سایت رو
   می‌بینی» رو منتقل می‌کنن (نه یه اپلیکیشن نصب‌شده) غیرفعال می‌کنه.
   فقط روی موبایل اعمال می‌شه، دسکتاپ کاملاً دست‌نخورده می‌مونه. */

@media (max-width: 768px) {
    html, body {
        /* 🔒 حذف افکت «کشیدن و برگشتن» (overscroll bounce) — این افکت
           دقیقاً همون چیزیه که فوراً به کاربر می‌گه «داری یه صفحه‌ی وب رو
           می‌بینی، نه یه اپ». اپ‌های واقعی معمولاً این رفتار رو ندارن. */
        overscroll-behavior-y: none;
    }

    /* 🔒 حذف فلاش خاکستری/آبی پیش‌فرض هنگام لمس دکمه‌ها و لینک‌ها —
       یکی از واضح‌ترین نشونه‌های «این یه سایته» که در اپ‌های واقعی
       اصلاً وجود نداره */
    * {
        -webkit-tap-highlight-color: transparent;
    }

    /* 🔒 جلوگیری از انتخاب ناخواسته‌ی متن روی عناصر رابط کاربری (دکمه‌ها،
       ناوبری، آیکون‌ها) — در اپ‌های واقعی نمی‌شه متن دکمه‌ها رو انتخاب کرد،
       فقط محتوای واقعی (مثل نظرات، توضیحات) قابل انتخابه */
    button, .btn-luxury, .bm-bn-item, .nav-links a, .place-card-bookmark,
    .hero-badge, .filter-chip, .cafe-modal-like-btn, nav, .navbar {
        -webkit-user-select: none;
        user-select: none;
    }

    /* 🔒 اسکرول نرم‌تر و طبیعی‌تر، شبیه اسکرول native اپ‌ها */
    html {
        scroll-behavior: smooth;
    }
    body {
        -webkit-overflow-scrolling: touch;
    }

    /* 🔒 جلوگیری از zoom ناخواسته با دابل‌تپ روی دکمه‌ها (که در وب معمولیه
       ولی در اپ‌های واقعی هیچ‌وقت اتفاق نمی‌افته) */
    button, a, .place-card-new, .bm-bn-item {
        touch-action: manipulation;
    }

    /* 🎬 fade-in ملایم هنگام لود هر صفحه
       🔒 اصلاح حیاتی: نسخه‌ی قبلی این انیمیشن شامل transform هم می‌شد —
       که باعث می‌شد body یه containing block جدید برای تمام فرزندان
       position:fixed (از جمله خودِ نوار ناوبری پایینی!) بشه، و در نتیجه
       نوار ناوبری به‌جای ثابت‌ماندن روی صفحه‌ی گوشی، با اسکرول جابه‌جا
       می‌شد. الان فقط از opacity استفاده می‌شه که این مشکل رو نداره. */
    body {
        animation: bmPageFadeIn .35s ease both;
    }
    @keyframes bmPageFadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }
}

/* ══════════════════════════════════════════════════
   🎬 انیمیشن نرم بین صفحات
   ══════════════════════════════════════════════════
   🔒 یافته‌ی مهم در بررسی نهایی: این ویژگی از قبل، با روش دقیق‌تری
   (محدود فقط به موبایل، از طریق چک window.innerWidth) در فایل جداگانه‌ی
   app-shell.js پیاده‌سازی شده بود. نسخه‌ی تکراری قبلی اینجا (که بدون
   محدودیت @media بود و روی دسکتاپ هم فعال می‌شد) حذف شد تا با اصل اصلی
   پروژه («فقط موبایل، دسکتاپ دست‌نخورده») کاملاً هماهنگ بمونه. */