.component-parent-container{font-family:Inter,sans-serif}.fancy-bg{position:absolute;width:100%;inset:0;background:var(--input-bg-color);border-radius:30px;height:100%;z-index:-1;pointer-events:none;box-shadow:0 1px 4px rgba(0,0,0,.16)}label{width:100%;padding:.8em;height:40px;padding-inline:var(--inline-padding-of-input);display:flex;align-items:center}.close-btn,.search{position:absolute}.search{fill:var(--text-color);left:var(--inline-padding-of-input)}svg{width:17px;display:block}.close-btn{border:none;right:var(--inline-padding-of-input);box-sizing:border-box;display:flex;align-items:center;justify-content:center;color:#fff;padding:.1em;width:20px;height:20px;border-radius:50%;background:var(--active-color);opacity:0;visibility:hidden}.input{color:var(--input-text-color);width:100%;margin-inline:min(2em,calc(var(--inline-padding-of-input) + var(--gap)));background:none;border:none}.input:focus{outline:none}.input::-moz-placeholder{color:var(--text-color)}.input::placeholder{color:var(--text-color)}.input:focus~.fancy-bg{border:1px solid var(--active-color);background:var(--focus-input-bg-color)}.input:focus~.search{fill:var(--active-color)}.input:valid~.close-btn{opacity:1;visibility:visible}input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{-webkit-transition:"color 9999s ease-out, background-color 9999s ease-out";-webkit-transition-delay:9999s}@keyframes GradientAnimatedBgTurn{to{transform:rotate(1turn)}}