From 2247921fd7d7b6b21aaa3deea960240ca4d1ff01 Mon Sep 17 00:00:00 2001
From: Diyorbek Sadullaev <diyorbek3377@gmail.com>
Date: Thu, 21 Sep 2023 13:40:06 +0200
Subject: [PATCH] Video: Fix flickering video controls on iOS browsers (#3202)

---
 packages/gestalt/src/Icon.css | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/packages/gestalt/src/Icon.css b/packages/gestalt/src/Icon.css
index e78d458a54..bf59393a08 100644
--- a/packages/gestalt/src/Icon.css
+++ b/packages/gestalt/src/Icon.css
@@ -9,5 +9,11 @@
 }
 
 html[dir="rtl"] .rtlSupport {
-  transform: rotateY(180deg);
+  /*
+  Using `scale` instead of `rotateY`.
+  This is a workaround for the bug in iOS browsers with rendering rotated SVGs over video.
+  Bug repro: https://gist.github.com/diyorbek/945189e3036552d2de34ae955a1605ee
+  */
+  transform: scale(-1, 1);
+  transform-origin: center;
 }