.custom-related-products {
margin-bottom: 40px;
}
.custom-related-title {
font-size: 20px;
margin-bottom: 20px;
font-weight: 500;
}
.custom-products-grid {
display: grid;
gap: 10px;
list-style: none;
padding: 0;
margin: 0;
} .custom-products-cols-1 { grid-template-columns: repeat(1, 1fr); }
.custom-products-cols-2 { grid-template-columns: repeat(2, 1fr); }
.custom-products-cols-3 { grid-template-columns: repeat(3, 1fr); }
.custom-products-cols-4 { grid-template-columns: repeat(4, 1fr); }
.custom-products-cols-5 { grid-template-columns: repeat(5, 1fr); }
.custom-products-cols-6 { grid-template-columns: repeat(6, 1fr); }
.custom-products-cols-7 { grid-template-columns: repeat(7, 1fr); }
.custom-products-cols-8 { grid-template-columns: repeat(8, 1fr); } @media screen and (max-width: 992px) {
.custom-products-cols-8,
.custom-products-cols-7,
.custom-products-cols-6 {
grid-template-columns: repeat(4, 1fr);
}
.custom-products-cols-5,
.custom-products-cols-4 {
grid-template-columns: repeat(3, 1fr);
}
.custom-products-cols-3 {
grid-template-columns: repeat(3, 1fr);
}
.custom-products-cols-2,
.custom-products-cols-1 {
grid-template-columns: repeat(2, 1fr);
}
} @media screen and (max-width: 804px) {
.custom-products-cols-8,
.custom-products-cols-7,
.custom-products-cols-6,
.custom-products-cols-5,
.custom-products-cols-4,
.custom-products-cols-3,
.custom-products-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.custom-products-cols-1 {
grid-template-columns: repeat(1, 1fr);
}
}
.custom-product-item {
margin: 0;
padding: 0;
position: relative;
width: 100%;
}
.custom-product-link {
display: block;
text-decoration: none;
color: inherit;
transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
border: 1px solid #e0e0e0;
border-radius: 4px;
background-color: white;
height: 100%;
}
.custom-product-link:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
border-color: #EE4D2D;
}
.custom-product-image-wrap {
margin-bottom: 0px;
overflow: hidden;
padding-top: 10px;
padding-right: 20px;
padding-bottom: 0px;
padding-left: 20px;
position: relative;
}
.custom-product-image {
width: 100%;
height: auto;
transition: transform 0.3s ease;
margin: 0;
}
.custom-product-link:hover .custom-product-image {
transform: scale(1.00);
} .custom-sale-badge {
position: absolute;
top: 15px;
left: 15px;
background: #EE4D2D;
color: white;
padding: 4px 8px;
border-radius: 4px;
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
z-index: 2;
}
.custom-product-info {
padding: 5px 10px 10px;
}
.custom-product-title {
font-size: 14px !important;
color: black;
margin: 5px 0;
line-height: 1.4;
height: 2.8em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.custom-product-price {
color: #EE4D2D;
font-weight: 600;
display: block;
margin-top: 5px;
padding-top: 5px;
padding-bottom: 5px;
} .custom-price-regular {
color: #999;
font-size: 12px;
text-decoration: line-through;
display: block;
margin-bottom: 2px;
} .custom-price-amount {
color: #E62500;
font-size: 16px;
}
.custom-price-amount.custom-price-sale {
color: #EE4D2D;
} .custom-currency-symbol {
color: #EE4D2D;
font-size: 16px;
}
.custom-currency-symbol.custom-currency-sale {
color: #EE4D2D;
}