overflow-x: hidden corta el texto, pero no lo envuelve.

En cambio, la propiedad CSS white-space en blanco establece cómo se maneja el espacio en blanco dentro de un elemento; pre-wrap preserva las secuencias de espacios en blanco, las líneas se rompen en los caracteres de nueva línea, en <br> y según sea necesario para llenar los cuadros de línea.

 pre { white-space: pre-wrap; }

Este artículo brinda mucha información excelente sobre la etiqueta previa: https://mediatemple.net/blog/tips/considerations-for-styling-the-pre-tag/

Intenta agregar esto:

 text-align: right !important; overflow-x: hidden !important;

Además, este artículo podría ser interesante para tu trabajo: https://alfy.me/2014/07/26/lets-talk-about-rtl.html

¡Espero que haya ayudado! ¡Buena codificación! ;)

Editar:

Me explicaré.

Agregando text-align: right !important; estamos forzando que el texto se alinee correctamente, siendo su sitio web un RTL, este es el camino a seguir.

Agregando overflow-x: hidden !important; estamos diciendo que no queremos desplazamiento horizontal.

La declaración !important se usa para dar prioridad a esta regla css, se usa para anular otros estilos.

La respuesta se encuentra en esta publicación: ¿Cómo envuelvo el texto en una etiqueta previa?

 pre { white-space: pre-wrap; /* Since CSS 2.1 */ white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ }