.fancy-bg{background:var(--input-bg-color);z-index:-1;pointer-events:none;border-radius:30px;width:100%;height:100%;position:absolute;inset:0;box-shadow:0 1px 4px #00000029}label{width:100%;height:40px;padding:.8em;padding-inline:var(--inline-padding-of-input);align-items:center;display:flex}.search,.close-btn{position:absolute}.search{fill:var(--text-color);left:var(--inline-padding-of-input)}svg{width:17px;display:block}.close-btn{right:var(--inline-padding-of-input);box-sizing:border-box;color:#fff;background:var(--active-color);opacity:0;visibility:hidden;border:none;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;padding:.1em;display:flex}.input{color:var(--input-text-color);width:100%;margin-inline:min(2em, calc(var(--inline-padding-of-input) + var(--gap)));background:0 0;border:none}.input:focus{outline:none}.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{-webkit-transition:"color 9999s ease-out, background-color 9999s ease-out";-webkit-transition-delay:9999s}input:-webkit-autofill:hover{-webkit-transition:"color 9999s ease-out, background-color 9999s ease-out";-webkit-transition-delay:9999s}input:-webkit-autofill:focus{-webkit-transition:"color 9999s ease-out, background-color 9999s ease-out";-webkit-transition-delay:9999s}input:-webkit-autofill:active{-webkit-transition:"color 9999s ease-out, background-color 9999s ease-out";-webkit-transition-delay:9999s}@keyframes GradientAnimatedBgTurn{to{transform:rotate(1turn)}}