/* ==========================================================================
   AFFANECOM - WooCommerce loop product cards
   Loaded after Astra and WooCommerce so these rules win the cascade.

   Astra's actual loop markup, which the selectors below assume:
     li.product
       div.astra-shop-thumbnail-wrap
         a.woocommerce-loop-product__link  > span.affan-flags + img
         span.ast-onsale-card              (hidden, ours carries the %)
         a.ast-select-options-trigger      (hidden, duplicate of the CTA)
       div.astra-shop-summary-wrap
         span.ast-woo-product-category
         a.ast-loop-product__link > h2.woocommerce-loop-product__title
         span.price
         a.button.add_to_cart_button
       div.tinv-wraper                     (wishlist heart)
   Title, price and CTA sit in the summary wrapper, not in the product link.
   ========================================================================== */

/* Grid ------------------------------------------------------------------- */
.woocommerce ul.products,
ul.products{
	display:grid !important;
	grid-template-columns:repeat(4,minmax(0,1fr));
	gap:24px !important;
	margin:0 !important;
	padding:0 !important;
	list-style:none !important;
}
ul.products::before,
ul.products::after{ content:none !important; }
ul.products.columns-3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
ul.products.columns-2{ grid-template-columns:repeat(2,minmax(0,1fr)); }

@media (max-width:1024px){
	.woocommerce ul.products,
	ul.products{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:820px){
	.woocommerce ul.products,
	ul.products{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px !important; }
}

/* Card ------------------------------------------------------------------- */
.woocommerce ul.products li.product,
ul.products li.product{
	width:auto !important;
	margin:0 !important;
	padding:0 !important;
	float:none !important;
	clear:none !important;
	position:relative;
	display:flex !important;
	flex-direction:column;
	background:#fff;
	border:1px solid #E8E8E4;
	border-radius:16px;
	overflow:hidden;
	transition:transform .22s cubic-bezier(.22,.61,.36,1),
	           box-shadow .22s cubic-bezier(.22,.61,.36,1),
	           border-color .22s cubic-bezier(.22,.61,.36,1);
}
ul.products li.product:hover,
ul.products li.product:focus-within{
	transform:translateY(-5px);
	border-color:#DCDCD6;
	box-shadow:0 16px 38px rgba(37,37,37,.11);
}

/* Media box -------------------------------------------------------------- */
ul.products li.product .astra-shop-thumbnail-wrap{
	position:relative;
	display:block;
	overflow:hidden;
	background:#F7F7F5;
	margin:0 !important;
	padding:0 !important;
	line-height:0;
}
ul.products li.product a.woocommerce-loop-product__link{
	position:static;
	display:block;
	text-decoration:none;
}
ul.products li.product .astra-shop-thumbnail-wrap img{
	width:100% !important;
	height:auto;
	aspect-ratio:1/1;
	object-fit:cover;
	display:block;
	margin:0 !important;
	padding:0 !important;
	border-radius:0 !important;
	transition:transform .55s cubic-bezier(.22,.61,.36,1);
}
ul.products li.product:hover .astra-shop-thumbnail-wrap img{
	transform:scale(1.06);
}

/* Summary ---------------------------------------------------------------- */
ul.products li.product .astra-shop-summary-wrap{
	display:flex;
	flex-direction:column;
	align-items:stretch;
	flex:1;
	gap:0;
	padding:15px 16px 17px !important;
	margin:0 !important;
	text-align:left !important;
}

ul.products li.product .ast-woo-product-category{
	display:block;
	margin:0 0 7px !important;
	padding:0 !important;
	font-family:"Inter",sans-serif;
	font-size:.68rem !important;
	font-weight:800;
	letter-spacing:.11em;
	text-transform:uppercase;
	line-height:1.3;
	color:#9A9A93 !important;
}

ul.products li.product a.ast-loop-product__link{
	display:block;
	text-decoration:none;
}
ul.products li.product .woocommerce-loop-product__title{
	font-family:"Plus Jakarta Sans","Inter",sans-serif !important;
	font-size:.95rem !important;
	font-weight:700 !important;
	line-height:1.42 !important;
	color:#252525 !important;
	padding:0 !important;
	margin:0 !important;
	transition:color .18s ease;
}
ul.products li.product:hover .woocommerce-loop-product__title{ color:#B85A0E !important; }

ul.products li.product .star-rating{
	margin:9px 0 0 !important;
	font-size:.8rem;
	color:#F47C20;
}

/* Price is pushed to the bottom so CTAs line up across uneven titles. */
ul.products li.product .price{
	display:flex !important;
	align-items:baseline;
	flex-wrap:wrap;
	gap:9px;
	padding:0 !important;
	margin:auto 0 0 !important;
	padding-top:10px !important;
	font-family:"Plus Jakarta Sans","Inter",sans-serif;
	font-size:1.05rem;
	font-weight:800;
	color:#252525;
}
ul.products li.product .price .wmc-cache-pid{
	display:flex;
	align-items:baseline;
	flex-wrap:wrap;
	gap:9px;
}
ul.products li.product .price ins{
	text-decoration:none !important;
	background:transparent;
	font-weight:800;
	color:#252525;
	order:1;
}
ul.products li.product .price del{
	font-size:.84rem;
	font-weight:500;
	color:#9A9A93;
	opacity:1;
	order:2;
}

/* Add to cart ------------------------------------------------------------ */
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product a.added_to_cart,
ul.products li.product .astra-shop-summary-wrap .button{
	display:flex !important;
	align-items:center;
	justify-content:center;
	width:100%;
	margin:14px 0 0 !important;
	padding:12px 16px !important;
	border:0 !important;
	border-radius:10px !important;
	background:#252525 !important;
	color:#fff !important;
	font-family:"Inter",sans-serif !important;
	font-size:.85rem !important;
	font-weight:700 !important;
	letter-spacing:.01em;
	line-height:1.3 !important;
	text-align:center;
	text-decoration:none !important;
	text-transform:none !important;
	box-shadow:none !important;
	transition:background-color .18s ease, color .18s ease;
}
.woocommerce ul.products li.product .button.add_to_cart_button:hover,
.woocommerce ul.products li.product .button.add_to_cart_button:focus-visible,
ul.products li.product .astra-shop-summary-wrap .button:hover,
ul.products li.product .astra-shop-summary-wrap .button:focus-visible{
	background:#B85A0E !important;
	color:#fff !important;
}
.woocommerce ul.products li.product .button.loading::after{ top:.55em; }
ul.products li.product a.added_to_cart{
	background:#F7F7F5 !important;
	color:#252525 !important;
	margin-top:8px !important;
}
ul.products li.product .woocommerce_loop_add_to_cart_link_describedby,
ul.products li.product .astra-shop-summary-wrap > .screen-reader-text{ display:none; }

/* Flags ------------------------------------------------------------------ */
.affan-flags{
	position:absolute;
	top:12px;
	left:12px;
	z-index:3;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:7px;
	line-height:1;
	pointer-events:none;
}
.affan-flag{
	display:inline-flex;
	align-items:center;
	padding:6px 13px;
	border-radius:999px;
	font-family:"Inter",sans-serif;
	font-size:.72rem;
	font-weight:800;
	letter-spacing:.05em;
	text-transform:uppercase;
	line-height:1.2;
	white-space:nowrap;
	box-shadow:0 2px 8px rgba(37,37,37,.16);
}
.affan-flag--sale{ background:#F47C20; color:#fff; }
.affan-flag--new{  background:#252525; color:#fff; }
.affan-flag--low{  background:#C0392B; color:#fff; }
.affan-flag--out{  background:#6F6F6B; color:#fff; }

/* Astra's on-image chips: the sale chip has no percentage and the cart icon
   duplicates the CTA below, so both are removed rather than restyled. */
ul.products li.product .ast-onsale-card,
ul.products li.product span.onsale,
ul.products li.product .ast-on-card-button.ast-select-options-trigger{
	display:none !important;
}

/* Wishlist heart (TI WooCommerce Wishlist) ------------------------------- */
ul.products li.product .tinv-wraper.tinv-wishlist{
	position:absolute !important;
	top:12px;
	right:12px;
	z-index:4;
	margin:0 !important;
	padding:0 !important;
	width:38px;
	height:38px;
	line-height:1;
}
ul.products li.product .tinv-wraper .tinv-wishlist-clear,
ul.products li.product .tinv-wraper .tinvwl-tooltip{ display:none !important; }
ul.products li.product .tinvwl_add_to_wishlist_button{
	display:grid !important;
	place-items:center;
	width:38px;
	height:38px;
	margin:0 !important;
	padding:0 !important;
	border:1px solid #E8E8E4;
	border-radius:50%;
	background:rgba(255,255,255,.95);
	color:#252525;
	font-size:15px;
	line-height:1;
	box-shadow:0 2px 8px rgba(37,37,37,.12);
	transition:background .16s ease, color .16s ease, transform .16s ease;
}
ul.products li.product .tinvwl_add_to_wishlist_button::before{ margin:0 !important; }
ul.products li.product .tinvwl_add_to_wishlist-text{
	position:absolute !important;
	width:1px; height:1px;
	overflow:hidden;
	clip:rect(0 0 0 0);
	clip-path:inset(50%);
	white-space:nowrap;
}
ul.products li.product .tinvwl_add_to_wishlist_button:hover,
ul.products li.product .tinvwl_add_to_wishlist_button:focus-visible{
	background:#252525;
	color:#fff;
	transform:scale(1.08);
}
ul.products li.product .tinvwl-product-in-list .tinvwl_add_to_wishlist_button,
ul.products li.product .tinvwl_add_to_wishlist_button.tinvwl-product-already-in{
	background:#F47C20;
	border-color:#F47C20;
	color:#fff;
}

/* Small screens ---------------------------------------------------------- */
@media (max-width:480px){
	.affan-flag{ font-size:.66rem; padding:5px 10px; }
	ul.products li.product .astra-shop-summary-wrap{ padding:13px 13px 15px !important; }
	ul.products li.product .woocommerce-loop-product__title{ font-size:.88rem !important; }
	ul.products li.product .price{ font-size:.98rem; }
	.woocommerce ul.products li.product .button.add_to_cart_button{
		padding:11px 12px !important;
		font-size:.8rem !important;
	}
}

@media (prefers-reduced-motion:reduce){
	ul.products li.product,
	ul.products li.product .astra-shop-thumbnail-wrap img{ transition:none !important; }
	ul.products li.product:hover{ transform:none; }
	ul.products li.product:hover .astra-shop-thumbnail-wrap img{ transform:none; }
}