.flatpickr-calendar {
  border: 1px solid var(--color-brand-blue-100) !important;
  box-shadow: 0 4px 16px rgb(0 0 0 / 0.08) !important;
  font-family: inherit !important;
}

.flatpickr-calendar.arrowTop::before,
.flatpickr-calendar.arrowBottom::before {
  border-bottom-color: var(--color-brand-blue-100) !important;
}
.flatpickr-calendar.arrowTop::after {
  border-bottom-color: var(--color-brand-white) !important;
}
.flatpickr-calendar.arrowBottom::after {
  border-top-color: var(--color-brand-white) !important;
}

.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year {
  color: var(--color-brand-blue) !important;
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 1.26px;
  font-size: 16px;
}
.flatpickr-monthDropdown-months {
  margin-right: 8px !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  color: var(--color-brand-blue) !important;
  fill: var(--color-brand-blue) !important;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: var(--color-brand-yellow) !important;
}

.flatpickr-weekdays,
span.flatpickr-weekday {
  color: var(--color-brand-blue) !important;
  font-weight: 600 !important;
}

.flatpickr-day {
  color: var(--color-brand-blue) !important;
  border-radius: 9999px !important;
}

.flatpickr-day.today {
  border-color: var(--color-brand-yellow) !important;
}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  background: var(--color-brand-yellow) !important;
  border-color: var(--color-brand-yellow) !important;
  color: var(--color-brand-blue) !important;
}

.flatpickr-day:hover,
.flatpickr-day:focus {
  background: var(--color-brand-blue-100) !important;
  border-color: var(--color-brand-blue-100) !important;
  color: var(--color-brand-blue) !important;
}

.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange,
.flatpickr-day.endRange:hover {
  background: var(--color-brand-blue) !important;
  border-color: var(--color-brand-blue) !important;
  color: var(--color-brand-white) !important;
}

.flatpickr-day.inRange,
.flatpickr-day.inRange:hover {
  background: var(--color-brand-blue-100) !important;
  border-color: var(--color-brand-blue-100) !important;
  color: var(--color-brand-blue) !important;
  border-radius: 0 !important;
  box-shadow:
    -5px 0 0 var(--color-brand-blue-100),
    5px 0 0 var(--color-brand-blue-100) !important;
}

.flatpickr-day.startRange.endRange {
  border-radius: 9999px !important;
}
.flatpickr-day.startRange:not(.endRange) {
  border-radius: 9999px 0 0 9999px !important;
  box-shadow: 5px 0 0 var(--color-brand-blue-100) !important;
}
.flatpickr-day.endRange:not(.startRange) {
  border-radius: 0 9999px 9999px 0 !important;
  box-shadow: -5px 0 0 var(--color-brand-blue-100) !important;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: color-mix(
    in oklch,
    var(--color-brand-blue) 35%,
    transparent
  ) !important;
}