#modalImage {
    transition: transform 0.3s ease;
    cursor: zoom-in;
  }

  #modalImage.zoomed {
    transform: scale(2);
    cursor: zoom-out;
  }

  .flex-wrap {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  #filterBar::-webkit-scrollbar {
    display: none;
  }

  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  .no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  /* Add in your style.css or inside a <style> tag in the head */
#tabUpload, #tabUrl {
    transition: background-color 0.2s, color 0.2s;
  }
  
  
  
  
  #footerAdContainer,
#footerAdContainer ins.adsbygoogle {
  height: 50px !important;
  max-height: 50px !important;
  overflow: hidden !important;
}

.ad-container {
  height: auto;
  min-height: 0;
  transition: all 0.3s ease;
}

.ad-container.collapsed {
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}


.collapsed {
  display: none !important;
}

#leaderboardPagination {
  justify-content: center;
  gap: 1.5rem; /* Increased spacing */
  align-items: center;
}

#paginationInfo {
  padding: 0 0.5rem;
}

/* Inside your CSS */
.challenge-tile, .ad-tile {
  height: 240px !important; /* or whatever your image+text tile height is */
}

/* Fallback clamp so descriptions stay consistent even without plugin support */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}