import { useTranslations } from "next-intl";
import { Send } from "lucide-react";
import { Button } from "@/components/ui/button";

export function SignalCTA() {
  const t = useTranslations("sections");

  return (
    <section className="relative z-10 px-6 py-16">
      <div className="mx-auto max-w-6xl">
        <div className="relative overflow-hidden rounded-xl border border-accent/20 bg-surface p-8 md:p-12">
          {/* Background glow */}
          <div className="pointer-events-none absolute -right-20 -top-20 h-64 w-64 rounded-full bg-accent/5 blur-3xl" />

          <div className="relative flex flex-col items-start justify-between gap-6 md:flex-row md:items-center">
            <div className="flex items-start gap-4">
              <div className="flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-accent-muted">
                <Send size={20} className="text-accent" />
              </div>
              <div>
                <h2 className="mb-1 text-xl font-bold text-text-primary">
                  {t("signal")}
                </h2>
                <p className="text-sm text-text-secondary">{t("signal_desc")}</p>
              </div>
            </div>

            <Button asChild size="lg" className="shrink-0">
              <a
                href="https://t.me/alitaghavi_channel"
                target="_blank"
                rel="noopener noreferrer"
              >
                <Send size={16} />
                {t("signal_cta")}
              </a>
            </Button>
          </div>
        </div>
      </div>
    </section>
  );
}
