.input-wrapper{position:relative;display:flex}.input-wrapper .input-icon{position:absolute;top:0;bottom:0;display:flex;align-items:center;pointer-events:none;transition:color .2s ease-in-out}.input-wrapper .input-icon--left{left:20px}.input-wrapper .input-icon--right{right:20px}.input{width:100%;height:50px;padding:8px 16px;border:1px solid #ececec;border-radius:0;color:#051926;font-family:var(--font-family-default,"Roboto Flex");font-size:1rem;font-weight:400;outline:none;transition:border-color .2s ease-in-out,color .2s ease-in-out}.input:disabled{background-color:#ececec;color:#9e9e9e;cursor:not-allowed}.input:disabled+.input-icon,.input:not(:hover,:focus)+.input-icon{color:#9e9e9e}.input--focused:not(:disabled,.input--error),.input:focus:not(:disabled,.input--error),.input:hover:not(:disabled,.input--error){border-color:#051926}.input::placeholder{color:#686868}.input--s{height:40px}.input--m{height:50px}.input--l{height:60px;font-size:1.25rem}.input--error{border-color:#ed3c11;color:#ed3c11}.input--rounded{border-radius:4px}.input--with-icon-left{padding-left:60px}.input--with-icon-right{padding-right:60px}.input--readonly{cursor:pointer}