import Information from "./information";
import Location from "./location";

function BookingPage({
  doctor,
  step,
  setStep,
  children,
  isFirst,
  disableSide,
}) {
  return (
    <div
      className="flex flex-col lg:flex-row justify-center gap-[12px] sm:gap-[16px] md:gap-[20px] lg:gap-[24px] padding-responsive
            items-stretch pt-[calc(12px_+_75px_+_32px)] sm:pt-[calc(21px_+_75px_+_45px)] md:pt-[calc(30px_+_75px_+_58px)] lg:pt-[calc(40px_+_75px_+_78px)]"
    >
      {isFirst ? (
        <Location disableSide={disableSide} doctor={doctor} />
      ) : (
        <Information
          disableSide={disableSide}
          doctor={doctor}
          step={step}
          setStep={setStep}
        />
      )}
      {children}
    </div>
  );
}

export default BookingPage;