/*
 * Base "Add to favorites" heart button (see includes/favorites.php,
 * enacoding_render_favorite_button()) — loaded globally since the button can appear on the home
 * page, Catalog, Search results, single product pages and the Favorites page. Per-context
 * positioning (overlaid on a card image vs. a labeled button next to Add to Cart) is added
 * by each page's own stylesheet (assets/catalog.css, assets/single-product.css) or block
 * (src/blocks/best-sellers, src/blocks/favorites via the shared _favorite-button.scss
 * mixin) — this file only owns the shared, context-independent look.
 */
.enacoding-favorite-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	width: 2rem;
	height: 2rem;
	padding: 0;
	background: rgba( 255, 255, 255, 0.92 );
	border: 1px solid rgba( 0, 0, 0, 0.1 );
	border-radius: 9999px;
	color: #333;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.enacoding-favorite-btn svg {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.enacoding-favorite-btn:hover {
	border-color: #f97316;
	color: #f97316;
}

.enacoding-favorite-btn.is-active {
	background: #f97316;
	border-color: #f97316;
	color: #fff;
}

.enacoding-favorite-btn.is-active svg {
	fill: currentColor;
}

.enacoding-favorite-btn.is-loading {
	opacity: 0.6;
	pointer-events: none;
}

/* Labeled variant — full-size button with visible text, used next to "Add to cart" on
   the single product page. */
.enacoding-favorite-btn--labeled {
	width: auto;
	height: auto;
	padding: 0.875rem 1.5rem;
	font-weight: 700;
	font-size: 0.8125rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}