import { useLanguage } from "@/contexts/language-context"
import { toEmbedUrl } from "@/lib/embedUrl";
import { Play } from "lucide-react"

export default function Video() {
  const {t} = useLanguage();
  return (
    <section className="py-20 md:py-32 px-4 sm:px-6 lg:px-8">
      <div className="max-w-4xl mx-auto">
        <div className="text-center mb-12">
          <h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4">{t.action.title}</h2>
          <p className="text-lg text-muted-foreground">{t.action.subtitle}</p>
        </div>

        {/* YouTube video bo‘limi */}
        <section className="flex justify-center mb-10">
          <div className="w-full max-w-3xl aspect-video">
            <iframe
              className="w-full h-full rounded-lg shadow-lg"
              src={toEmbedUrl(
                'https://youtu.be/jorvR31QgnA?si=fX_CjYwxfUwFZAgY',
              )}
              title="Pedagogik yangilanish video"
              frameBorder="0"
              allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
              allowFullScreen
            ></iframe>
          </div>
        </section>
      </div>
    </section>
  )
}