/* This CSS is for the product thumbnail scroller */
/* 只显示6张缩略图，溢出隐藏，宽度固定 */

.thumbs-outer {
    overflow: visible !important;
    width: calc(6 * 6rem + 5 * 0.75rem) !important; /* 6个缩略图+5个间距 */
    max-width: 100% !important;
    display: block !important;
    position: relative !important;
}

[data-role="thumbs"] {
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    box-sizing: content-box;
    scrollbar-width: none;
}
[data-role="thumbs"]::-webkit-scrollbar {
    display: none;
}

/* Ensure the track itself doesn't shrink and allows scrolling */
[data-role="thumbs-track"] {
    display: flex;
    min-width: 100%;
    width: max-content;
    box-sizing: border-box;
}

/* Hide scrollbar consistently */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
.no-scrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari, and Opera */
}

.thumb-prev { left: -1.25rem !important; }
.thumb-next { right: -1.25rem !important; }

.thumb-nav:hover,
.thumb-nav:active {
  transform: translateY(-50%) !important;
  /* 去除 transform/translateY，防止箭头悬停时跳动 */
  box-shadow: 0 2px 8px rgba(0,0,0,0.10);
  background: #fff;
}
