Hi @nianfireworks,
Sorry for such a late reply.
As you can enter HTML directly into “Content” option (i.e. directly in “WooCommerce > Settings > Amount Left for Free Shipping > Cart > Content”), you can use style
attribute, e.g.:
<div style="color: white; background-color: red; padding: 10px; display: block; margin-bottom: 5px; text-align: center; font-weight: bold;">%amount_left_for_free_shipping% left for free shipping</div>
Or more correct way – use class
attribute, e.g.:
<div class="amount-left-for-free-shipping">%amount_left_for_free_shipping% left for free shipping</div>
and then add custom CSS for that class (in “Customize > Additional CSS”), e.g.:
.amount-left-for-free-shipping {
color: white;
background-color: red;
padding: 10px;
display: block;
margin-bottom: 5px;
text-align: center;
font-weight: bold;
}
The exact CSS would depend on your requirements and your theme.
Hope that helps, please let me know if you have any questions. And again sorry for the late reply.