いいねボタン（form_withのf.submit）にfont awesomeをつけたいのですが、余計な背景がついてしまいます。

Question

前提・実現したいこと

font awesomeについてしまっているグレーの背景を取り除いて普通のアイコンにしたいです。
よくあるいいねボタンを作りたくて、こちらを参考に、form_withの送信ボタンにfont awesomeを使用してみました。
（form_withの情報が見当たりませんでした）

発生している問題・エラーメッセージ

該当のソースコード

<% if current_user.favorite?(micropost) %>
 <%= form_with(model: current_user.favorites.find_by(micropost_id: micropost.id), local: true, method: :delete) do |f| %>
  <%= hidden_field_tag :favorite_id, micropost.id %>
  <%= f.button :type => "submit", style: 'border-style: none;' do %>
   <i class="fas fa-heart"></i>
  <% end %>
 <% end %>
<% else %>
 <%= form_with(model: current_user.favorites.build, local: true) do |f| %>
  <%= hidden_field_tag :favorite_id, micropost.id %>
  <%= f.button :type => "submit", style: 'border-style: none;' do %>
   <i class="far fa-heart"></i>
  <% end %>
 <% end %>
<% end %>

試したこと

「font awesome 背景 消す」などと調べてみましたが見当たらず…
初歩的な質問ですが、よろしくお願いいたします。

追記

ボタンに対してはborder-style: none;とpositionに関すること以外、何も装飾していないと思います。
念のため（参考になるか分かりませんが）、検証モードで見える部分をお見せします。
![

Comments

[Yasumichi]

CSS 側も提示できますでしょうか？

[nippledrill]

ありがとうございます。
追記させていただきました！

[Yasumichi]

background-color: buttonface;

が効いているのでは？

[nippledrill]

解決しました！
ありがとうございます。

Answer 1

background: none;

とすることで背景を取り除けました。
Yasumichiさん、ありがとうございます。