I hope you are well today and thank you for your questions.

1) I need to change the search bar width to make it smaller, so that when the Ajax details box displays when hovering over a product it doesn’t go off the right side of the screen.

You can achieve this by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Admin Area -> Ivory Search -> Settings -> Settings

.site-header .product-extra-search form.is-search-form {
    max-width: 400px;
}

2) Is there a way to display a button or icon when a user starts typing a search term, to clear all the words or characters already written and close the search results box? This could be useful for mobile version.

Currently, the Ivory Search plugin does not provide this functionality but I will consider implementing it in the future version of the plugin.

Best regards,
Ivory Search Support

I hope you are well today and thank you for your question.

You can change its color by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Admin Area -> Ivory Search -> Settings -> Settings

.thsn-sticky-on .is-menu path.search-icon-path {
    fill: #134a56;
}

Best regards,
Ivory Search Support

I hope you are well today and thank you for your question.

Could you please share the page URL from your site where it is happening so that I can troubleshoot it?

Also, please tell me how to reproduce the issue on your website.

Best regards,
Ivory Search Support

Sure, I will notify you here.

I hope you are well today and thank you for your question.

Could you please share the page URL from your site where it is displaying so that I can help you?

Best regards,
Ivory Search Support