import { CornerDownLeft } from "lucide-react";

import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";

interface Contact19Props {
  className?: string;
}

const Contact19 = ({ className }: Contact19Props) => {
  return (
    <section dir="rtl" lang="fa" className={cn("py-32", className)}>
      <div className="container">
        <div className="mt-20 flex max-h-120 flex-col justify-between gap-15 md:gap-20 lg:flex-row">
          <div className="flex w-full max-w-md flex-col justify-between gap-30">
            <div className="relative w-fit">
              <h1 className="text-2xll leading-none font-semibold tracking-tight lg:text-2xll">
                با تیم فروش صحبت کنید
              </h1>
              <p className="mt-10 mb-5 text-foreground/50">
                برای دموی سامانه مدیریت ارتباط با مشتری، مهاجرت داده یا پلن سازمانی، تلفنی یا ایمیلی با ما هماهنگ کنید.
                                            </p>

              <Button variant="ghost" className="group gap-2">
                <CornerDownLeft className="size-4" />
                درخواست تماس فروش
                                            </Button>
            </div>

            <div className="space-y-2">
              <a
                href="tel:+982112345678"
                className="flex items-center gap-4 text-xl font-medium tracking-tighter hover:underline"
                dir="rtl"
              >
                ۲۱-۱۲۳۴۵۶۷۸
              </a>
              <a
                href="mailto:hi@ShadcnBlocks"
                className="flex items-center gap-4 text-xl font-medium tracking-tighter hover:underline"
                dir="rtl"
              >
                hi@نوافروش
              </a>
            </div>
          </div>
          <div className="top-0 end-0 flex h-screen w-full flex-col gap-2 lg:absolute lg:w-1/2">
            <img
              src="/block-media/shadcnblocks/block/guri4/img11.png"
              alt="فضای تیم فروش و موفقیت مشتری"
              className="pointer-events-none h-full w-full object-cover"
            />
          </div>
        </div>
      </div>
    </section>
  );
};

export { Contact19 };