WhatsApp Button Block: Icon & text overlapping for RTL language

### Steps to reproduce the behavior

1. Go to **My site > Settings > General**
2. Change site language to an RTL one, like Hebrew for example
3. Create a new page or post and add the **WhatsApp Button Block**
4. Check the preview on the live site

#### What I expected to happen

The icons and text should not overlap, as it does for LTR languages (English for example).


#### What actually happened

On RTL languages, like Hebrew, the icon and text overlaps.


### Context

This was reported by a user who has set the site language to Hebrew: 29903005-hc

#### Browser / OS version

* Browsers: Chrome, Firefox & Vivaldi
* OS: Mac OS 11.3

#### Does this happen on simple or atomic sites or both?

Both.

#### Is there any console output or error text?

None.

#### Level of impact (Does it block purchases? Does it affect more than just one site?)

Does not block purchases, but affects all sites (simple/atomic).

#### Reproducibility (Consistent, Intermittent) Leave empty for consistent.

#### Screenshot / Video: If applicable, add screenshots to help explain your problem.

Same as above.

Start by reproducing the issue through My site > Settings > General with Hebrew, then add a WhatsApp Button Block and inspect its live-site preview. Locate the WhatsApp Button Block implementation and its RTL-related styling; done means the icon and text no longer overlap in RTL and still render correctly in LTR.

Written by the indexing model from the issue text.