/* autocomplete */ input.autocomplete-loading { background-image:url(../libs/autocomplete/autocomplete.gif); background-position: left center; background-repeat:no-repeat; } ul.autocomplete ~ .btn-close { position: absolute; right: 1.5rem; margin-top: -1.5rem; display:none; } .autocomplete-open ~ button.btn-close { display: block; } ul.autocomplete { position: absolute; overflow: hidden; background-color: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-top:none; margin-top: -1px; margin: 0px; padding: 0px; list-style: none; color: var(--bs-body-color); display:none; z-index:1000; } ul.autocomplete li { display: block; padding: 0.3em; overflow: hidden; width: 100%; cursor:pointer; &:hover { background-color: var(--bs-primary); color: var(--bs-body-bg); } } ul.autocomplete li.selected { background-color: Highlight ; background-color: var(--bs-primary); color: var(--bs-body-bg); color: var(--bs-white); } input.autocomplete-list { border-radius: 5px 5px 0px 0px; } div.autocomplete-list { //box-shadow: -1px 1px 2px 1px rgba(var(--bs-body-color-rgb), 0.07) inset; //background: #fafafa; border-radius: 0px 0px 5px 5px; overflow:auto; min-height:150px; height:150px; resize: vertical; } .autocomplete-list > div:nth-child(2n) { //background: var(--bs-border-color); } .autocomplete-list > div { padding: 0.3rem 0.3rem 0.3rem 1rem; border-bottom:1px dashed var(--bs-border-color); display:flex; justify-content: space-between; align-items: center; .btn-close { vertical-align:middle; margin: 0.5rem; } } .tags-input { .tag { display:inline-block; font-size:0.75rem; padding:0 0.3rem; border:1px solid var(--bs-primary-bg-subtle); background-color: var(--bs-primary-bg-subtle); background-color: rgba(var(--bs-primary-rgb), 0.10); color: var(--bs-primary-text-emphasis); border-radius: 4px; margin:0.2rem; .remove-btn { color:var(--bs-link-color); } } input.form-control { box-shadow: none; } }