"use client";

import { Download } from "lucide-react";

interface DownloadCardProps {
  title: string;
  fileType?: string;
  fileSize: string;
  fileUrl: string;
}

export default function DownloadCard({
  title,
  fileType = "PDF",
  fileSize,
  fileUrl,
}: DownloadCardProps) {
  return (
    <a
      href={fileUrl}
      download
      className="min-h-40 h-full group relative w-full max-w-md border border-white/10  bg-[#171616b8] transition rounded-lg p-4 flex flex-col gap-4 items-start justify-between"
    >
      {/* Background glow effect */}
      <div className="absolute inset-0 bg-linear-to-t from-red-600/20 via-transparent to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500" />

      {/* Decorative corner accent */}
      <div className="absolute top-0 right-0 w-24 h-24 bg-linear-to-br from-red-500/20 to-transparent rounded-bl-full opacity-0 group-hover:opacity-00 transition-opacity duration-500" />
      {/* Top section */}
      <div className="flex justify-between items-start">
        <h3 className="text-xl font-unbounded font-bold group-hover:text-red-500 text-white leading-tight transition-colors duration-300">
          {title}
        </h3>

        <span className="text-sm font-medium text-white">{fileType}</span>
      </div>

      {/* Bottom section */}
      <div className="flex w-full justify-between items-center">
        <span className="text-sm text-gray-200">{fileSize}</span>

        <Download
          size={20}
          className="text-gray-600 transition group-hover:text-red-700 duration-300"
        />
      </div>
    </a>
  );
}