.dropdown-container{position:relative;width:100%;max-width:300px}.dropdown-button{display:flex;justify-content:space-between;align-items:center;width:100%;padding:.75rem 1rem;background:white;border:1px solid #e2e8f0;border-radius:.375rem;font-size:1rem;cursor:pointer;transition:all .2s;text-align:left}.dropdown-button:hover{border-color:#cbd5e0}.dropdown-button:focus{outline:none;box-shadow:0 0 0 3px rgba(66,153,225,.5)}.dropdown-button.open{border-color:#3182ce;box-shadow:0 0 0 1px #3182ce}.selected-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#1a202c}.selected-text.placeholder{color:#a0aec0}.arrow-svg{width:1.25rem;height:1.25rem;fill:#4a5568;flex-shrink:0;margin-left:.5rem;transition:transform .2s}.arrow-svg.open{transform:rotate(180deg)}.dropdown-list{position:absolute;top:100%;left:0;right:0;margin-top:.25rem;padding:.5rem 0;background:white;border:1px solid #e2e8f0;border-radius:.375rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);list-style:none;z-index:50;max-height:15rem;overflow-y:auto;opacity:0;transform:translateY(-10px);pointer-events:none;transition:opacity .2s,transform .2s}.dropdown-list.open{opacity:1;transform:translateY(0);pointer-events:auto}.dropdown-item{padding:.5rem 1rem;cursor:pointer;background:transparent;color:#2d3748}.dropdown-item.highlighted,.dropdown-item:hover{background:#f7fafc}.dropdown-item[aria-selected=true]{background:#ebf8ff;color:#2b6cb0}