:root {
  --flatpickr-calendar-bg: #fff;
  --flatpickr-month-fg: #212a31;
  --flatpickr-today: var(--color-darkbrown);
  --flatpickr-hover-bg: var(--color-darkbrown);
  --flatpickr-hover-fg: #fff;
  --flatpickr-inrange-bg: var(--color-beige);
  --flatpickr-inrange-fg: var(--color-darkbrown);
  --flatpickr-range-fg: #fff;
  --flatpickr-range-bg: var(--color-darkbrown);
  --flatpickr-shadow-color: #e6e6e6;
  --flatpickr-shadow: 1px 0 0 var(--flatpickr-shadow-color),
    -1px 0 0 var(--flatpickr-shadow-color),
    0 1px 0 var(--flatpickr-shadow-color),
    0 -1px 0 var(--flatpickr-shadow-color), 0 3px 13px rgba(0, 0, 0, 0.08);
}

.flatpickr-calendar {
  background-color: var(--flatpickr-calendar-bg);
  box-shadow: var(--flatpickr-shadow);
}

.flatpickr-calendar:before {
  border-width: 6px;
  margin: 0 -6px;
}

.flatpickr-calendar.arrowTop:before {
  border-bottom-color: var(--flatpickr-shadow-color);
}

.flatpickr-calendar.arrowTop:after {
  border-bottom-color: var(--flatpickr-calendar-bg);
}

.flatpickr-months .flatpickr-month {
  color: var(--flatpickr-month-fg);
}

.flatpickr-current-month input.cur-year,
.flatpickr-current-month span.cur-month {
  font-weight: 400;
  color: var(--color-darkbrown);
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  display: block;
  color: var(--color-darkbrown);
}

.flatpickr-months .flatpickr-next-month:hover svg {
  fill: var(--color-secondary);
}

.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  background: var(--flatpickr-inrange-bg);
  border-color: var(--flatpickr-inrange-bg);
  color: var(--flatpickr-inrange-fg);
}

.flatpickr-day:focus {
  background: var(--flatpickr-hover-bg);
  border-color: var(--flatpickr-hover-bg);
  color: var(--flatpickr-hover-fg);
}

.flatpickr-day.inRange {
  box-shadow: -5px 0 0 var(--flatpickr-inrange-bg),
    5px 0 0 var(--flatpickr-inrange-bg);
}

.flatpickr-day.today {
  border-color: var(--flatpickr-today);
}

.flatpickr-day:hover,
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  background: var(--flatpickr-hover-bg);
  border-color: var(--flatpickr-hover-bg);
  color: var(--flatpickr-hover-fg);
}

.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: var(--flatpickr-range-bg);
  border-color: var(--flatpickr-range-bg);
  color: var(--flatpickr-range-fg);
}

.flatpickr-calendar.multiMonth
  .flatpickr-days
  .dayContainer:nth-child(n + 2)
  .flatpickr-day.inRange:nth-child(7n + 1) {
  box-shadow: -2px 0 0 var(--flatpickr-inrange-bg),
    5px 0 0 var(--flatpickr-inrange-bg);
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n + 1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n + 1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n + 1)) {
  box-shadow: -10px 0 0 var(--flatpickr-inrange-bg);
}

.flatpickr-calendar.multiMonth
  .flatpickr-days
  .dayContainer:nth-child(n + 1)
  .flatpickr-day.inRange:nth-child(7n + 7) {
  box-shadow: -5px 0 0 var(--flatpickr-inrange-bg) !important;
}

.flatpickr-current-month span.cur-month:hover {
  background: none;
}

/* fixes flatpickr .hidden */
.flatpickr-day.hidden {
  display: inline-block;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
  cursor: not-allowed;
  color: rgba(57, 57, 57, 0.5);
  background-color: rgba(57, 57, 57, 0.01);
  text-decoration: line-through;
}