.manga-card {
  background: #1d283b;
  border-radius: 12px;
  padding: 12px;
  height: 100%;
}
.manga-cover {
  width: 100%;
  height: 280px;
  object-fit: cover;
  border-radius: 10px;
}
.badge-type {
  background: #ff4d4f;
}

.time-text {
  color: whitesmoke !important;
  text-align: center;
  display: inline-block; /* эсвэл block/inline-flex тохируулах */
  max-width: 100%; /* эсвэл хүссэн өргөн */
  white-space: nowrap; /* нэг мөрт барина */
  overflow: hidden; /* хэтэрсэн хэсгийг нуух */
  text-overflow: ellipsis; /* ... болгож харуулах */
}
.chapter-item {
  background: #0e1524;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 14px;
  margin-top: 3px;
  margin-bottom: 3px;
}
@media (max-width: 768px) {
  .manga-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
  }
}

@media (max-width: 576px) {
  .manga-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
  }
}
.manga-card-image {
  width: 100%; /* container-ийн өргөнтэй тааруулна */
  height: auto; /* aspect ratio-г хадгална */
  display: block; /* inline gap арилгах */
  border-radius: 8px;
  cursor: pointer;
  margin-bottom: 0.6rem;
}
.manga-card-image:hover {
  transform: scale(0.98) !important;
  transition: transform 0.4s ease;
}
.mobile-show {
  display: block !important; /* mobile-д харуулах */
}
.desktop-show {
  display: none !important; /* mobile-д нуух */
}

/* Desktop view */
@media (min-width: 768px) {
  /* 768px-с дээш нь tablet/desktop гэж үзнэ */
  .mobile-show {
    display: none !important; /* том дэлгэц дээр нуух */
  }
  .desktop-show {
    display: flex !important; /* том дэлгэц дээр харуулах */
  }
}