.glow-web-date-time-picker {
  width: 100%;
  color: var(--glow-picker-text);
}

.glow-web-date-time-picker.is-disabled {
  opacity: .72;
}

.glow-web-date-time-picker .react-date-picker, .glow-web-date-time-picker .react-datetime-picker, .glow-web-date-time-picker .react-time-picker {
  width: 100%;
  color: var(--glow-picker-text);
  font-family: inherit;
}

.glow-web-date-time-picker .react-date-picker__wrapper, .glow-web-date-time-picker .react-datetime-picker__wrapper, .glow-web-date-time-picker .react-time-picker__wrapper {
  border: 0;
  border-bottom: 1px solid var(--glow-picker-border);
  background: var(--glow-picker-surface);
  border-radius: 0;
  min-height: 56px;
  padding: 0 0 8px;
  transition: border-color .12s;
}

.glow-web-date-time-picker .react-date-picker:focus-within .react-date-picker__wrapper, .glow-web-date-time-picker .react-datetime-picker:focus-within .react-datetime-picker__wrapper, .glow-web-date-time-picker .react-time-picker:focus-within .react-time-picker__wrapper {
  border-bottom-color: var(--glow-picker-border-focus);
}

.glow-web-date-time-picker .react-date-picker__inputGroup, .glow-web-date-time-picker .react-datetime-picker__inputGroup, .glow-web-date-time-picker .react-time-picker__inputGroup {
  min-height: 47px;
  color: var(--glow-picker-text);
  align-items: center;
  font-family: inherit;
  font-size: 16px;
  display: flex;
}

.glow-web-date-time-picker input, .glow-web-date-time-picker select, .glow-web-date-time-picker button {
  color: var(--glow-picker-text);
  font: inherit;
}

.glow-web-date-time-picker .react-date-picker__inputGroup__input, .glow-web-date-time-picker .react-datetime-picker__inputGroup__input, .glow-web-date-time-picker .react-time-picker__inputGroup__input, .glow-web-date-time-picker .react-time-picker__inputGroup__amPm {
  background: none;
}

.glow-web-date-time-picker .react-date-picker__inputGroup__input::placeholder, .glow-web-date-time-picker .react-datetime-picker__inputGroup__input::placeholder, .glow-web-date-time-picker .react-time-picker__inputGroup__input::placeholder {
  color: var(--glow-picker-muted);
}

.glow-web-date-time-picker .react-date-picker__button, .glow-web-date-time-picker .react-datetime-picker__button, .glow-web-date-time-picker .react-time-picker__button {
  border-radius: 0;
  padding: 6px;
}

.glow-web-date-time-picker .react-date-picker__button:enabled:hover, .glow-web-date-time-picker .react-datetime-picker__button:enabled:hover, .glow-web-date-time-picker .react-time-picker__button:enabled:hover, .glow-web-date-time-picker .react-date-picker__button:enabled:focus, .glow-web-date-time-picker .react-datetime-picker__button:enabled:focus, .glow-web-date-time-picker .react-time-picker__button:enabled:focus {
  background-color: #0000;
}

.glow-web-date-time-picker .react-date-picker__button svg, .glow-web-date-time-picker .react-datetime-picker__button svg, .glow-web-date-time-picker .react-time-picker__button svg, .glow-web-date-time-picker .react-calendar svg, .glow-web-date-time-picker .react-clock svg {
  stroke: var(--glow-picker-text);
}

.glow-web-date-time-picker .react-calendar, .glow-web-date-time-picker .react-clock {
  border: 1px solid var(--glow-picker-outline);
  background: var(--glow-picker-surface-low);
  color: var(--glow-picker-text);
  box-shadow: 0 18px 48px #1408041f;
}

.glow-web-date-time-picker .react-calendar button, .glow-web-date-time-picker .react-clock button {
  border-radius: 0;
}

.glow-web-date-time-picker .react-calendar__tile:enabled:hover, .glow-web-date-time-picker .react-calendar__tile:enabled:focus, .glow-web-date-time-picker .react-calendar__navigation button:enabled:hover, .glow-web-date-time-picker .react-calendar__navigation button:enabled:focus, .glow-web-date-time-picker .react-clock__button:enabled:hover, .glow-web-date-time-picker .react-clock__button:enabled:focus {
  background: var(--glow-picker-surface-high);
}

.glow-web-date-time-picker .react-calendar__tile--active, .glow-web-date-time-picker .react-calendar__tile--hasActive {
  background: var(--glow-picker-primary);
}

.glow-web-date-time-picker .react-clock__face {
  background: var(--glow-picker-surface-high);
}

.glow-web-date-time-picker .react-clock__mark__body, .glow-web-date-time-picker .react-clock__hand__body, .glow-web-date-time-picker .react-clock__center, .glow-web-date-time-picker .react-clock__second-hand__body, .glow-web-date-time-picker .react-clock__second-hand__front, .glow-web-date-time-picker .react-clock__second-hand__back {
  background: var(--glow-picker-primary);
}

.glow-web-native-time-picker {
  width: 100%;
  position: relative;
}

.glow-web-native-time-picker__input {
  border: 0;
  border-bottom: 1px solid var(--glow-picker-border);
  background: var(--glow-picker-surface);
  width: 100%;
  min-height: 56px;
  color: var(--glow-picker-text);
  font: inherit;
  border-radius: 0;
  outline: 0;
  padding: 0 0 8px;
  font-size: 16px;
  transition: border-color .12s;
}

.glow-web-native-time-picker__input:focus {
  border-bottom-color: var(--glow-picker-border-focus);
}

.glow-web-native-time-picker__input::-webkit-calendar-picker-indicator {
  cursor: pointer;
  filter: none;
}

.glow-web-native-time-picker__hint {
  color: var(--glow-picker-muted);
  font-size: 12px;
  position: absolute;
  bottom: 10px;
  right: 0;
}
