// components/Footer.tsx
import { Facebook, Twitter, Instagram, Youtube } from "lucide-react";
import Image from "next/image";

export default function Footer() {
  return (
    <footer className="bg-black text-white py-10 w-full">
      <div className=" mx-auto flex flex-col items-center justify-between px-14">
        <div className="flex justify-center ">
          <Image
            src="/isukini.jpg"
            alt="Kritik Tajam Logo"
            width={1080}
            height={1000}
            className="object-contain ml-0 md:ml-10"
          />
        </div>

        <div className="w-full md:w-5/12">
          <p className="text-[#666666] mb-2 text-center text-sm font-serif">
            IsuKini.com adalah sebuah media online yang memiliki fokus utama
            pada pemberitaan dan pencerahan terkait berbagai isu sosial yang
            relevan. Dalam era informasi yang begitu cepat dan dinamis,
            IsuKini.com hadir sebagai sumber berita yang mendalam dan mendalam
            dalam menyoroti permasalahan sosial yang memengaruhi masyarakat.
          </p>
          <p className="text-[#666666] my-6 text-sm font-serif text-center">
            Contact us:{" "}
            <span className="text-[#795548]">contact@isukini.com</span>
          </p>
        </div>

        {/* Follow Us */}
        <div>
          <div className="flex space-x-4">
            <a
              href="#"
              className="bg-blue-700 w-10 h-10 flex items-center justify-center"
            >
              <Facebook size={20} />
            </a>
            <a
              href="#"
              className="bg-sky-500 w-10 h-10 flex items-center justify-center"
            >
              <Twitter size={20} />
            </a>
            <a
              href="#"
              className="bg-gradient-to-br from-yellow-500 via-pink-500 to-purple-600 w-10 h-10 flex items-center justify-center"
            >
              <Instagram size={20} />
            </a>
            <a
              href="#"
              className="bg-red-600 w-10 h-10 flex items-center justify-center"
            >
              <Youtube size={20} />
            </a>
          </div>
        </div>
      </div>

      <div className="text-center text-[#666666] text-sm mt-10 border-gray-800 pt-4">
        @2023 - isukini.com. All Right Reserved.{" "}
      </div>
    </footer>
  );
}