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

function GlaMain({ data }: any) {
  return (
    <div className="pt-10">
      <div className=" text-center">
       <h2>{data?.postTitle}</h2>
      </div>
      <div className="">
        {/* Hero Section */}
        <div className="container mx-auto ">
          <div className="flex flex-col  md:flex-row items-center justify-between gap-10">
            {/* Text Content */}

              <div className="safe">
                <SafeHtmlRenderer htmlContent={data?.shortContent} />
              </div>
     

            {/* Image Grid */}
            <div className="md:w-[40%]">
                            <div className="bg-white rounded-2xl p-4 shadow-lg">
                              <div className="aspect-square rounded-lg overflow-hidden">
                                <Image
                                  width={100}
                                  height={100}
                                  unoptimized={true}
                                  src={`${BASE_URL}${data?.gallaryImage}`}
                                  alt="Digital transformation concept"
                                  className="w-full h-full object-cover"
                                />
                              </div>
                            </div>
                          </div>
          </div>
        </div>
      </div>
    </div>
  );
}

export default GlaMain;