/* Bootstrap 5.3 Theme */

.daterangepicker {
  background-color: var(--bs-body-bg);
  border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
  border-radius: var(--bs-border-radius-sm);
}

.daterangepicker:before {
  border-bottom: 7px solid var(--bs-border-color);
}

.daterangepicker:after {
  border-bottom: 6px solid var(--bs-body-bg);
}

.daterangepicker .calendar-table {
  background-color: var(--bs-body-bg);
  border: none;
  color: var(--bs-body-color);
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
  color: var(--bs-emphasis-color);
  border: solid var(--bs-emphasis-color);
  border-width: 0 2px 2px 0;
}

.daterangepicker td.available:not(.in-range):hover,
.daterangepicker th.available:not(.in-range):hover {
  background-color: var(--bs-secondary-bg) !important;
  color: var(--bs-emphasis-color);
}

.daterangepicker td.off,
.daterangepicker td.off.end-date,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date {
  background-color: var(--bs-body-bg);
  color: rgba(var(--bs-body-color-rgb), 0.5);
}

.daterangepicker td.in-range {
  background-color: var(--bs-primary-bg-subtle);
  color: var(--bs-body-color);
}

.daterangepicker td.in-range:hover {
  background-color: var(--bs-primary-bg-subtle);
  color: var(--bs-emphasis-color);
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
  background-color: var(--bs-primary);
  color: var(--bs-white);
}

.daterangepicker .drp-buttons {
  border-top: var(--bs-border-width) var(--bs-border-style)
    var(--bs-border-color);
}

.daterangepicker .drp-selected {
  color: var(--bs-body-color);
}

.applyBtn {
  color: var(--bs-white);
  background-color: var(--bs-primary);
}

.applyBtn:hover {
  background-color: var(--bs-primary);
}

.cancelBtn {
  color: var(--bs-secondary-color);
  background-color: var(--bs-secondary-bg);
}

.cancelBtn:hover {
  background-color: var(--bs-secondary-bg);
}

.daterangepicker select.hourselect,
.daterangepicker select.minuteselect,
.daterangepicker select.secondsselect,
.daterangepicker select.ampmselect {
  background: var(--bs-secondary-bg);
  border-color: var(--bs-secondary-bg);
  color: var(--bs-secondary-color);
}