interface ResumeCourseModalProps {
  onContinue: () => void
  onStartOver: () => void
}

export default function ResumeCourseModal({
  onContinue,
  onStartOver,
}: ResumeCourseModalProps) {
  return (
    <div className="fixed inset-0 bg-black/60 flex items-center justify-center z-50">
      <div className="bg-white shadow-xl rounded-lg p-8 max-w-md w-full animate-fade-in">
        <h2 className="text-xl font-bold text-gray-800 mb-3 text-center">
          You have an unfinished course
        </h2>
        <p className="text-gray-600 mb-6 text-center">
          You didn't finish creating your previous course.
          <br />
          What would you like to do?
        </p>
        <div className="flex flex-col gap-4">
          <button
            onClick={onContinue}
            className="w-full bg-blue-600 hover:bg-blue-700 text-white py-2 rounded-md font-semibold transition cursor-pointer"
          >
            Continue previous course
          </button>
          <button
            onClick={onStartOver}
            className="w-full border border-blue-600 text-blue-700 py-2 rounded-md font-semibold hover:bg-blue-50 transition cursor-pointer"
          >
            Erase previous answers and start a new course
          </button>
        </div>
      </div>
    </div>
  )
}
