/**
 * Override Elementor .elementor *::before / *::after and button styles for
 * react-datepicker nav only. Must load after Elementor frontend (enqueued at priority 999).
 */
body .react-datepicker-popper .react-datepicker button.react-datepicker__navigation,
.react-datepicker-popper .react-datepicker button.react-datepicker__navigation {
  background: transparent !important;
  background-color: transparent !important;
  color: #fff !important;
}

/* Chevron is drawn with ::before borders; Elementor sets border-color on .elementor *::before */
body .react-datepicker-popper .react-datepicker button.react-datepicker__navigation .react-datepicker__navigation-icon::before,
.react-datepicker-popper .react-datepicker button.react-datepicker__navigation .react-datepicker__navigation-icon::before {
  border-color: #fff !important;
  border-top-color: #fff !important;
  border-right-color: #fff !important;
  background-color: transparent !important;
}

body .react-datepicker-popper .react-datepicker button.react-datepicker__navigation:hover .react-datepicker__navigation-icon::before,
.react-datepicker-popper .react-datepicker button.react-datepicker__navigation:hover .react-datepicker__navigation-icon::before {
  border-color: rgba(255, 255, 255, 0.85) !important;
  border-top-color: rgba(255, 255, 255, 0.85) !important;
  border-right-color: rgba(255, 255, 255, 0.85) !important;
}