/*
 * Om Woodmart's inbyggda önskelista-knapp (hjärta) till en bokmärkes-ikon,
 * placerad över produktbildens övre vänstra hörn. Funktionen/JS:en är
 * Woodmart's egen och orörd - detta är enbart visuell omstyling.
 */

.wd-wishlist-btn {
	position: absolute;
	top: 7px;
	left: 7px;
	z-index: 2;
}

.wd-wishlist-btn > a {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 32px !important;
	height: 32px !important;
	background: #fff !important;
	border-radius: 6px !important;
	box-shadow: 0 2px 6px rgba( 0, 0, 0, 0.15 );
	transition: box-shadow 0.2s ease;
}

.wd-wishlist-btn > a:hover {
	box-shadow: 0 3px 10px rgba( 0, 0, 0, 0.2 );
}

/* Dölj Woodmart's cirkel-check-badge och textetikett - vår design är ikon-only. */
.wd-wishlist-btn .wd-check-icon {
	display: none !important;
}

.wd-wishlist-btn .wd-action-text {
	display: block !important; /* Woodmart sätter display:none här - vi vill ha den kvar för skärmläsare */
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

/* Bokmärkes-ikonen är en inbäddad SVG (bakgrundsbild) - garanterat synlig
   kontur/fyllning i alla lägen, ingen känslig CSS-beräkning inblandad. */
.wd-wishlist-btn .wd-action-icon {
	display: block !important;
	width: 16px;
	height: 16px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M6 4h12a1 1 0 0 1 1 1v15l-7-4-7 4V5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.wd-wishlist-btn .wd-action-icon:before,
.wd-wishlist-btn .wd-action-icon:after {
	content: none !important;
}

/* Fylld bokmärkes-ikon i varumärkesfärg när produkten redan är sparad. */
.wd-wishlist-btn > a.added .wd-action-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233f00ff'%3E%3Cpath d='M6 4h12a1 1 0 0 1 1 1v15l-7-4-7 4V5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

/* Större variant + lite mer luft från kanten på produktsidan - samma
   32px/16px som på produktkorten ser för liten/hopklämd ut mot den mycket
   större bildramen där (589px), se assets/css/tier-pricing.css. Rör bara
   .product-images .wd-wishlist-btn, så produktkorten i butiksrutnätet
   behåller sin nuvarande, redan avstämda storlek/position. */
.product-images .wd-wishlist-btn {
	top: 16px;
	left: 16px;
}

.product-images .wd-wishlist-btn > a {
	width: 44px !important;
	height: 44px !important;
	border-radius: 8px !important;
}

.product-images .wd-wishlist-btn .wd-action-icon {
	width: 22px;
	height: 22px;
}