{% comment %}
Feed exclusivo para móvil. Clona las seis noticias relacionadas y las ocho publicidades laterales,
sin alterar el HTML ni el diseño de escritorio.
{% endcomment %}

<style>
  .anqn-mobile-related-feed { display: none; }

  @media (max-width: 900px) {
    .single-post-page .anqn-related-news .related-posts-grid-professional {
      display: none !important;
    }

    .anqn-mobile-related-feed {
      display: flex;
      flex-direction: column;
      gap: 22px;
      width: 100%;
      margin-top: 20px;
    }

    .anqn-mobile-related-feed .related-post-card,
    .anqn-mobile-related-feed .anqn-mobile-ad-item,
    .anqn-mobile-related-feed .advertising-block-link-large {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
    }

    .anqn-mobile-related-feed .advertising-block-large.single-post-ad {
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      max-height: none !important;
      overflow: visible !important;
      border-radius: 10px !important;
    }

    .anqn-mobile-related-feed .advertising-block-large.single-post-ad img {
      display: block !important;
      width: 100% !important;
      height: auto !important;
      max-width: 100% !important;
      max-height: none !important;
      object-fit: contain !important;
      border-radius: 10px !important;
    }

    .anqn-mobile-related-feed .typewriter-text {
      display: flex;
      min-height: 220px;
      align-items: center;
      justify-content: center;
      padding: 20px;
      text-align: center;
    }
  }
</style>

<script>
(function () {
  function buildMobileFeed() {
    var media = window.matchMedia('(max-width: 900px)');
    var section = document.querySelector('.single-post-page .anqn-related-news');
    if (!section) return;

    var existing = section.querySelector('.anqn-mobile-related-feed');
    if (!media.matches) {
      if (existing) existing.remove();
      return;
    }
    if (existing) return;

    var cards = Array.prototype.slice.call(
      section.querySelectorAll('.related-posts-grid-professional .related-post-card')
    ).slice(0, 6);

    var ads = Array.prototype.slice.call(
      document.querySelectorAll('.single-post-page .post-side-ad .advertising-block-link-large')
    ).slice(0, 8);

    if (!cards.length || !ads.length) return;

    var feed = document.createElement('div');
    feed.className = 'anqn-mobile-related-feed';

    cards.forEach(function (card, index) {
      feed.appendChild(card.cloneNode(true));
      if (ads[index]) {
        var adItem = document.createElement('div');
        adItem.className = 'anqn-mobile-ad-item';
        adItem.appendChild(ads[index].cloneNode(true));
        feed.appendChild(adItem);
      }
    });

    for (var i = cards.length; i < ads.length; i++) {
      var finalAdItem = document.createElement('div');
      finalAdItem.className = 'anqn-mobile-ad-item';
      finalAdItem.appendChild(ads[i].cloneNode(true));
      feed.appendChild(finalAdItem);
    }

    section.appendChild(feed);
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', buildMobileFeed);
  } else {
    buildMobileFeed();
  }

  window.addEventListener('resize', buildMobileFeed);
})();
</script>