:root {
    --product-icon-background: #ffffff;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
}

.product {
    border: 1px solid #DDDDDD;
    padding: 10px;
}

/* pierwsza strona jest teraz pieciokolumnowa */
@media (min-width: 757px) {
    .hotspot:not(.--list):not(.--added) .products__wrapper:not(.swiper) .products, .hotspot:not(.--list):not(.--added) .swiper:not(.swiper-initialized) .products {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }



/* zamiana z bold na normalną i zmniana wysokosci czcionki w nazwach produktów */
.product__name {
    font-weight: normal; /* lub po prostu usuń tę linię, jeśli zmienna nie jest używana */
     font-size: 14px; /* Możesz użyć innej jednostki zamiast px */
}
/* wysokość i grubość ceny na pierwszej stronie */
.price {
    color: #000;
    font-size: 1.5em;
    font-weight: bold;
}

/* 3 male banery na pierwszej stronie */
@media (min-width: 757px) {
    #main_tree5 ul {
        grid-template-columns: repeat(3, 1fr);
    }
}