.hover-inp{width:clamp(0px,100%,450px);display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem;border:1px solid var(--border-color);border-radius:2rem;background-color:var(--sixty-percent);position:relative;z-index:1}.hover-inp.disabled{opacity:.7;cursor:not-allowed}.hover-inp.disabled input{pointer-events:none}.hover-inp .holder{display:flex;align-items:center;gap:.5rem;pointer-events:none;opacity:.7;transition:.2s ease;position:absolute;inset:0;right:1rem;z-index:3}.hover-inp input{flex:1 0 0;padding:1em;text-align:right;direction:ltr}.hover-inp.active .holder{opacity:0}.hover-inp:focus-within .holder{opacity:0}.hover-inp input{width:100%}.hover-inp .eye-icon{opacity:.7;padding:1rem}.hover-inp .reset-icon,.hover-inp .clear-icon{position:absolute;left:0;background-color:inherit;border-radius:inherit;z-index:2;height:100%;aspect-ratio:1;opacity:0;pointer-events:none;transition:.3s ease}.hover-inp .reset-icon svg,.hover-inp .clear-icon svg{transition:.7s transform ease}.hover-inp .reset-icon{color:var(--warning-color)}.hover-inp .reset-icon:hover svg{transform:rotate(-360deg)}.hover-inp .reset-icon.active{opacity:1;pointer-events:all}.hover-inp .clear-icon{color:var(--alert-error);transform:scale(0);opacity:1}.hover-inp .clear-icon.active{transform:scale(1);pointer-events:all}.hover-inp .clear-icon:hover svg{transform:scale(1.1)}