Pege Builder widgets and woocommerce shortcodes – transparent buttons

Hello,
I managed to use woocommerce shortcodes inside pagebuilder widgets with this simple code:

add_filter('widget_text', 'do_shortcode');

in the function.php.

I have a button with a vertical gradient and a hover effect which works perfectly in every page of the site and also in the “shop” page of woocommerce. It shows perfectly even in IE but there is a graphic problem with Chrome.
If I put the shortcode of the “shop” page in visual editor widget, on Chrome, the button loses the gradient and turns TRANSPARENT (I can see the page background) but maintains the hover effect. This happens ONLY using CHROME and only if the shortcode is in a widget.
Any suggestion?

This is what Chrome inspector says:

element.style {
}
media="all"
.woocommerce #page-wrapper .button, .widget a.button {
  border-top: solid 1px #d2d2d2;
  border-left: solid 1px #c3c3c3;
  border-right: solid 1px #c3c3c3;
  border-bottom: solid 1px #9f9f9f;
  background: #404040;
  background: -moz-linear-gradient(top, #404040 0%, #8f8f8f 20%, #8f8f8f 50%, #8f8f8f 80%, #404040 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#404040), color-stop(20%,#8f8f8f), color-stop(50%,#8f8f8f), color-stop(80%,#8f8f8f), color-stop(100%,#404040));
  background: -webkit-linear-gradient(top, #404040 0%,#8f8f8f 20%,#8f8f8f 50%,#8f8f8f 80%,#404040 100%);
  background: -o-linear-gradient(top, #404040 0%,#8f8f8f 20%,#8f8f8f 50%,#8f8f8f 80%,#404040 100%);
  background: -ms-linear-gradient(top, #404040 0%,#8f8f8f 20%,#8f8f8f 50%,#8f8f8f 80%,#404040 100%);
  background: linear-gradient(to bottom, #404040 0%,#8f8f8f 20%,#8f8f8f 50%,#8f8f8f 80%,#404040 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#404040', endColorstr='#404040',GradientType=0 );
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.125), inset 0 1px 0 rgba(255, 255, 255, 0.5);
  -moz-box-shadow: 0 1px 1px rgba(0,0,0,0.125), inset 0 1px 0 rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 1px rgba(0,0,0,0.125), inset 0 1px 0 rgba(255, 255, 255, 0.5);
  width: auto;
  text-decoration: none;
  cursor: pointer;
  -webkit-appearance: button;
  line-height: 1;
  text-shadow: 2px 1px 0px rgba(0, 0, 0, 0.8);
}