How to change the Chat Balloon image?

Technical issue
1

I want to change the Chat Balloon image showed below:
image

2

Below you can find an example:

image

<!DOCTYPE html>
<html>
  <head>
    <base href="./">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script type="application/javascript"> 
      // Handler for .ready() called.
      window.tiledeskSettings = 
      {
          // PROD:   
          projectid: "5ec25dc392befe0019055e4b"
      };

      (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); 
        js.id = id;
        js.src = "https://widget.tiledesk.com/v4/launch.js";
        fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'tiledesk-jssdk'));
      window.tileDeskAsyncInit = function() {
        window.tiledesk.on('onInit', function(event_data) {
          console.log("tiledesk onInit");
          var iframeTiledesk = document.getElementById("tiledeskiframe");
          
          var style = iframeTiledesk.contentWindow.document.createElement('style');
          style.type = 'text/css';
       
          style.innerHTML = '.message_innerhtml.marked { font-size: 17!important;}\n';
        style.innerHTML += '#c21-launcher-button > div > svg { display: none !important; }\n';
        style.innerHTML += '#c21-launcher-button .launcher-button { background-image: url("https://upload.wikimedia.org/wikipedia/commons/b/b0/NewTux.svg"); background-repeat: no-repeat; background-size: cover;}\n';
        style.innerHTML += '#c21-launcher-button { border-radius:5px !important; padding: 6px;background-color:unset !important;     border: 1px solid rgb(182, 20, 22);}\n';
   iframeTiledesk.contentWindow.document.getElementsByTagName('head')[0].appendChild(style);     
        });
      };
    </script>
  </head>
  <body>
  </body>
</html>