import { BASE_URL } from "@/Constant";
import Image from "next/image";

export default function CertificationValidation({ main, bottom }: any) {
  return (
    <div className="w-full px-4 py-2 pb-16">
      <div className="max-w-5xl mx-auto">
        <div className="mb-8">
          <h2 className="text-gray-800 text-xl mb-4">
            {main?.cb?.fullContent}
          </h2>
        </div>

        <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mt-8">
          {bottom?.cb?.map((card: any, i: any) => (
            <div
              key={i}
              className="bg-white hover:bg-btn-ob rounded-2xl overflow-hidden shadow-sm hover:shadow-md transition-shadow duration-300"
            >
              <div className="relative h-48 object-cover overflow-hidden">
                <Image
                  width={100}
                  height={100}
                  src={`${BASE_URL}${card?.gallaryImage}`}
                  alt={card?.gallaryImage}
                  className="w-full h-full object-cover"
                  unoptimized={true}
                />
              </div>
              <div className="p-3">
                <h3 className="text-center text-blue-900 font-medium">
                  {card?.postTitle}
                </h3>
              </div>
            </div>
          ))}
        </div>
      </div>
    </div>
  );
}