/* =========================================
   Product Loop Card (HyperDAF) — Clean + Stable
   Location: /assets/css/product-loop.css
   Purpose:
   - Shop + homepage product loop card UI.
   - Keeps custom actions stable when modules are ON/OFF.
   - Wishlist OFF: add-to-cart becomes full-width centered button.
   - AJAX add-to-cart: no visible text, cart icon swaps to tick icon.
========================================= */

/* Woo grid safety */
.woocommerce ul.products {
	position: relative;
	z-index: 0;
	gap: 2px !important;
	isolation: isolate;
	overflow: visible !important;
}

.woocommerce ul.products li.product {
	position: relative;
	z-index: 1;
	padding: 0 !important;
	overflow: visible !important;
}

.woocommerce ul.products li.product:hover {
	z-index: 20;
}

.woocommerce .up-sells,
.woocommerce .upsells,
.woocommerce .related,
.woocommerce .cross-sells {
	overflow: visible !important;
}

.woocommerce ul.products > li.product > a,
.woocommerce ul.products > li.product .woocommerce-LoopProduct-link,
.woocommerce ul.products > li.product .woocommerce-loop-product__link {
	padding: 0 !important;
}

.hdaf-product-card {
	list-style: none;
	border: 0 !important;
	border-radius: 0 !important;
}

/* Card shell */
.hdaf-pl {
	padding: 6px 15px 0;
	background: #fff;
	border: 0 !important;
	border-radius: 0 !important;
	transition: box-shadow .18s ease, transform .18s ease;
}

.woocommerce ul.products li.product:hover .hdaf-pl {
	box-shadow: 0 0 8px rgba(0, 0, 0, .3);
}

/* Category */
.hdaf-pl__cat {
	display: block;
	max-width: 100%;
	min-width: 0;
	overflow: hidden;
	color: rgba(0, 0, 0, .65);
	font-size: 14px;
	text-decoration: none;
	text-overflow: ellipsis;
	text-transform: uppercase;
	white-space: nowrap;
}

.hdaf-pl__cat:hover {
	color: rgba(0, 0, 0, .92);
	text-decoration: underline;
}

/* Media */
.hdaf-pl__media {
	position: relative;
	padding: 0;
	background: #fff;
	border: 0 !important;
	border-radius: 10px;
	overflow: hidden;
}

.hdaf-pl__mediaLink {
	display: block;
	color: inherit;
	text-decoration: none;
}

.hdaf-pl__media img {
	display: block;
	width: 100%;
	height: auto;
}

.woocommerce ul.products li.product:hover .hdaf-pl__media img {
	filter: brightness(80%);
	transition: filter .18s ease;
}

/* Product loop sale badge
   - Replaces WooCommerce default circular sale flash inside HyperDAF product cards.
   - Matches the clean green pill badge used by the upper homepage sale products. */
.hdaf-pl__sale-badge {
	position: absolute !important;
	top: 6px !important;
	right: 6px !important;
	bottom: auto !important;
	left: auto !important;
	z-index: 9 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	min-width: 44px !important;
	max-width: max-content !important;
	height: auto !important;
	min-height: 24px !important;
	margin: 0 !important;
	padding: 6px 10px !important;
	background: #64bd43 !important;
	border: 0 !important;
	border-radius: 999px !important;
	box-shadow: 0 5px 12px rgba(100, 189, 67, .24) !important;
	color: #ffffff !important;
	font-size: 11px !important;
	font-weight: 850 !important;
	line-height: 1 !important;
	letter-spacing: .03em !important;
	text-align: center !important;
	text-transform: uppercase !important;
	white-space: nowrap !important;
	pointer-events: none;
}

.hdaf-pl__sale-badge::before,
.hdaf-pl__sale-badge::after {
	display: none !important;
	content: none !important;
}

@media (max-width: 560px) {
	.hdaf-pl__sale-badge {
		top: 5px !important;
		right: 5px !important;
		min-width: 40px !important;
		min-height: 22px !important;
		padding: 5px 9px !important;
		font-size: 10px !important;
	}
}

/* Title */
.hdaf-pl__link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.hdaf-pl__title {
	display: -webkit-box;
	min-height: calc(1.35em * 2.5);
	max-height: calc(1.35em * 2.5);
	margin-top: 0 !important;
	margin-bottom: 6px;
	color: #0e5aa7;
	font-size: 16px;
	line-height: 1.35;
	transform: translateY(-20px);
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.hdaf-pl__link:hover .hdaf-pl__title {
	color: #0b3a6f;
	text-decoration: underline;
}

/* Rows */
.hdaf-pl__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.hdaf-pl__row--meta {
	margin-top: 10px !important;
}

.hdaf-pl__row--meta,
.hdaf-pl__row--actions {
	transform: translateY(-15px);
}

.hdaf-pl__row--actions {
	margin-top: 0 !important;
}

/* =========================================
   Module-aware action layout
========================================= */
.hdaf-pl__row--actions:has(.hdaf-pl__wish) {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.hdaf-pl__row--actions:not(:has(.hdaf-pl__wish)) {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	width: 100%;
}

.hdaf-pl__row--actions:not(:has(.hdaf-pl__wish)) .hdaf-pl__compare {
	grid-column: 1;
	justify-self: start;
}

.hdaf-pl__row--actions:not(:has(.hdaf-pl__wish)) .hdaf-pl__atc {
	grid-column: 2;
	justify-self: stretch;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	height: 36px;
	min-height: 36px !important;
	max-height: 36px !important;
	border-radius: 999px !important;
	flex: 1 1 auto !important;
	aspect-ratio: auto;
}

.hdaf-pl__row--actions:not(:has(.hdaf-pl__wish)):not(:has(.hdaf-pl__compare)) {
	grid-template-columns: minmax(0, 1fr);
}

.hdaf-pl__row--actions:not(:has(.hdaf-pl__wish)):not(:has(.hdaf-pl__compare)) .hdaf-pl__atc {
	grid-column: 1;
	justify-self: stretch;
	width: 100% !important;
}

/* Fallback for browsers without :has() */
@supports not selector(:has(*)) {
	.hdaf-pl__row--actions {
		justify-content: center;
	}

	.hdaf-pl__row--actions .hdaf-pl__compare {
		margin-right: auto;
	}

	.hdaf-pl__row--actions .hdaf-pl__atc {
		margin-inline: auto !important;
	}
}

/* Price */
.hdaf-pl__price,
.hdaf-pl__price .amount {
	color: #000 !important;
	font-size: 16px !important;
	font-weight: 650 !important;
}

.hdaf-pl__price del {
	opacity: .55;
}

.hdaf-pl__price ins {
	text-decoration: none;
}

/* Rating */
.hdaf-stars {
	position: relative;
	display: inline-block;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 1px;
}

.hdaf-stars__base {
	color: rgba(0, 0, 0, .22);
}

.hdaf-stars__fill {
	position: absolute;
	top: 0;
	left: 0;
	color: #f5a623;
	white-space: nowrap;
	overflow: hidden;
}

.hdaf-pl__rating {
	transform: translateY(-5px);
}

/* Wishlist action */
.hdaf-pl__wish {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	padding: 0;
	background: transparent !important;
	border: 0 !important;
	border-radius: 50%;
	cursor: pointer;
}

.hdaf-pl__icon--wish {
	display: block;
	width: 28px;
	height: 28px;
	background: url("../icons/wishlist.svg") center / 28px 28px no-repeat;
}

/* =========================================
   Add to cart
   - Default icon: assets/icons/add-to-cart.svg
   - Added icon : assets/icons/tick.svg
   - No visible text after AJAX.
========================================= */
.hdaf-pl__atc {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 34px !important;
	width: 34px;
	min-width: 34px !important;
	max-width: 34px !important;
	height: 34px;
	min-height: 34px !important;
	max-height: 34px !important;
	margin: 0 !important;
	padding: 0 !important;
	background-color: #ff7a00 !important;
	border: 0 !important;
	border-radius: 50% !important;
	box-sizing: border-box;
	aspect-ratio: 1 / 1;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px;
	white-space: nowrap;
	overflow: hidden;
	transition: width .16s ease, border-radius .16s ease, background-color .16s ease, transform .16s ease;
}

.hdaf-pl__atc:hover {
	background-color: #f97316 !important;
	transform: translateY(-1px);
}

.hdaf-pl__atc:focus-visible {
	outline: 2px solid rgba(255, 122, 0, .35);
	outline-offset: 2px;
}

.hdaf-pl__icon--atc {
	display: block;
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	margin: 0 !important;
	padding: 0 !important;
	background: url("../icons/add-to-cart.svg") center / 18px 18px no-repeat;
	filter: brightness(0) invert(1);
	text-indent: 0;
}

.hdaf-pl__atc.is-added {
	background-color: #16a34a !important;
}

.hdaf-pl__atc.is-added .hdaf-pl__icon--atc,
.hdaf-pl__atc.added .hdaf-pl__icon--atc {
	background-image: url("../icons/tick.svg");
}

.hdaf-pl__atc.loading {
	opacity: .82;
	pointer-events: none;
}

.hdaf-pl__atc.loading::after,
.hdaf-pl__atc.added::after {
	display: none !important;
	content: none !important;
}

/* Remove WooCommerce injected view-cart text/link in product cards */
.hdaf-pl__row--actions .added_to_cart,
.hdaf-pl__row--actions .wc-forward,
.hdaf-pl .added_to_cart,
.hdaf-pl .wc-forward {
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	font-size: 0 !important;
	line-height: 0 !important;
	overflow: hidden !important;
}

/* Legacy wishlist action support */
.hdaf-pl-action--wishlist {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	margin: 0;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.hdaf-pl-action--wishlist::before {
	display: block;
	width: 20px;
	height: 20px;
	background-image: var(--hdaf-wish-ico) !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: contain !important;
	background-color: transparent !important;
	content: "" !important;
	-webkit-mask: none !important;
	mask: none !important;
}

.hdaf-pl-action--wishlist.is-added::before {
	background-image: none !important;
	background-color: #000 !important;
	-webkit-mask-image: var(--hdaf-wish-ico) !important;
	mask-image: var(--hdaf-wish-ico) !important;
	-webkit-mask-repeat: no-repeat !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-position: center !important;
	mask-position: center !important;
	-webkit-mask-size: contain !important;
	mask-size: contain !important;
}

.hdaf-pl-action--wishlist:hover {
	opacity: .9;
}

.hdaf-pl-action--wishlist.is-loading {
	pointer-events: none;
	opacity: .6;
}

.hdaf-pl-action--wishlist:focus-visible {
	outline: 2px solid rgba(0, 0, 0, .25);
	outline-offset: 2px;
}

/* Wishlist page grid */
.hdaf-wishlist-page ul.products {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 18px;
}

@media (max-width: 1200px) {
	.hdaf-wishlist-page ul.products {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (max-width: 900px) {
	.hdaf-wishlist-page ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.hdaf-wishlist-page ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Pagination */
.woocommerce nav.woocommerce-pagination {
	margin: 24px 0 0 !important;
	text-align: center;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	list-style: none !important;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers li {
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers li a,
.woocommerce nav.woocommerce-pagination ul.page-numbers li span {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 40px;
	height: 40px;
	padding: 0 12px !important;
	background: transparent !important;
	border: 1px solid rgba(0, 0, 0, .18) !important;
	border-radius: 999px;
	box-shadow: none !important;
	color: rgba(0, 0, 0, .9) !important;
	filter: none !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-decoration: none !important;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers li span.current {
	background: #ff7a00 !important;
	border-color: #ff7a00 !important;
	color: #fff !important;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers li a:hover {
	background: transparent !important;
	border-color: rgba(0, 0, 0, .35) !important;
}

@media (max-width: 900px) {
	.woocommerce nav.woocommerce-pagination ul.page-numbers {
		gap: 8px !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers li a,
	.woocommerce nav.woocommerce-pagination ul.page-numbers li span {
		min-width: 36px;
		height: 36px;
		padding: 0 10px !important;
		font-weight: 700 !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers:not(.prev):not(.next),
	.woocommerce nav.woocommerce-pagination ul.page-numbers li span.page-numbers:not(.current):not(.dots) {
		display: none !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers li:first-child a.page-numbers,
	.woocommerce nav.woocommerce-pagination ul.page-numbers li:nth-last-child(2) a.page-numbers {
		display: inline-flex !important;
	}
}

@media (max-width: 600px) {
	.woocommerce nav.woocommerce-pagination {
		margin-top: 18px !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers {
		gap: 6px !important;
		padding: 0 10px !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers li a,
	.woocommerce nav.woocommerce-pagination ul.page-numbers li span {
		min-width: 32px;
		height: 32px;
		padding: 0 8px !important;
		font-size: 13px !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers li a.page-numbers:not(.prev):not(.next),
	.woocommerce nav.woocommerce-pagination ul.page-numbers li span.page-numbers:not(.current):not(.dots) {
		display: none !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers li:first-child a.page-numbers,
	.woocommerce nav.woocommerce-pagination ul.page-numbers li:nth-last-child(2) a.page-numbers {
		display: inline-flex !important;
	}
}

/* =========================================
   Quick View Product Card Button — Final
   - Outside product anchor
   - Parent orange + white text
   - Hover darker orange
   - Desktop hover only
========================================= */
.hdaf-pl__media .hdaf-qv-trigger,
.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger {
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	z-index: 8 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	min-width: 108px !important;
	max-width: calc(100% - 28px) !important;
	height: 38px !important;
	min-height: 38px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 1px solid #ff7a00 !important;
	border-radius: 999px !important;
	background: #ff7a00 !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-decoration: none !important;
	text-indent: 0 !important;
	white-space: nowrap !important;
	box-shadow: none !important;
	cursor: pointer !important;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%) scale(.98) !important;
	transition: opacity .16s ease, transform .16s ease, background-color .16s ease, border-color .16s ease !important;
}

@media (hover: hover) and (pointer: fine) {
	.hdaf-pl:hover .hdaf-pl__media .hdaf-qv-trigger,
	.hdaf-pl__media:hover .hdaf-qv-trigger {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translate(-50%, -50%) scale(1) !important;
	}

	.hdaf-pl__media .hdaf-qv-trigger:hover,
	.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger:hover {
		background: #e85b00 !important;
		border-color: #e85b00 !important;
		color: #fff !important;
		transform: translate(-50%, -50%) translateY(-1px) scale(1) !important;
	}

	.hdaf-pl__media .hdaf-qv-trigger:active,
	.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger:active {
		transform: translate(-50%, -50%) scale(.98) !important;
	}
}

.hdaf-pl__media .hdaf-qv-trigger:focus-visible {
	opacity: 1 !important;
	pointer-events: auto !important;
	outline: 2px solid rgba(255, 122, 0, .35) !important;
	outline-offset: 3px !important;
}

@media (hover: none) {
	.hdaf-pl__media .hdaf-qv-trigger,
	.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger {
		display: none !important;
	}
}

/* =========================================
   Product Card Action Position Polish
   - Compare icon 10px lower
   - Quick View 25px higher
   - Quick View remains clickable wherever card renders
========================================= */
.hdaf-pl__compare {
	transform: translateY(10px);
}

.hdaf-pl__media .hdaf-qv-trigger,
.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger {
	top: calc(50% - 25px) !important;
	z-index: 30 !important;
}

@media (hover: hover) and (pointer: fine) {
	.hdaf-pl:hover .hdaf-pl__media .hdaf-qv-trigger,
	.hdaf-pl__media:hover .hdaf-qv-trigger {
		transform: translate(-50%, -50%) scale(1) !important;
	}

	.hdaf-pl__media .hdaf-qv-trigger:hover,
	.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger:hover {
		transform: translate(-50%, -50%) translateY(-1px) scale(1) !important;
	}
}

/* =========================================
   Product Card Image-Hover Actions Final
   - Quick View 5px more up: total 30px above center
   - Quick View shows only when featured image/media is hovered
   - Compare shows only when featured image/media is hovered
========================================= */
.hdaf-pl__media .hdaf-qv-trigger,
.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger {
	top: calc(50% - 30px) !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

@media (hover: hover) and (pointer: fine) {
	.hdaf-pl:hover .hdaf-pl__media .hdaf-qv-trigger {
		opacity: 0 !important;
		pointer-events: none !important;
	}

	.hdaf-pl__media:hover .hdaf-qv-trigger,
	.hdaf-pl__media .hdaf-qv-trigger:hover,
	.hdaf-pl__media .hdaf-qv-trigger:focus-visible {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translate(-50%, -50%) scale(1) !important;
	}

	.hdaf-pl__media .hdaf-qv-trigger:hover,
	.hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger:hover {
		transform: translate(-50%, -50%) translateY(-1px) scale(1) !important;
	}
}

/* If compare action exists in the product card action row, show it only while media is hovered. */
@media (hover: hover) and (pointer: fine) {
	.hdaf-pl .hdaf-pl__compare {
		opacity: 0 !important;
		pointer-events: none !important;
		transition: opacity .16s ease, transform .16s ease, background-color .16s ease, border-color .16s ease !important;
	}

	.hdaf-pl__media:hover ~ .hdaf-pl__row--actions .hdaf-pl__compare,
	.hdaf-pl .hdaf-pl__compare:focus-visible {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translateY(10px) !important;
	}
}

@media (hover: none) {
	.hdaf-pl .hdaf-pl__compare {
		opacity: 1 !important;
		pointer-events: auto !important;
	}
}

/* =========================================
   Quick View Visibility + Title Layer Fix
   - Fix CSS specificity that hid Quick View
   - Quick View shows on featured image/media hover only
   - Product title stays above image/padding layer
========================================= */
.hdaf-pl__media {
	z-index: 2;
}

.hdaf-pl__link {
	position: relative;
	z-index: 5;
}

.hdaf-pl__title {
	position: relative;
	z-index: 6;
	background: #fff;
}

@media (hover: hover) and (pointer: fine) {
	.hdaf-pl .hdaf-pl__media .hdaf-qv-trigger,
	.hdaf-pl .hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger {
		opacity: 0 !important;
		pointer-events: none !important;
		top: calc(50% - 30px) !important;
	}

	.hdaf-pl:hover .hdaf-pl__media .hdaf-qv-trigger,
	.hdaf-pl:hover .hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger {
		opacity: 0 !important;
		pointer-events: none !important;
	}

	.hdaf-pl:hover .hdaf-pl__media:hover .hdaf-qv-trigger,
	.hdaf-pl:hover .hdaf-pl__media:hover .hdaf-qv-btn.hdaf-qv-trigger,
	.hdaf-pl .hdaf-pl__media:hover .hdaf-qv-trigger,
	.hdaf-pl .hdaf-pl__media:hover .hdaf-qv-btn.hdaf-qv-trigger,
	.hdaf-pl .hdaf-pl__media .hdaf-qv-trigger:hover,
	.hdaf-pl .hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger:hover,
	.hdaf-pl .hdaf-pl__media .hdaf-qv-trigger:focus-visible,
	.hdaf-pl .hdaf-pl__media .hdaf-qv-btn.hdaf-qv-trigger:focus-visible {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translate(-50%, -50%) scale(1) !important;
	}

	.hdaf-pl:hover .hdaf-pl__media:hover .hdaf-qv-trigger:hover,
	.hdaf-pl:hover .hdaf-pl__media:hover .hdaf-qv-btn.hdaf-qv-trigger:hover {
		background: #e85b00 !important;
		border-color: #e85b00 !important;
		color: #fff !important;
		transform: translate(-50%, -50%) translateY(-1px) scale(1) !important;
	}
}

/* Compare also remains image-hover only, but does not disappear while focused/clicked */
@media (hover: hover) and (pointer: fine) {
	.hdaf-pl:hover .hdaf-pl__media:hover ~ .hdaf-pl__link ~ .hdaf-pl__row--actions .hdaf-pl__compare,
	.hdaf-pl .hdaf-pl__compare:focus-visible {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translateY(10px) !important;
	}
}

/* =========================================
   Product Card Title + Compare Clean Final
   - Title 4px lower than original (-20px -> -16px)
   - Compare shows only while featured image/media is hovered
   - No Quick View CSS touched
========================================= */

/* Title always above media/padding layer and 4px lower */
.hdaf-pl__link {
	position: relative !important;
	z-index: 40 !important;
}

.hdaf-pl__title {
	position: relative !important;
	z-index: 41 !important;
	background: #fff !important;
	transform: translateY(-16px) !important;
	overflow: hidden !important;
}

/* Compare: image/media hover only on desktop pointer devices */
@media (hover: hover) and (pointer: fine) {
	.hdaf-pl .hdaf-pl__compare {
		opacity: 0 !important;
		pointer-events: none !important;
		transform: translateY(10px) !important;
		transition: opacity .16s ease, transform .16s ease, background-color .16s ease, border-color .16s ease !important;
	}

	/* Full product-card hover must not reveal compare */
	.hdaf-pl:hover .hdaf-pl__compare {
		opacity: 0 !important;
		pointer-events: none !important;
	}

	/* Only featured image/media hover reveals compare */
	.hdaf-pl .hdaf-pl__media:hover ~ .hdaf-pl__link ~ .hdaf-pl__row--actions .hdaf-pl__compare,
	.hdaf-pl:hover .hdaf-pl__media:hover ~ .hdaf-pl__link ~ .hdaf-pl__row--actions .hdaf-pl__compare,
	.hdaf-pl .hdaf-pl__compare:hover,
	.hdaf-pl .hdaf-pl__compare:focus-visible {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translateY(10px) !important;
	}
}

/* Touch devices keep compare usable */
@media (hover: none) {
	.hdaf-pl .hdaf-pl__compare {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translateY(10px) !important;
	}
}

/* =========================================
   Product Card Title Front Layer Fix
   - Title must render above feature image/padding layer
   - Keep title readable and visible in every product card render area
   - Quick View CSS untouched
========================================= */
.hdaf-pl {
	position: relative !important;
	isolation: isolate !important;
	overflow: visible !important;
}

.hdaf-pl__media {
	position: relative !important;
	z-index: 1 !important;
	overflow: visible !important;
}

.hdaf-pl__mediaLink {
	position: relative !important;
	z-index: 1 !important;
	display: block !important;
	overflow: hidden !important;
	border-radius: 10px !important;
}

.hdaf-pl__link {
	position: relative !important;
	z-index: 60 !important;
	display: block !important;
	background: #fff !important;
	overflow: visible !important;
}

.hdaf-pl__title {
	position: relative !important;
	z-index: 70 !important;
	display: -webkit-box !important;
	margin-top: 0 !important;
	background: #fff !important;
	color: #0e5aa7 !important;
	transform: translateY(-16px) !important;
	overflow: hidden !important;
	-webkit-box-orient: vertical !important;
	-webkit-line-clamp: 2 !important;
}

.hdaf-pl__row--meta,
.hdaf-pl__row--actions {
	position: relative !important;
	z-index: 55 !important;
	background: #fff !important;
}

/* =========================================
   Product Card Price/Rating/Actions Front Layer Fix
   - Wishlist, add-to-cart, price and rating stay above image/padding layer
   - Prevent icons from hiding behind media/padding in every product card render area
   - Quick View CSS untouched
========================================= */
.hdaf-pl__row--meta,
.hdaf-pl__row--actions {
	position: relative !important;
	z-index: 75 !important;
	background: #fff !important;
	isolation: isolate !important;
	overflow: visible !important;
}

.hdaf-pl__price,
.hdaf-pl__rating,
.hdaf-stars,
.hdaf-pl__wish,
.hdaf-pl-action--wishlist,
.hdaf-pl__compare,
.hdaf-pl__atc {
	position: relative !important;
	z-index: 80 !important;
}

.hdaf-pl__wish,
.hdaf-pl-action--wishlist,
.hdaf-pl__compare,
.hdaf-pl__atc {
	overflow: visible !important;
	transform-style: flat !important;
}

.hdaf-pl__icon--wish,
.hdaf-pl__icon--compare,
.hdaf-pl__icon--atc,
.hdaf-pl-action--wishlist::before {
	position: relative !important;
	z-index: 82 !important;
}

/* Keep compare's approved lower position while lifting it above layers */
.hdaf-pl__compare {
	transform: translateY(10px) !important;
}

/* Touch devices keep action icons fully usable and visible */
@media (hover: none) {
	.hdaf-pl__wish,
	.hdaf-pl-action--wishlist,
	.hdaf-pl__compare,
	.hdaf-pl__atc {
		opacity: 1 !important;
		pointer-events: auto !important;
	}
}


/* =========================================
   Product Card Compare Media-Hover Fix
   - Compare button now lives inside featured image/media.
   - Full product-card hover does NOT reveal compare.
   - Only featured image/media hover reveals compare, same behavior as Quick View.
========================================= */
.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media {
	position: absolute !important;
	right: 14px !important;
	top: 14px !important;
	z-index: 35 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 38px !important;
	min-width: 38px !important;
	max-width: 38px !important;
	height: 38px !important;
	min-height: 38px !important;
	max-height: 38px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid rgba(255, 255, 255, .9) !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, .96) !important;
	box-shadow: 0 8px 18px rgba(0, 0, 0, .18) !important;
	cursor: pointer !important;
	transform: translateY(-4px) scale(.96) !important;
	transition: opacity .16s ease, transform .16s ease, background-color .16s ease, border-color .16s ease !important;
}

.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media .hdaf-pl__icon--compare {
	display: block !important;
	width: 19px !important;
	height: 19px !important;
	background: url("../icons/compare.svg") center / 19px 19px no-repeat !important;
}

@media (hover: hover) and (pointer: fine) {
	.hdaf-pl .hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media,
	.hdaf-pl:hover .hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media {
		opacity: 0 !important;
		pointer-events: none !important;
		transform: translateY(-4px) scale(.96) !important;
	}

	.hdaf-pl .hdaf-pl__media:hover .hdaf-pl__compare.hdaf-pl__compare--media,
	.hdaf-pl:hover .hdaf-pl__media:hover .hdaf-pl__compare.hdaf-pl__compare--media,
	.hdaf-pl .hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media:hover,
	.hdaf-pl .hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media:focus-visible {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translateY(0) scale(1) !important;
	}

	.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media:hover,
	.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media[aria-pressed="true"] {
		background: #ff7a00 !important;
		border-color: #ff7a00 !important;
	}

	.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media:hover .hdaf-pl__icon--compare,
	.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media[aria-pressed="true"] .hdaf-pl__icon--compare {
		filter: brightness(0) invert(1) !important;
	}
}

.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media:focus-visible {
	outline: 2px solid rgba(255, 122, 0, .35) !important;
	outline-offset: 3px !important;
}

@media (hover: none) {
	.hdaf-pl__media .hdaf-pl__compare.hdaf-pl__compare--media {
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: translateY(0) scale(1) !important;
	}
}

/* =========================================
   Product Loop Single-Product Context Fixes
   Location: /assets/css/product-loop.css
   Purpose:
   - Keep related/upsell loop cards on single product pages consistent with shop/home loops.
   - Ensure category, wishlist row, rating stars, and media overlay actions remain visible.
========================================= */
.hdaf-stars,
.hdaf-stars__base,
.hdaf-stars__fill{
  white-space:nowrap !important;
}

body.single-product .hdaf-pl__catwrap{
  display:block !important;
  min-height:18px;
  overflow:hidden;
}

body.single-product .hdaf-pl__row--actions{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

body.single-product .hdaf-pl__row--actions .hdaf-pl__wish{
  display:inline-flex !important;
  flex:0 0 38px !important;
}

body.single-product .hdaf-pl__row--actions .hdaf-pl__atc{
  margin-left:auto !important;
}


/* =========================================
   Single Product Related/Upsell Card Completion Fix
   Location: /assets/css/product-loop.css
   Purpose:
   - Single product "You may also like" cards keep subcategory, compare, wishlist and add-to-cart visible.
   - Compare overlay sits directly below Quick View on media hover.
========================================= */
body.single-product .up-sells.upsells .hdaf-pl,
body.single-product .related.products .hdaf-pl{
  min-height:100% !important;
}

body.single-product .up-sells.upsells .hdaf-pl__catwrap,
body.single-product .related.products .hdaf-pl__catwrap{
  display:block !important;
  position:relative !important;
  z-index:90 !important;
  min-height:20px !important;
  margin:0 0 6px !important;
  background:#fff !important;
  overflow:hidden !important;
}

body.single-product .up-sells.upsells .hdaf-pl__cat,
body.single-product .related.products .hdaf-pl__cat{
  display:block !important;
  max-width:100% !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.single-product .up-sells.upsells .hdaf-pl__media .hdaf-compare-btn--overlay,
body.single-product .related.products .hdaf-pl__media .hdaf-compare-btn--overlay,
.hdaf-pl__media .hdaf-compare-btn--overlay{
  top:calc(50% + 18px) !important;
  z-index:36 !important;
}

body.single-product .up-sells.upsells .hdaf-pl__row--actions,
body.single-product .related.products .hdaf-pl__row--actions{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

body.single-product .up-sells.upsells .hdaf-pl__row--actions .hdaf-pl__wish,
body.single-product .related.products .hdaf-pl__row--actions .hdaf-pl__wish{
  display:inline-flex !important;
  flex:0 0 38px !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

body.single-product .up-sells.upsells .hdaf-pl__row--actions .hdaf-pl__atc,
body.single-product .related.products .hdaf-pl__row--actions .hdaf-pl__atc{
  margin-left:auto !important;
}

/* =========================================
   Product Loop Compact Price + Rating Fix
   Location: /assets/css/product-loop.css
   Purpose:
   - Product-loop prices stay on one line only.
   - Loop-only compact prices support 19k / 170k format from PHP markup.
   - Variable-product ranges show one currency symbol and keep stars compact.
========================================= */
.hdaf-pl__row--meta{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:5px !important;
  flex-wrap:nowrap !important;
  width:100% !important;
  min-width:0 !important;
  overflow:visible !important;
}

.hdaf-pl__price{
  flex:1 1 auto !important;
  min-width:0 !important;
  max-width:calc(100% - 54px) !important;
  overflow:hidden !important;
  white-space:nowrap !important;
  text-overflow:clip !important;
  line-height:1.2 !important;
}

.hdaf-pl__price,
.hdaf-pl__price .price,
.hdaf-pl__price .amount,
.hdaf-pl__price del,
.hdaf-pl__price ins,
.hdaf-pl__price bdi,
.hdaf-pl__price .woocommerce-Price-amount{
  white-space:nowrap !important;
}

.hdaf-pl__price .amount,
.hdaf-pl__price .woocommerce-Price-amount{
  display:inline !important;
  line-height:1.2 !important;
}

.hdaf-pl__price del{
  display:inline !important;
  margin-right:4px !important;
  vertical-align:baseline !important;
}

.hdaf-pl__price ins{
  display:inline !important;
  vertical-align:baseline !important;
}

.hdaf-pl__price-sep{
  display:inline-block !important;
  margin:0 2px !important;
}

.hdaf-pl__rating{
  flex:0 0 auto !important;
  min-width:49px !important;
  max-width:49px !important;
  margin-left:0 !important;
  overflow:hidden !important;
  transform:translateY(-5px) !important;
}

.hdaf-stars{
  font-size:13px !important;
  letter-spacing:0 !important;
  line-height:1 !important;
  width:49px !important;
  max-width:49px !important;
  overflow:hidden !important;
}

.hdaf-stars__base,
.hdaf-stars__fill{
  letter-spacing:0 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

.hdaf-pl--type-variable .hdaf-pl__row--meta{
  gap:4px !important;
}

.hdaf-pl--type-variable .hdaf-pl__price{
  max-width:calc(100% - 51px) !important;
}

.hdaf-pl--type-variable .hdaf-pl__rating{
  min-width:47px !important;
  max-width:47px !important;
}

.hdaf-pl--type-variable .hdaf-stars{
  width:47px !important;
  max-width:47px !important;
  font-size:13px !important;
  letter-spacing:-.15px !important;
}

/* =========================================
   Product Loop Variable Sale Price Correction
   Location: /assets/css/product-loop.css
   Purpose:
   - Variable sale products show one regular price + one sale price, not ranges.
   - Replaces star icons with rating count only for discounted variable products.
   - Keeps price on one line and prevents rating from touching price.
   - Keeps old loop price 6px smaller than sale price for tighter sale rows.
========================================= */
.hdaf-pl--variable-sale-compact .hdaf-pl__row--meta{
  align-items:center !important;
  gap:4px !important;
}

.hdaf-pl--variable-sale-compact .hdaf-pl__price{
  flex:1 1 auto !important;
  max-width:calc(100% - 28px) !important;
  min-width:0 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:clip !important;
}

.hdaf-pl--variable-sale-compact .hdaf-pl__price del{
  display:inline !important;
  margin-right:4px !important;
  color:#d92d20 !important;
  font-size:10px !important;
  font-weight:650 !important;
  line-height:1 !important;
  opacity:1 !important;
  text-decoration-line:line-through !important;
  text-decoration-color:#d92d20 !important;
  text-decoration-thickness:1.4px !important;
  vertical-align:baseline !important;
}

.hdaf-pl--variable-sale-compact .hdaf-pl__price del .amount,
.hdaf-pl--variable-sale-compact .hdaf-pl__price del .woocommerce-Price-amount,
.hdaf-pl--variable-sale-compact .hdaf-pl__price del bdi{
  color:#d92d20 !important;
  font-size:10px !important;
  font-weight:650 !important;
}

.hdaf-pl--variable-sale-compact .hdaf-pl__price ins{
  display:inline !important;
  color:#000 !important;
  font-size:16px !important;
  font-weight:750 !important;
  line-height:1 !important;
  text-decoration:none !important;
  vertical-align:baseline !important;
}

.hdaf-pl--variable-sale-compact .hdaf-pl__price ins .amount,
.hdaf-pl--variable-sale-compact .hdaf-pl__price ins .woocommerce-Price-amount,
.hdaf-pl--variable-sale-compact .hdaf-pl__price ins bdi{
  color:#000 !important;
  font-size:16px !important;
  font-weight:750 !important;
}

.hdaf-pl--variable-sale-compact .hdaf-pl__rating{
  flex:0 0 26px !important;
  min-width:26px !important;
  max-width:26px !important;
  margin-left:0 !important;
  overflow:visible !important;
  transform:translateY(-2px) !important;
  text-align:right !important;
}

.hdaf-pl__rating-count{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  min-width:24px !important;
  max-width:28px !important;
  color:rgba(0,0,0,.58) !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:-.2px !important;
  white-space:nowrap !important;
}

.hdaf-pl--variable-sale-compact .hdaf-stars{
  display:none !important;
}