Pushing metafield values up in the Placed Order event, to Klaviyo. Impossible?

[jfxJD]

I am utterly vexed and confused, and have no idea where to go next. I've been going to work on this for 8 days now. Let me explain:

I have a site using Shopify, and using Klaviyo for email. My end goal, is to send a flow that is Triggered by Placed Order but Filtered by the Metafield value for "Shipping_Timeframe". That's my Klaviyo side and the end goal.

I'm attempting to pass up More data in the Placed Order event, namely that metafield value. If not editing Placed Order (which seems to be uneditable since it is native in Shopify, and nowhere in my code) then just adding a new event to trigger by, with metafield value being the focused.

So how do I send an event to Klaviyo or anywhere, with more or custom data? I feel like I've tried everything but I know it is possible as per what Klaviyo support tells me. This isn't a Klaviyo exclusive issue but rather seems to be figuring out how to push an event up in my Shopify store just in general.

Notes: I have the Klaviyo App embed option switched on in the customizer settings, and the "Viewed Product" checkbox checked, so I thought maybe that needed to be disabled before I can edit the data for any other events, but I also read that that can be overwritten using this code:

    <!-- Metafields Object creation-->
    {% if template contains 'product' %}
    <script>
      window.productMetafields = {
        {% for metafield in product.metafields %}
          {% if metafield.namespace == 'product' %}
            "{{ metafield.key }}": "{{ metafield.value }}"{% unless forloop.last %},{% endunless %}
          {% endif %}
        {% endfor %}
      };
      console.log('Product Metafields:', window.productMetafields);
  
      window.KlaviyoViewedProduct = function (eventProperties) {
        console.log('Input Event Properties:', eventProperties);
        console.log('Product Metafields:', window.productMetafields);
        if (window.productMetafields) {
          eventProperties.$extra = window.productMetafields;
        }
        console.log('Output Event Properties:', eventProperties);
        return eventProperties;
      };
    </script>
  {% endif %}

Here's the code I'm working with below for my main issue:

<script>
window.addEventListener('load', function () {
  var _learnq = window._learnq || [];
  var klAjax = true;

  function addedToCart() {
    fetch(`${window.location.origin}/cart.js`)
      .then(res => res.json())
      .then(data => {
        var item = data.items[data.items.length - 1];
        var cart = {
          total_price: data.total_price / 100,
          $value: data.total_price / 100,
          total_discount: data.total_discount,
          original_total_price: data.original_total_price / 100,
          items: data.items
        }
        if (item !== 'undefined') {
          cart = Object.assign(cart, item);
        }

        fetch(window.location.origin + '/pages/metafields.json')
          .then(res => {
            if (!res.ok) {
              throw new Error('Network response was not ok');
            }
            return res.json();
          })
          .then(jsonData => {
            var productMetafields = jsonData.products.find(product => product.id === item.product_id).metafields;
            cart['$extra'] = productMetafields;
            if (klAjax) {
              _learnq.push(['track', 'Added to Cart', cart]);
              klAjax = false;
            }
          })
          .catch(error => {
            console.error('There was a problem with the fetch operation:', error);
          });
      });
  };

  (function (ns, fetch) {
    ns.fetch = function () {
      const response = fetch.apply(this, arguments);
      response.then(res => {
        if (`${window.location.origin}/cart/add.js`.includes(res.url)) {
          addedToCart();
        }
      });
      return response;
    }
  }(window, window.fetch));

  var atcButtons = document.querySelectorAll("form[action*='/cart/add'] button[type='submit']");
  for (var i = 0; i < atcButtons.length; i++) {
    atcButtons[i].addEventListener("click", function () {
      if (klAjax) {
        _learnq.push(['track', 'Added to Cart', item]);
        klAjax = false;
      }
    });
  }
});
</script>

In addition to this code in my codebase, I also have a page.metafields.liquid created to create a metafields json page of metafield values for products. The code in that page (which is hidden and only testing for this project):

{% assign metafields_keys = 'style,shipping_timeframe, ...(the rest of the fields here)' | split: ',' %}

{
  "products": [
    {% for product in collections.all.products %}
    {
      "id": {{ product.id }},
      "title": {{ product.title | json }},
      "metafields": [
        {% for key in metafields_keys %}
        {
          "key": "{{ key }}",
          "value": {{ product.metafields.product[key] | json }}
        }
        {% unless forloop.last %},{% endunless %}
        {% endfor %}
      ]
    }
    {% unless forloop.last %},{% endunless %}
    {% endfor %}
  ]
}