import Image, { StaticImageData } from "next/image";

interface TeamMemberCardProps {
  avatar: StaticImageData;
  name: string;
  position: string;
}

const TeamMemberCard = ({ avatar, name, position }: TeamMemberCardProps) => {
  return (
    <div className="flex flex-col items-center gap-3">
      <div className="relative w-40 h-40 sm:w-48 sm:h-48 rounded-full border-2 overflow-hidden">
        <Image src={avatar} alt={name} className="object-cover" />
      </div>
      <div className="text-center">
        <p
          className={`font-mono text-sm ${
            position === "Founder" ? "text-white" : "text-[var(--color-7)]"
          }`}
        >
          {name}
        </p>
        {position !== "Founder" && (
          <p className="font-mono text-sm text-[var(--color-10)]">{position}</p>
        )}
      </div>
    </div>
  );
};

export default TeamMemberCard;