.birth-date-picker {
    position: relative;
    width: 100%;
}

.birth-date-picker__input {
    width: 100%;
    padding-right: 3.25rem !important;
}

.birth-date-picker__input.is-invalid {
    padding-right: 5.25rem !important;
    background-position: right 3.3rem center;
}

.birth-date-picker__button {
    position: absolute;
    top: 50%;
    right: .7rem;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    color: #7d1d27;
    background: #fff7e8;
    border: 1px solid rgba(125, 29, 39, .18);
    border-radius: .7rem;
    transform: translateY(-50%);
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.birth-date-picker__button:hover {
    color: #fff;
    background: #7d1d27;
    border-color: #7d1d27;
}

.birth-date-picker:has(.birth-date-picker__native:hover) .birth-date-picker__button {
    color: #fff;
    background: #7d1d27;
    border-color: #7d1d27;
}

.birth-date-picker__button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, .3);
}

.birth-date-picker__button svg {
    width: 1.1rem;
    height: 1.1rem;
    pointer-events: none;
}

.birth-date-picker__native {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    width: 3.7rem;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.birth-date-picker.is-invalid + .invalid-feedback,
.birth-date-picker:has(.is-invalid) + .invalid-feedback {
    display: block;
}

@media (prefers-reduced-motion: reduce) {
    .birth-date-picker__button {
        transition: none;
    }
}