.registration-slot-picker[data-placement="after_fields"] {
    margin-top: 1rem;
}

.registration-slot-picker .flatpickr-calendar {
    box-shadow: none;
    margin: 0 auto;
    max-width: 307px;
    width: 307px;
}

.registration-slot-picker .flatpickr-current-month input.cur-year,
.registration-slot-picker .flatpickr-monthDropdown-months {
    background: transparent !important;
    border: 0 !important;
    color: #393939 !important;
    padding: 0 !important;
    width: auto !important;
}

.registration-slot-picker .flatpickr-current-month input.cur-year {
    min-height: 0 !important;
}

.registration-slot-picker .text-muted {
    color: rgba(255, 255, 255, .72) !important;
}

.registration-slot-times {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: .75rem;
}

.registration-slot-time-toggle {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .55);
    color: #fff;
    min-height: 2.75rem;
}

.registration-slot-time-toggle:hover,
.registration-slot-time-toggle:focus {
    background: transparent;
    border-color: rgba(255, 255, 255, .55);
    box-shadow: none;
    color: #fff;
}

.registration-slot-time-toggle:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.registration-slot-time-toggle.active,
.registration-slot-time-toggle.active:hover,
.registration-slot-time-toggle.active:focus {
    background: var(--bs-primary, #0d6efd);
    border-color: var(--bs-primary, #0d6efd);
    color: #fff;
}

.srsvp-rsvp-v2 .registration-slot-picker {
    border-color: color-mix(in srgb, var(--srsvp-border) 76%, transparent) !important;
    color: var(--srsvp-text);
}

.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-calendar {
    font-size: 14px !important;
    line-height: 24px !important;
}

.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-current-month {
    font-size: 135% !important;
    height: 34px !important;
    line-height: inherit !important;
    padding: 7px 0 0 !important;
}

.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-current-month input.cur-year {
    box-shadow: none !important;
    font-size: inherit !important;
    line-height: inherit !important;
    min-height: 0 !important;
}

.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-monthDropdown-months,
.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-current-month input.cur-year {
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-weight: 300 !important;
    height: auto !important;
    line-height: inherit !important;
    margin: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
}

.srsvp-rsvp-v2 .registration-slot-picker .text-muted {
    color: color-mix(in srgb, var(--srsvp-text) 70%, transparent) !important;
}

.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-day.selected,
.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-day.selected:hover,
.srsvp-rsvp-v2 .registration-slot-picker .flatpickr-day.selected:focus {
    background: var(--srsvp-button-bg);
    border-color: var(--srsvp-button-bg);
    color: var(--srsvp-button-text);
}

.srsvp-rsvp-v2 .registration-slot-time-toggle,
.srsvp-rsvp-v2 .registration-slot-time-toggle:hover,
.srsvp-rsvp-v2 .registration-slot-time-toggle:focus {
    background: var(--srsvp-input-bg);
    border: var(--srsvp-field-border-width) var(--srsvp-field-border-style) var(--srsvp-border);
    border-radius: var(--srsvp-button-radius);
    color: #111827;
}

.srsvp-rsvp-v2 .registration-slot-time-toggle.active,
.srsvp-rsvp-v2 .registration-slot-time-toggle.active:hover,
.srsvp-rsvp-v2 .registration-slot-time-toggle.active:focus {
    background: var(--srsvp-button-bg);
    border-color: var(--srsvp-button-bg);
    color: var(--srsvp-button-text);
}