'use strict';

module.exports = ".react-datepicker {\n  font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',\n    sans-serif;\n  overflow: hidden;\n}\n\n.react-datepicker-wrapper,\n.react-datepicker__input-container {\n  display: block;\n}\n\n.react-datepicker__header:not(.react-datepicker__header--has-time-select) {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.react-datepicker__day:focus-within {\n  outline: 0;\n  box-shadow: none;\n}\n\n.react-datepicker__day-name {\n  border-radius: 0.25rem;\n\n  &:hover {\n    background: hsl(9, 76%, 82%);\n  }\n}\n\n.react-datepicker__input-container {\n  font-size: 1rem;\n  padding-left: 1rem;\n  padding-right: 1rem;\n  height: 2.5rem;\n  border-radius: 0.25rem;\n  border: 1px solid;\n  border-color: hsl(0, 0%, 80%);\n}\n\n.react-datepicker__input-container:focus-within {\n  z-index: 1;\n  border-color: #3182ce;\n  box-shadow: 0 0 0 1px #3182ce;\n\n  transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow,\n    transform;\n  transition-duration: 200ms;\n}\n\n.react-datepicker__input-container > input {\n  width: 100%;\n  height: 100%;\n  outline: 0;\n}\n\n.react-datepicker__week-number {\n  color: hsl(9, 76%, 72%);\n}\n\n.react-datepicker__navigation--previous {\n  border-right-color: hsl(9, 76%, 52%);\n\n  &:hover {\n    border-right-color: hsl(9, 76%, 72%);\n  }\n}\n\n.react-datepicker__navigation--next {\n  border-left-color: hsl(9, 76%, 52%);\n\n  &:hover {\n    border-left-color: hsl(9, 76%, 72%);\n  }\n}\n\n.react-datepicker__header {\n  border-radius: 0;\n  background: #f7fafc;\n}\n\n.react-datepicker,\n.react-datepicker__header,\n.react-datepicker__time-container {\n  border-color: #e2e8f0;\n}\n\n.react-datepicker__current-month,\n.react-datepicker-time__header,\n.react-datepicker-year-header {\n  font-size: inherit;\n  font-weight: 600;\n}\n\n.react-datepicker__time-container\n  .react-datepicker__time\n  .react-datepicker__time-box\n  ul.react-datepicker__time-list\n  li.react-datepicker__time-list-item {\n  margin: 0 1px 0 0;\n  height: auto;\n  padding: 7px 10px;\n\n  &:hover {\n    background: hsl(9, 76%, 82%);\n  }\n}\n\nli.react-datepicker__time-list-item .react-datepicker__time-list-item--selected {\n  &:hover {\n    background: hsl(9, 76%, 82%);\n  }\n}\n\n.react-datepicker__time-list-item .react-datepicker__time-list-item--selected:hover {\n  background: hsl(9, 76%, 82%) !important;\n}\n\n.react-datepicker__day--outside-month {\n  opacity: 35%;\n}\n\n/* .react-datepicker__navigation-icon--previous::before {\n  transform: rotate(-45deg);\n}\n\n.react-datepicker__navigation-icon--next::before {\n  transform: rotate(135deg);\n} */\n\n.react-datepicker__header--time {\n  height: 54.04px;\n  /* display: none; */\n}\n\n.react-datepicker__time-container\n  .react-datepicker__time\n  .react-datepicker__time-box\n  ul.react-datepicker__time-list {\n  height: 237px !important; /* Have to use !important because of react-datepicker overriding styles */\n}\n\n.react-datepicker__day:hover {\n  background: hsl(9, 76%, 82%);\n}\n\n.react-datepicker__day--selected,\n.react-datepicker__day--in-selecting-range,\n.react-datepicker__day--in-range,\n.react-datepicker__month-text--selected,\n.react-datepicker__month-text--in-selecting-range,\n.react-datepicker__month-text--in-range,\n.react-datepicker__time-container\n  .react-datepicker__time\n  .react-datepicker__time-box\n  ul.react-datepicker__time-list\n  li.react-datepicker__time-list-item--selected {\n  background: hsl(9, 76%, 52%);\n  font-weight: normal;\n\n  &:hover {\n    background: hsl(9, 76%, 82%);\n  }\n}\n\n.react-datepicker__day--keyboard-selected {\n  background: hsl(9, 76%, 82%);\n  font-weight: normal;\n\n  &:hover {\n    background: hsl(9, 76%, 82%);\n  }\n}\n\n.react-datepicker__children-container {\n  position: unset;\n  margin: 0;\n  padding-left: 0;\n  padding-right: 0;\n  width: 210.24px;\n}\n";
//# sourceMappingURL=custom-date-time-picker.css.cjs.map
