/* Articles Homepage Styles */

.articles-carousel {
  position: relative;
}

.articles-scroll-container {
  padding-top: 10px;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  transition: scrollbar-color 0.3s ease;
}

.articles-scroll-container::-webkit-scrollbar {
  height: 6px;
}

.articles-scroll-container::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 10px;
}

.articles-scroll-container::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 10px;
  transition: background 0.3s ease;
}

/* Show scrollbar only when scrolling */
.articles-scroll-container.scrolling {
  scrollbar-color: rgba(155, 155, 155, 0.5) transparent;
}

.articles-scroll-container.scrolling::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.articles-scroll-container.scrolling::-webkit-scrollbar-thumb {
  background: #888;
}

.articles-scroll-container.scrolling::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Hide native scrollbar arrows/buttons */
.articles-scroll-container::-webkit-scrollbar-button {
  display: none;
}

.articles-scroll-container::-webkit-scrollbar-corner {
  display: none;
}

.article-card .card {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.article-card .card:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

.text-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 3;
}

.scroll-indicators {
  opacity: 0.7;
  transition: opacity 0.2s ease-in-out;
}

.scroll-indicators:hover {
  opacity: 1;
}