react-select-search-sm/dist/react-select-search-sm.css

React Select Search component that supports single and multiple selections.

.main-select-container{background:#fff;border:1px solid #ddd;border-radius:5px;position:relative;display:flex;justify-content:space-between;align-items:center}.right-tools{padding:5px;display:flex;align-items:center;justify-content:end;gap:5px}.down-arrow{transition:all .3s ease-in-out}.up-arrow{transform:rotate(180deg)}.close-div{cursor:pointer;margin-right:8px}.close{width:10px;opacity:.6}.selected-items{cursor:pointer;width:75%;padding:10px;display:flex;gap:5px;font-size:14px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ellipsis-text{max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.more-span{font-weight:700;font-size:12px;color:#3e66b0}.option-container{position:absolute;width:100%;background:#fff;box-shadow:2px 4px 6px #0005;border-radius:5px;border:1px solid #ddd;list-style:none;z-index:999}.drop-up{bottom:50px}.drop-down{top:50px}ul{padding:10px;max-height:160px;overflow:auto}li{font-size:12px;cursor:pointer;transition:all .3s ease-in-out;border-radius:5px}li:hover{background:#c7edea4f}li.active{background:#607d8b;color:#fff}label{cursor:pointer;padding:8px 10px;display:flex;align-items:center;gap:10px}.no-data-found{text-align:center;padding:10px}.search-container{padding:5px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #ddd3}.select-all-label{cursor:pointer;display:flex;align-items:center;gap:10px;padding:5px 5px 5px 16px;color:#3e66b0}input{accent-color:#3e66b0}.search-wrapper{width:60%;position:relative}.search-input{padding:7px 10px;border:none;box-shadow:1px 1px 5px #0003;border-radius:50px;width:100%;font-size:12px}.close-img{cursor:pointer;position:absolute;transition:all .3s ease-in-out;width:9px;top:7px;right:33px;opacity:.6;filter:drop-shadow(2px 2px 3px #0007)}.search-icon{position:absolute;top:4px;right:5px;width:19px;opacity:.6}.zoom-anim{animation:zoomAnim .3s linear;-webkit-animation:zoomAnim .3s linear}@keyframes zoomAnim{0%{transform:scale(.2)}to{transform:scale(1)}}