[data-type="autocomplete"] {
position: relative;
z-index: 0;
display: block;
margin: 0 auto;
box-sizing: border-box;
}
[data-type="autocomplete"] * {
box-sizing: border-box;
}
[data-type="autocomplete"] > *{
z-index: 0;
}
[data-type="autocomplete"] .autocomplete-searching {
background-image: url(/img/searching.gif);
background-position: right center;
background-repeat: no-repeat;
}
[data-type="autocomplete"] input[id$="_acText"] {
width: 100%;
margin: 0;
}
[data-type="autocomplete"] input[id$="_acText"], [data-type="autocomplete"] [id$="_tokensList"] {
display: inline-block;
}
[data-type="autocomplete"] input[id$="_acText"][disabled] {
border-color: var(--disabled-border);
background-color: var(--disabled-background);
color: var(--disabled-text);
}
[data-autocomplete="results"] {
position: absolute;
right: 0;
left: 0;
z-index: 9;
display: none;
border: 1px solid Transparent;
border-color: var(--results-border);
background-color: var(--results-background);
}
[data-autocomplete="results"].autocomplete-results {
display: block;
}
[data-autocomplete="results"] > * {
position: relative;
z-index: 9;
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 0.1em 0.2em;
outline: none !important;
border: 1px solid Transparent !important;
background-color: Transparent !important;
color: var(--results-text) !important;
cursor: pointer;
}
[data-autocomplete="results"] > *.autocomplete-hover {
border-color: var(--results-border-hover) !important;
background-color: var(--results-background-hover) !important;
color: var(--results-text-hover) !important;
}
[data-type="autocomplete"] .autocomplete-token {
position: relative;
display: inline-block;
max-width: 100%;
margin: 0.1em 0.1em 0 0.1em;
padding: 0.2em 1.4em 0.2em 0.2em;
border: 1px solid Black;
border-color: var(--token-border);
border-radius: 0.2em;
background-color: inherit;
background-color: var(--token-background);
line-height: 1em;
color: inherit;
color: var(--token-text);
}
[data-type="autocomplete"] .autocomplete-token:hover {
border-color: var(--token-border-hover);
background-color: var(--token-background-hover);
color: var(--token-text-hover);
}
[data-type="autocomplete"] .autocomplete-remove {
position: absolute;
top: 0;
right: 0;
display: block;
width: 1.4em;
height: 1.4em;
outline: none;
text-indent: -99999px;
text-decoration: none;
color: var(--remove);
cursor: pointer;
}
[data-type="autocomplete"] .autocomplete-remove:hover {
color: var(--remove-hover);
}
[data-type="autocomplete"] .autocomplete-remove:before, [data-type="autocomplete"] .autocomplete-remove:after {
content: '';
display: block;
position: absolute;
top: 10%;
bottom: 10%;
right: 50%;
width: 15%;
margin-right: -7.5%;
border-radius: 0.05em;
background-color: currentColor;
}
[data-type="autocomplete"] .autocomplete-remove:before {
transform: rotate(-45deg);
}
[data-type="autocomplete"] .autocomplete-remove:after {
transform: rotate(45deg);
}
[data-type="autocomplete"] .autocomplete-toremove {
background-color: var(--remove-background);
}
[data-type="autocomplete"][disabled] .autocomplete-token {
padding-right: 0.2em;
}
[data-type="autocomplete"][disabled] .autocomplete-remove {
display: none;
}