import { Avatar, AvatarImage } from "@/components/ui/avatar";
import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";

interface Testimonial15Props {
  className?: string;
}

const Testimonial15 = ({ className }: Testimonial15Props) => {
  return (
    <section
      dir="rtl"
      lang="fa"
      className={cn("mb-32 bg-muted pt-32 dark:bg-background", className)}
    >
      <div className="container">
        <div className="grid gap-20 lg:grid-cols-2 lg:gap-32">
          <div className="text-center lg:text-start">
            <h1 className="mb-4 text-3xl font-bold text-balance lg:text-xl">
              همین امروز قیف فروش یکپارچه را فعال کنید
            </h1>
            <p className="mb-8 text-muted-foreground">
              به شبکه‌ای از مدیران فروش، بازاریابی و عملیات درآمد بپیوندید تا
              بهترین شیوه‌های سامانه مدیریت ارتباط با مشتری، اتوماسیون کمپین و تبدیل لید را به اشتراک
              بگذارید و نتایج واقعی ببینید.
            </p>
            <Button className="mb-10 lg:mb-20">شروع کنید</Button>
            <p className="mb-7 text-xs text-muted-foreground uppercase">
              مورد اعتماد تیم‌های فروش پیشرو
            </p>
            <div className="flex flex-wrap items-center justify-center gap-10 lg:justify-start">
              <img
                src="/block-media/shadcnblocks/block/logos/shadcn-ui-wordmark.svg"
                alt="لوگوی ری یو آی"
                className="h-5 dark:invert"
              />
              <img
                src="/block-media/shadcnblocks/block/logos/supabase-wordmark.svg"
                alt="لوگوی پایگاه داده ابری"
                className="h-6 dark:hidden"
              />
              <img
                src="/block-media/shadcnblocks/block/logos/supabase-wordmark-dark.svg"
                alt="لوگوی پایگاه داده ابری"
                className="hidden h-6 dark:block"
              />
              <img
                src="/block-media/shadcnblocks/block/logos/tailwind-wordmark-light.svg"
                alt="لوگوی استایل‌دهی مدرن"
                className="h-4 dark:hidden"
              />
              <img
                src="/block-media/shadcnblocks/block/logos/tailwind-wordmark-dark.svg"
                alt="لوگوی استایل‌دهی مدرن"
                className="hidden h-4 dark:block"
              />
            </div>
          </div>
          <div className="flex flex-col gap-5">
            <div className="flex gap-5 rounded-xl bg-card p-6">
              <Avatar className="size-9 rounded-full ring-1 ring-input">
                <AvatarImage
                  src="/block-media/shadcnblocks/block/avatar-1.webp"
                  alt="نیلوفر حسینی"
                />
              </Avatar>
              <div>
                <p className="mb-1 text-sm font-medium">نیلوفر حسینی</p>
                <p className="text-xs text-muted-foreground">
                  با سامانه مدیریت ارتباط با مشتری یکپارچه، زمان پیگیری لیدها نصف شد و نرخ تبدیل تیم فروش
                  ما در یک فصل ۳۲٪ رشد کرد. گزارش‌های بلادرنگ برای کوچینگ فروش
                  حیاتی شده‌اند.
                </p>
              </div>
            </div>
            <div className="flex gap-5 rounded-xl border p-6">
              <Avatar className="size-9 rounded-full ring-1 ring-input">
                <AvatarImage
                  src="/block-media/shadcnblocks/block/avatar-2.webp"
                  alt="امیر محمدی"
                />
              </Avatar>
              <div>
                <p className="mb-1 text-sm font-medium">امیر محمدی</p>
                <p className="text-xs text-muted-foreground">
                  اتوماسیون بازاریابی ایمیل، فرم و وبینار را در یک جریان واحد
                  کرد. هر لید بدون تأخیر به نماینده مناسب می‌رسد و هیچ فرصت
                  گرمی از دست نمی‌رود.
                </p>
              </div>
            </div>
            <div className="flex gap-5 rounded-xl bg-card p-6">
              <Avatar className="size-9 rounded-full ring-1 ring-input">
                <AvatarImage
                  src="/block-media/shadcnblocks/block/avatar-3.webp"
                  alt="سارا احمدی"
                />
              </Avatar>
              <div>
                <p className="mb-1 text-sm font-medium">سارا احمدی</p>
                <p className="text-xs text-muted-foreground">
                  داشبورد قیف فروش، مراحل مذاکره تا قرارداد را شفاف کرد.
                  پیش‌بینی درآمد دقیق‌تر شد و جلسات هفته‌ای تیم فروش کوتاه‌تر و
                  نتیجه‌محورتر شده‌اند.
                </p>
              </div>
            </div>
            <div className="flex gap-5 rounded-t-xl border-x border-t px-5 pt-6 pb-1">
              <Avatar className="size-9 rounded-full ring-1 ring-input">
                <AvatarImage
                  src="/block-media/shadcnblocks/block/avatar-4.webp"
                  alt="علی رحمانی"
                />
              </Avatar>
              <div>
                <p className="mb-1 text-sm font-medium">علی رحمانی</p>
                <p className="text-xs text-muted-foreground">
                  یکپارچه‌سازی سامانه مدیریت ارتباط با مشتری با پشتیبانی مشتری، تیکت و فرصت فروش را
                  هم‌راستا کرد. نرخ تمدید قرارداد و رضایت حساب‌های کلیدی ما
                  هر دو رشد محسوس داشته‌اند.
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
};

export { Testimonial15 };