/* slider.css — 공용 슬라이더 모듈(js/ui/slider.js)의 동작 레벨 규칙.

   시각 스타일(화살표 모양·도트 색·카드 폭)은 여기 두지 않는다. 각 컴포넌트 CSS
   (.route-slider-* → preview.css 등)가 계속 소유한다. 이 파일은 data-slider-* 훅에만
   반응하는 "어느 슬라이더든 공통으로 참인" 규칙만 담는다. */

[data-slider] { position: relative; }

/* 가로 스크롤은 유지하되 스크롤바만 숨김 */
[data-slider-track] { scrollbar-width: none; }
[data-slider-track]::-webkit-scrollbar { display: none; }

/* 넘칠 내용이 없으면(카드가 전부 보이면) 컨트롤을 통째로 숨긴다 — 모듈이 부여 */
[data-slider-inert] [data-slider-prev],
[data-slider-inert] [data-slider-next],
[data-slider-inert] [data-slider-dots] { display: none; }

/* 페이지가 1개뿐이면 모듈이 [hidden] 을 건다. 컴포넌트 CSS 의 display:flex 가
   [hidden] 의 UA display:none 을 이기므로 여기서 명시적으로 되돌린다. */
[data-slider-dots][hidden] { display: none !important; }

/* 끝에 도달(loop 아님) — 컴포넌트 CSS 가 cursor:pointer 를 걸어두는 경우가 많아, 죽은 버튼이
   여전히 눌릴 것처럼 보인다. "더 넘길 게 없다"는 신호가 흐려지므로 커서까지 같이 되돌린다. */
[data-slider-prev][disabled],
[data-slider-next][disabled] { opacity: .35; cursor: default; }

/* 인덱스로 움직이는 슬라이더 — 가로 제스처는 모듈이 스와이프로 가로채고, 세로 팬은
   브라우저(페이지 스크롤)에 남긴다. touch-action 없이 pointermove 에서 preventDefault 하면
   터치에서 동작하지 않는다. data-slider-strategy 는 모듈이 마크업을 판별해 부여한다.
   (네이티브 스크롤러는 브라우저가 알아서 하므로 건드리지 않는다) */
[data-slider-strategy="index"] { touch-action: pan-y; }

/* 드래그 중 — 텍스트 선택과 자손 링크/이미지의 기본 드래그를 막는다.
   (드래그 직후의 클릭 네비게이션 차단은 모듈이 capture 단계에서 별도 처리) */
[data-slider][data-slider-dragging] { cursor: grabbing; user-select: none; }
[data-slider][data-slider-dragging] a,
[data-slider][data-slider-dragging] img { pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  [data-slider-track] { scroll-behavior: auto; }
}