How to fix react-datepicker always moving to next line and pushing others to next line

I have a react component where I render input fields with react-datepicker. The problem is, the react-datepicker element is always moving to the next line instead of all fields being on the same line. Although the top div is declared as flex. If I remove the react-datepicker then the elements are aligned properly. As soon as datepicker added, the form loses styling.

<App /> component:

return (
<div className="container">
  <div className="app-wrapper">
    <div>
      <Form />
    </div>
  </div>
</div>

);

<Form /> component looks like below:

   return (
    <form onSubmit={onFormSubmit}>
      <input
        type="text"
        className="task-title"
      />
      <input
        type="text"
        className="task-description"
      />
      <DatePicker
        className="datePicker"
        selected={dueDate}
        onChange={onDueDateChange}
        name="Date"
        dateFormat="yyyy-MM-dd"
      />
      <button type="submit" className="button-add" />
    </form>
  );

CSS:

 .container {
  display: flex;
  background: linear-gradient(to right bottom, #82cbe1, #66acc8);
  width: 100%;
  min-height: 100vh;
  justify-content: center;
  align-items: center;
}

.app-wrapper {
  background-color: #94b2c4;
  min-width: 0;
  min-height: 0;
  padding: 30px;
  box-sizing: border-box;
  border-radius: 10px;
  box-shadow: 3px 6px 40px #000;
  margin-bottom: 10px;
}

.task-description {
  outline: none;
  width: 450px;
  padding: 15px;
  margin-right: 5px;
  font-size: 20px;
  color: #ccc;
  background-color: #000000;
  border: 1px solid #66acc8;
  border-radius: 10px;
}

.datePicker {
  outline: none;
  width: 140px;
  padding: 15px;
  margin-right: 5px;
  font-size: 20px;
  color: #ccc;
  background-color: #000000;
  border: 1px solid #66acc8;
  border-radius: 10px;
}

.task-title,
.task-description,
.datePicker,
.button-add {
  margin-bottom: 10px;
}

.button-add {
  width: 60px;
  padding: 15px 15px;
  font-size: 20px;
  border-radius: 10px;
  border: 0;
  background-color: #71def1;
  cursor: pointer;
}