import Link from "next/link";
import dynamic from "next/dynamic";
import classNames from "classnames";
import JsonLd from "@/components/JsonLd";
import { SITE, type Lang } from "@/lib/config";
import {
  generateOrganizationSchema,
  generateWebSiteSchema,
} from "@/lib/seo/structured-data";
import {
  CalendarCheck,
  CreditCard,
  Megaphone,
  FolderOpen,
  BarChart3,
  Plug,
  ShieldCheck,
} from "lucide-react";
import {
  MotionWrapper,
  StaggerContainer,
  StaggerItem,
  SectionDivider,
  MagneticButton,
} from "@/components/motion";

// Above-the-fold components - import directly for fast LCP
import HeroEnhanced from "@/components/HeroEnhanced";
import WhatsAppPower from "@/components/WhatsAppPower";

// Loading skeleton for dynamic components
const LoadingSkeleton = () => (
  <div className="h-64 animate-pulse bg-gray-100 dark:bg-slate-800 rounded-lg" />
);

// Lazy load heavy components for better performance (below-fold)
const AIVoiceAgentCTA = dynamic(
  () => import("@/components/AIVoiceAgentCTA_SDK"),
  {
    ssr: false,
    loading: LoadingSkeleton,
  },
);

// Dynamic import ALL below-fold components for faster initial page load
const AIAgentsShowcase = dynamic(
  () => import("@/components/AIAgentsShowcase"),
  {
    loading: LoadingSkeleton,
  },
);
const AnimatedStats = dynamic(() => import("@/components/AnimatedStats"), {
  loading: LoadingSkeleton,
});
const IndustrySolutions = dynamic(
  () => import("@/components/IndustrySolutions"),
  {
    loading: LoadingSkeleton,
  },
);
const InteractiveServices = dynamic(
  () => import("@/components/InteractiveServices"),
  {
    loading: LoadingSkeleton,
  },
);
const FeatureShowcase = dynamic(() => import("@/components/FeatureShowcase"), {
  loading: LoadingSkeleton,
});
const StatBand = dynamic(() => import("@/components/StatBand"), {
  loading: () => <div className="h-24 bg-brand-green animate-pulse" />,
});
const InlineEmailForm = dynamic(() => import("@/components/InlineEmailForm"), {
  loading: LoadingSkeleton,
});
const EarlyEmailCapture = dynamic(
  () => import("@/components/marketing/EarlyEmailCapture"),
  {
    ssr: false,
  },
);

export const revalidate = SITE.revalidateSeconds;

export default function Home({ params }: { params: { lang: Lang } }) {
  const { lang } = params;
  const isAr = lang === "ar";

  const opsPillars = [
    {
      icon: CalendarCheck,
      titleEn: "Front desk coverage",
      titleAr: "تغطية الاستقبال",
      copyEn:
        "Bilingual concierge replies within 10 seconds, qualifies cases, and books directly into your systems.",
      copyAr:
        "مستقبلون بالعربية والإنجليزية يردّون خلال <10 ثوانٍ، يحددون الخدمة والفرع ويثبّتون الموعد فوراً.",
    },
    {
      icon: CreditCard,
      titleEn: "Deposits & reminders",
      titleAr: "العربون والتذكيرات",
      copyEn:
        "Collect prepaid deposits over Mada, Apple Pay, or Sadad, then automate polite follow-ups and reschedules.",
      copyAr:
        "تحصيل عربونات عبر مدى وأبل باي وسداد مع تذكيرات مهذبة وخيارات إعادة جدولة فورية.",
    },
    {
      icon: Megaphone,
      titleEn: "Marketing without spam",
      titleAr: "تسويق بلا إزعاج",
      copyEn:
        "Launch approved WhatsApp campaigns with segmenting for VIP, dormant, or seasonal guests.",
      copyAr:
        "حملات واتساب معتمدة مع تقسيم للضيوف المميزين والعملاء الخاملين والمواسم المهمة.",
    },
  ];

  const stack = [
    {
      icon: FolderOpen,
      titleEn: "Unified inbox",
      titleAr: "صندوق موحد",
      copyEn:
        "Every branch, doctor, and service lives in one shared inbox with SLA timers.",
      copyAr: "كل فرع وطبيب وخدمة في صندوق واحد مع مؤقتات SLA للرؤية الكاملة.",
    },
    {
      icon: BarChart3,
      titleEn: "Owner dashboards",
      titleAr: "لوحات الملاك",
      copyEn:
        "Daily WhatsApp digest + weekly PDF showing revenue, conversion, and no-show deltas.",
      copyAr:
        "ملخص واتساب يومي وPDF أسبوعي يوضح الدخل والتحويل والتغير في عدم الحضور.",
    },
    {
      icon: Plug,
      titleEn: "Clinic integrations",
      titleAr: "تكامل العيادة",
      copyEn:
        "Tap, PayTabs, HyperPay, Google Calendar, Outlook, plus custom EMR bridges (coming Q2 2026).",
      copyAr:
        "تكامل مع Tap وPayTabs وHyperPay وتقويم Google وأوتلوك وروابط EMR خاصة (قريباً الربع الثاني 2026).",
    },
    {
      icon: ShieldCheck,
      titleEn: "Compliance baked-in",
      titleAr: "التزام مدمج",
      copyEn:
        "Official WhatsApp templates with audit trails, role-based access, and data residency in the GCC.",
      copyAr:
        "قوالب واتساب معتمدة مع سجلات تدقيق وصلاحيات حسب الدور واستضافة داخل الخليج.",
    },
  ];

  const workflow = [
    {
      stepEn: "Listen & audit",
      stepAr: "الاستماع والتدقيق",
      descEn:
        "Shadow your existing reception, catalogue services, tone, and clinic rules.",
      descAr:
        "مرافقة استقبالكم الحالي وتوثيق الخدمات والنبرة والقواعد الداخلية.",
    },
    {
      stepEn: "Template approval",
      stepAr: "اعتماد القوالب",
      descEn:
        "Draft bilingual replies, secure WhatsApp Commerce approvals, and connect payment rails.",
      descAr: "كتابة ردود ثنائية اللغة واعتمادها رسمياً وربط بوابات الدفع.",
    },
    {
      stepEn: "Pilot branch",
      stepAr: "فرع تجريبي",
      descEn:
        "Run a two-week pilot on one branch with daily check-ins and shared metrics.",
      descAr:
        "تشغيل تجربة لمدة أسبوعين على فرع واحد مع اجتماعات يومية ومؤشرات مشتركة.",
    },
    {
      stepEn: "Scale network",
      stepAr: "توسيع الشبكة",
      descEn:
        "Layer in more services and branches, automate more intents, and optimise deposits.",
      descAr:
        "إضافة فروع وخدمات جديدة مع أتمتة نوايا إضافية وتحسين قيمة العربون.",
    },
  ];

  const testimonials = [
    {
      quoteEn:
        "\u201CMawidi gave us real bilingual reception without hiring six extra coordinators. Deposits alone paid for the pilot in week one.\u201D",
      quoteAr:
        "\u201Cموعدي وفر لنا استقبال ثنائي اللغة دون توظيف ست موظفات إضافيات. العربونات وحدها غطت تكلفة التجربة في الأسبوع الأول.\u201D",
      nameEn: "Dr. Layla Al-Harbi",
      nameAr: "د. ليلى الحربي",
      roleEn: "Medical Director, Riyadh Aesthetics",
      roleAr: "المديرة الطبية، رياض أستيتيكس",
    },
    {
      quoteEn:
        "\u201COur Friday evening WhatsApps used to pile up. Now the Mawidi concierge clears them by midnight with polite follow-ups.\u201D",
      quoteAr:
        "\u201Cرسائل مساء الجمعة كانت تتكدس. الآن فريق موعدي ينهيها قبل منتصف الليل بمتابعة مهذبة.\u201D",
      nameEn: "Sarah Al-Kuwari",
      nameAr: "سارة الكواري",
      roleEn: "Operations Lead, Doha Laser Group",
      roleAr: "قائدة العمليات، مجموعة دوحة ليزر",
    },
  ];

  const assuranceList = [
    isAr
      ? "استضافة AWS (البحرين) مع تشفير في الراحة والحركة."
      : "Hosted on AWS Bahrain with encryption at rest and in transit.",
    isAr
      ? "تشغيل بشري + أتمتة لضمان نبرة إنسانية مع سرعة الرد."
      : "Human + automation blend to keep empathy while staying instant.",
    isAr
      ? "دعم عمليات خلال 7 أيام مع خط طوارئ لعيادات ما بعد الجراحة."
      : "7-day operations coverage with an escalation line for post-procedure care.",
  ];

  return (
    <div>
      <HeroEnhanced lang={lang} />
      <WhatsAppPower lang={lang} />
      <AIVoiceAgentCTA lang={lang} />
      <AIAgentsShowcase lang={lang} />
      <InteractiveServices lang={lang} />
      <AnimatedStats lang={lang} />
      <IndustrySolutions lang={lang} />
      <StatBand lang={lang} />
      <EarlyEmailCapture language={lang} variant="newsletter" />

      <SectionDivider
        variant="wave"
        colorClass="fill-white dark:fill-slate-900"
      />

      <section className="mx-auto max-w-6xl px-4 py-16">
        <MotionWrapper direction="up" blur>
          <div
            className={classNames(
              "flex flex-col gap-4 md:flex-row md:items-end md:justify-between",
              isAr ? "text-center md:text-right" : "text-left",
            )}
          >
            <div>
              <h2
                className={classNames(
                  "text-2xl font-bold text-brand-ink md:text-3xl dark:text-slate-100",
                  isAr ? "text-right" : "text-left",
                )}
              >
                {isAr
                  ? "نغطي دورة المواعيد من أول رسالة حتى التأكيد"
                  : "We cover the appointment journey end-to-end"}
              </h2>
              <p className="mt-2 text-neutral-600 dark:text-slate-300">
                {isAr
                  ? "خدمة استقبال خارجية تجمع بين أنظمة العيادة وفريقكم البشري لضمان حجوزات مدفوعة وانخفاض في عدم الحضور."
                  : "A managed reception layer that works with your team and systems to secure prepaid bookings and cut no-shows."}
              </p>
            </div>
            <Link
              href={`/${lang}/services`}
              className="inline-flex items-center justify-center rounded-lg border border-brand-green px-5 py-2.5 text-sm font-semibold text-brand-green transition-colors hover:bg-brand-green hover:text-white"
            >
              {isAr ? "استعرض باقات الخدمات" : "Explore service modules"}
            </Link>
          </div>
        </MotionWrapper>
        <StaggerContainer
          className={classNames(
            "mt-10 grid gap-6 md:grid-cols-3",
            isAr ? "text-right" : "text-left",
          )}
        >
          {opsPillars.map((item) => (
            <StaggerItem key={item.titleEn}>
              <div className="rounded-2xl border border-slate-100 bg-white p-6 shadow-sm transition-colors dark:border-slate-800 dark:bg-slate-900">
                <item.icon
                  className="h-8 w-8 text-brand-green"
                  strokeWidth={1.5}
                />
                <h3 className="mt-3 text-xl font-semibold text-brand-ink dark:text-slate-100">
                  {isAr ? item.titleAr : item.titleEn}
                </h3>
                <p className="mt-3 text-neutral-600 dark:text-slate-300">
                  {isAr ? item.copyAr : item.copyEn}
                </p>
              </div>
            </StaggerItem>
          ))}
        </StaggerContainer>
      </section>

      <FeatureShowcase lang={lang} />

      <section className="bg-slate-50 transition-colors dark:bg-slate-900">
        <div className="mx-auto max-w-6xl px-4 py-16">
          <MotionWrapper direction="up" blur>
            <h2 className="text-2xl font-bold text-brand-ink md:text-3xl dark:text-slate-100">
              {isAr
                ? "منصة تشغيل كاملة وليست روبوتاً مجرداً"
                : "A full operations stack\u2014not just a chatbot"}
            </h2>
          </MotionWrapper>
          <StaggerContainer className="mt-10 grid gap-6 md:grid-cols-2">
            {stack.map((block) => (
              <StaggerItem key={block.titleEn}>
                <div className="rounded-2xl border border-slate-100 bg-white p-6 shadow-sm transition-colors dark:border-slate-800 dark:bg-slate-900">
                  <block.icon
                    className="h-8 w-8 text-brand-green"
                    strokeWidth={1.5}
                  />
                  <h3 className="mt-4 text-xl font-semibold text-brand-ink dark:text-slate-100">
                    {isAr ? block.titleAr : block.titleEn}
                  </h3>
                  <p className="mt-3 text-neutral-600 dark:text-slate-300">
                    {isAr ? block.copyAr : block.copyEn}
                  </p>
                </div>
              </StaggerItem>
            ))}
          </StaggerContainer>
        </div>
      </section>

      <section className="mx-auto max-w-6xl px-4 py-16">
        <MotionWrapper direction="up" blur>
          <div className="max-w-3xl">
            <h2 className="text-2xl font-bold text-brand-ink md:text-3xl dark:text-slate-100">
              {isAr
                ? "طريقة عملنا خلال أول 30 يوماً"
                : "How we onboard you in the first 30 days"}
            </h2>
          </div>
        </MotionWrapper>
        <StaggerContainer
          staggerDelay={0.15}
          className="mt-10 grid gap-6 md:grid-cols-4"
        >
          {workflow.map((item, index) => (
            <StaggerItem key={item.stepEn}>
              <div className="relative rounded-2xl border border-slate-100 bg-white p-6 shadow-sm transition-colors dark:border-slate-800 dark:bg-slate-900">
                <span className="absolute -top-3 left-4 inline-flex h-8 w-8 items-center justify-center rounded-full bg-brand-green text-sm font-bold text-white">
                  {index + 1}
                </span>
                <h3 className="mt-4 text-lg font-semibold text-brand-ink dark:text-slate-100">
                  {isAr ? item.stepAr : item.stepEn}
                </h3>
                <p className="mt-3 text-sm leading-relaxed text-neutral-600 dark:text-slate-300">
                  {isAr ? item.descAr : item.descEn}
                </p>
              </div>
            </StaggerItem>
          ))}
        </StaggerContainer>
      </section>

      <SectionDivider variant="curve" colorClass="fill-brand-green" />

      <section className="bg-brand-green text-white">
        <div className="mx-auto grid max-w-6xl gap-10 px-4 py-16 md:grid-cols-[1.15fr_0.85fr]">
          <MotionWrapper direction="left">
            <h2 className="text-2xl md:text-3xl font-bold">
              {isAr
                ? "نتائج ملموسة منذ الأسبوع الأول"
                : "Proven impact within the first weeks"}
            </h2>
            <ul className="mt-6 space-y-3 text-base leading-relaxed">
              {[
                isAr
                  ? "انخفاض عدم الحضور بنسبة 38% بعد فرض عربونات مسبقة في جدة."
                  : "38% no-show reduction after deposits went live in Jeddah.",
                isAr
                  ? "زيادة معدل التحويل من استفسار إلى حجز مدفوع من 22% إلى 41% في دبي."
                  : "Conversion from enquiry to prepaid booking grew from 22% to 41% in Dubai.",
                isAr
                  ? "متوسط زمن الرد أقل من 9 ثوانٍ أثناء ذروة عطلة نهاية الأسبوع."
                  : "Average response under 9 seconds during weekend peak hours.",
              ].map((item) => (
                <li key={item} className="flex items-start gap-3">
                  <span className="mt-1">{"\u2713"}</span>
                  <span>{item}</span>
                </li>
              ))}
            </ul>
          </MotionWrapper>
          <MotionWrapper direction="right" delay={0.2}>
            <div className="space-y-6 rounded-3xl bg-white/10 p-6 backdrop-blur">
              {testimonials.map((item) => (
                <blockquote
                  key={item.quoteEn}
                  className="rounded-2xl bg-white/10 backdrop-blur-md border border-white/20 hover:bg-white/15 transition-colors p-5 text-sm leading-relaxed"
                >
                  <p>{isAr ? item.quoteAr : item.quoteEn}</p>
                  <footer className="mt-4 text-xs uppercase tracking-wide text-white/80">
                    {isAr
                      ? `${item.nameAr} \u2014 ${item.roleAr}`
                      : `${item.nameEn} \u2014 ${item.roleEn}`}
                  </footer>
                </blockquote>
              ))}
            </div>
          </MotionWrapper>
        </div>
      </section>

      <SectionDivider
        variant="curve"
        colorClass="fill-white dark:fill-slate-900"
        flip
      />

      <section className="mx-auto max-w-6xl px-4 py-16">
        <div className="grid gap-10 md:grid-cols-[1.15fr_0.85fr]">
          <MotionWrapper direction="left">
            <h2 className="text-2xl font-bold text-brand-ink md:text-3xl dark:text-slate-100">
              {isAr
                ? "هندسة أمان وتشغيل على مستوى المؤسسات"
                : "Enterprise-grade security and operations"}
            </h2>
            <p className="mt-3 text-neutral-600 dark:text-slate-300">
              {isAr
                ? "نلتزم بمعايير وزارة الصحة والهيئات التنظيمية في الخليج، ونعمل مع فرق الامتثال لديكم للتأكد من سلامة كل خطوة."
                : "We comply with GCC health regulators and partner with your compliance team to keep every interaction safe and auditable."}
            </p>
            <div className="mt-6 space-y-3 text-neutral-700 dark:text-slate-200">
              {assuranceList.map((line) => (
                <div key={line} className="flex items-start gap-3">
                  <span className="mt-1 h-2 w-2 rounded-full bg-brand-green" />
                  <span>{line}</span>
                </div>
              ))}
            </div>
          </MotionWrapper>
          <MotionWrapper direction="right" delay={0.2}>
            <div className="rounded-3xl border border-slate-100 bg-slate-50 p-6 shadow-sm transition-colors dark:border-slate-800 dark:bg-slate-900">
              <h3 className="text-lg font-semibold text-brand-ink dark:text-slate-100">
                {isAr
                  ? "دراسة حالة مختصرة — مركز ليزر في الرياض"
                  : "Case snapshot \u2014 Riyadh laser centre"}
              </h3>
              <dl className="mt-4 space-y-3 text-sm text-neutral-600 dark:text-slate-300">
                <div className="flex justify-between">
                  <dt>{isAr ? "الفروع المغطاة" : "Branches covered"}</dt>
                  <dd className="font-semibold text-brand-ink dark:text-slate-100">
                    4
                  </dd>
                </div>
                <div className="flex justify-between">
                  <dt>{isAr ? "انخفاض عدم الحضور" : "No-show drop"}</dt>
                  <dd className="font-semibold text-brand-ink dark:text-slate-100">
                    47%
                  </dd>
                </div>
                <div className="flex justify-between">
                  <dt>
                    {isAr
                      ? "العربون المحصّل خلال أول 30 يوم"
                      : "Deposits captured (30 days)"}
                  </dt>
                  <dd className="font-semibold text-brand-ink dark:text-slate-100">
                    SAR 126,000
                  </dd>
                </div>
                <div className="flex justify-between">
                  <dt>{isAr ? "رضا الفريق" : "Team satisfaction"}</dt>
                  <dd className="font-semibold text-brand-ink dark:text-slate-100">
                    9.1/10
                  </dd>
                </div>
              </dl>
              <p className="mt-6 text-sm text-neutral-500 dark:text-slate-400">
                {isAr
                  ? "تعاون بين فريق العمليات بموعدي ومديرة الفروع لضبط النبرة العربية وإدخال العروض الموسمية تلقائياً."
                  : "Joint taskforce between Mawidi ops and the branch lead aligned on Arabic tone and seasonal offer broadcasts."}
              </p>
            </div>
          </MotionWrapper>
        </div>
      </section>

      <section className="text-center space-y-6 py-12">
        <MotionWrapper direction="up" blur>
          <div className="inline-flex items-center gap-2 rounded-full bg-gradient-to-r from-brand-green/10 to-emerald-500/10 px-4 py-2">
            <span className="text-2xl">{"\uD83C\uDDF6\uD83C\uDDE6"}</span>
            <span className="text-sm font-semibold text-brand-green">
              {isAr ? "نعمل من قطر" : "Operating from Qatar"}
            </span>
          </div>
          <h2 className="text-3xl font-bold text-brand-ink dark:text-white md:text-4xl">
            {isAr
              ? "من قطر إلى جميع دول الخليج"
              : "From Qatar to All GCC Markets"}
          </h2>
          <p className="max-w-3xl mx-auto text-lg text-gray-600 dark:text-gray-300">
            {isAr
              ? "نعمل من مقرنا الرئيسي في الدوحة، قطر، لخدمة جميع دول مجلس التعاون الخليجي بحلول دفع ومواعيد متطورة تناسب احتياجات السوق المحلية"
              : "Operating from our headquarters in Doha, Qatar, we serve all GCC countries with advanced payment and appointment solutions tailored to local market needs"}
          </p>
        </MotionWrapper>
        <StaggerContainer className="flex flex-wrap justify-center gap-4 pt-4">
          {[
            "\uD83C\uDDF6\uD83C\uDDE6 Qatar",
            "\uD83C\uDDF8\uD83C\uDDE6 Saudi Arabia",
            "\uD83C\uDDE6\uD83C\uDDEA UAE",
            "\uD83C\uDDF0\uD83C\uDDFC Kuwait",
            "\uD83C\uDDE7\uD83C\uDDED Bahrain",
            "\uD83C\uDDF4\uD83C\uDDF2 Oman",
          ].map((country) => (
            <StaggerItem key={country}>
              <div className="px-4 py-2 rounded-lg bg-white dark:bg-slate-800 shadow-md">
                <span className="text-sm font-medium">{country}</span>
              </div>
            </StaggerItem>
          ))}
        </StaggerContainer>
      </section>

      <section
        className="bg-slate-100 transition-colors dark:bg-slate-900"
        id="book-demo"
      >
        <div className="mx-auto max-w-6xl px-4 py-16 space-y-10">
          <MotionWrapper direction="up">
            <div className="flex flex-col gap-6 md:flex-row md:items-center md:justify-between">
              <div>
                <h2 className="text-2xl font-bold text-brand-ink md:text-3xl dark:text-slate-100">
                  {isAr
                    ? "جاهزون لتجربة خلال أسبوعين مع طاقم استقبال متخصص؟"
                    : "Ready for a two-week pilot with a dedicated reception crew?"}
                </h2>
                <p className="mt-3 text-neutral-600 dark:text-slate-300">
                  {isAr
                    ? "سنغطي فرعاً واحداً أولاً، نوفر سكريبتات بالعربية والإنجليزية، ونشارك لوحة مؤشرات يومية."
                    : "We start with one branch, ship bilingual scripts, and share daily dashboards from day one."}
                </p>
              </div>
              <div className="flex flex-wrap gap-3">
                <MagneticButton as="div" glow>
                  <Link
                    href={`/${lang}/contact`}
                    className="rounded-lg bg-brand-green px-6 py-3 text-white hover:bg-brand-greenHover inline-block"
                  >
                    {isAr ? "احجز مكالمة تعريف" : "Book a discovery call"}
                  </Link>
                </MagneticButton>
                <MagneticButton as="div">
                  <Link
                    href={`/${lang}/pricing`}
                    className="rounded-lg border border-brand-green px-6 py-3 text-brand-green hover:bg-brand-green hover:text-white inline-block"
                  >
                    {isAr ? "اطلع على الأسعار" : "View pricing"}
                  </Link>
                </MagneticButton>
              </div>
            </div>
          </MotionWrapper>

          <InlineEmailForm lang={lang} context="homepage" />
        </div>
      </section>

      <JsonLd override data={generateOrganizationSchema()} />
      <JsonLd override data={generateWebSiteSchema()} />
      <JsonLd type="SoftwareApplication" />
      <JsonLd
        type="FAQPage"
        data={{
          mainEntity: [
            {
              "@type": "Question",
              name: isAr ? "ما هو موعدي؟" : "What is Mawidi?",
              acceptedAnswer: {
                "@type": "Answer",
                text: isAr
                  ? "موعدي هو نظام استقبال ذكي للعيادات يعمل عبر واتساب، يجمع بين الذكاء الاصطناعي والإشراف البشري لضمان حجز المواعيد وتحصيل العربون."
                  : "Mawidi is a GCC AI receptionist for clinics that automates WhatsApp booking, deposit collection, and patient follow-ups.",
              },
            },
            {
              "@type": "Question",
              name: isAr
                ? "كيف يساعد موعدي في تقليل عدم الحضور؟"
                : "How does Mawidi reduce no-shows?",
              acceptedAnswer: {
                "@type": "Answer",
                text: isAr
                  ? "يقوم موعدي بتحصيل عربون مقدم (مبلغ رمزي أو كامل) عبر روابط دفع آمنة، ويرسل تذكيرات واتساب تلقائية، مما يقلل نسبة عدم الحضور بمتوسط 38%."
                  : "Mawidi secures prepaid deposits via payment links and sends automated WhatsApp reminders, reducing clinic no-show rates by an average of 38%.",
              },
            },
            {
              "@type": "Question",
              name: isAr
                ? "هل يدعم موعدي اللهجات العربية؟"
                : "Does Mawidi support Arabic dialects?",
              acceptedAnswer: {
                "@type": "Answer",
                text: isAr
                  ? "نعم، تم تدريب موعدي خصيصاً على اللهجات الخليجية (السعودية، القطرية، الإماراتية) لضمان محادثة طبيعية مع المرضى."
                  : "Yes, Mawidi is specifically trained on GCC Arabic dialects (Saudi, Qatari, Emirati) to ensure natural, human-like conversations with patients.",
              },
            },
          ],
        }}
      />
    </div>
  );
}