import Image from "next/image";

export interface CardTeamProps {
  data: {
    name: string;
    role: string;
    img: string;
  };
}

export function CardTeam({ data }: CardTeamProps) {
  return (
    <div className="bg-white p-6 rounded-lg shadow-md">
      <Image
        src={data.img}
        alt={data.name}
        width={80}
        height={80}
        className="rounded-full object-cover mx-auto"
        style={{ width: "80px", height: "80px" }}
      />
      <h3 className="mt-4 text-lg font-medium text-gray-900">{data.name}</h3>
      <p className="text-gray-600">{data.role}</p>
      <button className="bg-slate-400 rounded-full p-2 font-semibold text-slate-50 text-xs">BIOGRAPHY</button>
    </div>
  );
}