.datepicker-dropdown,
.bootstrap-datetimepicker-widget {
	z-index: 9999 !important;
}
.datepicker-dropdown {
  background-color: var(--bs-gray-200);
}
.datepicker-dropdown.datepicker-orient-bottom:before {
	bottom: -7px;
}
.datepicker-dropdown.datepicker-orient-bottom:after {
	bottom: -5px;
}
.datepicker .datepicker-switch:hover,
.datepicker .next:hover,
.datepicker .prev:hover,
.datepicker tfoot tr th:hover {
  background: var(--bs-primary);
  color: var(--bs-white);
  border-radius: 4px;
}
.datepicker table {
	border-collapse: collapse;
}
.datepicker table tbody {
  background-color: var(--bs-light);
}
.datepicker td, .datepicker th {
  width: 38px;
  height: 38px;
  border-radius: 0;
}
.datepicker table tr td.day:hover,
.datepicker table tr td.focused,
.datepicker table tr td span.focused,
.datepicker table tr td span:hover {
  background: var(--bs-primary);
  color: var(--bs-white);
  border-radius: 4px;
}
.datepicker table tr td.active.active,
.datepicker table tr td.active.highlighted.active,
.datepicker table tr td.active.highlighted:active,
.datepicker table tr td.active:active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled.active:hover,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active:active,
.datepicker table tr td span.active.active:hover,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td.active.active.focus,
.datepicker table tr td.active.active:focus,
.datepicker table tr td.active.active:hover,
.datepicker table tr td.active.highlighted.active.focus,
.datepicker table tr td.active.highlighted.active:focus,
.datepicker table tr td.active.highlighted.active:hover,
.datepicker table tr td.active.highlighted.focus:active,
.datepicker table tr td.active.highlighted:active:focus,
.datepicker table tr td.active.highlighted:active:hover,
.datepicker table tr td.active.focus:active,
.datepicker table tr td.active:active:focus,
.datepicker table tr td.active:active:hover,
.datepicker table tr td span.active.active.focus,
.datepicker table tr td span.active.active:focus,
.datepicker table tr td span.active.active:hover,
.datepicker table tr td span.active.disabled.active.focus,
.datepicker table tr td span.active.disabled.active:focus,
.datepicker table tr td span.active.disabled.active:hover,
.datepicker table tr td span.active.disabled.focus:active,
.datepicker table tr td span.active.disabled:active:focus,
.datepicker table tr td span.active.disabled:active:hover,
.datepicker table tr td span.active.disabled.active.focus:hover,
.datepicker table tr td span.active.disabled.active:hover:focus,
.datepicker table tr td span.active.disabled.active:hover:hover,
.datepicker table tr td span.active.disabled.focus:hover:active,
.datepicker table tr td span.active.disabled:hover:active:focus,
.datepicker table tr td span.active.disabled:hover:active:hover,
.datepicker table tr td span.active.focus:active,
.datepicker table tr td span.active:active:focus,
.datepicker table tr td span.active:active:hover,
.datepicker table tr td span.active.active.focus:hover,
.datepicker table tr td span.active.active:hover:focus,
.datepicker table tr td span.active.active:hover:hover,
.datepicker table tr td span.active.focus:hover:active,
.datepicker table tr td span.active:hover:active:focus,
.datepicker table tr td span.active:hover:active:hover {
  background-color: var(--bs-primary);
  border-radius: 4px;
}

.bootstrap-datetimepicker-widget table td {
	border-top: 0 none;
}
.bootstrap-datetimepicker-widget table th,
.bootstrap-datetimepicker-widget table td.day {
  height: 30px;
  line-height: 30px;
  width: 30px;
}

.bootstrap-datetimepicker-widget table td span:hover {
  background-color: var(--bs-primary);
  color: var(--bs-white);
  border-radius: 4px;
}