Edit product search in top bar

Hello there,
I’m not 100% sure on how you would like it to appear… but I’ve prepared a CSS snippet to make the search field full-width.

#topbar .widget_woocommerce_product_search_widget {
    width: 100%;
}

#topbar .container {
    display: table;
    width: calc( 100vw - 15px);
    margin-left: 0;
}

#topbar .widget {
    display: table-cell;
    white-space: nowrap;
    vertical-align: middle;
    line-height: normal;
}

#topbar .widget_yith_proteo_social_icons a {
    margin-bottom: 0;
}

#topbar .widget_shopping_cart h2.widget-title{
    display: none;
}

#topbar .widget_woocommerce_product_search_widget .product-search-results .entry a span, .product-search-results .search-results .entry a span{
    color: var(--proteo-base_font_color, #404040);
}

#topbar .widget_woocommerce_product_search_widget td.product-info .wps_add_to_cart{float: right;margin-top: 15px;}

#topbar .widget_woocommerce_product_search_widget div.product-search-results {
    margin-right: 40px;
}

#topbar .widget_woocommerce_product_search_widget td.product-info > a {
    display: inline-block;
}

#topbar .widget_woocommerce_product_search_widget tr.entry.product:nth-child(even) {
    background: #EEEEEE;
}

Please let me know if it looks like your goal or if you would like to achieve something different.

I hope you will appreciate this

Hi Francesco,

Thank you very much for your help again, I am going to try and tell you how it works for me.

A hug!

Hi Francesco,

Thank you very much it worked well look: https://ibb.co/sHG06D3
During the week I will optimize it.

Thank you very much again for your help !!

You’re welcome! I’m happy to see your website going further.
If you’re happy with Proteo and our help, please help us with a nice review here on www.ads-software.com ??