/* =====================================================
   MOBILE LISTEN SECTION - VIDEO CARDS
   Horizontal scroll video cards for all screen sizes
   ===================================================== */

/* Phone only - Horizontal scroll video cards */
@media (max-width: 480px) {

  /* KEEP the video gallery visible — show as horizontal scroll */
  .ccp-video-gallery-container {
    margin-bottom: 16px !important;
    padding: 0 !important;
  }

  .ccp-video-gallery {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    gap: 12px !important;
    padding: 4px 16px !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    justify-content: flex-start !important;
  }

  .ccp-video-gallery::-webkit-scrollbar {
    display: none;
  }

  .ccp-video-card {
    flex-shrink: 0 !important;
    width: 220px !important;
    scroll-snap-align: start;
  }

  .ccp-video-wrapper {
    aspect-ratio: 3 / 4;
    border-radius: 12px;
  }

  .ccp-video-info {
    padding: 12px 10px 16px !important;
  }

  .ccp-video-title {
    font-size: 13px !important;
    margin-bottom: 4px !important;
  }

  .ccp-video-desc {
    font-size: 12px !important;
    line-height: 1.4 !important;
  }
}

/* Extra small phones */
@media (max-width: 380px) {
  .ccp-video-card {
    width: 200px !important;
  }

  .ccp-video-title {
    font-size: 12px !important;
  }

  .ccp-video-desc {
    font-size: 12px !important;
  }
}