/** Shopify CDN: Minification failed

Line 28:9 Expected identifier but found "addEventListener("
Line 50:4 Comments in CSS use "/* ... */" instead of "//"
Line 69:2 Comments in CSS use "/* ... */" instead of "//"
Line 69:71 Unterminated string token
Line 70:2 Comments in CSS use "/* ... */" instead of "//"
Line 70:72 Unterminated string token
Line 74:51 Comments in CSS use "/* ... */" instead of "//"
Line 74:77 Unterminated string token
Line 75:33 Comments in CSS use "/* ... */" instead of "//"
Line 80:2 Comments in CSS use "/* ... */" instead of "//"
... and 2 more hidden warnings

**/
/* ============================================
   PREMIUM ENHANCEMENTS — STAP 1: ANIMATIE-FUNDAMENT (JS)
   Bestand: assets/premium-enhancements.js
   ============================================
   Waarom dit de webshop beter maakt:
   Zuivere vanilla JavaScript (geen libraries, dus geen impact op
   laadsnelheid) die de CSS-animaties hierboven activeert op het
   juiste moment: wanneer elementen in beeld scrollen, wanneer een
   product wordt toegevoegd aan de winkelwagen, en tijdens scrollen
   voor de progress bar.
   ============================================ */

document.addEventListener('DOMContentLoaded', function () {

  /* --- 1. Fade-in bij scroll: voegt .pe-visible toe zodra element in beeld komt --- */
  var fadeElements = document.querySelectorAll('.pe-fade-in');

  if ('IntersectionObserver' in window && fadeElements.length) {
    var observer = new IntersectionObserver(function (entries) {
      entries.forEach(function (entry) {
        if (entry.isIntersecting) {
          entry.target.classList.add('pe-visible');
          observer.unobserve(entry.target);
        }
      });
    }, {
      threshold: 0.1,
      rootMargin: '0px 0px -50px 0px'
    });

    fadeElements.forEach(function (el) {
      observer.observe(el);
    });
  } else {
    // Fallback voor oude browsers: toon direct
    fadeElements.forEach(function (el) {
      el.classList.add('pe-visible');
    });
  }

  /* --- 2. Scroll progress bar bovenaan de pagina --- */
  var progressBar = document.getElementById('pe-scroll-progress');

  if (progressBar) {
    window.addEventListener('scroll', function () {
      var scrollTop = window.scrollY;
      var docHeight = document.documentElement.scrollHeight - window.innerHeight;
      var progress = docHeight > 0 ? (scrollTop / docHeight) * 100 : 0;
      progressBar.style.width = progress + '%';
    }, { passive: true });
  }

  /* --- 3. Winkelwagen-bounce-animatie bij toevoegen product --- */
  // Luistert naar Shopify's 'cart:updated' event dat de meeste moderne
  // Online Store 2.0-thema's uitzenden bij een succesvolle add-to-cart.
  document.addEventListener('cart:updated', function () {
    var cartIcon = document.querySelector('.cart-icon, #cart-icon-bubble, [data-cart-icon]');
    if (cartIcon) {
      cartIcon.classList.remove('pe-cart-bounce'); // reset als 'm nog draait
      void cartIcon.offsetWidth; // forceer reflow zodat animatie opnieuw kan starten
      cartIcon.classList.add('pe-cart-bounce');
    }
  });

  // Fallback: luister ook naar standaard "Toevoegen aan winkelwagen"-formulieren,
  // voor thema's die geen custom cart:updated event uitzenden.
  var addToCartForms = document.querySelectorAll('form[action^="/cart/add"]');
  addToCartForms.forEach(function (form) {
    form.addEventListener('submit', function () {
      setTimeout(function () {
        var cartIcon = document.querySelector('.cart-icon, #cart-icon-bubble, [data-cart-icon]');
        if (cartIcon) {
          cartIcon.classList.remove('pe-cart-bounce');
          void cartIcon.offsetWidth;
          cartIcon.classList.add('pe-cart-bounce');
        }
      }, 300);
    });
  });

});