.flatpickr-calendar {
  background: $theme-bg;

  &.arrowTop {
    &::after {
      border-bottom-color: lighten($theme-bg-color, percentage($theme-bg-gradient-strength));
    }
  }

  &.showTimeInput.hasTime {
    .flatpickr-time {
      border-radius: 0 0 5px 5px;
    }
  }

  &.noCalendar {
    &::after {
      border-bottom-color: white;
    }

    &.showTimeInput.hasTime {
      .flatpickr-time {
        border-top: 0;
        border-radius: 5px;
      }
    }
  }
}

.flatpickr-month {
  color: rgba(white, 0.9);
  fill: rgba(white, 0.9);
}

span.flatpickr-weekday {
  color: rgba(white, 0.9);
}

.flatpickr-days,
.flatpickr-time {
  background: white;
}

.flatpickr-current-month {
  .numInputWrapper {
    span.arrowUp::after {
      border-bottom-color: rgba(white, 0.9);
    }

    span.arrowDown:after {
      border-top-color: rgba(white, 0.9);
    }
  }
}

.flatpickr-prev-month:hover svg,
.flatpickr-next-month:hover svg {
  fill: lighten($brand-primary, 15%);
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: $brand-primary;
  border-color: $brand-primary;
}

.flatpickr-day.selected.startRange + .endRange,
.flatpickr-day.startRange.startRange + .endRange,
.flatpickr-day.endRange.startRange + .endRange {
  box-shadow: -10px 0 0 $brand-primary;
}

.flatpickr-day.week.selected {
  box-shadow: -5px 0 0 $brand-primary, 5px 0 0 $brand-primary;
}