/* 상품섹션 네비 (pd-nav) 스타일 */
#pdNavHolder { position: relative; }

.pd-nav {
    background: #fff;
    z-index: 50;
}
/* 상단 고정 상태 (top/left/width는 JS가 상단 헤더 높이에 맞춰 넣어줌) */
.pd-nav.is-fixed {
    position: fixed;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

/* ── 원래 자리: 4칸 격자 (4개 이하면 1줄, 5개 이상이면 2줄) ── */
.pd-nav__track {
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--pd-cols, 4), 1fr);   /* --pd-cols는 JS가 메뉴 개수로 넣어줌 */
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
}
.pd-nav__item {
    display: block;
    height: 44px;
    padding: 0 6px;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #fff;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: -0.04em;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;          /* 칸보다 글자가 길면 … 처리 */
    transition: background .2s, color .2s;
}
.pd-nav__item.is-active {
    background: #222;
    color: #fff;
    font-weight: 700;
}

/* ── 상단 고정: 한 줄 + 가로 스크롤(드래그) ── */
.pd-nav.is-fixed .pd-nav__track {
    display: flex;
    border-left: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    cursor: grab;
    user-select: none;
}
.pd-nav__track::-webkit-scrollbar { display: none; }
.pd-nav.is-fixed .pd-nav__item {
    flex: 0 0 auto;
    min-width: 25%;                   /* 최소 4칸 너비, 글자가 길면 그만큼 늘어남 */
    padding: 0 16px;
    overflow: visible;
}
.pd-nav.is-fixed .pd-nav__item:last-child { border-right: 0; }

/* PC 마우스 드래그 중 */
.pd-nav__track.is-dragging { cursor: grabbing; }
.pd-nav__track.is-dragging .pd-nav__item { pointer-events: none; }