/* ============================================================================
   GESER MENDATAR — isyarat bahwa baris itu bisa ditarik
   ----------------------------------------------------------------------------
   Aturan di sini hanya berlaku pada peranti dengan penunjuk presisi
   (pointer: fine) — artinya tetikus, bukan jari. Di HP semuanya dibiarkan
   seperti semula: jari sudah bisa menggeser, dan kursor grab tidak ada
   artinya di layar sentuh.
   ========================================================================== */

@media (pointer: fine) {

  .bisa-digeser { cursor: grab; }
  .bisa-digeser.sedang-ditarik {
    cursor: grabbing;
    /* Selama ditarik, teks jangan ikut tersorot biru. */
    user-select: none;
    -webkit-user-select: none;
    scroll-behavior: auto;
  }
  .bisa-digeser.sedang-ditarik a { pointer-events: none; }

  /* Tiga baris menyembunyikan scrollbar-nya lewat scrollbar-width:none. Di
     HP itu wajar. Di desktop akibatnya tidak ada satu pun tanda bahwa masih
     ada isi di sebelah kanan — yang justru membuat baris itu dikira rusak.
     Dikembalikan, tapi tipis dan sewarna halaman, bukan scrollbar tebal
     bawaan sistem. */
  .featured-categories-track,
  .video-gallery-track,
  .ig-feed-track {
    scrollbar-width: thin;
    scrollbar-color: rgba(33, 28, 22, .28) transparent;
  }
  .featured-categories-track::-webkit-scrollbar,
  .video-gallery-track::-webkit-scrollbar,
  .ig-feed-track::-webkit-scrollbar {
    display: block;
    height: 6px;
  }
  .featured-categories-track::-webkit-scrollbar-track,
  .video-gallery-track::-webkit-scrollbar-track,
  .ig-feed-track::-webkit-scrollbar-track {
    background: transparent;
  }
  .featured-categories-track::-webkit-scrollbar-thumb,
  .video-gallery-track::-webkit-scrollbar-thumb,
  .ig-feed-track::-webkit-scrollbar-thumb {
    background: rgba(33, 28, 22, .22);
    border-radius: 99px;
  }
  .featured-categories-track:hover::-webkit-scrollbar-thumb,
  .video-gallery-track:hover::-webkit-scrollbar-thumb,
  .ig-feed-track:hover::-webkit-scrollbar-thumb {
    background: rgba(33, 28, 22, .38);
  }
}

/* ---------------------------------------------------------------------------
   Carousel banner promo
   Dulu hanya bisa dipindah lewat dua panah kecil. Sekarang bisa ditarik dan
   diusap, jadi perlu dua hal: kursor yang menunjukkan itu, dan touch-action
   yang membiarkan gulungan TEGAK halaman tetap jalan sementara gerakan
   MENDATAR ditangani skrip. Tanpa pan-y, mengusap ke bawah di atas banner
   akan terasa macet.
   --------------------------------------------------------------------------- */
.promo-track { touch-action: pan-y; }
.promo-track img, .promo-slide img { -webkit-user-drag: none; user-drag: none; }
.promo-carousel.sedang-ditarik { user-select: none; -webkit-user-select: none; }
.promo-carousel.sedang-ditarik .promo-slide { pointer-events: none; }

@media (pointer: fine) {
  .promo-track { cursor: grab; }
  .promo-carousel.sedang-ditarik .promo-track { cursor: grabbing; }
}
