bug #16190 Fix products grid (kulczy)

This PR was merged into the 1.12 branch.

Discussion
----------

| Q               | A
|-----------------|-----
| Branch?         | 1.12
| Bug fix?        | no
| New feature?    | no
| BC breaks?      | no
| Deprecations?   | no
| Related tickets | fixes #16041 
| License         | MIT

THEN
<img width="1426" alt="Screenshot 2024-04-29 at 11 40 14" src="https://github.com/Sylius/Sylius/assets/15385420/21b47fa6-7f5f-43bb-bff8-ceb656d57a16">

NOW
<img width="1426" alt="Screenshot 2024-04-29 at 11 40 35" src="https://github.com/Sylius/Sylius/assets/15385420/37d76943-dd8a-4b4b-a766-6c1a1fe79665">


Commits
-------

4cf0178 Fix products grid

src/Sylius/Bundle/ShopBundle/Resources/private/scss/theme.scss

@@ -173,7 +173,7 @@ header .ui.three.column.stackable.grid > .column:nth-child(3) .button span {
 
 #products.three.cards {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    grid-template-columns: repeat(3, minmax(240px, 1fr));
     gap: 30px;
     margin: 0 !important;
 }
@@ -326,7 +326,7 @@ header .ui.three.column.stackable.grid > .column:nth-child(3) .button span {
 
 .ui.four.doubling.cards {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    grid-template-columns: repeat(4, minmax(240px, 1fr));
     gap: 30px;
     margin: 0 !important;
 }