const search = document.querySelector('#search');
let category = 'all';
function filter() {
  const term = search.value.trim().toLowerCase();
  let count = 0;
  document.querySelectorAll('.latest .story').forEach(card => {
    card.hidden = !(category === 'all' || card.dataset.category === category) || !card.dataset.search.includes(term);
    if (!card.hidden) count++;
  });
  document.querySelector('#count').textContent = `${count} ${count === 1 ? 'story' : 'stories'}`;
  document.querySelector('#results-status').textContent = `${count} stories found`;
  document.querySelector('#no-results').hidden = count !== 0;
}
if (search) {
  search.addEventListener('input', filter);
  document.querySelectorAll('[data-filter]').forEach(button => button.addEventListener('click', () => {
    category = button.dataset.filter;
    document.querySelectorAll('[data-filter]').forEach(b => {b.classList.toggle('selected', b === button);b.setAttribute('aria-pressed',String(b === button));});
    filter();
  }));
  document.addEventListener('keydown', e => {if(e.key === '/' && !['INPUT','TEXTAREA'].includes(document.activeElement.tagName)){e.preventDefault();search.focus();}});
}