
.dropdown .dropdown-select {
min-height: 1.94rem;
height: auto;
min-width: 15rem;
text-align: left;
white-space: normal;
flex: 1;
font-family: 'Open Sans', sans-serif;
font-size: .9rem;
-webkit-appearance: none;
background: #f9efdc url('data:image/svg+xml,<svg fill="%23193c82" viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg"><path d="M 100 100 L 300 100 L 200 250 z"/></svg>') no-repeat calc(100% - .5rem) center;
background-size: 1.1rem;
border: .1rem solid #e8d5b4;
border-radius: .1rem;
cursor: pointer;
outline: none;
padding: 0 1.8rem 0 .6rem;
}

.dropdown-menu {
position: absolute;
top: 3rem;
z-index: 100;
box-shadow: 0 0 0.3em #888;
padding: .6rem;
max-width: 100%;
min-height: 40px;
max-height: 312px;
overflow-y: auto;
width: 500px;
font-family: 'Open Sans', sans-serif;
font-size: .9rem;
background-color: #f9efdc;
border: .1rem solid #e8d5b4;
border-radius: .1rem;
}

.dropdown-menu .message {
font-style: italic;
color: #888;
user-select: none;
}

.dropdown-search-input {
display: flex;
justify-content: center;
}

.dropdown-search-input .search-field {
margin-bottom: .5rem;
border-radius: .1rem;
border: .1rem solid #e8d5b4;
font-family: 'Open Sans', sans-serif;
font-size: .9rem;
background: #fff url("icono--buscar.svg") .2rem/1rem no-repeat;
padding: .2rem 0 .2rem 1.5rem;
flex: 1;
}

.dropdown-search-input .search-field::placeholder {
font-size: .9rem;
}

.dropdown-content {
max-height: 120px;
overflow-y: auto;
font-family: 'Open Sans', sans-serif;
font-size: .9rem;
}

.dropdown-content-item {
cursor: pointer;
list-style: none;
user-select: none;
}

.dropdown-content-item p {
padding: .3rem;
}

.dropdown-content-item:hover {
background-color: #d4e0f9;
}

.dropdown-content-item.typed {
font-style: italic;
}

.dropdown-content-item.selected {
background-color: #9cb1f2;
color: #fff;
}

.dropdown-content-item.disabled {
background-color: transparent;
color: #b0b0b0;
}
