/* 점포가이드 매물 목록 정렬 버튼 1.5.0 (2026-10-04) — mu-plugin jumpo-list-sort.php 가 페이지 2844·2740·2842·2830 에서만 부른다
   버튼 = 사이트 «유리» 표준(프랜차이즈 순위 .fr-jump 공식 · CLAUDE.md 🎨)
   휴대폰(≤600) = 검색창 아래 오른쪽에 작은 칩 3개 — 1.1.0 👤 «모바일 버튼이 너무 커 · 당근·중고나라는 이렇게 크게 안 한다»
   1.1.1 = 그 틀을 ≤650 까지(👤 «650px 밑에는 검색창이 맨 끝까지 · 버튼은 작게 오른쪽») — 사이트 CSS 가 검색 폼에 max-width:500px 를 걸어 풀어 준다
           · 651px 이상에서 버튼이 다음 줄로 밀리면(651~669) 왼쪽 대신 오른쪽에
   (유리 표준의 «휴대폰 꽉 찬 폭» 은 페이지의 주 버튼 몫 · 정렬은 보조 버튼이라 예외) */
.jg-sort-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:24px 0 40px}
.jg-sort-row #keyword-search-form{margin:0!important;flex:1 1 360px}
/* 1.5.0 «검색결과가 없습니다» 는 정렬 버튼 아래 줄로 — 검색창·버튼은 한 줄 그대로(👤 «검색창 올라가는 거 안 이쁘다») */
.jg-sort-row #keyword-empty-message{order:3;flex-basis:100%;max-width:none!important;margin:2px 0 0 4px!important;color:#9cc9ff!important;font-size:13px}
/* 1.5.0 검색어 지우기 × — 입력칸 안 오른쪽(돋보기 버튼 60px 왼쪽) · 글자 있을 때만 · 브라우저 기본 × 는 숨김(겹치지 않게) */
.jg-sort-row #keyword-search-form{position:relative}
.jg-sort-row #keyword-search-form input[name=keyword]{padding-right:46px!important}
.jg-sort-row #keyword-search-form input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
.jg-kw-clear{position:absolute;top:50%;right:70px;transform:translateY(-50%);display:none;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;border-radius:50%;background:#e5e7eb;color:#4b5563;font-size:18px;font-weight:700;line-height:1;cursor:pointer}
.jg-kw-clear.on{display:flex}
.jg-kw-clear:hover{background:#d1d5db;color:#111827}
.jg-sort{display:flex;gap:8px;flex:none;margin-left:auto}
.jg-sort button{
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 55%,rgba(255,255,255,0)) rgba(61,125,255,.4);
  border:none;border-radius:999px;color:#fff;font-weight:700;font-size:15px;line-height:1.2;padding:12px 18px;cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(156,201,255,.34),inset 0 1px 0 rgba(255,255,255,.2),0 4px 14px rgba(2,10,26,.35);
  -webkit-backdrop-filter:blur(8px) saturate(140%);backdrop-filter:blur(8px) saturate(140%);
  transition:background-color .15s ease,box-shadow .15s ease,transform .12s ease;white-space:nowrap}
.jg-sort button:hover{background-color:rgba(76,141,255,.56);box-shadow:inset 0 0 0 1px rgba(156,201,255,.52),inset 0 1px 0 rgba(255,255,255,.26),0 8px 20px rgba(2,10,26,.42)}
.jg-sort button:active{transform:scale(.97)}
.jg-sort button:focus{outline:none}
.jg-sort button:focus-visible{outline:2px solid rgba(156,201,255,.7);outline-offset:2px}
.jg-sort button[aria-pressed="true"]{background-color:rgba(76,141,255,.78);box-shadow:inset 0 0 0 1px rgba(200,225,255,.7),inset 0 1px 0 rgba(255,255,255,.3),0 6px 18px rgba(2,10,26,.45)}
.jg-sort button[disabled]{opacity:.6;cursor:progress}
/* 정확도·거리 목록 */
.jg-sort-note{margin:-24px 0 18px;color:#9cc9ff;font-size:14px}
.jg-sort-dist{display:inline-block;margin:2px 0 8px;padding:3px 10px;border-radius:999px;background:rgba(61,125,255,.22);color:#cfe3ff;font-size:13px;font-weight:700}
.jg-sort-more{display:flex;justify-content:center;margin:8px 0 40px}
.jg-sort-more button{
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 55%,rgba(255,255,255,0)) rgba(61,125,255,.4);
  border:none;border-radius:999px;color:#fff;font-weight:700;font-size:15px;padding:12px 28px;cursor:pointer;
  box-shadow:inset 0 0 0 1px rgba(156,201,255,.34),inset 0 1px 0 rgba(255,255,255,.2),0 4px 14px rgba(2,10,26,.35)}
.jg-sort-more button:hover{background-color:rgba(76,141,255,.56)}
/* 1.2.1 당겨서 다른 추천 — 맨 위 가운데 유리 알약(손가락을 따라 내려온다) */
.jg-ptr{position:fixed;top:0;left:50%;transform:translate(-50%,-60px);z-index:99990;padding:9px 16px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.03) 55%,rgba(255,255,255,0)) rgba(30,60,120,.85);color:#fff;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:inset 0 0 0 1px rgba(156,201,255,.34),0 6px 18px rgba(2,10,26,.45);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.jg-ptr.on{transition:none}
.jg-ptr.ready{background-color:rgba(76,141,255,.9)}
@media (max-width:650px){
  .jg-sort-row{gap:10px;margin:16px 0 20px}
  .jg-sort-row #keyword-search-form{flex-basis:100%;max-width:none!important}
  .jg-sort{width:100%;justify-content:flex-end;gap:6px}
  .jg-sort button{padding:7px 13px;font-size:13px;font-weight:600;
    box-shadow:inset 0 0 0 1px rgba(156,201,255,.3),inset 0 1px 0 rgba(255,255,255,.16),0 2px 8px rgba(2,10,26,.3)}
  .jg-sort-note{margin:-8px 0 12px;font-size:13px;word-break:keep-all}
  .jg-sort-more button{width:100%}
}