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

export default function GlaPurpose({ data }: any) {
  return (
    <div className="w-full max-w-7xl  mx-auto py-4">
      <div className="relative ">
        <div className="flex flex-col lg:flex-row items-center gap-10">
          {/* Images Section */}
          <div className="md:w-[40%]">
            <div className="bg-white rounded-2xl 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>
          {/* Content Section */}
          <div className="flex-1 space-y-6 pt-5 md:pt-0 md:relative">
            <div className="safe">
              <SafeHtmlRenderer htmlContent={data?.shortContent} />
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}