diff --git a/packages/nc-gui/components/extensions/Extension.vue b/packages/nc-gui/components/extensions/Extension.vue
index 13070ea125..a72f712e31 100644
--- a/packages/nc-gui/components/extensions/Extension.vue
+++ b/packages/nc-gui/components/extensions/Extension.vue
@@ -167,7 +167,7 @@ onMounted(() => {
   </div>
 </template>
 
-<style lang="scss">
+<style scoped lang="scss">
 .extension-wrapper {
   @apply bg-white rounded-lg p-2 w-full border-1;
 }
@@ -192,7 +192,7 @@ onMounted(() => {
   @apply border-1 m-2 p-2 rounded-lg;
 }
 
-.extension-fullscreen .nc-modal {
+:global(.extension-fullscreen .nc-modal) {
   @apply p-0;
 }
 </style>
diff --git a/packages/nc-gui/components/extensions/Wrapper.vue b/packages/nc-gui/components/extensions/Wrapper.vue
index b6c990b539..cbc36f13d8 100644
--- a/packages/nc-gui/components/extensions/Wrapper.vue
+++ b/packages/nc-gui/components/extensions/Wrapper.vue
@@ -15,28 +15,4 @@ const { extensionId } = defineProps<Prop>()
   </NuxtErrorBoundary>
 </template>
 
-<style lang="scss">
-.extension-wrapper {
-  @apply bg-white rounded-lg p-2 w-full border-1;
-}
-
-.extension-header {
-  @apply flex justify-between;
-
-  .extension-header-left {
-    @apply flex items-center gap-2;
-  }
-
-  .extension-header-right {
-    @apply flex items-center gap-4;
-  }
-
-  .extension-title {
-    @apply font-weight-600;
-  }
-}
-
-.extension-content {
-  @apply border-1 m-2 p-2 rounded-lg;
-}
-</style>
+<style scoped lang="scss"></style>