/* ایران‌گرد — سه صفحهٔ تازهٔ منو: «خدماتِ گردشگری»، «بلیط و اقامت»، «کیف‌پول و ارز».
   هر سه با همان `WGP.PageShell` (هدر/فوتر/تم/سه‌زبانه) رندر می‌شوند.

   ── چرا لینکِ عمیق و نه فراخوانِ API ──
   بررسیِ ۱۶ مرداد: **هیچ‌کدام از ارائه‌دهندگانِ ایرانی API افیلیتِ عمومی ندارند.**
   علی‌بابا فقط «پنلِ آژانسی» و «فروشِ سازمانی» دارد، سفرمارکت و جاباما هیچ‌چیز.
   پس تا امضایِ قرارداد، لینکِ عمیق تنها چیزی است که **امروز کار می‌کند**: کاربر
   مبدأ/مقصد/تاریخ را همین‌جا می‌زند و مستقیم به صفحهٔ نتیجهٔ همان مسیر می‌رود.

   ساختار طوری است که وقتی کدِ رهگیری آمد، فقط `travelDesk.affiliate*` در تنظیماتِ
   سایت پر شود و همهٔ لینک‌ها درآمدزا شوند — بدونِ یک خط کد، دقیقاً مثلِ باسلام.
   `window.WGP_TRAVEL` را اندپوینتِ عمومیِ ماژول پر می‌کند؛ اگر نبود، فهرستِ
   پیش‌فرضِ زیر استفاده می‌شود تا صفحه هیچ‌وقت خالی نباشد. */
(function () {
  const DS = window.WegopaarsDesignSystem_3b7565;
  const { Card, Badge, Button, SectionHeading } = DS;
  const WGP = (window.WGP = window.WGP || {});
  const { fmt, ico } = WGP;

  const tx = (o, lang) => (o && typeof o === 'object' ? (o[lang] || o.fa || o.en || '') : (o || ''));
  const L = (fa, en, ar) => ({ fa, en, ar });
  const t = (o, lang) => tx(o, lang);

  /** آدرسِ نهایی با کدِ رهگیری، اگر ادمین تنظیمش کرده باشد. */
  function track(url) {
    const cfg = (window.WGP_TRAVEL || {}).affiliate || {};
    if (!url || !cfg.mode || cfg.mode === 'none') return url;
    try {
      const u = new URL(url);
      if (u.protocol !== 'http:' && u.protocol !== 'https:') return url;
      if (cfg.mode === 'param' && cfg.param && cfg.value) { u.searchParams.set(cfg.param, cfg.value); return u.toString(); }
      if (cfg.mode === 'b64' && cfg.baseUrl) {
        const b = btoa(unescape(encodeURIComponent(u.toString())));
        return cfg.baseUrl + (cfg.baseUrl.includes('?') ? '&' : '?') + 'b64=' + b;
      }
    } catch (e) { /* آدرسِ نامعتبر → همان خام */ }
    return url;
  }

  // ─────────────── ارائه‌دهنده‌های پیش‌فرض ───────────────
  // مسیرها با بررسیِ زندهٔ سایت‌ها استخراج شده‌اند (۱۶ مرداد)، نه حدس.
  const PROVIDERS = {
    flight: [
      { name: 'علی‌بابا', url: 'https://www.alibaba.ir/flights/{from}-{to}' },
      { name: 'سفرمارکت', url: 'https://safarmarket.com/flights' },
      { name: 'فلایتیو', url: 'https://www.flytoday.ir/flight' },
    ],
    train: [
      { name: 'علی‌بابا', url: 'https://www.alibaba.ir/train-ticket/{from}-{to}' },
      { name: 'سفرمارکت', url: 'https://safarmarket.com/trains' },
      { name: 'رجا', url: 'https://raja.ir' },
    ],
    bus: [
      { name: 'علی‌بابا', url: 'https://www.alibaba.ir/bus-ticket/{from}-{to}' },
      { name: 'سفرمارکت', url: 'https://safarmarket.com/buses' },
    ],
    stay: [
      { name: 'جاباما', url: 'https://www.jabama.com/city-{city}' },
      { name: 'علی‌بابا', url: 'https://www.alibaba.ir/hotel/{city}' },
      { name: 'سفرمارکت', url: 'https://safarmarket.com/hotels' },
    ],
  };

  // نامِ لاتینِ شهرهایِ پرتردد برای ساختِ لینکِ عمیق. عمداً کوتاه است: شهری که اینجا
  // نباشد به صفحهٔ جستجویِ عمومیِ همان سرویس می‌رود، نه لینکِ شکسته.
  const SLUG = {
    'تهران': 'tehran', 'مشهد': 'mashhad', 'اصفهان': 'isfahan', 'شیراز': 'shiraz',
    'تبریز': 'tabriz', 'کیش': 'kish', 'یزد': 'yazd', 'کرمان': 'kerman', 'اهواز': 'ahvaz',
    'رشت': 'rasht', 'بندرعباس': 'bandar-abbas', 'قشم': 'qeshm', 'ساری': 'sari',
    'کرمانشاه': 'kermanshah', 'ارومیه': 'urmia', 'همدان': 'hamadan', 'قم': 'qom',
    'اردبیل': 'ardabil', 'زاهدان': 'zahedan', 'بوشهر': 'bushehr', 'گرگان': 'gorgan',
  };
  const CITIES = Object.keys(SLUG);

  /** جای‌گذاریِ مبدأ/مقصد در الگو؛ اگر شهر شناخته نشد، الگو را بی‌پارامتر برمی‌گرداند. */
  function deepLink(tpl, from, to) {
    const f = SLUG[from], p = SLUG[to];
    if (!tpl.includes('{')) return tpl;
    if (tpl.includes('{city}')) return p || f ? tpl.replace('{city}', p || f) : tpl.split('/{')[0];
    if (!f || !p) return tpl.split('/{')[0]; // صفحهٔ جستجویِ عمومیِ همان سرویس
    return tpl.replace('{from}', f).replace('{to}', p);
  }


  /** کلیکِ «پرسش از پشتیبانی» با پیامِ آماده. کاربرِ عرب کادرِ خالیِ چت را رها می‌کند. */
  function askSupport(topic, lang) {
    return function () {
      var msg = t(L('سلام، دربارهٔ «' + topic + '» راهنمایی می‌خواهم.',
                    'Hello, I would like information about "' + topic + '".',
                    'مرحباً، أرغب بمعلومات حول «' + topic + '».'), lang);
      try {
        if (window.WCSupport && window.WCSupport.open) {
          window.WCSupport.open();
          setTimeout(function () {
            var ta = document.querySelector('#wc-support textarea, .wc-support textarea, textarea[name="message"]');
            if (ta) { ta.value = msg; ta.dispatchEvent(new Event('input', { bubbles: true })); ta.focus(); }
          }, 350);
          return;
        }
      } catch (e) {}
      window.location.href = '/custom/wegopars/contact.html';
    };
  }

  // ═══════════════ صفحهٔ ۱: خدمات ═══════════════
  /* بازطراحیِ ۱۷ مرداد. مالک فهرستِ صریح داد: بیمهٔ مسافرتی در ایران · سیم‌کارتِ
     ایرانی (پیش‌فرض ایرانسل) · خدماتِ بانکی و کارت · شارژِ کارت از کیف‌پول ·
     شارژِ کیف‌پول با ریال/دلار/پوند/یورو و رمزارز · ویزا.

     ── محکِ مالک، عیناً ──
     «خدماتی که طولانی پول نمی‌آید ازش یا خیلی زمان‌بر است، کاربرد نیست؛ باشد برای
     فازهای بعدی. الان نیاز نیست متمرکز بشیم، فقط اشاره باشد خوب است.»

     پس هر کارت یک `soon` دارد: خدماتی که امروز واقعاً قابلِ ارائه‌اند دکمهٔ فعال
     می‌گیرند، و بقیه برچسبِ «به‌زودی» با همان معرفیِ کوتاه — **اشاره، نه وعده**.
     ⚠️ هیچ‌کدام دکمهٔ بی‌مقصد ندارند (تلهٔ «دکمهٔ مرده»): هرچه لینکِ واقعی ندارد،
     به پشتیبانی وصل می‌شود. */
  const SERVICES = [
    {
      key: 'insurance', soon: false,
      icon: ['M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z', 'M9 12l2 2 4-4'],
      title: L('بیمهٔ مسافرتی', 'Travel insurance', 'تأمين السفر'),
      body: L(
        'پوششِ درمان و حادثه برای مسافرانِ ورودی به ایران، و بیمهٔ سفرِ خارجی برای ایرانیان. برای ویزای شنگن پوششِ حداقل ۳۰٬۰۰۰ یورو الزامی است.',
        'Medical and accident cover for visitors to Iran, and outbound travel insurance for Iranians. Schengen visas require at least €30,000 of medical cover.',
        'تغطية طبية وحوادث للزوار القادمين إلى إيران، وتأمين سفر للخارج للإيرانيين. تأشيرة شنغن تتطلب تغطية ٣٠٠٠٠ يورو على الأقل.'),
      points: [
        L('پوششِ درمانِ اضطراری در طولِ سفر', 'Emergency medical cover during the trip', 'تغطية طبية طارئة أثناء الرحلة'),
        L('مناسبِ همراهِ گردشگریِ سلامت', 'Suitable alongside health tourism', 'مناسب مع السياحة العلاجية'),
        L('صدورِ سریع', 'Fast issuance', 'إصدار سريع'),
      ],
      cta: L('استعلام و صدور', 'Get a quote', 'احصل على عرض'),
    },
    {
      key: 'sim', soon: false,
      icon: ['M7 2h7l5 5v15a1 1 0 0 1-1 1H7a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1z', 'M9 12h6v6H9z'],
      title: L('سیم‌کارتِ ایرانی', 'Iranian SIM card', 'شريحة اتصال إيرانية'),
      body: L(
        'سیم‌کارتِ اعتباری با بستهٔ اینترنت برای مسافرانِ خارجی — پیش‌فرضِ ما ایرانسل است و اپراتورهای دیگر (همراه اول، رایتل) هم در دسترس‌اند.',
        'Prepaid SIM with a data bundle for foreign visitors — Irancell by default, with MCI and Rightel also available.',
        'شريحة مسبقة الدفع مع باقة إنترنت للزوار الأجانب — إيرانسل افتراضياً، وهناك أيضاً همراه اول ورايتل.'),
      points: [
        L('پیش‌فرض: ایرانسل', 'Default: Irancell', 'الافتراضي: إيرانسل'),
        L('ثبتِ نام با پاسپورت — همان روز', 'Passport registration, same day', 'التسجيل بجواز السفر في نفس اليوم'),
        L('تحویل در فرودگاه یا محلِ اقامت', 'Delivery at the airport or your stay', 'التسليم في المطار أو مكان الإقامة'),
      ],
      cta: L('درخواستِ سیم‌کارت', 'Request a SIM', 'اطلب شريحة'),
    },
    {
      key: 'bank', soon: true,
      icon: ['M3 21h18', 'M5 21V10l7-5 7 5v11', 'M9 21v-6h6v6'],
      title: L('کارتِ بانکیِ سفر', 'Travel bank card', 'بطاقة بنكية للسفر'),
      body: L(
        'کارتِ ریالیِ قابلِ شارژ برای مسافرِ خارجی — چون کارت‌های بین‌المللی در ایران کار نمی‌کنند. شارژ از کیف‌پولِ ایران‌گرد انجام می‌شود.',
        'A rechargeable rial card for foreign visitors — international cards do not work inside Iran. Top-ups come from your WeGoPars wallet.',
        'بطاقة بالريال قابلة للشحن للزائر الأجنبي — لأن البطاقات الدولية لا تعمل داخل إيران. الشحن يتم من محفظة إيران‌غرد.'),
      points: [
        L('پرداخت در فروشگاه‌ها و تاکسی', 'Pay at shops and taxis', 'الدفع في المتاجر وسيارات الأجرة'),
        L('شارژِ مجدد از کیف‌پول', 'Recharge from your wallet', 'إعادة الشحن من المحفظة'),
        L('بازگرداندنِ مانده در پایانِ سفر', 'Refund of the balance when you leave', 'استرداد الرصيد عند المغادرة'),
      ],
      cta: L('اطلاعاتِ بیشتر', 'Learn more', 'مزيد من المعلومات'),
    },
    {
      key: 'visa', soon: true,
      icon: ['M4 4h16v16H4z', 'M4 9h16', 'M9 14h6'],
      title: L('ویزای ورود به ایران', 'Iran entry visa', 'تأشيرة دخول إيران'),
      body: L(
        'راهنمایی برای ویزای توریستی، درمانی و زیارتی؛ مدارکِ لازم و مسیرِ درخواست. جزئیاتِ کامل در صفحهٔ «دربارهٔ ما».',
        'Guidance for tourist, medical and pilgrimage visas — required documents and how to apply. Full detail on the About page.',
        'إرشادات لتأشيرة سياحية أو علاجية أو للزيارة الدينية — المستندات المطلوبة وطريقة التقديم. التفاصيل الكاملة في صفحة «من نحن».'),
      points: [
        L('ویزای درمانی برای گردشگریِ سلامت', 'Medical visa for health tourism', 'تأشيرة علاجية للسياحة العلاجية'),
        L('بررسیِ اولیهٔ پرونده', 'Initial eligibility review', 'مراجعة أولية للملف'),
        L('هماهنگی با مرکزِ درمانیِ پذیرنده', 'Coordination with the admitting centre', 'التنسيق مع المركز الطبي المستقبِل'),
      ],
      cta: L('پرسش دربارهٔ ویزا', 'Ask about visas', 'استفسر عن التأشيرة'),
    },
  ];

  /* شارژِ کیف‌پول — بخشِ جدا چون **درآمدِ اصلیِ ایران‌گرد همین است**.
     مالک: «عملاً درآمدِ اصلی می‌شود تبدیلِ ارزی + امکانِ خریدِ خدماتِ گردشگری،
     بیمه، خریدِ صنایع‌دستی و…» پس این نباید یک کارتِ معمولی وسطِ بقیه باشد. */
  const TOPUP = [
    { c: '﷼', t: L('ریالِ ایران', 'Iranian rial', 'الريال الإيراني'), s: L('درگاهِ بانکیِ داخلی', 'Local bank gateway', 'بوابة بنكية محلية'), soon: false },
    { c: '$', t: L('دلار', 'US dollar', 'الدولار'), s: L('درگاهِ بین‌المللی', 'International gateway', 'بوابة دولية'), soon: true },
    { c: '€', t: L('یورو', 'Euro', 'اليورو'), s: L('درگاهِ بین‌المللی', 'International gateway', 'بوابة دولية'), soon: true },
    { c: '£', t: L('پوند', 'Pound', 'الجنيه'), s: L('درگاهِ بین‌المللی', 'International gateway', 'بوابة دولية'), soon: true },
    { c: '₮', t: L('رمزارز', 'Crypto', 'العملات الرقمية'), s: L('USDT و…', 'USDT and more', 'USDT وغيرها'), soon: true },
  ];

  WGP.ServicesPage = function ServicesPage() {
    return (
      <WGP.PageShell crumbI18n={L('خدماتِ گردشگری', 'Travel services', 'خدمات السفر')}>
        {({ lang, fa }) => {
          const cfg = (window.WGP_TRAVEL || {}).services || {};
          return (
            <>
              <SectionHeading align="start" tag={t(L('خدمات', 'Services', 'الخدمات'), lang)}
                title={t(L('هر چیزی که سفر به ایران لازم دارد', 'Everything a trip to Iran needs', 'كل ما تحتاجه رحلتك إلى إيران'), lang)}
                subtitle={t(L('بیمه، سیم‌کارت، کارتِ بانکی و کیف‌پولِ ارزی — کارهایی که مسافرِ خارجی به‌تنهایی سخت انجامشان می‌دهد.', 'Insurance, SIM card, bank card and a currency wallet — the things a foreign traveller struggles to arrange alone.', 'التأمين والشريحة والبطاقة البنكية والمحفظة بالعملات — أمور يصعب على المسافر الأجنبي ترتيبها وحده.'), lang)} />

              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(2,1fr)', gap: 20, marginTop: 28 }}>
                {SERVICES.map((s) => (
                  <Card key={s.key} pad="26px 24px" style={{ display: 'flex', flexDirection: 'column' }}>
                    <div style={{ width: 52, height: 52, borderRadius: 14, background: 'var(--grad-brand)', display: 'grid', placeItems: 'center', color: '#fff', marginBottom: 16 }}>
                      {ico(s.icon, 1.8, 26)}
                    </div>
                    <h3 style={{ fontSize: 19, fontWeight: 900, margin: '0 0 10px', display:'flex', alignItems:'center', gap:9, flexWrap:'wrap' }}>
                      {t(s.title, lang)}
                      {/* «اشاره، نه وعده» — محکِ مالک برایِ خدماتِ دیربازده */}
                      {s.soon && <Badge tone="saffron">{t(L('به‌زودی', 'Coming soon', 'قريباً'), lang)}</Badge>}
                    </h3>
                    <p style={{ color: 'var(--t2)', fontSize: 14, lineHeight: 2, margin: '0 0 16px' }}>{t(s.body, lang)}</p>
                    <ul style={{ margin: '0 0 20px', paddingInlineStart: 18, color: 'var(--t2)', fontSize: 13.5, lineHeight: 2.1 }}>
                      {s.points.map((p, i) => <li key={i}>{t(p, lang)}</li>)}
                    </ul>
                    {/* ⚠️ دکمهٔ بدونِ مقصد نمی‌گذاریم (تلهٔ «دکمهٔ مرده»). تا وقتی ادمین
                        لینکِ ارائه‌دهنده را در پنل نگذاشته، فرمِ تماس باز می‌شود. */}
                    {cfg[s.key]
                      ? <Button variant="brand" style={{ marginTop:'auto' }} href={track(cfg[s.key])} target="_blank" rel="noopener nofollow sponsored">{t(s.cta, lang)}</Button>
                      : <Button variant={s.soon ? 'surface' : 'brand'} style={{ marginTop:'auto' }} onClick={askSupport(t(s.title, lang), lang)}>{t(s.cta, lang)}</Button>}
                  </Card>
                ))}
              </div>

              {/* ── کیف‌پول و تبدیلِ ارزی ──
                  مالک: «عملاً درآمدِ اصلی می‌شود تبدیلِ ارزی + امکانِ خریدِ خدماتِ
                  گردشگری، بیمه، خریدِ صنایع‌دستی و…» پس این بخش عمداً برجسته است
                  و کارتِ معمولی وسطِ بقیه نیست. */}
              <section style={{ marginTop: 42 }}>
                <SectionHeading align="start" tagColor="var(--saffron)"
                  tag={t(L('کیف‌پول و ارز', 'Wallet & currency', 'المحفظة والعملات'), lang)}
                  title={t(L('یک‌بار شارژ کن، همه‌جا خرید کن', 'Top up once, pay everywhere', 'اشحن مرة واحدة وادفع في كل مكان'), lang)}
                  subtitle={t(L(
                    'کارت‌های بین‌المللی در ایران کار نمی‌کنند. کیف‌پولِ ایران‌گرد را با ارزِ خودت شارژ کن و با آن بیمه، تور، اقامت و صنایع‌دستی بخر.',
                    'International cards do not work in Iran. Top up your WeGoPars wallet in your own currency and use it for insurance, tours, stays and handicrafts.',
                    'البطاقات الدولية لا تعمل في إيران. اشحن محفظة إيران‌غرد بعملتك واستخدمها للتأمين والجولات والإقامة والحرف اليدوية.',
                  ), lang)} />
                <div className="wgp-grid4" style={{ display:'grid', gap:13, marginTop:22 }}>
                  {TOPUP.map((u, i) => (
                    <Card key={i} pad="18px 20px" style={{ textAlign:'center' }}>
                      <div style={{ fontSize:30, fontWeight:900, color:'var(--acc)', lineHeight:1.2 }}>{u.c}</div>
                      <div style={{ fontWeight:800, fontSize:14.5, marginTop:8 }}>{t(u.t, lang)}</div>
                      <div style={{ fontSize:12, color:'var(--t3)', marginTop:4 }}>{t(u.s, lang)}</div>
                      {u.soon && <div style={{ marginTop:9 }}><Badge tone="saffron">{t(L('به‌زودی', 'Coming soon', 'قريباً'), lang)}</Badge></div>}
                    </Card>
                  ))}
                </div>
                <div style={{ display:'flex', gap:10, marginTop:18, flexWrap:'wrap' }}>
                  <Button variant="brand" href="/custom/wegopars/wallet.html">{t(L('رفتن به کیف‌پول', 'Go to wallet', 'الذهاب إلى المحفظة'), lang)}</Button>
                  <Button variant="surface" onClick={askSupport(t(L('کیف‌پول و تبدیلِ ارزی', 'Wallet & currency exchange', 'المحفظة وصرف العملات'), lang), lang)}>
                    {t(L('پرسش از پشتیبانی', 'Ask support', 'اسأل الدعم'), lang)}
                  </Button>
                </div>
                <p style={{ marginTop:14, fontSize:12, color:'var(--t3)', lineHeight:2 }}>
                  {t(L(
                    'نرخِ تبدیل در لحظهٔ شارژ قفل می‌شود و روی رسید ثبت می‌ماند.',
                    'The exchange rate is locked at the moment of top-up and recorded on your receipt.',
                    'يُثبَّت سعر الصرف لحظة الشحن ويُسجَّل في الإيصال.',
                  ), lang)}
                </p>
              </section>

              <WGP.AdSlot lang={lang} slot="adSlotServices" />

              <p style={{ marginTop: 30, fontSize: 12.5, color: 'var(--t3)', lineHeight: 2 }}>
                {t(L(
                  'ایران‌گرد این خدمات را معرفی و هماهنگ می‌کند؛ صدورِ بیمه‌نامه و تصمیمِ ویزا بر عهدهٔ شرکتِ بیمه و سفارتِ مربوطه است.',
                  'WeGoPars introduces and coordinates these services; policy issuance and visa decisions rest with the insurer and the embassy.',
                  'إيران‌غرد تُعرّف وتنسّق هذه الخدمات؛ إصدار الوثيقة وقرار التأشيرة من مسؤولية شركة التأمين والسفارة.'), lang)}
              </p>
            </>
          );
        }}
      </WGP.PageShell>
    );
  };


  /** باکسِ جستجوی اقامت — شهر + تاریخِ ورود/خروج، با لینکِ عمیق به جاباما/علی‌بابا/سفرمارکت. */
  function StayBox({ lang }) {
    const [city, setCity] = React.useState('تهران');
    const [inD, setInD] = React.useState('');
    const [outD, setOutD] = React.useState('');
    const list = ((window.WGP_TRAVEL || {}).providers || {}).stay || PROVIDERS.stay;
    const sel = { padding:'11px 13px', borderRadius:'var(--r-sm)', border:'1px solid var(--line)', background:'var(--card)', color:'var(--t1)', fontFamily:'inherit', fontSize:14, width:'100%' };
    const lbl = { display:'block', fontSize:12.5, color:'var(--t2)', marginBottom:6, fontWeight:700 };
    return (
      <section style={{ marginTop: 34 }}>
        <SectionHeading align="start" tagColor="var(--firuze)"
          tag={t(L('اقامت', 'Accommodation', 'الإقامة'), lang)}
          title={t(L('هتل و اقامتگاه پیدا کن', 'Find a hotel or guesthouse', 'ابحث عن فندق أو مكان إقامة'), lang)}
          subtitle={t(L('شهر و تاریخ را بزن تا مستقیم به نتیجهٔ همان شهر در سرویس‌های معتبرِ رزرو بروی.', 'Enter the city and dates to jump straight to that city on trusted booking services.', 'أدخل المدينة والتواريخ للانتقال مباشرة إلى نتائج تلك المدينة في خدمات الحجز الموثوقة.'), lang)} />
        <Card pad="22px 24px" style={{ marginTop: 18 }}>
          <div style={{ display:'grid', gridTemplateColumns:'repeat(auto-fit,minmax(180px,1fr))', gap:14 }}>
            <div>
              <label style={lbl}>{t(L('شهر', 'City', 'المدينة'), lang)}</label>
              <select style={sel} value={city} onChange={(e) => setCity(e.target.value)}>
                {CITIES.map((c) => <option key={c} value={c}>{c}</option>)}
              </select>
            </div>
            <div>
              <label style={lbl}>{t(L('تاریخِ ورود', 'Check-in', 'تاريخ الوصول'), lang)}</label>
              <input type="date" style={sel} value={inD} onChange={(e) => setInD(e.target.value)} />
            </div>
            <div>
              <label style={lbl}>{t(L('تاریخِ خروج', 'Check-out', 'تاريخ المغادرة'), lang)}</label>
              <input type="date" style={sel} value={outD} onChange={(e) => setOutD(e.target.value)} />
            </div>
          </div>
          <div style={{ display:'flex', gap:10, marginTop:18, flexWrap:'wrap' }}>
            {list.map((p, i) => (
              <Button key={i} variant={i === 0 ? 'brand' : 'surface'} size="sm"
                href={track(deepLink(p.url, city, city))} target="_blank" rel="noopener nofollow sponsored">
                {t(L('جستجو در ', 'Search on ', 'ابحث في '), lang)}{p.name}
              </Button>
            ))}
          </div>
          <p style={{ fontSize:12, color:'var(--t3)', marginTop:14, lineHeight:1.9 }}>
            {t(L(
              'رزرو، پرداخت و استرداد کاملاً در بسترِ همان سرویس انجام می‌شود. ایران‌گرد فقط معرفی می‌کند.',
              'Booking, payment and refunds happen entirely on that service. WeGoPars only makes the introduction.',
              'الحجز والدفع والاسترداد تتم بالكامل على تلك الخدمة. إيران‌غرد يقوم بالتعريف فقط.'), lang)}
          </p>
        </Card>
      </section>
    );
  }

  // ═══════════════ صفحهٔ ۲: بلیط و اقامت ═══════════════
  const TABS = [
    { key: 'flight', title: L('هواپیما', 'Flight', 'طيران'), icon: ['M17.8 19.2 16 11l3.5-3.5a2.1 2.1 0 0 0-3-3L13 8 4.8 6.2a.5.5 0 0 0-.5.8l4.2 4.2-2 3.5-2.5-.5.9 2.4 2.4.9-.5-2.5 3.5-2 4.2 4.2a.5.5 0 0 0 .8-.5z'] },
    { key: 'train',  title: L('قطار', 'Train', 'قطار'),      icon: ['M4 15V6a4 4 0 0 1 4-4h8a4 4 0 0 1 4 4v9a4 4 0 0 1-4 4H8a4 4 0 0 1-4-4z', 'M4 11h16', 'M8 19l-2 3M16 19l2 3'] },
    { key: 'bus',    title: L('اتوبوس', 'Bus', 'حافلة'),      icon: ['M4 16V6a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v10', 'M4 11h16', 'M6 20v2M18 20v2', 'M4 16h16v4H4z'] },
    { key: 'stay',   title: L('اقامت', 'Stay', 'إقامة'),      icon: ['M3 21h18', 'M5 21V7l7-4 7 4v14', 'M10 21v-6h4v6'] },
  ];

  WGP.TicketsPage = function TicketsPage() {
    const [tab, setTab] = React.useState('flight');
    const [from, setFrom] = React.useState('تهران');
    const [to, setTo] = React.useState('مشهد');
    const [date, setDate] = React.useState('');

    return (
      <WGP.PageShell crumbI18n={L('بلیط و اقامت', 'Tickets & stays', 'التذاكر والإقامة')}>
        {({ lang, fa }) => {
          const isStay = tab === 'stay';
          const list = ((window.WGP_TRAVEL || {}).providers || {})[tab] || PROVIDERS[tab];
          const sel = { padding: '11px 13px', borderRadius: 'var(--r-sm)', border: '1px solid var(--line)', background: 'var(--card)', color: 'var(--t1)', fontFamily: 'inherit', fontSize: 14, width: '100%' };
          const lbl = { display: 'block', fontSize: 12.5, color: 'var(--t2)', marginBottom: 6, fontWeight: 700 };

          return (
            <>
              <SectionHeading align="start" tag={t(L('بلیط و اقامت', 'Tickets & stays', 'التذاكر والإقامة'), lang)}
                title={t(L('مسیرت را انتخاب کن', 'Pick your route', 'اختر مسارك'), lang)}
                subtitle={t(L('مبدأ و مقصد را بزن تا مستقیم به نتیجهٔ همان مسیر در سرویس‌های معتبر بروی. مقایسه و خرید آنجا انجام می‌شود.', 'Enter origin and destination to jump straight to that route on trusted services. Comparison and purchase happen there.', 'أدخل نقطة الانطلاق والوجهة للانتقال مباشرة إلى نتائج المسار في الخدمات الموثوقة.'), lang)} />

              <WGP.TicketsMap lang={lang} />
              <WGP.AdSlot lang={lang} slot="adSlotTickets" />

              {/* تب‌ها */}
              <div style={{ display: 'flex', gap: 8, marginTop: 24, flexWrap: 'wrap' }}>
                {TABS.map((x) => (
                  <button key={x.key} onClick={() => setTab(x.key)}
                    style={{
                      display: 'inline-flex', alignItems: 'center', gap: 8, padding: '10px 18px',
                      borderRadius: 'var(--pill)', fontFamily: 'inherit', fontSize: 13.5, fontWeight: 700, cursor: 'pointer',
                      border: '1px solid ' + (tab === x.key ? 'transparent' : 'var(--line)'),
                      background: tab === x.key ? 'var(--green)' : 'var(--surface)',
                      color: tab === x.key ? '#fff' : 'var(--t2)',
                    }}>
                    {ico(x.icon, 1.8, 16)}{t(x.title, lang)}
                  </button>
                ))}
              </div>

              {/* فرمِ مسیر */}
              <Card pad="22px 24px" style={{ marginTop: 20 }}>
                <div style={{ display: 'grid', gridTemplateColumns: isStay ? '1fr 1fr' : '1fr 1fr 1fr', gap: 14 }}>
                  {!isStay && (
                    <div>
                      <label style={lbl}>{t(L('مبدأ', 'From', 'من'), lang)}</label>
                      <select style={sel} value={from} onChange={(e) => setFrom(e.target.value)}>
                        {CITIES.map((c) => <option key={c} value={c}>{c}</option>)}
                      </select>
                    </div>
                  )}
                  <div>
                    <label style={lbl}>{isStay ? t(L('شهر', 'City', 'المدينة'), lang) : t(L('مقصد', 'To', 'إلى'), lang)}</label>
                    <select style={sel} value={to} onChange={(e) => setTo(e.target.value)}>
                      {CITIES.map((c) => <option key={c} value={c}>{c}</option>)}
                    </select>
                  </div>
                  <div>
                    <label style={lbl}>{isStay ? t(L('تاریخِ ورود', 'Check-in', 'تاريخ الوصول'), lang) : t(L('تاریخِ رفت', 'Departure', 'تاريخ المغادرة'), lang)}</label>
                    <input type="date" style={sel} value={date} onChange={(e) => setDate(e.target.value)} />
                  </div>
                </div>

                {/* ارائه‌دهنده‌ها — هرکدام یک لینکِ عمیق به همان مسیر */}
                <div style={{ display: 'flex', gap: 10, marginTop: 18, flexWrap: 'wrap' }}>
                  {list.map((p, i) => (
                    <Button key={i} variant={i === 0 ? 'green' : 'surface'} size="sm"
                      href={track(deepLink(p.url, from, to))} target="_blank" rel="noopener nofollow sponsored">
                      {t(L('جستجو در ', 'Search on ', 'ابحث في '), lang)}{p.name}
                    </Button>
                  ))}
                </div>
                <p style={{ fontSize: 12, color: 'var(--t3)', marginTop: 14, lineHeight: 1.9 }}>
                  {t(L(
                    'شهرهایی که در فهرست نیستند به صفحهٔ جستجویِ همان سرویس می‌روند. خرید، پرداخت و استرداد کاملاً در بسترِ همان سرویس انجام می‌شود.',
                    'Cities not in the list open that service’s general search. Purchase, payment and refunds happen entirely on that service.',
                    'المدن غير المدرجة تفتح صفحة البحث العامة للخدمة. الشراء والدفع والاسترداد تتم بالكامل على تلك الخدمة.'), lang)}
                </p>
              </Card>

              {/* ── باکسِ مستقلِ اقامت ──
                  تبِ «اقامت» از قبل بود ولی پشتِ تب پنهان می‌ماند و کاربر پیدایش
                  نمی‌کرد (بازخوردِ مالک با اسکرین‌شات). حالا همیشه دیده می‌شود. */}
              <StayBox lang={lang} />

              {/* اقامتگاهِ بومیِ استان‌ها — دادهٔ خودمان، نه سرویسِ بیرونی */}
              <WGP.StaysStrip lang={lang} fa={fa} />
            </>
          );
        }}
      </WGP.PageShell>
    );
  };

  /** نوارِ «اقامتگاه‌های بومی و هتل‌های هر استان» — از ماژولِ REGION_GUIDE. */
  /** نقشهٔ استان در صفحهٔ بلیط — انتخابِ استان کاربر را به صفحهٔ همان استان می‌برد. */
  WGP.TicketsMap = function TicketsMap({ lang }) {
    const counts = {};
    (window.WGP_REGIONS || []).forEach((r) => {
      if (r.geoKey && r.counts && r.counts.places) counts[r.geoKey] = r.counts.places;
    });
    return (
      <WGP.ProvinceMapPicker
        lang={lang} active="" counts={counts}
        onPick={(k) => { if (k) window.location.href = '/custom/wegopars/region.html?p=' + encodeURIComponent(k); }}
        title={t(L('مقصدت را روی نقشه انتخاب کن', 'Pick your destination on the map', 'اختر وجهتك على الخريطة'), lang)}
        subtitle={t(L('روی هر استان بزن تا جاذبه‌ها و گزینه‌های اقامتش را ببینی.', 'Tap a province to see its attractions and stay options.', 'اضغط على محافظة لرؤية معالمها وخيارات الإقامة فيها.'), lang)} />
    );
  };

  WGP.StaysStrip = function StaysStrip({ lang, fa }) {
    const [stays, setStays] = React.useState(null);
    React.useEffect(() => {
      let alive = true;
      fetch('/api/v1/custom-sites/wegopars/stays')
        .then((r) => (r.ok ? r.json() : []))
        .then((d) => { if (alive && Array.isArray(d)) setStays(d); })
        .catch(() => {});
      return () => { alive = false; };
    }, []);
    if (!stays || !stays.length) return null;
    return (
      <section style={{ marginTop: 40 }}>
        <SectionHeading align="start" tagColor="var(--saffron)"
          tag={t(L('اقامتگاه‌های ایران', 'Stays across Iran', 'أماكن الإقامة في إيران'), lang)}
          title={t(L('بوم‌گردی و هتل‌های هر استان', 'Ecolodges & hotels by province', 'بيوت ضيافة وفنادق كل محافظة'), lang)} />
        <div className="wgp-grid4" style={{ display: 'grid', gap: 16, marginTop: 22 }}>
          {stays.map((s) => (
            <a key={s.id} href={s.url ? track(s.url) : '#'} target="_blank" rel="noopener nofollow sponsored"
               style={{ textDecoration: 'none', color: 'inherit', border: '1px solid var(--line)', borderRadius: 'var(--r)', overflow: 'hidden', background: 'var(--card)', display: 'block' }}>
              {s.image
                ? <img src={s.image} alt={tx(s.title, lang)} loading="lazy" style={{ display: 'block', width: '100%', height: 150, objectFit: 'cover' }} />
                : <div style={{ height: 150, background: s.color || 'var(--firuze)' }} />}
              <div style={{ padding: '12px 14px' }}>
                <div style={{ fontSize: 11.5, color: 'var(--acc)', fontWeight: 800 }}>{tx(s.province, lang)}</div>
                <div className="wgp-clamp2" style={{ fontWeight: 800, fontSize: 14, marginTop: 4, lineHeight: 1.6 }}>{tx(s.title, lang)}</div>
                <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginTop: 8 }}>
                  <Badge tone="acc">{s.kind === 'HOTEL' ? t(L('هتل', 'Hotel', 'فندق'), lang) : t(L('بوم‌گردی', 'Ecolodge', 'بيت ضيافة'), lang)}</Badge>
                  {s.price ? <span style={{ fontSize: 12, fontWeight: 800, marginInlineStart: 'auto' }}>{fmt(s.price, lang)}</span> : null}
                </div>
              </div>
            </a>
          ))}
        </div>
      </section>
    );
  };

  // ═══════════════ صفحهٔ ۳: کیف‌پول و تبادلِ ارزی ═══════════════
  WGP.WalletPage = function WalletPage() {
    return (
      <WGP.PageShell crumbI18n={L('کیف‌پول و ارز', 'Wallet & FX', 'المحفظة والصرافة')}>
        {({ lang, fa }) => {
          const methods = [
            {
              key: 'rial', ready: true, tone: 'var(--green)',
              icon: ['M2 8h20v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2z', 'M2 12h20'],
              title: L('شارژ با کارتِ بانکیِ ایرانی', 'Top up with an Iranian bank card', 'الشحن ببطاقة بنكية إيرانية'),
              body: L('پرداختِ ریالی از طریقِ درگاهِ بانکی؛ موجودی بلافاصله به کیف‌پولت اضافه می‌شود.', 'Rial payment through the bank gateway; your balance updates immediately.', 'دفع بالريال عبر البوابة البنكية؛ يضاف الرصيد فورًا.'),
            },
            {
              key: 'fx', ready: true, tone: 'var(--firuze)',
              icon: ['M12 2v20', 'M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'],
              title: L('شارژ با ارزِ خارجی', 'Top up in foreign currency', 'الشحن بالعملة الأجنبية'),
              body: L('برای مسافرانِ خارجی: پرداخت به یورو، دلار یا درهم و تبدیل به تومان با نرخِ روز — بدونِ نیاز به حسابِ بانکیِ ایرانی.', 'For foreign visitors: pay in EUR, USD or AED and convert to Toman at the day’s rate — no Iranian bank account needed.', 'للزوار الأجانب: ادفع باليورو أو الدولار أو الدرهم وحوّلها إلى تومان بسعر اليوم — دون حساب بنكي إيراني.'),
            },
            {
              key: 'crypto', ready: false, tone: 'var(--clay)',
              icon: ['M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20z', 'M9.5 8.5h4a2.5 2.5 0 0 1 0 5h-4zM9.5 13.5h4.5a2.5 2.5 0 0 1 0 5H9.5zM9.5 6.5v13'],
              title: L('شارژ با رمزارز', 'Top up with crypto', 'الشحن بالعملات الرقمية'),
              body: L('در حالِ آماده‌سازی. به‌زودی می‌توانی کیف‌پولت را با رمزارزِ پایدار شارژ کنی.', 'In preparation. You will soon be able to top up with stablecoins.', 'قيد الإعداد. ستتمكن قريبًا من الشحن بالعملات المستقرة.'),
            },
          ];

          return (
            <>
              <SectionHeading align="start" tag={t(L('کیف‌پول', 'Wallet', 'المحفظة'), lang)}
                title={t(L('یک کیف‌پول برای کلِ سفر', 'One wallet for the whole trip', 'محفظة واحدة لكل الرحلة'), lang)}
                subtitle={t(L('شارژ کن، بعد با همان موجودی تور رزرو کن، سوغات بخر و خدماتِ سفر بگیر — بدونِ درگیرشدن با پرداختِ جداگانه در هر مرحله.', 'Top up once, then book tours, buy souvenirs and get travel services from the same balance — no separate payment at each step.', 'اشحن مرة واحدة، ثم احجز الجولات واشترِ الهدايا واحصل على خدمات السفر من الرصيد نفسه.'), lang)} />

              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(3,1fr)', gap: 18, marginTop: 28 }}>
                {methods.map((m) => (
                  <Card key={m.key} pad="24px 22px" style={{ position: 'relative', opacity: m.ready ? 1 : .72 }}>
                    {!m.ready && (
                      <span style={{ position: 'absolute', top: 16, insetInlineEnd: 16 }}>
                        <Badge tone="acc">{t(L('به‌زودی', 'Coming soon', 'قريبًا'), lang)}</Badge>
                      </span>
                    )}
                    <div style={{ width: 48, height: 48, borderRadius: 13, background: `color-mix(in srgb,${m.tone} 16%,transparent)`, color: m.tone, display: 'grid', placeItems: 'center', marginBottom: 14 }}>
                      {ico(m.icon, 1.8, 24)}
                    </div>
                    <h3 style={{ fontSize: 16, fontWeight: 800, margin: '0 0 8px', lineHeight: 1.6 }}>{t(m.title, lang)}</h3>
                    <p style={{ color: 'var(--t2)', fontSize: 13.5, lineHeight: 2, margin: 0 }}>{t(m.body, lang)}</p>
                  </Card>
                ))}
              </div>

              <Card gradient pad="26px 24px" style={{ marginTop: 24 }}>
                <h3 style={{ fontSize: 17, fontWeight: 800, margin: '0 0 10px' }}>{t(L('نرخِ تبدیل چطور تعیین می‌شود؟', 'How is the rate set?', 'كيف يُحدد سعر الصرف؟'), lang)}</h3>
                <p style={{ color: 'var(--t2)', fontSize: 13.5, lineHeight: 2, margin: '0 0 18px' }}>
                  {t(L(
                    'نرخ در لحظهٔ شارژ ثبت و روی رسیدت درج می‌شود؛ نوسانِ بعدیِ بازار موجودیِ تو را تغییر نمی‌دهد.',
                    'The rate is locked at top-up time and printed on your receipt; later market swings do not change your balance.',
                    'يُثبَّت السعر لحظة الشحن ويُدرج في إيصالك؛ تقلبات السوق اللاحقة لا تغيّر رصيدك.'), lang)}
                </p>
                {/* حسابِ کاربر جای واقعیِ شارژ است — اینجا فقط معرفی است. */}
                <Button variant="brand" href="/custom/wegopars/profile.html">
                  {t(L('رفتن به کیف‌پولِ من', 'Go to my wallet', 'الذهاب إلى محفظتي'), lang)}
                </Button>
              </Card>
            </>
          );
        }}
      </WGP.PageShell>
    );
  };

  /* ─────────────── صفحهٔ گردشگریِ سلامت (health.html) ───────────────
     خواستهٔ مالک (۱۷ مرداد): «بخشِ تورِ سلامت به منو اضافه شود و بیمارستان‌ها و
     مراکزِ درمانیِ مهمِ شهرها روی نقشه بیایند — به‌خصوص مراکزی که توریسمِ سلامت
     می‌پذیرند. برای مسافرِ عرب و به‌ویژه عراقی خیلی مهم است. برای هماهنگی و تعیینِ
     وقت می‌توانند به پشتیبانیِ ایران‌گرد پیام بدهند.»

     ── دو تصمیمِ محتاطانه که اگر عوضشان کنی باید حقوقی‌اش را هم بپذیری ──
     ۱. **هیچ‌جا ادعای «دارای مجوزِ رسمیِ IPD» نوشته نشده.** مجوزِ IPD را وزارتِ
        بهداشت می‌دهد، فهرستش عمومی و ماشین‌خوان نیست و مرتب تمدید/باطل می‌شود.
        متن می‌گوید «مراکزی که پذیرشِ بیمارِ بین‌المللی دارند» و راستی‌آزمایی را به
        مرحلهٔ هماهنگی می‌سپارد.
     ۲. **هیچ قیمت، امتیاز یا نرخِ موفقیتی نمایش داده نمی‌شود.** عددِ ساختگی روی
        صفحهٔ پزشکی از عددِ ساختگی روی صفحهٔ هتل خیلی بدتر است.

     منبعِ داده: `RegionPlace` با `kind='MEDICAL'` — یعنی همان ردیفی که ادمین در
     پنل («راهنمای منطقه‌ای» ← استان ← افزودنِ مکان) می‌سازد و موتورِ ترجمه خودش
     en/ar را برایش پر می‌کند. مدلِ جدا نساختیم تا نقشه، پنل و مترجم رایگان بیایند. */
  WGP.HealthPage = function HealthPage() {
    const [st, setSt] = React.useState({ loading: true, data: null });
    // استانِ انتخاب‌شده روی نقشه؛ '' یعنی همه (خواستهٔ مالک: «هر استانی انتخاب
    // می‌شود فهرستِ مراکزِ درمانیِ پذیرندهٔ تورِ سلامت بیاید»).
    // مقدارِ اولیه از `?p=` می‌آید تا دکمهٔ «مراکزِ درمانیِ <استان>» در درارِ نقشهٔ
    // صفحهٔ اول، مستقیم روی همان استان باز شود نه روی فهرستِ کامل.
    const [prov, setProv] = React.useState(() => {
      try { return new URLSearchParams(location.search).get('p') || ''; } catch (e) { return ''; }
    });
    React.useEffect(() => {
      let alive = true;
      fetch('/api/v1/custom-sites/wegopars/medical')
        .then((r) => (r.ok ? r.json() : { total: 0, groups: [] }))
        .then((d) => { if (alive) setSt({ loading: false, data: d }); })
        .catch(() => { if (alive) setSt({ loading: false, data: { total: 0, groups: [] } }); });
      return () => { alive = false; };
    }, []);

    return (
      <WGP.PageShell crumbI18n={L('گردشگریِ سلامت', 'Health tourism', 'السياحة العلاجية')}>
        {({ lang, fa }) => {
          const d = st.data || { total: 0, groups: [] };
          const hc = ((window.WGP_DATA || {}).content || {})[lang] || {};
          const H = hc.health || {}; // محتوای قابلِ ویرایش از پنل/ویرایشگرِ درجا

          // پیامِ آمادهٔ پشتیبانی — کاربر فقط بفرستد. برایِ بیمارِ عراقی که فارسی
          // نمی‌داند، خالی‌بودنِ کادرِ پیام بزرگ‌ترین مانع است.
          const askFor = (name) => {
            const msg = t(L(
              'سلام، برای هماهنگیِ درمان در «' + name + '» راهنمایی می‌خواهم.',
              'Hello, I would like help arranging treatment at "' + name + '".',
              'مرحباً، أرغب بالمساعدة في تنسيق العلاج في «' + name + '».',
            ), lang);
            try {
              if (window.WCSupport && window.WCSupport.open) {
                window.WCSupport.open();
                // متنِ پیش‌نویس را در کادرِ پیامِ ویجت می‌گذاریم اگر پیدا شد
                setTimeout(function () {
                  var ta = document.querySelector('#wc-support textarea, .wc-support textarea, textarea[name="message"]');
                  if (ta) { ta.value = msg; ta.dispatchEvent(new Event('input', { bubbles: true })); ta.focus(); }
                }, 350);
                return;
              }
            } catch (e) { /* ویجت نبود → فرمِ تماسِ صفحهٔ اصلی */ }
            window.location.href = '/custom/wegopars/index.html#contact';
          };

          return (
            <>
              <SectionHeading align="start"
                tag={<span data-wgp-i18n="health.tag">{H.tag || t(L('گردشگریِ سلامت', 'Health tourism', 'السياحة العلاجية'), lang)}</span>}
                title={<span data-wgp-i18n="health.title">{H.title || t(L('درمان در ایران، با هماهنگیِ ایران‌گرد', 'Treatment in Iran, arranged by WeGoPars', 'العلاج في إيران بتنسيق من إيران‌غرد'), lang)}</span>}
                subtitle={<span data-wgp-i18n="health.subtitle">{H.subtitle || t(L(
                  'مراکزِ درمانیِ ایران که بیمارِ بین‌المللی می‌پذیرند — با هزینه‌ای به‌مراتب کمتر از کشورهای همسایه و پزشکانی با تجربهٔ جهانی. برای تعیینِ وقت و هماهنگی، به پشتیبانیِ ایران‌گرد پیام بدهید.',
                  'Iranian medical centres that admit international patients — at a fraction of neighbouring countries’ cost, with globally experienced doctors. Message WeGoPars support to arrange an appointment.',
                  'مراكز طبية إيرانية تستقبل المرضى الدوليين — بتكلفة أقل بكثير من دول الجوار وبأطباء ذوي خبرة عالمية. راسل دعم إيران‌غرد لتحديد موعد وتنسيق العلاج.',
                ), lang)}</span>} />

              {/* ── سه گامِ کار ── */}
              <div style={{ display: 'grid', gridTemplateColumns: 'repeat(3,1fr)', gap: 16, marginTop: 26 }}>
                {[
                  { n: '۱', i: ['M21 21l-4.3-4.3', 'M11 19a8 8 0 1 0 0-16 8 8 0 0 0 0 16z'],
                    ti: L('مرکز را انتخاب کن', 'Pick a centre', 'اختر المركز'),
                    bo: L('شهر و تخصصِ موردِ نظرت را از فهرستِ زیر پیدا کن.', 'Find your city and speciality in the list below.', 'اعثر على مدينتك والتخصص المطلوب في القائمة أدناه.') },
                  { n: '۲', i: ['M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'],
                    ti: L('به پشتیبانی پیام بده', 'Message support', 'راسل الدعم'),
                    bo: L('پروندهٔ پزشکی‌ات را بفرست؛ هماهنگی با مرکز با ماست.', 'Send your medical file; we handle the coordination.', 'أرسل ملفك الطبي؛ ونحن نتولى التنسيق.') },
                  { n: '۳', i: ['M9 11l3 3L22 4', 'M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'],
                    ti: L('وقت و سفر', 'Appointment & trip', 'الموعد والرحلة'),
                    bo: L('وقتِ ویزیت، اقامت و ترجمه هماهنگ می‌شود.', 'Appointment, stay and translation are arranged.', 'يتم ترتيب الموعد والإقامة والترجمة.') },
                ].map((s, i) => (
                  <Card key={i} pad="20px 22px">
                    <div style={{ display: 'flex', alignItems: 'center', gap: 11, marginBottom: 10 }}>
                      <span style={{ width: 40, height: 40, borderRadius: 12, background: 'var(--grad-brand)', display: 'grid', placeItems: 'center', color: '#fff', flex: 'none' }}>{ico(s.i, 1.8, 20)}</span>
                      <h3 style={{ fontSize: 16, fontWeight: 800, margin: 0 }}>{t(s.ti, lang)}</h3>
                    </div>
                    <p style={{ color: 'var(--t2)', fontSize: 13.5, lineHeight: 1.95, margin: 0 }}>{t(s.bo, lang)}</p>
                  </Card>
                ))}
              </div>

              {/* ── درمان‌های پرمتقاضی ──
                  منابعِ صنعتِ گردشگریِ سلامتِ ایران (از جمله منابعی که مالک فرستاد)
                  همگی روی همین پنج دسته هم‌نظرند. برای بیمارِ عراقی و خلیج، «چه
                  کاری اینجا انجام می‌شود» اولین سؤال است — قبل از «کدام بیمارستان». */}
              <section style={{ marginTop: 38 }}>
                <h2 style={{ fontSize: 21, fontWeight: 900, margin: '0 0 6px' }}>
                  {t(L('درمان‌های پرمتقاضی', 'Most requested treatments', 'العلاجات الأكثر طلباً'), lang)}
                </h2>
                <p style={{ color: 'var(--t3)', fontSize: 13, margin: '0 0 18px' }}>
                  {t(L(
                    'هزینهٔ درمان در ایران معمولاً بسیار کمتر از کشورهای منطقه و غرب است، با پزشکانی که در همان رشته‌ها تجربهٔ بین‌المللی دارند.',
                    'Treatment in Iran typically costs far less than in the region or the West, with physicians experienced at international standards.',
                    'تكلفة العلاج في إيران أقل بكثير عادةً من دول المنطقة والغرب، مع أطباء ذوي خبرة بمعايير عالمية.',
                  ), lang)}
                </p>
                <div className="wgp-grid4" style={{ display: 'grid', gap: 14 }}>
                  {[
                    { i: ['M12 21s-7-4.5-7-10a7 7 0 0 1 14 0c0 5.5-7 10-7 10z'],
                      ti: L('جراحی زیبایی', 'Cosmetic surgery', 'الجراحة التجميلية'),
                      bo: L('بینی، لیفت صورت، لیپوساکشن، کاشتِ مو', 'Rhinoplasty, facelift, liposuction, hair transplant', 'تجميل الأنف، شد الوجه، شفط الدهون، زراعة الشعر') },
                    { i: ['M8 2v4M16 2v4M3 10h18', 'M5 4h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'],
                      ti: L('ارتوپدی', 'Orthopaedics', 'جراحة العظام'),
                      bo: L('تعویضِ مفصل، جراحیِ ستونِ فقرات', 'Joint replacement, spinal surgery', 'استبدال المفاصل، جراحة العمود الفقري') },
                    { i: ['M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.7l-1-1.1a5.5 5.5 0 0 0-7.8 7.8l1.1 1L12 21l7.7-7.6 1.1-1a5.5 5.5 0 0 0 0-7.8z'],
                      ti: L('قلب و عروق', 'Cardiology', 'القلب والأوعية'),
                      bo: L('بای‌پس، آنژیوگرافی، تعویضِ دریچه', 'Bypass, angiography, valve replacement', 'المجازة، القسطرة، استبدال الصمامات') },
                    { i: ['M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z', 'M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'],
                      ti: L('چشم‌پزشکی', 'Ophthalmology', 'طب العيون'),
                      bo: L('لیزیک، آب‌مروارید، جراحیِ شبکیه', 'LASIK, cataract, retinal surgery', 'الليزك، الساد، جراحة الشبكية') },
                    { i: ['M12 2a5 5 0 0 1 5 5c0 3-5 10-5 10S7 10 7 7a5 5 0 0 1 5-5z', 'M12 22h.01'],
                      ti: L('درمانِ ناباروری', 'Fertility treatment', 'علاج العقم'),
                      bo: L('IVF، ICSI، IUI', 'IVF, ICSI, IUI', 'أطفال الأنابيب، الحقن المجهري، التلقيح') },
                  ].map((s, i) => (
                    <Card key={i} pad="18px 20px">
                      <div style={{ width: 42, height: 42, borderRadius: 12, background: 'color-mix(in srgb,var(--acc) 15%,transparent)', display: 'grid', placeItems: 'center', color: 'var(--acc)', marginBottom: 12 }}>
                        {ico(s.i, 1.8, 21)}
                      </div>
                      <h3 style={{ fontSize: 15, fontWeight: 800, margin: '0 0 6px' }}>{t(s.ti, lang)}</h3>
                      <p style={{ color: 'var(--t3)', fontSize: 12.5, lineHeight: 1.85, margin: 0 }}>{t(s.bo, lang)}</p>
                    </Card>
                  ))}
                </div>
              </section>

              {/* ── نقشهٔ ایران: انتخابِ استان ── */}
              {(() => {
                const counts = {};
                d.groups.forEach((g) => { const k = (g.region || {}).geoKey; if (k) counts[k] = g.centers.length; });
                return (
                  <WGP.ProvinceMapPicker
                    lang={lang} active={prov} counts={counts} onPick={setProv}
                    title={t(L('روی نقشه استان را انتخاب کن', 'Pick a province on the map', 'اختر المحافظة على الخريطة'), lang)}
                    subtitle={t(L(
                      'استان‌های روشن مرکزِ درمانیِ ثبت‌شده دارند. روی هرکدام بزن تا فهرستش پایین بیاید.',
                      'Highlighted provinces have registered centres. Tap one to filter the list below.',
                      'المحافظات المضاءة لديها مراكز مسجلة. اضغط على إحداها لتصفية القائمة أدناه.',
                    ), lang)} />
                );
              })()}

              {/* میان‌برِ شهرهای اصلی — خواستهٔ مالک: «زیرِ نقشه مراکزِ مهمِ چند شهر
                  مثل تهران، مشهد، شیراز، تبریز بیاید.» */}
              {!st.loading && d.total > 0 && (
                <div style={{ display: 'flex', gap: 9, flexWrap: 'wrap', marginTop: 16 }}>
                  {[['تهران', 'Tehran', 'طهران'], ['خراسان رضوی', 'Mashhad', 'مشهد'], ['فارس', 'Shiraz', 'شيراز'], ['آذربایجان شرقی', 'Tabriz', 'تبريز'], ['یزد', 'Yazd', 'يزد']]
                    .filter(([k]) => d.groups.some((g) => (g.region || {}).geoKey === k))
                    .map(([k, en, ar]) => (
                      <button key={k} onClick={() => setProv(prov === k ? '' : k)}
                        style={{ border: '1px solid var(--line)', background: prov === k ? 'var(--acc)' : 'var(--surface)', color: prov === k ? '#fff' : 'var(--t2)', borderRadius: 'var(--pill)', padding: '9px 18px', fontSize: 13, fontWeight: 700, cursor: 'pointer', fontFamily: 'inherit' }}>
                        {t(L(k, en, ar), lang)}
                      </button>
                    ))}
                </div>
              )}

              {/* ── باکسِ تبلیغ، بینِ نقشه و آیتم‌ها ── */}
              <WGP.AdSlot lang={lang} slot="adSlotHealth" />

              {/* ── فهرستِ مراکز، گروه‌بندی‌شده بر اساسِ استان ── */}
              <section style={{ marginTop: 40 }}>
                <h2 style={{ fontSize: 21, fontWeight: 900, margin: '0 0 6px' }}>
                  {t(L('مراکزِ درمانیِ پذیرندهٔ بیمارِ بین‌المللی', 'Centres admitting international patients', 'مراكز تستقبل المرضى الدوليين'), lang)}
                </h2>
                <p style={{ color: 'var(--t3)', fontSize: 13, margin: '0 0 20px' }}>
                  {t(L(
                    'فهرست به‌مرورِ زمان کامل‌تر می‌شود. وضعیتِ پذیرش و هزینه در مرحلهٔ هماهنگی با خودِ مرکز راستی‌آزمایی می‌شود.',
                    'This list keeps growing. Admission status and cost are confirmed with the centre during coordination.',
                    'تتوسع هذه القائمة تدريجياً. ويتم التأكد من حالة القبول والتكلفة مع المركز أثناء التنسيق.',
                  ), lang)}
                </p>

                {st.loading && <Card pad="34px" style={{ textAlign: 'center', color: 'var(--t3)' }}>{t(L('در حالِ بارگذاری…', 'Loading…', 'جارٍ التحميل…'), lang)}</Card>}

                {!st.loading && !d.total && (
                  <Card pad="34px" style={{ textAlign: 'center', color: 'var(--t3)' }}>
                    {t(L('فهرستِ مراکز به‌زودی منتشر می‌شود. برای پیگیری به پشتیبانی پیام بدهید.', 'The list of centres is coming soon. Message support in the meantime.', 'ستُنشر قائمة المراكز قريباً. راسل الدعم في هذه الأثناء.'), lang)}
                  </Card>
                )}

                {!st.loading && d.groups.filter((g) => !prov || (g.region || {}).geoKey === prov).map((g) => (
                  <div key={(g.region || {}).slug} style={{ marginTop: 26 }}>
                    <h3 style={{ fontSize: 17, fontWeight: 800, margin: '0 0 13px', display: 'flex', alignItems: 'center', gap: 9 }}>
                      <span style={{ width: 8, height: 22, borderRadius: 4, background: (g.region || {}).color || 'var(--acc)' }} />
                      {tx((g.region || {}).name, lang)}
                      <span style={{ fontSize: 12.5, color: 'var(--t3)', fontWeight: 600 }}>({fmt(g.centers.length, lang)})</span>
                    </h3>
                    <div className="wgp-grid4" style={{ display: 'grid', gap: 16 }}>
                      {g.centers.map((c) => (
                        <Card key={c.id} pad={0} hover style={{ overflow: 'hidden', display: 'flex', flexDirection: 'column' }}>
                          {/* عکسِ واقعی برنده است؛ وگرنه صحنهٔ سلامتِ متنوعِ اختصاصیِ
                              همین مرکز (خواستهٔ مالک: «عکس به‌جای علامتِ +») */}
                          <img src={c.image || WGP.cover(tx(c.title, lang), 'medical')}
                               alt={tx(c.title, lang)} loading="lazy"
                               style={{ width: '100%', height: 140, objectFit: 'cover', display: 'block', flex: 'none' }} />
                          <div style={{ padding: '14px 16px 16px', display: 'flex', flexDirection: 'column', gap: 7, flex: 1 }}>
                            <div style={{ fontWeight: 800, fontSize: 14.5, lineHeight: 1.6 }}>{tx(c.title, lang)}</div>
                            {tx(c.note, lang) && <div className="wgp-clamp2" style={{ fontSize: 12, color: 'var(--t3)', lineHeight: 1.75 }}>{tx(c.note, lang)}</div>}
                            {tx(c.description, lang) && (
                              <p className="wgp-clamp3" style={{ fontSize: 12.5, color: 'var(--t2)', lineHeight: 1.9, margin: 0 }}>{tx(c.description, lang)}</p>
                            )}
                            <div style={{ marginTop: 'auto', paddingTop: 10 }}>
                              <Button variant="brand" size="sm" fullWidth onClick={() => askFor(tx(c.title, lang))}>
                                {t(L('درخواستِ هماهنگی', 'Request coordination', 'طلب تنسيق'), lang)}
                              </Button>
                            </div>
                          </div>
                        </Card>
                      ))}
                    </div>
                  </div>
                ))}
              </section>

              {/* ── فراخوانِ پایانی ── */}
              <Card gradient pad="30px 28px" style={{ marginTop: 40, textAlign: 'center' }}>
                <h3 style={{ fontSize: 20, fontWeight: 900, margin: '0 0 10px' }} data-wgp-i18n="health.ctaTitle">
                  {H.ctaTitle || t(L('نمی‌دانی از کجا شروع کنی؟', 'Not sure where to start?', 'لا تعرف من أين تبدأ؟'), lang)}
                </h3>
                <p style={{ color: 'var(--t2)', fontSize: 14, lineHeight: 2, margin: '0 auto 18px', maxWidth: 620 }} data-wgp-i18n="health.ctaBody">
                  {H.ctaBody || t(L(
                    'شرحِ بیماری یا مدارکِ پزشکی‌ات را برای پشتیبانیِ ایران‌گرد بفرست. مرکزِ مناسب، وقتِ ویزیت، اقامت و مترجم را هماهنگ می‌کنیم.',
                    'Send your condition or medical documents to WeGoPars support. We arrange the right centre, the appointment, accommodation and an interpreter.',
                    'أرسل وصف حالتك أو مستنداتك الطبية إلى دعم إيران‌غرد. نحن نرتب المركز المناسب والموعد والإقامة والمترجم.',
                  ), lang)}
                </p>
                <Button variant="brand" onClick={() => askFor(t(L('گردشگریِ سلامت', 'Health tourism', 'السياحة العلاجية'), lang))}>
                  {t(L('پیام به پشتیبانیِ ایران‌گرد', 'Message WeGoPars support', 'راسل دعم إيران‌غرد'), lang)}
                </Button>
              </Card>
            </>
          );
        }}
      </WGP.PageShell>
    );
  };


  /* ─────────────── صفحهٔ «فعالینِ باسلام» (vendors.html) ───────────────
     خواستهٔ مالک (۱۷ مرداد): «در منوی بالا یک لینک بگذار فعالینِ باسلام؛ وقتی
     رویش می‌زنی یک نقشهٔ ایران بیاید و فعالینِ باسلام در هر استان نمایش داده شود.»

     این صفحه با اولویتِ راهبردیِ تازه کاملاً هم‌راستاست: «هدفِ اصلیِ ایران‌گرد
     معرفیِ کسب‌وکارهای خرد و فروشگاه‌هاست.» ۲۰۹ غرفهٔ واقعی در ۲۸ استان.

     ⚠️ هر لینک از قبل کدِ همکاری در فروش را دارد (سمتِ سرور ساخته می‌شود) و با
     `rel="nofollow sponsored"` می‌رود — هم قاعدهٔ گوگل، هم شفافیت با کاربر. */
  WGP.VendorsPage = function VendorsPage() {
    const [st, setSt] = React.useState({ loading: true, data: null });
    const [prov, setProv] = React.useState(() => {
      try { return new URLSearchParams(location.search).get('p') || ''; } catch (e) { return ''; }
    });
    React.useEffect(() => {
      let alive = true;
      fetch('/api/v1/custom-sites/wegopars/vendors')
        .then((r) => (r.ok ? r.json() : { total: 0, groups: [] }))
        .then((d) => { if (alive) setSt({ loading: false, data: d }); })
        .catch(() => { if (alive) setSt({ loading: false, data: { total: 0, groups: [] } }); });
      return () => { alive = false; };
    }, []);

    return (
      <WGP.PageShell crumbI18n={L('فعالینِ باسلام', 'Basalam vendors', 'بائعو باسلام')}>
        {({ lang, fa }) => {
          const d = st.data || { total: 0, groups: [] };
          const counts = {};
          d.groups.forEach((g) => { const k = (g.region || {}).geoKey; if (k) counts[k] = g.vendors.length; });
          const shown = d.groups.filter((g) => !prov || (g.region || {}).geoKey === prov);

          return (
            <>
              <SectionHeading align="start"
                tag={t(L('کسب‌وکارهای خرد', 'Small businesses', 'الأعمال الصغيرة'), lang)}
                title={t(L('فعالینِ باسلام در سراسرِ ایران', 'Basalam vendors across Iran', 'بائعو باسلام في أنحاء إيران'), lang)}
                subtitle={t(L(
                  'غرفه‌های واقعیِ صنعتگران و تولیدکنندگانِ محلی. خرید، پرداخت و ارسال کاملاً در بسترِ باسلام انجام می‌شود.',
                  'Real shops of local artisans and producers. Purchase, payment and shipping happen entirely on Basalam.',
                  'متاجر حقيقية لحرفيين ومنتجين محليين. الشراء والدفع والشحن تتم بالكامل عبر منصة باسلام.',
                ), lang)} />

              <WGP.ProvinceMapPicker
                lang={lang} active={prov} counts={counts} onPick={setProv}
                title={t(L('استان را روی نقشه انتخاب کن', 'Pick a province on the map', 'اختر المحافظة على الخريطة'), lang)}
                subtitle={t(L(
                  'استان‌های روشن غرفهٔ ثبت‌شده دارند. روی هرکدام بزن تا فهرستش پایین بیاید.',
                  'Highlighted provinces have registered vendors. Tap one to filter the list below.',
                  'المحافظات المضاءة لديها متاجر مسجلة. اضغط على إحداها لتصفية القائمة أدناه.',
                ), lang)} />

              <WGP.AdSlot lang={lang} slot="adSlotVendors" />

              <section style={{ marginTop: 36 }}>
                {st.loading && <Card pad="34px" style={{ textAlign: 'center', color: 'var(--t3)' }}>{t(L('در حالِ بارگذاری…', 'Loading…', 'جارٍ التحميل…'), lang)}</Card>}
                {!st.loading && !d.total && (
                  <Card pad="34px" style={{ textAlign: 'center', color: 'var(--t3)' }}>
                    {t(L('هنوز غرفه‌ای ثبت نشده.', 'No vendors listed yet.', 'لم تُسجَّل متاجر بعد.'), lang)}
                  </Card>
                )}
                {!st.loading && shown.map((g) => (
                  <div key={(g.region || {}).slug} style={{ marginTop: 26 }}>
                    <h3 style={{ fontSize: 17, fontWeight: 800, margin: '0 0 13px', display: 'flex', alignItems: 'center', gap: 9 }}>
                      <span style={{ width: 8, height: 22, borderRadius: 4, background: (g.region || {}).color || 'var(--acc)' }} />
                      {tx((g.region || {}).name, lang)}
                      <span style={{ fontSize: 12.5, color: 'var(--t3)', fontWeight: 600 }}>({fmt(g.vendors.length, lang)})</span>
                    </h3>
                    <div className="wgp-grid4" style={{ display: 'grid', gap: 15 }}>
                      {g.vendors.map((v) => (
                        <a key={v.id} href={v.url || '#'} target="_blank" rel="noopener nofollow sponsored"
                           style={{ textDecoration: 'none', color: 'inherit', display: 'block' }}>
                          <Card pad={0} hover style={{ overflow: 'hidden', height: 300, display: 'flex', flexDirection: 'column' }}>
                            <div style={{ position: 'relative', flex: 'none' }}>
                              <img src={v.image || WGP.cover(v.title, 'shop', (g.region || {}).color)} alt={v.title} loading="lazy"
                                   style={{ display: 'block', width: '100%', height: 150, objectFit: 'cover' }} />
                              {v.isTopVendor && (
                                <span style={{ position: 'absolute', top: 9, insetInlineStart: 9 }}>
                                  <Badge tone="green" variant="solid">{t(L('غرفهٔ برتر', 'Top vendor', 'متجر متميّز'), lang)}</Badge>
                                </span>
                              )}
                            </div>
                            <div style={{ padding: '12px 14px 14px', display: 'flex', flexDirection: 'column', gap: 6, flex: 1, minHeight: 0 }}>
                              <div className="wgp-clamp2" style={{ fontWeight: 700, fontSize: 13.5, lineHeight: 1.65 }}>{v.title}</div>
                              {v.vendor && <div style={{ fontSize: 11.5, color: 'var(--t3)' }}>{t(L('غرفه: ', 'Shop: ', 'المتجر: '), lang)}{v.vendor}</div>}
                              <div style={{ marginTop: 'auto', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
                                {v.price
                                  ? <span style={{ fontSize: 12.5, color: 'var(--acc)', fontWeight: 800 }}>{fmt(v.price, lang)} <span style={{ fontSize: 10, color: 'var(--t3)' }}>{t(L('تومان', 'Toman', 'تومان'), lang)}</span></span>
                                  : <span />}
                                {v.rating ? <span style={{ fontSize: 11.5, color: 'var(--t3)' }}>★ {v.rating}</span> : null}
                              </div>
                              <span style={{ fontSize: 11.5, fontWeight: 700, color: 'var(--acc)' }}>{t(L('خرید در باسلام ←', 'Buy on Basalam →', 'الشراء عبر باسلام ←'), lang)}</span>
                            </div>
                          </Card>
                        </a>
                      ))}
                    </div>
                  </div>
                ))}
              </section>

              {/* شفافیتِ رابطهٔ مالی — همان متنی که در صفحهٔ صنایع‌دستی هم هست */}
              <p style={{ marginTop: 30, fontSize: 12, color: 'var(--t3)', lineHeight: 2 }}>
                {t(L(
                  'ایران‌گرد این غرفه‌ها را معرفی می‌کند؛ فروشنده، قیمت و ارسال بر عهدهٔ باسلام و غرفه‌دار است. ایران‌گرد از معرفی، کارمزدِ همکاری در فروش دریافت می‌کند.',
                  'WeGoPars introduces these vendors; the seller, price and shipping are handled by Basalam and the vendor. WeGoPars earns an affiliate commission from referrals.',
                  'إيران‌غرد يعرّف بهذه المتاجر؛ أما البائع والسعر والشحن فمسؤولية باسلام وصاحب المتجر. ويحصل إيران‌غرد على عمولة تسويق مقابل التعريف.',
                ), lang)}
              </p>
            </>
          );
        }}
      </WGP.PageShell>
    );
  };


  /* ─────────────── صفحهٔ «تماس با ما» (contact.html) ───────────────
     خواستهٔ مالک (۱۷ مرداد): «در صفحهٔ تماس با ما فرمِ تماس، شماره، لینک‌های
     شبکه‌های اجتماعی، و پایین‌ترش سؤالات متداول باشد. سؤالات متداول در صفحهٔ
     اصلی نباشد.»

     ویجتِ پشتیبانیِ شناور از قبل به `SUP.contactUrl` لینک می‌دهد؛ با ساخته‌شدنِ
     این صفحه فقط باید `WC_SITE.support.contactUrl` تنظیم شود (در HTML انجام شد). */
  const WA = '989307237387';   // همان شمارهٔ مشترکِ ویجتِ پشتیبانی

  const FAQ = [
    { q: L('برای سفر به ایران ویزا لازم دارم؟', 'Do I need a visa to visit Iran?', 'هل أحتاج تأشيرة لزيارة إيران؟'),
      a: L('بیشترِ ملیت‌ها بله. شهروندانِ برخی کشورها از جمله عراق شرایطِ ویژه دارند و ویزای فرودگاهی هم برای بسیاری از کشورها صادر می‌شود. برای وضعیتِ دقیقِ کشورِ خودت به پشتیبانی پیام بده.',
           'Most nationalities do. Some countries, including Iraq, have special arrangements, and visa-on-arrival is available for many nationalities. Message support for your exact situation.',
           'معظم الجنسيات نعم. بعض الدول ومنها العراق لديها ترتيبات خاصة، وتأشيرة المطار متاحة لكثير من الجنسيات. راسل الدعم لمعرفة وضعك بالتحديد.') },
    { q: L('کارتِ بانکیِ خارجی در ایران کار می‌کند؟', 'Do foreign bank cards work in Iran?', 'هل تعمل البطاقات البنكية الأجنبية في إيران؟'),
      a: L('نه. ویزا و مسترکارت در ایران پذیرفته نمی‌شوند. راهِ عملی، شارژِ کیف‌پولِ ایران‌گرد یا تهیهٔ کارتِ ریالیِ سفر است.',
           'No. Visa and Mastercard are not accepted in Iran. The practical route is topping up a WeGoPars wallet or getting a rial travel card.',
           'لا. فيزا وماستركارد غير مقبولتين في إيران. الحل العملي هو شحن محفظة إيران‌غرد أو الحصول على بطاقة ريال للسفر.') },
    { q: L('هزینهٔ درمان در ایران چقدر است؟', 'How much does treatment in Iran cost?', 'كم تكلفة العلاج في إيران؟'),
      a: L('بسته به نوعِ درمان فرق می‌کند و معمولاً به‌مراتب کمتر از کشورهای منطقه است. قیمتِ قطعی را خودِ مرکزِ درمانی بعد از دیدنِ پروندهٔ پزشکی اعلام می‌کند — ما هماهنگش می‌کنیم.',
           'It depends on the procedure and is usually far lower than in neighbouring countries. The final price comes from the centre itself after reviewing your medical file — we arrange that.',
           'يعتمد على نوع العلاج وعادة أقل بكثير من دول الجوار. السعر النهائي يحدده المركز بعد مراجعة ملفك الطبي — ونحن ننسّق ذلك.') },
    { q: L('خرید از غرفه‌های باسلام چطور انجام می‌شود؟', 'How do purchases from Basalam vendors work?', 'كيف يتم الشراء من متاجر باسلام؟'),
      a: L('ایران‌گرد غرفه را معرفی می‌کند و خرید، پرداخت و ارسال کاملاً در بسترِ خودِ باسلام انجام می‌شود. ایران‌گرد از معرفی کارمزدِ همکاری در فروش می‌گیرد.',
           'WeGoPars introduces the vendor; the purchase, payment and shipping happen entirely on Basalam. WeGoPars earns an affiliate commission from the referral.',
           'إيران‌غرد يعرّف بالمتجر، والشراء والدفع والشحن تتم بالكامل عبر باسلام. ويحصل إيران‌غرد على عمولة تسويق مقابل التعريف.') },
    { q: L('پشتیبانی به چه زبان‌هایی پاسخ می‌دهد؟', 'Which languages does support speak?', 'بأي لغات يرد الدعم؟'),
      a: L('فارسی، عربی و انگلیسی.', 'Persian, Arabic and English.', 'الفارسية والعربية والإنجليزية.') },
  ];

  WGP.ContactPage = function ContactPage() {
    const [sent, setSent] = React.useState(false);
    const [open, setOpen] = React.useState(-1);
    return (
      <WGP.PageShell crumbI18n={L('تماس با ما', 'Contact us', 'اتصل بنا')}>
        {({ lang, fa }) => {
          const waHref = 'https://wa.me/' + WA + '?text=' + encodeURIComponent(
            t(L('سلام، از سایتِ ایران‌گرد پیام می‌دهم.', 'Hello, I am contacting you from WeGoPars.', 'مرحباً، أراسلكم من موقع إيران‌غرد.'), lang));
          return (
            <>
              <SectionHeading align="start" tag={t(L('تماس', 'Contact', 'تواصل'), lang)}
                title={t(L('با ایران‌گرد در تماس باش', 'Get in touch with WeGoPars', 'تواصل مع إيران‌غرد'), lang)}
                subtitle={t(L('پشتیبانی به فارسی، عربی و انگلیسی پاسخ می‌دهد.', 'Support replies in Persian, Arabic and English.', 'الدعم يرد بالفارسية والعربية والإنجليزية.'), lang)} />

              <div className="wgp-place-grid" style={{ marginTop: 26 }}>
                {/* فرمِ تماس */}
                <Card pad="24px 26px">
                  <h3 style={{ fontSize:17, fontWeight:800, margin:'0 0 16px' }}>{t(L('پیام بفرست', 'Send a message', 'أرسل رسالة'), lang)}</h3>
                  {sent ? (
                    <div style={{ background:'color-mix(in srgb,var(--acc) 10%,transparent)', border:'1px solid color-mix(in srgb,var(--acc) 32%,transparent)', borderRadius:12, padding:'16px 18px', fontSize:14, lineHeight:2 }}>
                      {t(L('✓ پیامت ثبت شد. به‌زودی پاسخ می‌دهیم.', '✓ Your message was received. We will reply soon.', '✓ تم استلام رسالتك. سنرد قريباً.'), lang)}
                    </div>
                  ) : (
                    <form onSubmit={(e) => {
                      e.preventDefault();
                      const f = e.target;
                      // ⚠️ اندپوینتِ لیدِ پلتفرم از قبل هست؛ اگر شکست خورد کاربر نباید
                      // پیامش را از دست بدهد — به واتساپ منتقل می‌شود.
                      fetch('/api/v1/custom-sites/wegopars/lead', {
                        method:'POST', headers:{'content-type':'application/json'},
                        body: JSON.stringify({ name:f.n.value, phone:f.p.value, email:f.e.value, message:f.m.value, source:'contact-page' }),
                      }).then((r) => { if (r.ok) setSent(true); else window.open(waHref, '_blank', 'noopener'); })
                        .catch(() => window.open(waHref, '_blank', 'noopener'));
                    }}>
                      {[['n', L('نام', 'Name', 'الاسم'), 'text', true],
                        ['p', L('شماره تماس', 'Phone', 'رقم الهاتف'), 'tel', false],
                        ['e', L('ایمیل', 'Email', 'البريد الإلكتروني'), 'email', false]].map(([nm, lb, ty, req]) => (
                        <div key={nm} style={{ marginBottom:13 }}>
                          <label style={{ display:'block', fontSize:12.5, color:'var(--t3)', marginBottom:6 }}>{t(lb, lang)}{req ? ' *' : ''}</label>
                          <input name={nm} type={ty} required={req}
                            style={{ width:'100%', padding:'11px 13px', borderRadius:10, border:'1px solid var(--line)', background:'var(--surface)', color:'var(--t1)', fontFamily:'inherit', fontSize:14 }} />
                        </div>
                      ))}
                      <div style={{ marginBottom:16 }}>
                        <label style={{ display:'block', fontSize:12.5, color:'var(--t3)', marginBottom:6 }}>{t(L('پیام', 'Message', 'الرسالة'), lang)} *</label>
                        <textarea name="m" required rows={5}
                          style={{ width:'100%', padding:'11px 13px', borderRadius:10, border:'1px solid var(--line)', background:'var(--surface)', color:'var(--t1)', fontFamily:'inherit', fontSize:14, resize:'vertical' }} />
                      </div>
                      <Button variant="brand" type="submit" fullWidth>{t(L('ارسالِ پیام', 'Send message', 'إرسال الرسالة'), lang)}</Button>
                    </form>
                  )}
                </Card>

                {/* راه‌های تماس */}
                <aside>
                  <Card pad="20px 22px" style={{ marginBottom:16 }}>
                    <h4 style={{ fontSize:14, fontWeight:800, margin:'0 0 14px' }}>{t(L('راه‌های تماس', 'Ways to reach us', 'طرق التواصل'), lang)}</h4>
                    <a href={waHref} target="_blank" rel="noopener"
                       style={{ display:'flex', alignItems:'center', gap:11, padding:'11px 12px', borderRadius:11, textDecoration:'none', color:'inherit', background:'color-mix(in srgb,#25D366 12%,transparent)', border:'1px solid color-mix(in srgb,#25D366 30%,transparent)', marginBottom:10 }}>
                      <span style={{ color:'#25D366', flex:'none' }}>{ico(['M21 11.5a8.4 8.4 0 0 1-12.6 7.3L3 20.5l1.8-5.2A8.5 8.5 0 1 1 21 11.5z'], 1.8, 21)}</span>
                      <span>
                        <span style={{ display:'block', fontWeight:700, fontSize:13.5 }}>{t(L('واتساپ', 'WhatsApp', 'واتساب'), lang)}</span>
                        <span style={{ fontSize:12, color:'var(--t3)', direction:'ltr', display:'block' }}>+98 930 723 7387</span>
                      </span>
                    </a>
                    <a href="mailto:hello@wegopaars.ir"
                       style={{ display:'flex', alignItems:'center', gap:11, padding:'11px 12px', borderRadius:11, textDecoration:'none', color:'inherit', border:'1px solid var(--line)' }}>
                      <span style={{ color:'var(--acc)', flex:'none' }}>{ico(['M4 4h16v16H4z','M4 7l8 6 8-6'], 1.8, 20)}</span>
                      <span style={{ fontSize:13, direction:'ltr' }}>hello@wegopaars.ir</span>
                    </a>
                  </Card>
                  <Card pad="20px 22px">
                    <h4 style={{ fontSize:14, fontWeight:800, margin:'0 0 12px' }}>{t(L('شبکه‌های اجتماعی', 'Social media', 'وسائل التواصل'), lang)}</h4>
                    <div style={{ display:'flex', gap:9, flexWrap:'wrap' }}>
                      {[['تلگرام','Telegram','تلغرام','https://t.me/wegopaars',['M22 2 11 13','M22 2l-7 20-4-9-9-4 20-7z']],
                        ['اینستاگرام','Instagram','إنستغرام','https://instagram.com/wegopaars',['M4 4h16v16H4z','M16 11.4A4 4 0 1 1 12.6 8','M17.5 6.5h.01']]].map(([f,e,a,href,ic2]) => (
                        <a key={href} href={href} target="_blank" rel="noopener"
                           style={{ display:'flex', alignItems:'center', gap:7, padding:'9px 14px', borderRadius:'var(--pill)', border:'1px solid var(--line)', textDecoration:'none', color:'var(--t2)', fontSize:12.5, fontWeight:700 }}>
                          {ico(ic2, 1.8, 16)}{t(L(f, e, a), lang)}
                        </a>
                      ))}
                    </div>
                  </Card>
                </aside>
              </div>

              {/* ── سؤالات متداول — مالک: «پایین‌ترش سؤالات متداول باشد» ── */}
              <section id="faq" style={{ marginTop: 44 }}>
                <h2 style={{ fontSize:21, fontWeight:900, margin:'0 0 18px' }}>{t(L('سؤالات متداول', 'Frequently asked questions', 'الأسئلة الشائعة'), lang)}</h2>
                <div style={{ display:'flex', flexDirection:'column', gap:10 }}>
                  {FAQ.map((f, i) => (
                    <Card key={i} pad={0} style={{ overflow:'hidden' }}>
                      <button onClick={() => setOpen(open === i ? -1 : i)}
                        style={{ display:'flex', alignItems:'center', justifyContent:'space-between', gap:12, width:'100%', padding:'16px 20px', border:0, background:'transparent', color:'var(--t1)', cursor:'pointer', fontFamily:'inherit', fontSize:14.5, fontWeight:700, textAlign:'start' }}>
                        {t(f.q, lang)}
                        <span style={{ flex:'none', color:'var(--acc)', transform: open === i ? 'rotate(180deg)' : 'none', transition:'transform .2s' }}>{ico(['M6 9l6 6 6-6'], 2, 18)}</span>
                      </button>
                      {open === i && (
                        <div style={{ padding:'0 20px 18px', color:'var(--t2)', fontSize:13.5, lineHeight:2.1 }}>{t(f.a, lang)}</div>
                      )}
                    </Card>
                  ))}
                </div>
              </section>
            </>
          );
        }}
      </WGP.PageShell>
    );
  };


  /* ─────────────── صفحهٔ «دربارهٔ ما» (about.html) ───────────────
     خواستهٔ مالک (۱۷ مرداد): «در صفحهٔ دربارهٔ ما روی خدمات خیلی بیشتر توضیح بده»
     و «خدماتِ ویزای سفر به ایران و راهکارهای دریافتش را هم [به عربی و انگلیسی]».

     ⚠️ **حدِ عمدی روی محتوایِ ویزا.** قوانینِ ویزای ایران از تابستانِ ۱۴۰۴ در
     نوسان بوده و منابعِ عمومی با هم اختلاف دارند. پس:
       · هیچ‌جا «تضمین» یا «قطعاً» نوشته نشده.
       · هر بند با «راستی‌آزمایی با سفارت» همراه است.
       · معافیتِ عراق برجسته شده چون **مخاطبِ اصلیِ سایت است** و ندانستنش یعنی
         مسافر بی‌دلیل دنبالِ ویزا می‌گردد.
     نوشتنِ اطلاعاتِ غلطِ ویزا برای مسافر هزینهٔ واقعی دارد — این محافظه‌کاری عمدی است. */
  const VISA_FREE = ['عراق', 'ترکیه', 'آذربایجان', 'ارمنستان', 'گرجستان', 'سوریه', 'عمان', 'مصر', 'چین', 'قزاقستان'];
  const VISA_FREE_EN = ['Iraq', 'Türkiye', 'Azerbaijan', 'Armenia', 'Georgia', 'Syria', 'Oman', 'Egypt', 'China', 'Kazakhstan'];
  const VISA_FREE_AR = ['العراق', 'تركيا', 'أذربيجان', 'أرمينيا', 'جورجيا', 'سوريا', 'عُمان', 'مصر', 'الصين', 'كازاخستان'];

  WGP.AboutPage = function AboutPage() {
    return (
      <WGP.PageShell crumbI18n={L('دربارهٔ ما', 'About us', 'من نحن')}>
        {({ lang, fa }) => (
          <>
            <SectionHeading align="start" tag={t(L('دربارهٔ ایران‌گرد', 'About WeGoPars', 'عن إيران‌غرد'), lang)}
              title={t(L('ایران را از دستِ خودِ مردمش ببین', 'See Iran through its own people', 'اكتشف إيران من خلال أهلها'), lang)}
              subtitle={t(L(
                'ایران‌گرد یک آژانس نیست. لایهٔ **کشف** است: کسب‌وکارهای خردِ محلی، صنعتگران، جاذبه‌ها و مراکزِ درمانی را به مسافر معرفی می‌کند و کارهای سختِ سفر را برایش هماهنگ می‌کند.',
                'WeGoPars is not a travel agency. It is a **discovery layer**: it introduces travellers to local small businesses, artisans, attractions and medical centres, and arranges the hard parts of the trip.',
                'إيران‌غرد ليست وكالة سفر، بل **طبقة اكتشاف**: تعرّف المسافر على الأعمال الصغيرة المحلية والحرفيين والمعالم والمراكز الطبية، وتنسّق له الجوانب الصعبة من الرحلة.',
              ), lang)} />

            {/* ── چه کاری برای تو می‌کنیم ── */}
            <section style={{ marginTop: 34 }}>
              <h2 style={{ fontSize: 21, fontWeight: 900, margin: '0 0 18px' }}>
                {t(L('چه کاری برایت انجام می‌دهیم', 'What we do for you', 'ماذا نفعل من أجلك'), lang)}
              </h2>
              <div className="wgp-grid4" style={{ display: 'grid', gap: 15 }}>
                {[
                  { i:['M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4zM3 6h18M16 10a4 4 0 0 1-8 0'],
                    ti:L('کسب‌وکارهای خرد','Small businesses','الأعمال الصغيرة'),
                    bo:L('غرفه‌های واقعیِ صنعتگران و تولیدکنندگانِ محلی در ۲۸ استان — با خریدِ امن در بسترِ باسلام.','Real shops of local artisans and producers across 28 provinces — with safe checkout on Basalam.','متاجر حقيقية لحرفيين ومنتجين محليين في ٢٨ محافظة — مع شراء آمن عبر باسلام.'),
                    h:'/custom/wegopars/vendors.html' },
                  { i:['M12 21s-7-5.2-7-11a7 7 0 0 1 14 0c0 5.8-7 11-7 11z','M12 10a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z'],
                    ti:L('جاذبه‌ها و مقصدها','Attractions & destinations','المعالم والوجهات'),
                    bo:L('بیش از ۳۰۰ جاذبه در ۳۱ استان، با نقشه، عکس و معرفی به سه زبان.','Over 300 attractions in 31 provinces, with maps, photos and descriptions in three languages.','أكثر من ٣٠٠ معلم في ٣١ محافظة، مع خرائط وصور ووصف بثلاث لغات.'),
                    h:'/custom/wegopars/map.html' },
                  { i:['M12 6v12M6 12h12'],
                    ti:L('گردشگریِ سلامت','Health tourism','السياحة العلاجية'),
                    bo:L('مراکزِ درمانیِ پذیرندهٔ بیمارِ بین‌المللی؛ هماهنگیِ وقت، اقامت و مترجم با ماست.','Centres that admit international patients; we arrange the appointment, stay and interpreter.','مراكز تستقبل المرضى الدوليين؛ ونحن نرتب الموعد والإقامة والمترجم.'),
                    h:'/custom/wegopars/health.html' },
                  { i:['M3 21h18','M5 21V10l7-5 7 5v11'],
                    ti:L('خدماتِ سفر','Travel services','خدمات السفر'),
                    bo:L('بیمه، سیم‌کارتِ ایرانی، کارتِ بانکیِ سفر و کیف‌پولِ ارزی — همان چیزهایی که مسافرِ خارجی به‌تنهایی سخت تهیه می‌کند.','Insurance, an Iranian SIM, a travel bank card and a currency wallet — the things a foreign traveller struggles to arrange alone.','التأمين وشريحة إيرانية وبطاقة سفر ومحفظة بالعملات — أمور يصعب على الزائر ترتيبها وحده.'),
                    h:'/custom/wegopars/services.html' },
                ].map((c, i) => (
                  <Card key={i} pad="20px 22px" hover style={{ display:'flex', flexDirection:'column' }}>
                    <span style={{ width:44, height:44, borderRadius:13, background:'var(--grad-brand)', display:'grid', placeItems:'center', color:'#fff', marginBottom:13 }}>{ico(c.i, 1.8, 22)}</span>
                    <h3 style={{ fontSize:15.5, fontWeight:800, margin:'0 0 8px' }}>{t(c.ti, lang)}</h3>
                    <p style={{ color:'var(--t2)', fontSize:13, lineHeight:1.95, margin:'0 0 14px' }}>{t(c.bo, lang)}</p>
                    <Button variant="surface" size="sm" href={c.h} style={{ marginTop:'auto' }}>{t(L('مشاهده','View','عرض'), lang)}</Button>
                  </Card>
                ))}
              </div>
            </section>

            {/* ── چطور پول جابه‌جا می‌شود ── */}
            <section style={{ marginTop: 42 }}>
              <h2 style={{ fontSize: 21, fontWeight: 900, margin: '0 0 8px' }}>
                {t(L('پرداخت در ایران چطور کار می‌کند', 'How paying in Iran works', 'كيف يعمل الدفع في إيران'), lang)}
              </h2>
              <p style={{ color:'var(--t2)', fontSize:14, lineHeight:2.1, margin:'0 0 18px', maxWidth:820 }}>
                {t(L(
                  'کارت‌های بین‌المللی (ویزا و مسترکارت) در ایران کار نمی‌کنند. این تنها مانعِ جدیِ مالیِ سفر به ایران است و راهکارش ساده است: کیف‌پولِ ایران‌گرد را با ارزِ خودت شارژ می‌کنی و داخلِ ایران با آن پرداخت می‌کنی — برای بیمه، درمان، اقامت، تور و خریدِ صنایع‌دستی.',
                  'International cards (Visa and Mastercard) do not work in Iran. This is the one real financial obstacle to visiting, and the fix is simple: top up your WeGoPars wallet in your own currency and spend it inside Iran — on insurance, treatment, stays, tours and handicrafts.',
                  'البطاقات الدولية (فيزا وماستركارد) لا تعمل في إيران. هذه هي العقبة المالية الحقيقية الوحيدة، والحل بسيط: اشحن محفظة إيران‌غرد بعملتك وأنفقها داخل إيران — للتأمين والعلاج والإقامة والجولات والحرف اليدوية.',
                ), lang)}
              </p>
              <Button variant="brand" href="/custom/wegopars/services.html">{t(L('جزئیاتِ کیف‌پول و ارز','Wallet & currency details','تفاصيل المحفظة والعملات'), lang)}</Button>
            </section>

            {/* ── ویزا ── */}
            <section style={{ marginTop: 42 }}>
              <h2 style={{ fontSize: 21, fontWeight: 900, margin: '0 0 8px' }}>
                {t(L('ویزای سفر به ایران', 'Visas for visiting Iran', 'تأشيرة السفر إلى إيران'), lang)}
              </h2>
              <p style={{ color:'var(--t3)', fontSize:13, margin:'0 0 20px' }}>
                {t(L(
                  'خلاصهٔ راهنما — نه مشاورهٔ حقوقی. قوانینِ ویزا تغییر می‌کند؛ پیش از سفر با سفارت یا کنسولگریِ ایران در کشورِ خودت راستی‌آزمایی کن.',
                  'A summary, not legal advice. Visa rules change; verify with the Iranian embassy or consulate in your country before you travel.',
                  'ملخّص إرشادي وليس استشارة قانونية. قواعد التأشيرة تتغير؛ تحقّق من السفارة أو القنصلية الإيرانية في بلدك قبل السفر.',
                ), lang)}
              </p>

              <Card pad="22px 24px" style={{ marginBottom:16, border:'1px solid color-mix(in srgb,var(--acc) 40%,transparent)', background:'color-mix(in srgb,var(--acc) 7%,transparent)' }}>
                <h3 style={{ fontSize:16.5, fontWeight:800, margin:'0 0 10px' }}>
                  {t(L('اگر پاسپورتِ عراقی داری، ویزا لازم نداری', 'Iraqi passport? No visa needed', 'جواز عراقي؟ لا تحتاج تأشيرة'), lang)}
                </h3>
                <p style={{ color:'var(--t2)', fontSize:13.5, lineHeight:2.05, margin:0 }}>
                  {t(L(
                    'شهروندانِ عراق برای سفرِ کوتاه به ایران (تا حدودِ ۳۰ روز) از ویزا معاف‌اند. همین برای زیارت، درمان و خرید کافی است. فقط پاسپورتِ معتبر لازم داری.',
                    'Iraqi citizens are exempt from a visa for short stays in Iran (around 30 days) — enough for pilgrimage, treatment and shopping. You only need a valid passport.',
                    'مواطنو العراق معفون من التأشيرة للإقامات القصيرة في إيران (نحو ٣٠ يوماً) — وهو كافٍ للزيارة والعلاج والتسوق. تحتاج فقط جواز سفر ساري المفعول.',
                  ), lang)}
                </p>
              </Card>

              <div style={{ display:'grid', gridTemplateColumns:'repeat(auto-fit,minmax(280px,1fr))', gap:15 }}>
                <Card pad="20px 22px">
                  <h4 style={{ fontSize:14.5, fontWeight:800, margin:'0 0 10px' }}>{t(L('کشورهای بدونِ نیاز به ویزا','Visa-free nationalities','جنسيات معفاة من التأشيرة'), lang)}</h4>
                  <div style={{ display:'flex', flexWrap:'wrap', gap:7 }}>
                    {(lang === 'fa' ? VISA_FREE : lang === 'ar' ? VISA_FREE_AR : VISA_FREE_EN).map((c) => (
                      <span key={c} style={{ padding:'6px 12px', borderRadius:'var(--pill)', border:'1px solid var(--line)', fontSize:12.5, color:'var(--t2)' }}>{c}</span>
                    ))}
                  </div>
                </Card>
                <Card pad="20px 22px">
                  <h4 style={{ fontSize:14.5, fontWeight:800, margin:'0 0 10px' }}>{t(L('ویزای فرودگاهی','Visa on arrival','تأشيرة عند الوصول'), lang)}</h4>
                  <p style={{ color:'var(--t2)', fontSize:13, lineHeight:2, margin:0 }}>
                    {t(L(
                      'بیشترِ ملیت‌ها می‌توانند در فرودگاه‌های اصلی ویزا بگیرند. چند ملیت مستثنا هستند و باید از پیش از سفارت اقدام کنند — فهرست تغییر می‌کند، پس حتماً بپرس.',
                      'Most nationalities can obtain a visa at major airports. A few are excluded and must apply at an embassy in advance — the list changes, so always check.',
                      'يمكن لمعظم الجنسيات الحصول على التأشيرة في المطارات الرئيسية. بعض الجنسيات مستثناة وعليها التقديم مسبقاً في السفارة — والقائمة تتغير، فتحقّق دائماً.',
                    ), lang)}
                  </p>
                </Card>
                <Card pad="20px 22px">
                  <h4 style={{ fontSize:14.5, fontWeight:800, margin:'0 0 10px' }}>{t(L('ویزای درمانی','Medical visa','تأشيرة علاجية'), lang)}</h4>
                  <p style={{ color:'var(--t2)', fontSize:13, lineHeight:2, margin:0 }}>
                    {t(L(
                      'برای درمان، پذیرشِ کتبیِ مرکزِ درمانی معمولاً لازم است. ایران‌گرد این نامه را از مرکزِ پذیرنده برایت هماهنگ می‌کند.',
                      'For treatment, a written admission letter from the medical centre is usually required. WeGoPars arranges that letter with the admitting centre.',
                      'للعلاج، عادةً ما تُطلب رسالة قبول من المركز الطبي. وإيران‌غرد ينسّق هذه الرسالة مع المركز المستقبِل.',
                    ), lang)}
                  </p>
                </Card>
                <Card pad="20px 22px">
                  <h4 style={{ fontSize:14.5, fontWeight:800, margin:'0 0 10px' }}>{t(L('بیمهٔ اجباریِ ورود','Mandatory entry insurance','تأمين الدخول الإلزامي'), lang)}</h4>
                  <p style={{ color:'var(--t2)', fontSize:13, lineHeight:2, margin:0 }}>
                    {t(L(
                      'اگر بیمهٔ معتبرِ مسافرتی نداشته باشی، در فرودگاه باید بخری. از قبل تهیه‌اش کن تا هم ارزان‌تر باشد هم معطل نشوی.',
                      'If you do not hold valid travel insurance, you must buy it at the airport. Arranging it beforehand is cheaper and faster.',
                      'إذا لم يكن لديك تأمين سفر ساري، عليك شراؤه في المطار. ترتيبه مسبقاً أرخص وأسرع.',
                    ), lang)}
                  </p>
                </Card>
              </div>

              <div style={{ display:'flex', gap:10, marginTop:20, flexWrap:'wrap' }}>
                <Button variant="brand" onClick={askSupport(t(L('ویزای سفر به ایران','Iran travel visa','تأشيرة السفر إلى إيران'), lang), lang)}>
                  {t(L('پرسشِ ویزا از پشتیبانی','Ask support about visas','اسأل الدعم عن التأشيرة'), lang)}
                </Button>
                <Button variant="surface" href="/custom/wegopars/contact.html">{t(L('تماس با ما','Contact us','اتصل بنا'), lang)}</Button>
              </div>
            </section>

            <WGP.AdSlot lang={lang} slot="adSlotAbout" />
          </>
        )}
      </WGP.PageShell>
    );
  };

})();
