.SearchBox{position:relative;transition:all .4s ease;width:100%;border-radius:4px;height:35px;background-color:transparent}.SearchBox.withBackground{background-color:#f3eeffc4}.SearchBox.darkMode{background:linear-gradient(0deg,#181824,#181824),linear-gradient(0deg,#303148,#303148);border:1px solid #303148;box-shadow:0 2px 5px #0000001a;border-radius:8px}.SearchBox.darkMode input::placeholder{color:#fff;font-size:14px}.SearchBox.grayModeBorder{background-color:#f8f9fa}.SearchBox.grayModeBorder input{border:1px solid #DFE2E5!important}.SearchBox.rightSide input::placeholder{text-align:right}.SearchBox.rightSide .SearchBox__magnify{position:absolute;left:178px;top:50%}.SearchBox.rightSide:hover input::placeholder{opacity:0}.SearchBox.rightSide:hover .SearchBox__magnify{opacity:0!important}.SearchBox:hover,.SearchBox:hover input{transition:all .2s ease}.SearchBox:hover input::placeholder{color:#252525;transition:all .2s ease}.SearchBox:hover .SearchBox__magnify{color:#9872fe;transition:all .2s ease}.SearchBox input{background-color:transparent;border:1px solid transparent;border-radius:4px;height:35px;padding-left:38px;width:100%;transition:all .2s ease}.SearchBox input::placeholder{color:#9872fe;transition:all .2s ease}.SearchBox input:focus{transition:all .2s ease}.SearchBox input:hover{border-color:#9872fe80!important}.SearchBox__magnify{position:absolute;left:18px;top:50%;transform:translate(-50%,-50%);color:#9872fecc;transition:opacity .3s ease}.SearchBox__clear{position:absolute;right:5px;top:50%;transform:translate(-50%,-50%);color:#25252566;transition:all .3s ease;font-size:12px;color:#9872feb3;cursor:pointer}.SearchBox__clear:hover{color:#9872fee6;transition:all .3s ease}.SearchBox.grayMode input::placeholder{color:var(--textSuperLight);transition:all .2s ease}.SearchBox.grayMode .SearchBox__magnify{color:var(--textSuperLight)}.SearchBox.noBorder input:hover{border-color:transparent!important}.SearchBox.bordered{height:40px;background-color:var(--header-btn-BG);border:1px solid var(--header-btn-border);border-radius:10px;overflow:hidden}.SearchBox.bordered:hover,.SearchBox.bordered:focus-within{border-color:var(--primary)}.SearchBox.bordered input{height:100%;border:none;border-radius:inherit}.SearchBox.bordered input::placeholder{color:var(--textLighter)}.SearchBox.bordered .SearchBox__magnify{color:var(--primary)}.SearchBox__shortcut{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none}.SearchBox__shortcut span{display:flex;gap:4px}.light .SearchBox__shortcut-dark,.dark .SearchBox__shortcut-light{display:none!important}.light .SearchBox.darkMode{background:#fafafa;border:1px solid #EAEAEA;box-shadow:none}.light .SearchBox.darkMode input::placeholder{color:#8e8d8f}
