import Image from "next/image";
import Link from "next/link";

const Footer = () => {
  const currentYear = new Date().getFullYear();

  return (
    <footer className="relative h-[125px] flex flex-col justify-center">
      <div className="absolute top-0 left-0 right-0 h-px">
        <div
          className="mx-auto w-[87.5%] h-[3px]"
          style={{
            background: "var(--color-2)",
          }}
        />
      </div>

      <div className="mx-8 flex flex-col md:flex-row justify-between items-center relative">
        <div className="mb-4 md:mb-0">
          <Link href="/">
            <Image
              src="/assets/images/logo_no_bg.png"
              alt="Logo"
              width={125}
              height={125}
              className="w-[100px] h-auto sm:w-[120px] lg:w-[125px]"
            />
          </Link>
        </div>

        <div className="text-white text-sm font-mono absolute top-[70%] md:static left-0 right-0 text-center md:text-right">
          {currentYear} Lan Codes All Rights Reserved
        </div>
      </div>
    </footer>
  );
};

export default Footer;