.flatpickr-calendar {
    font-family: system-ui, sans-serif;
    border-radius: 8px;
    box-shadow: 1px 0 0 #af82f1,-1px 0 0 #af82f1,0 1px 0 #af82f1,0 -1px 0 #af82f1,0 3px 13px rgba(0,0,0,0.08);
}

.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange {
    background: #af82f1;
    color: #fff;
}

.flatpickr-day.today {
    border-color: #ffac05;
}

    .flatpickr-day.today:hover, .flatpickr-day.today:focus {
        border-color: #ffac05;
        color: #444;
        background: #ffac05;
    }

.flatpickr-calendar {
    background: #444;
    color: #fff;
}

.flatpickr-day {
    color: #ccc;
}

.flatpickr-day.nextMonthDay, .flatpickr-day.prevMonthDay {
    color: #666;
    background: #444;
}

.flatpickr-current-month {
    color: #ccc;
}

span.flatpickr-weekday {
    color: rgba(230,230,230,0.54);
}

.flatpickr-day.selected, .flatpickr-day.nextMonthDay.selected, .flatpickr-day.prevMonthDay.selected {
    border-color: #af82f1;
    background: #af82f1;
    color: #fff;
}

.flatpickr-day:hover, .flatpickr-day.nextMonthDay:hover, .flatpickr-day.prevMonthDay:hover {
    background: #ffac05;
    color: #444;
    border-color: #ffac05;
}

.flatpickr-day.selected:hover {
    background: #ffac05;
    color: #444;
    border-color: #ffac05;
}

.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
    

    color: rgba(175, 130, 241,0.9);
    fill: rgba(175, 130, 241,0.9);
}

.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg {
    color: rgba(255, 219, 88,0.9);
    fill: rgba(255, 219, 88,0.9);
}