.form-input{flex-direction:column;gap:6px;width:100%;display:flex}.form-input__wrapper{box-sizing:border-box;align-items:center;width:100%;display:flex;position:relative}.form-input__field{border:1px solid var(--grey-200);box-sizing:border-box;color:#111827;background-color:#fff;border-radius:8px;outline:none;width:100%;min-height:40px;padding:10px 12px;font-size:16px;transition:border-color .2s,box-shadow .2s}.form-input__field::placeholder{color:#9ca3af}.form-input__field:hover:not(:disabled){border-color:#9ca3af}.form-input__field:focus{border-color:var(--brand-500);box-shadow:0 0 0 2px #2563eb26}.form-input__field:disabled{color:#9ca3af;cursor:not-allowed;background-color:#f9fafb}.form-input__field.has-prefix{padding-left:40px}.form-input__field.has-suffix{padding-right:40px}.form-input__addon{color:#9ca3af;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:50%;transform:translateY(-50%)}.form-input__addon svg{display:block}.form-input__addon--prefix{pointer-events:none;left:12px}.form-input__addon--suffix{cursor:pointer;right:12px}.form-input__footer{justify-content:space-between;align-items:center;display:flex}.form-input__error{color:#ef4444;font-size:12px}.form-input__count{color:var(--grey);margin-left:auto;font-size:12px}.form-input__helper{color:#718096;font-size:13px}