/* ===== Product-row carousel (Shopify Flickity parity, dependency-free) ===== */
/* .prow becomes a horizontal scroll-snap track once carousel.js tags it. */
.prow.uw-carousel {
    display: flex;
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 18px;
    padding-bottom: 4px;
}
.prow.uw-carousel::-webkit-scrollbar { display: none; }
.prow.uw-carousel .pcard {
    flex: 0 0 calc((100% - 5 * 18px) / 6); /* 6 visible per view, like Shopify */
    scroll-snap-align: start;
    min-width: 0;
}
@media (max-width: 900px) {
    .prow.uw-carousel .pcard { flex-basis: calc((100% - 2 * 14px) / 3); }
    .prow.uw-carousel { gap: 14px; }
    .views { display: none; }
}
@media (max-width: 560px) {
    .prow.uw-carousel .pcard { flex-basis: calc((100% - 14px) / 2); }
}

/* arrows: functional state */
.arrows button { transition: opacity .2s; }
.arrows button.is-off { opacity: .35; cursor: default; }
.arrows button:not(.is-off):hover { border-color: #999; }
/* a row that doesn't overflow has nothing to scroll — hide its arrows entirely
   rather than showing two permanently-dead controls */
.arrows.uw-arrows-hidden { display: none; }