I have a text input, where a user can enter a text. This text can have extra spaces, line breaks, bullet points, or whatever the user wants to type. Then, this input is saved in the database, and is linked with some kind of a "token". Then, this token can be inserted in notification messages that are sent via SMS, email, push,etc to other users. My issue is with email, specifically when the receiver uses an outlook email. When opening the email, outlook (web & app), renders the token "incorrectly" without all the extra spaces and line breaks. In gmail or any other email client, the token is perfectly rendered, with all the extra spaces, line breaks, etc.

Another important facts of the implementation My email has a predefined wrapper which is stored at the database and is:

<div style=\"text-align: left;\n  font-weight: normal;\n  text-decoration: none;\n  font-size: 14px;\n  font-style: normal;\">
   <div>
     <span style=\"font-size: 12px\">

Here I have the user input text, which can include the token whose format I am trying to preserve as {{myTokenWithExtraSpacesAndLineBreaks}}

  </span>
 </div>
</div>

I do not know how to make it work in Outlook, I have tried like 7 implementations and the best for now was the one that does

private function formatForEmail(string $tokenToFormat): string
{
    // Replace multiple spaces with a single <span> wrapper
    $tokenToFormat = preg_replace_callback('/ {2,}/', function ($matches) {
        return '<span>' . $matches[0] . '</span>';
    }, $tokenToFormat);

    // Finally, replace single line breaks with <br>
    return str_replace("\n", '<br>', $tokenToFormat);
}

This lets outlook to respect line breaks, but all the extra spaces are collapsed in 1. I also tried to directly replace all the spaces with

<span> </span>

But this gave me the same result as the code above (which is a bit nicer since does not "spam with spans").

I also can not use &nbsp because if the token has a long line (for example if the user does ctrl C + ctrl V) many times, the line exceeds the screen width without preserving the formatting.

I also tried to insert between the span, a table with tr and td as follows

<div style=\"text-align: left;\n  font-weight: normal;\n  text-decoration: none;\n  font-size: 14px;\n  font-style: normal;\">
  <div>
    <span style=\"font-size: 12px\">    
     <table role="presentation" style="display: inline-table;">
      <tr>
       <td style="font-size: 12px; white-space: pre-wrap;">
         The input with the {{myTokenWithExtraSpacesAndLineBreaks}} go here

But this also did not work on outlook (I read that Outlook likes tables).

What can I do to make Outlook render the token as I want, so as all the format is preserved with all the extra spaces, line breaks and other symbols ?

PS: I can not modify the HTML wrapper of the token (div div span), but I can add HTML dynamically to it.