Задать стили при переполнении контента

Как мне задать определенные css стили, при условии, если элементов(кнопок) в списке станет больше при переполнении контента? Изначально данные стили не нужны, только когда элементов станет больше 4 шт.

<article class="podcast-cart">
   <div class="podcast-cart-counter">
    <button class="podcast-cart__counter-btn-play  podcast-counter__item"></button>
    <button class="podcast-cart__counter-btn-pause  podcast-counter__item"></button>
  </div>
</article>

пытаюсь сделать так - не работает

let podcastList = document.querySelectorAll('.podcast-cart');

podcastList.forEach(item => {
  let podcastCounterItem = document.querySelector('.podcast-counter__item');

   if (podcastCounterItem > 4) {
    podcastCounterItem.style.padding = "10px 0";
   }
});