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

function Content({ doctor, step, setStep, children, isFirst, disableSide, selectedSlot, selectedDate, selectedLocation }) {
  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} selectedLocation={selectedLocation} />
      ) : (
        <Information
          disableSide={disableSide}
          doctor={doctor}
          step={step}
          setStep={setStep}
          selectedSlot={selectedSlot}
          selectedDate={selectedDate}
        />
      )}
      {children}
    </div>
  );
}

export default Content;