diff --git a/package-lock.json b/package-lock.json
index 7f9bb577..8914a297 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -21,7 +21,7 @@
         "@ngx-translate/core": "^13.0.0",
         "@ngx-translate/http-loader": "^6.0.0",
         "@popperjs/core": "^2.11.5",
-        "@stream-io/stream-chat-css": "3.10.1",
+        "@stream-io/stream-chat-css": "3.12.0",
         "@stream-io/transliterate": "^1.5.2",
         "angular-mentions": "^1.4.0",
         "dayjs": "^1.10.7",
@@ -3999,9 +3999,9 @@
       "dev": true
     },
     "node_modules/@stream-io/stream-chat-css": {
-      "version": "3.10.1",
-      "resolved": "https://registry.npmjs.org/@stream-io/stream-chat-css/-/stream-chat-css-3.10.1.tgz",
-      "integrity": "sha512-TIIExSxH9s+1TG2+xjFCihd1vgaAZ3M3AA/p0hbcHCtrMGU2COtNis0K4JXqkTzx9j1DWaMt4EwVh4kIFkYDLw=="
+      "version": "3.12.0",
+      "resolved": "https://registry.npmjs.org/@stream-io/stream-chat-css/-/stream-chat-css-3.12.0.tgz",
+      "integrity": "sha512-Oi21RiekjIV1tA8GX2bQjUtnx+BJPP8GhMgTeLRANdDf5Tb5AmYCyEUXjXMSBEbw7pMeaEKIxaFmpdkMiqh/IA=="
     },
     "node_modules/@stream-io/transliterate": {
       "version": "1.5.2",
@@ -30104,9 +30104,9 @@
       "dev": true
     },
     "@stream-io/stream-chat-css": {
-      "version": "3.10.1",
-      "resolved": "https://registry.npmjs.org/@stream-io/stream-chat-css/-/stream-chat-css-3.10.1.tgz",
-      "integrity": "sha512-TIIExSxH9s+1TG2+xjFCihd1vgaAZ3M3AA/p0hbcHCtrMGU2COtNis0K4JXqkTzx9j1DWaMt4EwVh4kIFkYDLw=="
+      "version": "3.12.0",
+      "resolved": "https://registry.npmjs.org/@stream-io/stream-chat-css/-/stream-chat-css-3.12.0.tgz",
+      "integrity": "sha512-Oi21RiekjIV1tA8GX2bQjUtnx+BJPP8GhMgTeLRANdDf5Tb5AmYCyEUXjXMSBEbw7pMeaEKIxaFmpdkMiqh/IA=="
     },
     "@stream-io/transliterate": {
       "version": "1.5.2",
diff --git a/package.json b/package.json
index 163a1d35..c2c50492 100644
--- a/package.json
+++ b/package.json
@@ -117,7 +117,7 @@
     "@ngx-translate/core": "^13.0.0",
     "@ngx-translate/http-loader": "^6.0.0",
     "@popperjs/core": "^2.11.5",
-    "@stream-io/stream-chat-css": "3.10.1",
+    "@stream-io/stream-chat-css": "3.12.0",
     "@stream-io/transliterate": "^1.5.2",
     "angular-mentions": "^1.4.0",
     "dayjs": "^1.10.7",
diff --git a/projects/stream-chat-angular/src/lib/channel/channel.component.html b/projects/stream-chat-angular/src/lib/channel/channel.component.html
index a78cc789..0384cdec 100644
--- a/projects/stream-chat-angular/src/lib/channel/channel.component.html
+++ b/projects/stream-chat-angular/src/lib/channel/channel.component.html
@@ -2,6 +2,7 @@
   class="str-chat str-chat-channel messaging str-chat__channel str-chat__theme-{{
     theme$ | async
   }}"
+  [class.google-chrome]="isChrome"
 >
   <div
     class="str-chat__container"
diff --git a/projects/stream-chat-angular/src/lib/channel/channel.component.ts b/projects/stream-chat-angular/src/lib/channel/channel.component.ts
index 051fc807..fd908320 100644
--- a/projects/stream-chat-angular/src/lib/channel/channel.component.ts
+++ b/projects/stream-chat-angular/src/lib/channel/channel.component.ts
@@ -19,6 +19,8 @@ export class ChannelComponent {
   isActiveChannel$: Observable<boolean>;
   subscriptions: Subscription[] = [];
   theme$: Observable<string>;
+  isChrome =
+    !!(window as any).chrome && typeof (window as any).opr === 'undefined';
 
   constructor(
     private channelService: ChannelService,