.datepicker-container {
  position: relative;
  z-index: 11;
  width: 0;
  height: 0;
}

.datepicker-container.on-right {
  left: calc(100% - 392px);
}

.datepicker-calendar-view, .datepicker-collapse-view {
  position: absolute;
  width: 392px;
  padding: 0 16px;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid #e2e2e2;
  border-radius: 4px;
  box-shadow: 0 2px 4px 0 rgba(119, 119, 119, 0.1), 0 4px 8px 0 rgba(119, 119, 119, 0.2);
}

.datepicker-calendar-view {
  height: 320px;
}

.datepicker-collapse-view {
  height: 244px;
}

.datepicker-header {
  display: flex;
  align-items: center;
  height: 52px;
  text-align: center;
}

.datepicker-header-title {
  flex-grow: 5;
  font-weight: 500;
  cursor: pointer;
}

.datepicker-previous-button {
  flex-grow: 1;
  padding-right: 16px;
  text-align: left;
}

.datepicker-previous-button .ic:hover {
  cursor: pointer;
}

.datepicker-next-button {
  flex-grow: 1;
  padding-left: 16px;
  text-align: right;
}

.datepicker-next-button .ic:hover {
  cursor: pointer;
}

.datepicker-row .datepicker-cell .datepicker-date-cell.current-date, .datepicker-row .datepicker-cell .datepicker-month-cell.current-month, .datepicker-row .datepicker-cell .datepicker-year-cell.current-year {
  border-radius: 100%;
  box-shadow: inset 0 0 0 1px #005fbf;
}

.datepicker-row .datepicker-cell .datepicker-date-cell.selected-date, .datepicker-row .datepicker-cell .datepicker-month-cell.selected-month, .datepicker-row .datepicker-cell .datepicker-year-cell.selected-year {
  color: #fff;
  background-color: #005fbf;
  border-radius: 100%;
}

.datepicker-row .datepicker-cell .datepicker-date-cell:hover, .datepicker-row .datepicker-cell .datepicker-month-cell:hover, .datepicker-row .datepicker-cell .datepicker-year-cell:hover {
  color: #212121;
  cursor: pointer;
  background-color: #f2f4f7;
  border-radius: 100%;
  box-shadow: none;
}

.datepicker-row {
  display: flex;
}

.datepicker-row .datepicker-cell {
  flex: 1 1 0;
  text-align: center;
}

.datepicker-row .datepicker-cell .datepicker-date-cell {
  width: 32px;
  height: 32px;
  margin: 2px auto;
  line-height: 32px;
}

.datepicker-row .datepicker-cell .datepicker-month-cell {
  width: 40px;
  height: 40px;
  margin: 0 auto;
  margin-bottom: 12px;
  line-height: 40px;
}

.datepicker-row .datepicker-cell .datepicker-year-cell {
  width: 48px;
  height: 48px;
  margin: 0 auto;
  margin-bottom: 4px;
  line-height: 48px;
}

.datepicker-day-container {
  display: flex;
  margin-bottom: 16px;
}

.datepicker-day-container .datepicker-day {
  flex: 1 1 0;
  color: #777;
  text-align: center;
}

.datepicker-shortcut-button {
  position: absolute;
  bottom: 16px;
  width: 360px;
  color: #777;
  text-align: center;
  cursor: pointer;
}

.datepicker-shortcut-button.disabled {
  color: #b4b4b4;
  cursor: not-allowed;
}
/*# sourceMappingURL=mekari-ui-date-picker.css.map */