/* ==========================================================================
   IVONIX CATALOGUE — Lenovo-style product cards on shop / category / search
   ========================================================================== */
:root{ --navy:#192465; --gold:#dc9814; --ink:#1a1a1a; --muted:#6b7280; --line:#e6e8ee; }

/* ---- Card ---- */
ul.products li.product{
	background:#fff !important;
	border:1px solid var(--line) !important;
	border-radius:2px !important;
	padding:14px !important;
	position:relative;
	transition:box-shadow .2s, border-color .2s;
	display:flex; flex-direction:column;
}
ul.products li.product:hover{
	box-shadow:0 8px 24px rgba(16,24,64,.12) !important;
	border-color:#d2d6e2 !important;
}

/* ---- Image ---- */
ul.products li.product .woocommerce-image__wrapper{ position:relative; }
ul.products li.product .woocommerce-image__wrapper img,
ul.products li.product img.attachment-woocommerce_thumbnail{
	height:180px !important;
	width:auto !important;
	max-width:100% !important;
	margin:0 auto 6px !important;
	object-fit:contain !important;
	mix-blend-mode:multiply;
}

/* ---- Category eyebrow ---- */
ul.products li.product p.product__categories{
	font-size:11px !important; color:var(--muted) !important;
	text-transform:uppercase; letter-spacing:.3px; margin:0 0 4px !important;
}
ul.products li.product p.product__categories a{ color:var(--muted) !important; }

/* ---- Title (2-line clamp) ---- */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title{
	font-size:13px !important; font-weight:600 !important; line-height:1.35 !important;
	color:var(--ink) !important; padding:0 !important; margin:0 0 6px !important;
	min-height:35px;
	display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

/* ---- Rating ---- */
ul.products li.product .star-rating{ margin:2px 0 6px !important; font-size:14px; }

/* ---- Price + Starting at + Free delivery ---- */
.ivx-loop-starting{ display:block; font-size:11px; color:var(--muted); line-height:1.2; }
ul.products li.product .price{
	color:var(--ink) !important; font-size:17px !important; font-weight:700 !important;
	margin:0 !important;
}
ul.products li.product .price del{ font-size:12px !important; color:#9aa0ad !important; font-weight:400 !important; opacity:1; }
ul.products li.product .price ins{ text-decoration:none; }
.ivx-loop-ship{ font-size:11px; font-weight:700; color:#1a7f37; letter-spacing:.2px; margin:6px 0 2px; }

/* ---- Add to cart button (only the real cart/read-more button, NOT compare) ---- */
ul.products li.product a.add_to_cart_button,
ul.products li.product a.product_type_simple,
ul.products li.product a.product_type_variable,
ul.products li.product a.product_type_grouped,
ul.products li.product a.product_type_external,
ul.products li.product .added_to_cart{
	/* theme positions this absolutely with right:-14px -> overflows the card; inset both sides instead */
	left:14px !important; right:14px !important; width:auto !important; box-sizing:border-box !important;
	margin-top:10px !important; text-align:center;
	border-radius:2px !important; font-size:13px !important; font-weight:600 !important;
}

/* ---- Action row ABOVE the image: ☐ Compare (left) + heart (right) ----
   Reserve a strip at the top of the card; actions sit there, image starts below. */
ul.products li.product{ padding-top:44px !important; }

/* Compare: checkbox-style, top-left, plain (no pill) */
ul.products li.product a.compare.button{
	position:absolute !important; top:14px !important; left:14px !important; right:auto !important; bottom:auto !important; z-index:6;
	display:inline-flex !important; align-items:center; gap:7px;
	margin:0 !important; padding:0 !important; min-width:0 !important; width:auto !important; height:auto !important; max-height:none !important;
	background:transparent !important; border:none !important; border-radius:0 !important; box-shadow:none !important;
	color:#555 !important; font-size:12px !important; font-weight:500 !important;
	line-height:1.3 !important; text-transform:none !important; letter-spacing:0 !important;
	opacity:1 !important; visibility:visible !important;   /* theme hides compare until hover; always show it */
}
ul.products li.product a.compare.button::before{
	content:""; flex:0 0 auto; width:14px; height:14px; border:1.5px solid #b9bdc9; border-radius:3px; background:#fff;
}
ul.products li.product a.compare.button .label{ font-size:12px !important; }
ul.products li.product a.compare.button:hover{ color:var(--navy) !important; }
ul.products li.product a.compare.button:hover::before{ border-color:var(--navy) !important; }
/* checked state (product added to compare) */
ul.products li.product a.compare.button.added::before,
ul.products li.product a.compare.button.checked::before{ background:var(--navy); border-color:var(--navy); }

/* Wishlist: plain heart, top-right (no circle) */
ul.products li.product .yith-add-to-wishlist-button-block{
	position:absolute !important; top:11px !important; right:14px !important; left:auto !important; bottom:auto !important; z-index:6;
	margin:0 !important; padding:0 !important; background:transparent !important; width:auto !important; height:auto !important;
}
ul.products li.product .yith-wcwl-add-to-wishlist-button{
	width:auto !important; height:auto !important; min-width:0 !important; padding:0 !important; gap:0 !important;
	display:inline-flex !important; align-items:center;
	background:transparent !important; border:none !important; border-radius:0 !important; box-shadow:none !important;
	color:#9aa0ad !important; font-size:0 !important; line-height:0 !important; text-decoration:none;
}
ul.products li.product .yith-wcwl-add-to-wishlist-button .yith-wcwl-label{ display:none !important; }
ul.products li.product .yith-wcwl-add-to-wishlist-button .yith-wcwl-icon,
ul.products li.product .yith-wcwl-add-to-wishlist-button svg{
	width:20px !important; height:20px !important; margin:0 !important;
}
ul.products li.product .yith-wcwl-add-to-wishlist-button:hover{ color:#e23744 !important; }

/* ---- Sale badge: on the image, just under the action row (doubled class beats theme) ---- */
ul.products li.product .onsale.onsale{
	position:absolute !important; top:52px !important; left:14px !important; right:auto !important; bottom:auto !important; z-index:5;
	border-radius:4px; font-size:11px; font-weight:700; padding:3px 8px; margin:0 !important;
}