/**
 * @fileoverview React component for CtaVideoPreview.jsx
 * 
 * @module pages.HomePage.CtaVideoPreview
 */

import React from "react";
import atividadesVideo from "./assets/atividades.mp4";

const CtaVideoPreview = () => {
  return (
    <section className="relative overflow-hidden">
      {/* Background com gradiente igual ao CtaPlayground */}
      <div
        className="absolute inset-0 h-full w-full -z-10"
        style={{
          background: "linear-gradient(135deg, #dbeafe 0%, #faf5ff 100%)",
        }}
      ></div>

      {/* Container principal */}
      <div className="w-full">
        <div className="w-full overflow-hidden">
          {/* Terminal de Vídeo */}
          <div className="flex flex-col justify-center text-sm min-w-0">
            <div className="overflow-hidden">
              <div className="relative flex-1 bg-white/50 bg-gray-50/50 backdrop-blur-lg shadow-2xl rounded-xl border border-gray-200">
                {/* Header do Terminal */}
                <div className="flex items-center justify-between p-3 border-b border-gray-200">
                  <div className="flex items-center gap-2 pl-2">
                    <div className="w-3 h-3 bg-red-500 rounded-full"></div>
                    <div className="w-3 h-3 bg-yellow-500 rounded-full"></div>
                    <div className="w-3 h-3 bg-green-500 rounded-full"></div>
                  </div>
                </div>

                {/* Conteúdo do Vídeo */}
                <div className="relative bg-gray-50 dark:bg-gray-900">
                  <video
                    autoPlay
                    loop
                    muted
                    playsInline
                    className="w-full h-96 object-cover"
                  >
                    <source src={atividadesVideo} type="video/mp4" />
                    Seu navegador não suporta a reprodução de vídeos.
                  </video>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
};

export default CtaVideoPreview;
