/* ================================
   Top Topics — Swiper integration
   Studio.Design CSS (data-s-*) handles visual styling.
   This file only adds Swiper-specific layout overrides.
   ================================ */

/* Swiper container: fill remaining space after sidebar header */
.top-topics-swiper {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  height: 100%;
}

/* Slide width matches Studio card width */
.top-topics-swiper .swiper-slide {
  width: 365px;
  height: 100%;
}

/* Thumbnail: keep original 400:225 aspect ratio, cover-fit */
.top-topics-swiper img[data-s-302e3b95-f5cb-4694-817c-2be0aeed8d4c] {
  aspect-ratio: 400 / 225;
  object-fit: contain;
}

@media (max-width: 768px) {
  .top-topics-swiper .swiper-slide {
    width: 342px;
  }
}

@media (max-width: 480px) {
  .top-topics-swiper .swiper-slide {
    width: 280px;
  }
}