import NumberInput from "./NumberInput";
import TimePicker from "./TimePicker";

function SessionScheduleSettings() {
  return (
    <div className="text-white flex gap-4">
      <div className="bg-[#212121] rounded p-8 w-80 h-fit shadow space-y-8">
        <p className="text-2xl font-gilroy">Настройки расписания сеансов</p>
        <form className="space-y-4">
          <div className="flex gap-2">
            <div className="space-y-1">
              <p>Время начала:</p>
              <TimePicker />
            </div>
            <div>—</div>
            <div className="space-y-1">
              <p>Время конца:</p>
              <TimePicker />
            </div>
          </div>
          <div className="">
            <p>Длительность:</p>
            <NumberInput
              min={15}
              max={60}
              step={5}
              defaultValue={30}
              onChange={(value) => console.log(value)}
            />
          </div>
          <button type="submit" className="px-4 py-2 bg-gradient rounded">
            Сохранить
          </button>
        </form>
      </div>
      <div className="bg-[#212121] rounded p-4 w-80 h-fit shadow">preview</div>
    </div>
  );
}

export default SessionScheduleSettings;