/* 副本：來源 shared/ui/drag-scroll/drag-scroll.css（可重用元件，改行為請改來源再複製過來）。 */
/* 橫向列「滑鼠按住拖曳」樣式——可重用元件
   來源：piaa_web/brand/index.html 的 .bv-dock（overflow-x:auto、隱藏捲軸、cursor:grab），2026-10-08 抽出。
   套用方式：在橫向列加 class="drag-scroll"，提示放 <span class="drag-hint" hidden>← 左右滑動 →</span>。
   ⚠️ 不要照抄原版的 touch-action:pan-y：那會吃掉手機原生的橫向慣性捲動（見 drag-scroll.js 註解）。 */
.drag-scroll {
  overflow-x: auto;
  scrollbar-width: none;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  /* 右側淡出：暗示還有更多；捲到底（is-end）就拿掉 */
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
          mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
}
.drag-scroll::-webkit-scrollbar { display: none; }
.drag-scroll:not(.is-overflow), .drag-scroll.is-end { -webkit-mask-image: none; mask-image: none; cursor: auto; }
.drag-scroll.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.drag-scroll.is-dragging a { pointer-events: none; }

.drag-hint { font-size: 12.5px; font-weight: 500; color: #8b9198; letter-spacing: .04em; white-space: nowrap; }
.drag-hint[hidden] { display: none; }