.token-autocomplete-container { display: block; flex-wrap: wrap; border: 1px solid #E6E6E6; background-color: #FFFFFF; } .token-autocomplete-container, .token-autocomplete-container * { box-sizing: border-box; } .token-autocomplete-container .token-autocomplete-input { display: block; line-height: 32px; margin: 4px 2px; padding: 0px 8px; } .token-autocomplete-container .token-autocomplete-input:empty::before { content: attr(data-placeholder); color: rgb(0,0,0,0.6); } .token-autocomplete-container .token-autocomplete-token { width: 100%; display: block; padding: 2px 8px; background: #ccc; } .token-autocomplete-container .token-autocomplete-token:hover { background-color: #ddd; } .token-autocomplete-container .token-autocomplete-token .token-autocomplete-token-delete { cursor: pointer; font-size: 24px; line-height: 16px; margin-left: 4px; pointer-events: auto; border-radius: 50%; height: 24px; width: 24px; display: inline-block; text-align: center; } .token-autocomplete-container .token-autocomplete-token .token-autocomplete-token-delete:hover { background-color: #e55858; } .token-autocomplete-container .token-autocomplete-suggestions { display: none; width: 100%; list-style-type: none; padding: 0px; margin: 0px; } .token-autocomplete-container .token-autocomplete-suggestions li { width: 100%; padding: 8px; cursor: pointer; } .token-autocomplete-container .token-autocomplete-suggestions li.token-autocomplete-suggestion-active { color: #747474; background-color: #fdfdfd; } .token-autocomplete-container .token-autocomplete-suggestions li.token-autocomplete-suggestion-highlighted { background-color: #95caec; } .token-autocomplete-container .token-autocomplete-suggestions li .token-autocomplete-suggestion-description { display:block; font-size: 0.7em; color: #808080; }