​
Steps to Enable RTL

  1. Navigate to the Theme tab in your Agent settings.
  2. Paste the following Custom CSS into the designated Custom CSS field: 
    .agent-container {
  direction: rtl;
}

.agent-avatar-container {
  margin-right: 0;
  margin-left: 0.5rem;
}

.guest-container {
  margin-left: 0;
  margin-right: 50px;
}
  3. Exit the CSS box to apply the new styling.
Custom CSS RTL
Note: Adjust margins or padding values as needed to ensure proper alignment based on your layout preferences.

​
Validation and Testing

Before deployment:
  • Confirm that text aligns properly in right-to-left format.
  • Verify that margins and paddings are consistent across all elements.
  • Test on different devices to ensure responsiveness.