input[data-manual-time] {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  min-height: 50px;
  font-size: 16px;
  text-align: left;
  font-variant-numeric: tabular-nums;
  -webkit-appearance: none;
  appearance: none;
}

.manual-time-hint {
  display: block;
  margin-top: 5px;
  color: #667085;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: normal;
}

.manual-time-hint[hidden] { display: none !important; }

/* The hint adds a third row to time fields. Keep the neighbouring date field
   top-aligned instead of stretching its two rows across that extra height. */
.booking-page #booking-form .pickup-details > .form-grid > .field {
  align-self: start;
  align-content: start;
}

#booking-dialog #booking-dialog-form .booking-field-pair:has(input[data-manual-time]) {
  align-items: start;
}

#booking-dialog #booking-dialog-form .booking-field-pair:has(input[data-manual-time]) > label {
  align-self: start;
  justify-content: flex-start;
}

#booking-dialog #booking-dialog-form input[data-manual-time] {
  height: 50px;
  min-height: 50px;
  min-inline-size: 0;
  text-align: left;
  -webkit-appearance: none;
  appearance: none;
}
.manual-time-hint.is-error { color: #b42318 !important; }
