/* PickSell 관리자(unfold) 미세 폴리시.
   레이아웃을 바꾸지 않는 '추가만 되는' 안전한 개선(스크롤바/전환/호버/포커스). */

/* 부드러운 스크롤바 (다크/라이트 자동) */
* { scrollbar-width: thin; scrollbar-color: rgba(37,99,235,.35) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: rgba(37,99,235,.30); border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover { background: rgba(37,99,235,.55); background-clip: padding-box; }
.dark *::-webkit-scrollbar-thumb { background: rgba(120,170,255,.28); background-clip: padding-box; }

/* 링크/버튼 전환을 살짝 부드럽게 */
a, button, .button, [role="button"] {
  transition: color .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease, opacity .15s ease;
}

/* 결과 테이블 행 hover 를 브랜드 톤으로 은은하게 */
#result_list tbody tr:hover > * { background-color: rgba(37,99,235,.055); }
.dark #result_list tbody tr:hover > * { background-color: rgba(120,170,255,.08); }

/* ── 스크롤 시 열 헤더(thead) 고정 — 기존 단일(창) 스크롤 그대로 ─────────
   결과 테이블은 simplebar 스크롤 영역 안이라 CSS sticky 가 안 먹는다. 이 테이블에
   한해 simplebar 의 '스크롤 컨테이너' 역할을 해제(overflow:visible)해서, 페이지(창)
   스크롤 기준으로 thead 를 고정한다. → 내부 스크롤바가 새로 생기지 않고 기존 스크롤 1개만 유지. */
div[data-simplebar]:has(#result_list),
div[data-simplebar]:has(#result_list) .simplebar-mask,
div[data-simplebar]:has(#result_list) .simplebar-offset,
div[data-simplebar]:has(#result_list) .simplebar-content-wrapper,
div[data-simplebar]:has(#result_list) .simplebar-content {
  overflow: visible !important;
}

/* 검색 + Filters 툴바도 상단 고정(사용 가능). 기본 박스의 과한 하단여백/음수마진을
   정리해 깔끔한 바로 만든다. 높이는 admin_custom.js 가 재서 --ps-thead-top 에 넣는다. */
.ps-sticky-toolbar {
  position: sticky;
  top: 0;
  z-index: 40;
  background: #ffffff;
  padding-bottom: .55rem !important;
  margin-bottom: .5rem !important;
}
.dark .ps-sticky-toolbar { background: #18181b; }

/* 열 헤더는 툴바 바로 아래에 고정 */
#result_list thead th {
  position: sticky;
  top: var(--ps-thead-top, 0px);
  z-index: 15;
  background: #f1f5fb;            /* 스크롤 시 아래 행이 비치지 않도록 불투명 배경 */
  box-shadow: inset 0 -1px 0 rgba(15, 37, 71, .12);
}
.dark #result_list thead th {
  background: #20242c;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .10);
}

/* ── 상품 목록 썸네일 + 호버 확대 미리보기 ───────────────────────── */
/* 썸네일 열너비 고정(약 70px) */
#result_list th.column-display_thumb,
#result_list td.field-display_thumb {
  width: 70px; min-width: 70px; max-width: 70px;
  text-align: center; padding-left: 8px; padding-right: 8px;
}

.ps-thumb {
  width: 52px; height: 52px; object-fit: cover; border-radius: 8px;
  border: 1px solid rgba(15, 37, 71, .10); background: #eef2f7; display: block;
}
.dark .ps-thumb { border-color: rgba(255, 255, 255, .10); background: #262b34; }

.ps-thumb--empty {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 22px; color: #c2ccd8;
}
.dark .ps-thumb--empty { color: #4b5563; }

.ps-thumb-link { position: relative; display: inline-block; line-height: 0; }

/* 호버 시 큰 미리보기 (같은 URL이라 추가 다운로드 없음) */
.ps-thumb-zoom {
  position: absolute; left: 62px; top: 50%;
  transform: translateY(-50%) scale(.96); transform-origin: left center;
  width: 240px; height: 240px; object-fit: cover; border-radius: 12px;
  border: 1px solid rgba(15, 37, 71, .12); background: #fff;
  box-shadow: 0 14px 44px rgba(0, 0, 0, .30);
  opacity: 0; visibility: hidden; pointer-events: none; z-index: 60;
  transition: opacity .15s ease, transform .15s ease;
}
.dark .ps-thumb-zoom { background: #1f232b; border-color: rgba(255, 255, 255, .12); }
.ps-thumb-link:hover .ps-thumb-zoom {
  opacity: 1; visibility: visible; transform: translateY(-50%) scale(1);
}