0
Your Cart

botiga

/* ═══════════════════════════════════════
PRINTWO — SHOP PAGE
Desktop: 5 col | Tablet: 3 col | Mobile: 2 col
═══════════════════════════════════════ */

.woocommerce ul.products,
.woocommerce-page ul.products{
display: grid !important;
grid-template-columns: repeat(5, 1fr) !important;
gap: 16px !important;
flex-wrap: unset !important;
overflow-x: unset !important;
padding: 0 !important;
margin: 0 !important;
list-style: none;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
width: 100% !important;
min-width: unset !important;
max-width: 100% !important;
float: none !important;
margin: 0 !important;
padding: 14px !important;
background: #fff;
border: 1px solid #f0f0f0;
border-radius: 18px;
box-shadow: 0 8px 20px rgba(0,0,0,.05);
transition: .3s ease;
text-align: center;
display: flex !important;
flex-direction: column !important;
align-items: center;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover{
transform: translateY(-4px);
box-shadow: 0 16px 30px rgba(0,0,0,.09);
border-color: #e3c6f0;
}

.woocommerce ul.products li.product a,
.woocommerce-page ul.products li.product a{
display: block;
width: 100%;
}

.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img{
width: 100% !important;
height: 180px !important;
object-fit: cover !important;
object-position: center top;
border-radius: 12px !important;
display: block !important;
margin: 0 0 12px !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title{
font-size: 14px !important;
font-weight: 700 !important;
color: #111 !important;
line-height: 1.3 !important;
margin: 0 0 8px !important;
min-height: 40px;
display: flex !important;
align-items: center;
justify-content: center;
width: 100%;
}

.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price{
font-size: 15px !important;
font-weight: 700 !important;
color: #7E019D !important;
margin: 0 0 12px !important;
min-height: 24px;
width: 100%;
}

.woocommerce ul.products li.product .star-rating,
.woocommerce-page ul.products li.product .star-rating{
margin: 0 auto 10px !important;
}

.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button{
display: block !important;
width: 100% !important;
margin-top: auto !important;
background: #7E019D !important;
color: #fff !important;
border: none !important;
border-radius: 10px !important;
padding: 11px 12px !important;
font-size: 13px !important;
font-weight: 700 !important;
text-decoration: none !important;
cursor: pointer;
transition: background .2s;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce-page ul.products li.product .button:hover{
background: #680184 !important;
}

.woocommerce ul.products li.product .onsale,
.woocommerce-page ul.products li.product .onsale{
background: #7E019D !important;
color: #fff !important;
border-radius: 30px !important;
padding: 5px 10px !important;
font-size: 11px !important;
font-weight: 700 !important;
min-height: auto !important;
min-width: auto !important;
line-height: 1 !important;
top: 10px !important;
left: 10px !important;
}

/* Tablet — 3 columns */
@media(max-width: 991px){
.woocommerce ul.products,
.woocommerce-page ul.products{
grid-template-columns: repeat(3, 1fr) !important;
gap: 14px !important;
}
}

/* Mobile — 2 columns */
@media(max-width: 767px){
.woocommerce ul.products,
.woocommerce-page ul.products{
grid-template-columns: repeat(2, 1fr) !important;
gap: 10px !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
padding: 10px !important;
border-radius: 14px;
}

.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img{
height: 140px !important;
border-radius: 10px !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title{
font-size: 12px !important;
min-height: 34px;
}

.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price{
font-size: 13px !important;
}

.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button{
font-size: 11px !important;
padding: 9px 8px !important;
border-radius: 8px !important;
}
}

/* ═══════════════════════════════════════
HOMEPAGE — OUR MOST FAV PICKS
Horizontal scroll — scoped to .pw-picks-section
Add wrapper div in Custom HTML block on homepage
═══════════════════════════════════════ */

.pw-picks-section ul.products{
display: flex !important;
grid-template-columns: unset !important;
flex-wrap: nowrap !important;
overflow-x: auto !important;
gap: 18px !important;
padding: 8px 4px 18px !important;
margin: 0 !important;
align-items: stretch;
scroll-behavior: smooth;
}

.pw-picks-section ul.products::-webkit-scrollbar{ height: 7px; }

.pw-picks-section ul.products::-webkit-scrollbar-thumb{
background: #7E019D;
border-radius: 20px;
}

.pw-picks-section ul.products::-webkit-scrollbar-track{
background: #f3f3f3;
border-radius: 20px;
}

.pw-picks-section ul.products li.product{
width: 260px !important;
min-width: 260px !important;
max-width: 260px !important;
flex-shrink: 0;
margin: 0 !important;
padding: 14px !important;
border-radius: 22px;
}

.pw-picks-section ul.products li.product a img{
height: 230px !important;
border-radius: 16px !important;
}

.pw-picks-section ul.products li.product .woocommerce-loop-product__title{
font-size: 16px !important;
min-height: 44px;
}

.pw-picks-section ul.products li.product .price{
font-size: 17px !important;
}

.pw-picks-section ul.products li.product .button{
border-radius: 12px !important;
padding: 12px 16px !important;
font-size: 14px !important;
}

/* Homepage picks — mobile */
@media(max-width: 767px){

.pw-picks-section ul.products{
gap: 12px !important;
}

.pw-picks-section ul.products li.product{
width: 200px !important;
min-width: 200px !important;
max-width: 200px !important;
padding: 10px !important;
}

.pw-picks-section ul.products li.product a img{
height: 175px !important;
border-radius: 13px !important;
}

.pw-picks-section ul.products li.product .woocommerce-loop-product__title{
font-size: 14px !important;
min-height: 38px;
}

.pw-picks-section ul.products li.product .price{
font-size: 14px !important;
}

.pw-picks-section ul.products li.product .button{
font-size: 12px !important;
padding: 10px 12px !important;
}

}