feat: Add RTL Support to Widget (#11022)

This PR adds RTL support to the web widget for improved right-to-left language compatibility, updates colors, and cleans up code.

Fixes https://linear.app/chatwoot/issue/CW-4089/rtl-issues-on-widget

https://github.com/chatwoot/chatwoot/issues/9791

Other PR: https://github.com/chatwoot/chatwoot/pull/11016

app/javascript/widget/components/Banner.vue

@@ -33,21 +33,15 @@ export default {
 </template>
 
 <style scoped lang="scss">
-@import 'widget/assets/scss/variables.scss';
-
 .banner {
-  color: $color-white;
-  font-size: $font-size-default;
-  font-weight: $font-weight-bold;
-  padding: $space-slab;
-  text-align: center;
+  @apply text-white text-sm font-semibold p-3 text-center;
 
   &.success {
-    background: $color-success;
+    @apply bg-n-teal-9;
   }
 
   &.error {
-    background: $color-error;
+    @apply bg-n-ruby-9;
   }
 }
 </style>