/* Homepage product-collection sections drawn as a fixed grid of N rows
   (home-sections/_collection_products.blade.php, setting "rows").
   A row holds as many products as the slider shows on that screen
   (HomepageSectionTypes::COLLECTION_ROW_LENGTHS); products past the last row
   are hidden, so one list serves every screen. Generated: 6 rows x 5 screens. */

.pf-product-rows {
    display: grid;
    gap: 12px;
}

@media (max-width: 575.98px) {
    .pf-product-rows {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pf-product-rows--r1 > :nth-child(n + 3) {
        display: none;
    }

    .pf-product-rows--r2 > :nth-child(n + 5) {
        display: none;
    }

    .pf-product-rows--r3 > :nth-child(n + 7) {
        display: none;
    }

    .pf-product-rows--r4 > :nth-child(n + 9) {
        display: none;
    }

    .pf-product-rows--r5 > :nth-child(n + 11) {
        display: none;
    }

    .pf-product-rows--r6 > :nth-child(n + 13) {
        display: none;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .pf-product-rows {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .pf-product-rows--r1 > :nth-child(n + 4) {
        display: none;
    }

    .pf-product-rows--r2 > :nth-child(n + 7) {
        display: none;
    }

    .pf-product-rows--r3 > :nth-child(n + 10) {
        display: none;
    }

    .pf-product-rows--r4 > :nth-child(n + 13) {
        display: none;
    }

    .pf-product-rows--r5 > :nth-child(n + 16) {
        display: none;
    }

    .pf-product-rows--r6 > :nth-child(n + 19) {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .pf-product-rows {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .pf-product-rows--r1 > :nth-child(n + 5) {
        display: none;
    }

    .pf-product-rows--r2 > :nth-child(n + 9) {
        display: none;
    }

    .pf-product-rows--r3 > :nth-child(n + 13) {
        display: none;
    }

    .pf-product-rows--r4 > :nth-child(n + 17) {
        display: none;
    }

    .pf-product-rows--r5 > :nth-child(n + 21) {
        display: none;
    }

    .pf-product-rows--r6 > :nth-child(n + 25) {
        display: none;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .pf-product-rows {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .pf-product-rows--r1 > :nth-child(n + 6) {
        display: none;
    }

    .pf-product-rows--r2 > :nth-child(n + 11) {
        display: none;
    }

    .pf-product-rows--r3 > :nth-child(n + 16) {
        display: none;
    }

    .pf-product-rows--r4 > :nth-child(n + 21) {
        display: none;
    }

    .pf-product-rows--r5 > :nth-child(n + 26) {
        display: none;
    }

    .pf-product-rows--r6 > :nth-child(n + 31) {
        display: none;
    }
}

@media (min-width: 1200px) {
    .pf-product-rows {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .pf-product-rows--r1 > :nth-child(n + 7) {
        display: none;
    }

    .pf-product-rows--r2 > :nth-child(n + 13) {
        display: none;
    }

    .pf-product-rows--r3 > :nth-child(n + 19) {
        display: none;
    }

    .pf-product-rows--r4 > :nth-child(n + 25) {
        display: none;
    }

    .pf-product-rows--r5 > :nth-child(n + 31) {
        display: none;
    }

    .pf-product-rows--r6 > :nth-child(n + 37) {
        display: none;
    }
}