I want to add Google gclid to the Custom Variables in the customer detail tab

I have placed the following code into my header:

const urlParams = new URLSearchParams(window.location.search);
        let gclid = 'none';
        // Get the gclid and set the cookie
        if (urlParams.get('gclid')) {
            gclid = urlParams.get('gclid');
            console.log(gclid);
            // retrieve the cookie
        } else if (document.cookie.split(';').some((item) => item.trim().startsWith('_gcl_aw='))) {
            gclid = document.cookie.split('; ').find(row => row.startsWith('_gcl_aw=')).split('=')[1].split('.')[2];
        }
        window.__lc = window.__lc || {};
        window.__lc.license = 11257102;
        window.__lc.params = [{
            name: 'gclid',
            value: gclid
        }, ];
        (function() {
            var lc = document.createElement('script');
            lc.type = 'text/javascript';
            lc.async = true;
            lc.src = ('https:' == document.location.protocol ? 'https://' : 'https://') + 'cdn.livechatinc.com/tracking.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(lc, s);
        })();

Which should send the gclid into the custom Integrations data of the details tab.

That works and I get this desired result:
https://prnt.sc/26nkyby
However, if the user visits a product page then the **LiveChat WooCommerce** plugin takes over the Integrations data area looks like this:
https://prnt.sc/26nkye5
Can someone help me with the code to add the gclid id into the customer information area in a way that persists please?