diff --git a/src/components/styled/avatar.css b/src/components/styled/avatar.css
index d4f574870d3..3defa378392 100644
--- a/src/components/styled/avatar.css
+++ b/src/components/styled/avatar.css
@@ -1,6 +1,6 @@
 .avatar-group {
   @apply flex overflow-hidden;
-  .avatar {
+  :where(.avatar) {
     @apply overflow-hidden rounded-full border-4 border-base-100;
   }
 }