/* ============================================================
   배때지 V2 · 랭킹 스타일

   ※ 가로 캐러셀/카드/섹션헤더/탭 공용 스타일은 v2-carousel.css 로 이전했다.
        .v2c, .v2c-slide, .v2c-card__*, .v2c-sec__*, .v2c-tab
      이 파일에는 랭킹 고유 요소만 남긴다.
        - 메인 섹션 장식(트로피, TOP 배지)
        - /v2/ranking.php 더보기 페이지(세로 목록 · 브랜드 그리드 · 종류 아이콘)
   ============================================================ */

.v2rk-home,
.v2rk-page{
    --rk-ink:#16161a;
    --rk-sub:#6b6b74;
    --rk-line:#eceef1;
    --rk-bg:#fff;
    --rk-accent:#16161a;
}

/* ---------------- 메인 섹션 장식 ---------------- */
.v2rk-trophy{display:inline-flex;flex:none;color:var(--rk-sub)}
.v2rk-trophy svg{width:20px;height:20px;display:block}
.v2rk-topbadge{
    font-style:normal;font-size:12px;font-weight:800;
    padding:2px 8px;border-radius:999px;
    background:var(--rk-ink);color:#fff;letter-spacing:.02em;
}

/* ============================================================
   /v2/ranking.php — 더보기 페이지
   ============================================================ */
.v2rk-page{padding:0 16px 40px}

.v2rk-page-head{padding:20px 0 14px;border-bottom:1px solid var(--rk-line);margin-bottom:16px}
.v2rk-page-head h1{
    margin:0;font-size:21px;font-weight:800;letter-spacing:-.4px;color:var(--rk-ink);
    display:flex;align-items:center;gap:7px;
}
.v2rk-basis{margin:5px 0 0;font-size:12px;color:var(--rk-sub)}
.v2rk-page-head .v2rk-basis{margin-top:6px;font-size:12.5px}
/* ============================================================
   집계 기준 디스클로저 (2026-08-27 리디자인)
   예전 .v2rk-intro 장문(H1 아래 4줄)을 대체한다. 공용 뼈대는 v2-disclosure.css.
   ============================================================ */
.v2rk-listbar{margin:16px 0 10px}
.v2rk-listbar-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.v2rk-listttl{margin:0;font-size:15px;font-weight:800;letter-spacing:-.2px;color:var(--rk-ink)}
.v2rk-basis-btn{min-height:36px;padding:0 12px;font-size:12.5px;border-radius:999px;flex:none}
.v2rk-basis-btn .v2dc-chev{width:14px;height:14px}
.v2rk-basis-key{margin:0 0 12px;font-size:13px;line-height:1.7;font-weight:700;
    color:var(--rk-ink);word-break:keep-all;max-width:760px}
.v2rk-basis-facts{margin:0 0 12px;padding:0;display:grid;grid-template-columns:1fr;gap:1px;
    background:var(--rk-line);border:1px solid var(--rk-line);border-radius:12px;overflow:hidden}
.v2rk-basis-facts>div{display:flex;align-items:baseline;gap:10px;background:#fff;padding:11px 14px}
.v2rk-basis-facts dt{flex:none;width:72px;font-size:12px;font-weight:700;color:var(--rk-sub)}
.v2rk-basis-facts dd{margin:0;font-size:12.5px;line-height:1.6;color:var(--rk-ink);
    font-weight:600;word-break:keep-all}
.v2rk-basis-more{margin:0;font-size:12.5px;line-height:1.8;color:var(--rk-sub);
    word-break:keep-all;max-width:760px}
.v2rk-basis-more a{color:var(--rk-ink);font-weight:700;text-decoration:underline;
    text-decoration-thickness:1px;text-underline-offset:3px}
.v2rk-basis-more a:hover{text-decoration-thickness:2px}
@media (min-width:768px){
    .v2rk-listttl{font-size:16.5px}
    .v2rk-basis-facts{grid-template-columns:repeat(3,minmax(0,1fr))}
    .v2rk-basis-facts>div{flex-direction:column;gap:4px}
    .v2rk-basis-facts dt{width:auto}
    .v2rk-basis-more{font-size:13px}
}
@media (max-width:430px){
    .v2rk-listbar-row{align-items:flex-start}
    .v2rk-listttl{font-size:14.5px;line-height:1.4}
}

/* 종류 아이콘 스위처 */
.v2rk-kinds{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.v2rk-kind{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
    padding:13px 6px;border:1px solid var(--rk-line);border-radius:12px;background:#fff;
    text-decoration:none;color:var(--rk-sub);font-size:12.5px;font-weight:700;text-align:center;
    transition:border-color .15s,background .15s,color .15s;
}
.v2rk-kind svg{width:22px;height:22px}
.v2rk-kind:hover{border-color:#d6d9de;color:var(--rk-ink)}
.v2rk-kind.on{background:var(--rk-accent);border-color:var(--rk-accent);color:#fff}

/* 더보기 페이지 탭 (레거시 마크업 유지) */
.v2rk-tabs{
    display:flex;gap:7px;margin-bottom:16px;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;padding-bottom:2px;
}
.v2rk-tabs::-webkit-scrollbar{display:none}
.v2rk-tab{
    flex:0 0 auto;min-height:44px;padding:0 18px;
    border:1px solid #dcdee3;border-radius:999px;background:#fff;
    font-family:inherit;font-size:13.5px;font-weight:700;color:var(--rk-sub);
    letter-spacing:-.01em;
    cursor:pointer;white-space:nowrap;
    transition:background .15s,color .15s,border-color .15s;
}
.v2rk-tab:hover{border-color:#111;color:var(--rk-ink)}
.v2rk-tab.on{background:var(--rk-accent);border-color:var(--rk-accent);color:#fff}
.v2rk-tabs{margin-bottom:6px}
.v2rk-panel[hidden]{display:none}

/* 기준시각 구분점 */
.v2rk-basis-dot{margin:0 6px;color:#c9ccd2}

/* ============================================================
   세로 순위 목록 — 한 줄에 상품 하나 (모든 브레이크포인트 동일)
   행 구성: [순위] [대표이미지] [상품정보] [최근7일 클릭수 · 이동]
   ============================================================ */
.v2rk-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.v2rk-item{margin:0}
.v2rk-item a{
    display:grid;
    grid-template-columns:38px 68px minmax(0,1fr) auto;
    align-items:center;gap:12px;
    padding:11px;border:1px solid var(--rk-line);border-radius:14px;background:#fff;
    text-decoration:none;color:inherit;min-height:44px;
    transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease;
}
@media (hover:hover) and (pointer:fine){
    .v2rk-item a:hover{border-color:#d9dce1;box-shadow:0 6px 20px rgba(0,0,0,.05);transform:translateY(-1px)}
}

/* 순위 — 1·2·3위 메달, 4위 이하 숫자 */
.v2rk-num{
    width:36px;height:36px;display:flex;align-items:center;justify-content:center;
    font-size:15px;font-weight:800;color:#aab0b9;font-variant-numeric:tabular-nums;
    border-radius:11px;letter-spacing:-.02em;
}
.v2rk-num.is-top{color:#3a2f14}
/* 2026-08-27 : 그라데이션·컬러 그림자 제거 — 채도 낮은 배경 + 1px 라인만 */
.v2rk-num.r1{background:#f8f2e1;border:1px solid #e5d5a6;color:#6d5719}
.v2rk-num.r2{background:#f2f3f6;border:1px solid #dbdee4;color:#4a4f58}
.v2rk-num.r3{background:#f7ede4;border:1px solid #e4cfba;color:#6b4b2d}

/* 대표이미지 — 정사각형 */
.v2rk-thumb{
    width:68px;height:68px;border-radius:12px;overflow:hidden;background:#f2f3f5;
    display:flex;align-items:center;justify-content:center;flex:none;
}
.v2rk-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.v2rk-noimg{font-size:11px;color:#aeb2ba;font-weight:700}

/* 상품정보 */
.v2rk-info{min-width:0;display:flex;flex-direction:column;gap:3px}
.v2rk-brand{
    font-size:11.5px;font-weight:700;color:var(--rk-sub);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.v2rk-name{
    font-size:14px;font-weight:600;line-height:1.35;color:var(--rk-ink);
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.v2rk-price{font-size:14px;font-weight:800;color:var(--rk-ink);margin-top:1px}

/* 통계 · 이동 */
.v2rk-side{display:flex;align-items:center;gap:10px;flex:none}
.v2rk-hits{
    font-size:12px;color:var(--rk-sub);font-weight:700;white-space:nowrap;
    background:#f4f5f7;padding:5px 10px;border-radius:999px;
}
.v2rk-hits b{color:var(--rk-ink);font-weight:800;font-variant-numeric:tabular-nums}
.v2rk-go{display:flex;color:#c4c8cf}
.v2rk-go svg{width:20px;height:20px}

.v2rk-empty{
    padding:52px 20px;text-align:center;color:var(--rk-sub);font-size:14px;line-height:1.7;
    border:1px dashed var(--rk-line);border-radius:14px;background:#fafbfc;
}

/* ---------------- 모바일 (~599) : 화살표 숨김, 클릭수 소형 ---------------- */
@media (max-width:599px){
    /* 2026-08-27 : 조회수를 오른쪽에 두면 상품명 폭을 먹는다 → 본문 아래 2행으로 내린다 */
    .v2rk-item a{grid-template-columns:34px 62px minmax(0,1fr);
        grid-template-areas:"num thumb info" "num thumb meta";gap:4px 11px;padding:10px}
    .v2rk-num{grid-area:num}
    .v2rk-thumb{grid-area:thumb}
    .v2rk-info{grid-area:info}
    .v2rk-side{grid-area:meta;justify-content:flex-start;gap:6px}
    .v2rk-thumb{width:62px;height:62px}
    .v2rk-num{width:32px;height:32px;font-size:14px;border-radius:10px}
    .v2rk-go{display:none}
    .v2rk-hits{background:none;padding:0;font-size:11.5px;color:#9a9ca3}
    .v2rk-name{font-size:13.5px}
    .v2rk-price{font-size:13.5px}
}

/* ---------------- 태블릿 ---------------- */
@media (min-width:768px){
    .v2rk-page{padding:0 24px 56px;max-width:1040px;margin:0 auto}
    .v2rk-page-head h1{font-size:24px}
    .v2rk-item a{grid-template-columns:44px 84px minmax(0,1fr) auto;gap:16px;padding:13px}
    .v2rk-thumb{width:84px;height:84px}
    .v2rk-name{font-size:15px}
}

/* ---------------- PC ---------------- */
@media (min-width:1024px){
    .v2rk-page{max-width:1120px;padding:0 32px 64px}
    .v2rk-list{gap:10px}
    .v2rk-item a{grid-template-columns:48px 96px minmax(0,1fr) auto;gap:20px;padding:16px 20px}
    .v2rk-thumb{width:96px;height:96px;border-radius:14px}
    .v2rk-num{width:40px;height:40px;font-size:16px}
    .v2rk-name{font-size:15.5px}
    .v2rk-price{font-size:15px}
    .v2rk-hits{font-size:13px;padding:6px 13px}
}
@media (min-width:1440px){
    .v2rk-page{max-width:1200px}
    .v2rk-item a{grid-template-columns:52px 104px minmax(0,1fr) auto}
    .v2rk-thumb{width:104px;height:104px}
}

/* 접근성 */
.v2rk-tab:focus-visible,
.v2rk-kind:focus-visible,
.v2rk-item a:focus-visible,
.v2rk-brand-card:focus-visible{outline:2px solid #3d5afe;outline-offset:2px}
@media (prefers-reduced-motion:reduce){ .v2rk-tab,.v2rk-kind{transition:none} }

.v2rk-thumb picture{display:contents}