import BackIcon from "../icons/BackIcon";

type BackButtonProps = {
  onClick: () => void;
  className?: string;
  title?: string;
};

const BackButton = ({ title = "", onClick, className }: BackButtonProps) => {
  return (
    <button
      onClick={onClick}
      className={`flex items-center gap-1 py-[6px] pl-2 pr-4 bg-white rounded-full text-sm font-medium border border-[#C7BDBA] justify-center select-none hover:bg-secondary transition-all duration-200 ${
        title ? "w-fit" : "w-10"
      }  ${className ? className : ""}`}
    >
      <div className="w-5 h-5 flex items-center justify-center">
        <BackIcon className="w-[5px] h-[10px]" />
      </div>
      {title}
    </button>
  );
};

export default BackButton;