"use client";

import { Link } from "@/lib/router";
import { Button } from "@/components/ui/button";
import { Instagram, Linkedin, Send, Twitter } from "lucide-react";

export default function Footer() {
  const year = new Date().getFullYear();

  return (
    <footer
      className="border-t bg-background/60 backdrop-blur supports-[backdrop-filter]:bg-background/40"
      dir="rtl"
    >
      <div className="container mx-auto px-4 py-10">
        <div className="grid gap-8 md:grid-cols-2 lg:grid-cols-4">
          <div className="space-y-4">
            <div className="flex items-center gap-2">
              <img src="/favicon.ico" alt="لوگوی انجمن" className="h-9 w-9 rounded" />
              <span className="text-xl font-bold">انجمن علمی کامپیوتر گیلان</span>
            </div>
            <p className="text-sm text-muted-foreground leading-7">
              ترویج علم کامپیوتر، برگزاری رویدادهای تخصصی، تقویت شبکه‌ی دانشجویی و پیوند با صنعت.
            </p>
          </div>

          <div>
            <h4 className="mb-3 text-base font-semibold">لینک‌های مفید</h4>
            <ul className="space-y-2 text-sm">
              <li>
                <Link to="/" className="text-muted-foreground hover:text-foreground">
                  خانه
                </Link>
              </li>
              <li>
                <Link to="/events" className="text-muted-foreground hover:text-foreground">
                  رویدادها
                </Link>
              </li>
              <li>
                <Link to="/blog" className="text-muted-foreground hover:text-foreground">
                  بلاگ
                </Link>
              </li>
              <li>
                <Link to="/about" className="text-muted-foreground hover:text-foreground">
                  درباره‌ی انجمن
                </Link>
              </li>
            </ul>
          </div>

          <div>
            <h4 className="mb-3 text-base font-semibold">ارتباط با ما</h4>
            <ul className="space-y-2 text-sm text-muted-foreground">
              <li>ایمیل: info@east-guilan-ce.ir</li>
              <li>آدرس: دانشگاه گیلان، دانشکده‌ی فنی و مهندسی شرق گیلان</li>
            </ul>

            <div className="mt-4 flex items-center gap-2">
              <a
                href="https://Instagram.com/guilance.ir"
                target="_blank"
                rel="noreferrer"
                className="inline-flex"
              >
                <Button variant="outline" size="icon" className="h-9 w-9" aria-label="اینستاگرام">
                  <Instagram className="h-4 w-4" />
                </Button>
              </a>
              <a
                href="https://t.me/guilance"
                target="_blank"
                rel="noreferrer"
                className="inline-flex"
              >
                <Button variant="outline" size="icon" className="h-9 w-9" aria-label="تلگرام">
                  <Send className="h-4 w-4" />
                </Button>
              </a>
              <a
                href="https://www.linkedin.com/in/amiirkhl/"
                target="_blank"
                rel="noreferrer"
                className="inline-flex"
              >
                <Button variant="outline" size="icon" className="h-9 w-9" aria-label="لینکدین">
                  <Linkedin className="h-4 w-4" />
                </Button>
              </a>
              <a href="https://x.com" target="_blank" rel="noreferrer" className="inline-flex">
                <Button
                  variant="outline"
                  size="icon"
                  className="h-9 w-9"
                  aria-label="ایکس (توییتر)"
                >
                  <Twitter className="h-4 w-4" />
                </Button>
              </a>
            </div>
          </div>

          <div className="justify-self-end">
            <a
              href="https://trustseal.enamad.ir/?id=649977&Code=m0wWM1DFYqd4fLEnjyMU3o2pupfuqDVW"
              target="_blank"
              rel="noreferrer"
              referrerPolicy="origin"
            >
              <img
                src="/enamad.png"
                width="125"
                alt="نماد اعتماد الکترونیکی"
                referrerPolicy="origin"
                style={{ cursor: "pointer" }}
                data-code="m0wWM1DFYqd4fLEnjyMU3o2pupfuqDVW"
              />
            </a>
          </div>
        </div>

        <div className="my-8 h-px w-full bg-border" />

        <div className="flex gap-2 items-center justify-center text-sm text-muted-foreground md:flex-row">
          <div>© {year} انجمن علمی کامپیوتر گیلان - تمامی حقوق محفوظ است.</div>
        </div>
      </div>
    </footer>
  );
}