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/ChatMessage.vue

@@ -53,56 +53,3 @@ export default {
   max-width: 90%;
 }
 </style>
-
-<style lang="scss">
-@import 'widget/assets/scss/variables.scss';
-
-.chat-bubble .message-content,
-.chat-bubble.user {
-  p code {
-    background-color: var(--s-75);
-    display: inline-block;
-    line-height: 1;
-
-    border-radius: $border-radius-small;
-    padding: $space-smaller;
-  }
-
-  pre {
-    overflow-y: auto;
-    background-color: var(--s-75);
-    border-color: var(--s-75);
-    color: var(--s-800);
-    border-radius: $border-radius-normal;
-    padding: $space-small;
-    margin-top: $space-smaller;
-    margin-bottom: $space-small;
-    display: block;
-    line-height: 1.7;
-    white-space: pre-wrap;
-
-    code {
-      background-color: transparent;
-      color: var(--s-800);
-      padding: 0;
-    }
-  }
-
-  blockquote {
-    border-left: $space-micro solid var(--s-75);
-    color: var(--s-800);
-    padding: $space-smaller $space-small;
-    margin: $space-smaller 0;
-    padding: $space-small $space-small 0 $space-normal;
-  }
-}
-
-@media (prefers-color-scheme: dark) {
-  .chat-bubble.agent.has-dark-mode {
-    blockquote {
-      border-color: var(--s-200);
-      color: var(--s-50);
-    }
-  }
-}
-</style>