form {
  display: flex;
  flex-direction: column;
  text-align: center;
  margin: 40px auto 0 auto;
  width: 400px;
}

form label {
  text-align: left;
  margin-left: 5px;
  margin-bottom: 3px;
}

.autocomplete {
  display: flex;
  flex-direction: column;
}

.autocomplete ul {
  background-color: $secondary-bg-color-lighter;
  list-style: none;
  text-align: left;
  padding: 5px;
  margin-top: -15px;
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: 5px;
}

.autocomplete ul .selected {
  background-color: $secondary-color;
}

.autocomplete ul li {
  padding: 3px 5px;
  border-radius: 3px;
}

input,select {
  background-color: $secondary-bg-color-light;
  border: none;
  border-radius: 3px;
  padding: 5px 10px;
  font-size: 0.9em;
  color: $text-color;
  margin-bottom: 20px;
}

input[type=submit]:hover {
  background-color: $secondary-bg-color-lighter;
  cursor: pointer;
}

form .time {
  display: flex;
  gap: 6px;
}

form .time input {
  display: flex;
  width: 30px;
  text-align: center;
  -moz-appearance: textfield;
}

form .time input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}