/* Clicking day / month / year (or hour / minute) opens the native picker.
   Chrome otherwise only opens it from the calendar icon. */
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="week"],
input[type="time"] {
  cursor: pointer;
  position: relative;
}

input[type="date"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit-fields-wrapper,
input[type="date"]::-webkit-datetime-edit-text,
input[type="date"]::-webkit-datetime-edit-year-field,
input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-day-field,
input[type="datetime-local"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper,
input[type="datetime-local"]::-webkit-datetime-edit-text,
input[type="datetime-local"]::-webkit-datetime-edit-year-field,
input[type="datetime-local"]::-webkit-datetime-edit-month-field,
input[type="datetime-local"]::-webkit-datetime-edit-day-field,
input[type="datetime-local"]::-webkit-datetime-edit-hour-field,
input[type="datetime-local"]::-webkit-datetime-edit-minute-field,
input[type="datetime-local"]::-webkit-datetime-edit-ampm-field,
input[type="time"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit-fields-wrapper,
input[type="time"]::-webkit-datetime-edit-text,
input[type="time"]::-webkit-datetime-edit-hour-field,
input[type="time"]::-webkit-datetime-edit-minute-field,
input[type="time"]::-webkit-datetime-edit-ampm-field,
input[type="month"]::-webkit-datetime-edit,
input[type="month"]::-webkit-datetime-edit-fields-wrapper,
input[type="month"]::-webkit-datetime-edit-text,
input[type="month"]::-webkit-datetime-edit-year-field,
input[type="month"]::-webkit-datetime-edit-month-field,
input[type="week"]::-webkit-datetime-edit,
input[type="week"]::-webkit-datetime-edit-fields-wrapper {
  pointer-events: none;
}

.mr-date-wrap{
  position:relative;
  display:block;
  width:100%;
}
.mr-date-wrap > input[type="date"]{width:100%}
.mr-date-face{
  position:absolute;
  left:.7rem;
  right:2rem;
  top:0;
  bottom:0;
  display:flex;
  align-items:center;
  pointer-events:none;
  font:inherit;
  color:inherit;
}
.mr-date-wrap > input.mr-date-mask{
  color:transparent;
  caret-color:transparent;
}
.mr-date-wrap > input.mr-date-mask::-webkit-datetime-edit,
.mr-date-wrap > input.mr-date-mask::-webkit-datetime-edit-fields-wrapper,
.mr-date-wrap > input.mr-date-mask::-webkit-datetime-edit-text,
.mr-date-wrap > input.mr-date-mask::-webkit-datetime-edit-year-field,
.mr-date-wrap > input.mr-date-mask::-webkit-datetime-edit-month-field,
.mr-date-wrap > input.mr-date-mask::-webkit-datetime-edit-day-field{
  color:transparent;
}

input[type="date"]:not(#date)::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator,
input[type="week"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  color: transparent;
  cursor: pointer;
  opacity: 0;
}
#date::-webkit-calendar-picker-indicator{
  display:none !important;
  position:static !important;
  width:0 !important;
  height:0 !important;
  pointer-events:none !important;
}