/**
 * player.css
 * Patch CSS untuk Full Player & Mini Player.
 * Load setelah main.css.
 *
 * Fix utama:
 *  - fp-scroll-body: overscroll-behavior: contain → cegah scroll "bocor" ke parent
 *  - full-player: touch-action tuned agar browser tidak intercept gesture vertikal lebih awal
 *  - Swipe drag handle visual di header full player
 */

/* ─── Cegah scroll leak ke gesture parent ─── */
.fp-scroll-body {
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
}

/* ─── Drag handle indicator di atas full player ─── */
.fp-drag-handle {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px 0 2px;
  flex-shrink: 0;
  position: relative;
  z-index: 10;
  pointer-events: none;
}

.fp-drag-handle::before {
  content: '';
  width: 36px;
  height: 4px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.2);
  display: block;
}

/* ─── Full player header tidak intercept touch vertikal ─── */
.fp-header {
  touch-action: pan-x; /* izinkan hanya horizontal — vertikal diteruskan ke gesture handler */
}

/* ─── Artwork area: izinkan swipe horizontal ─── */
.fp-art {
  touch-action: pan-y pinch-zoom; /* vertikal untuk scroll, horizontal untuk gesture player */
}

/* ─── Mini player: touch area minimal 48px terpenuhi, feedback jelas ─── */
.mini-player {
  cursor: default;
  -webkit-tap-highlight-color: transparent;
  touch-action: pan-x; /* block vertikal scroll di mini player — hanya horizontal & tap */
}

/* ─── Progress bar: touch-action none agar tidak diklaim browser ─── */
.fp-bar,
.fp-lyric-bar {
  touch-action: none;
}

/* ─── Queue drag handle tap area ─── */
.qrow-drag-handle {
  min-width: 32px;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  touch-action: none;
}