import CarIcon from "../icons/CarIcon";

interface LocationPopupProps {
  title: string;
  travelTime: number;
  style?: React.CSSProperties;
}

function LocationPopup({ title, travelTime, style }: LocationPopupProps) {
  return (
    <div
      style={style}
      className="max-md:hidden 2xl:gap-y-[0.556vw] gap-y-2 flex flex-col items-center 2xl:px-[0.833vw] px-3 2xl:py-[0.694vw] py-2.5 2xl:rounded-[1.111vw] rounded-2xl bg-[#F7F6F3] shadow-[0px_4px_40px_0px_rgba(15,16,17,0.1),0px_2px_2px_0px_rgba(0,0,0,0.06)]"
    >
      <p className="text-s [font-family:Poppins] text-[#324D43]">{title}</p>
      <div className="flex items-center 2xl:gap-[0.556vw] gap-2">
        <div className="2xl:size-[1.111vw] size-4 text-[#A7A08E]">
          <CarIcon />
        </div>
        <p className="caption font-medium text-[#A7A08E]">{travelTime} min</p>
      </div>
    </div>
  );
}

export default LocationPopup;
