.autocomplete div{
    width: 100%;
    border: 1px solid #BCCCDC;
    padding: 0em;
    border-radius: 0em 0em 0em 0.3em;
    height: auto;
    position: absolute;
    font: inherit;
    top: calc(1.5rem + (0.375rem * 2));
    left: 1px;
    background-color: white;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
    display: none;
    z-index: 9999999;
    animation-name: slidedown;
    animation-duration: 0.6s;    
}

@keyframes slidedown {
    from {opacity: 0; height: 0;}
    to {opacity: 1; height: auto;}
  }

.autocomplete div ul li {
    background-color: bisque;
    padding: 0.2em;
    cursor: pointer;
    pointer-events: all;
}

.autocomplete div ul li:nth-child(odd) {
    background-color: #F8FAFC;
}

.autocomplete div ul li:nth-child(even) {
    background-color: #D9EAFD;
}

.autocomplete div ul li:hover {
    background-color: grey;
}

.autocomplete div ul {
    list-style: none;
    padding: 0;
    margin: 0;
    pointer-events: none;
}

.close-btn {
    cursor: pointer;
}
.close-btn:hover {
    color:var(--bs-danger)
}
.close-btn i {
    pointer-events: none;
}