/* Likes (2026-10-04): the thumbs-up with its count, on product cards and over the product gallery. */
.ek-like {
	-webkit-appearance: none;
	appearance: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ekcs-ink, #1a1714);
	font: inherit;
	line-height: 1;
	cursor: pointer;
	display: inline-grid;
	place-items: center;
	align-content: center;
	gap: 2px;
	-webkit-tap-highlight-color: transparent;
}
.ek-like > svg {
	display: block;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: transform .18s cubic-bezier(.25, .6, .3, 1);
}
.ek-like.is-liked > svg,
.ek-like.is-liked > svg * {
	fill: currentColor !important;
	stroke: currentColor !important;
}
.ek-like__n {
	display: block;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .02em;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}
/* No likes yet: a small LIKE label instead of a number (owner 2026-10-04). */
.ek-like__n:empty::before {
	content: "LIKE";
	font-size: 8px;
	letter-spacing: .08em;
}
.ek-like:focus-visible {
	outline: 2px solid var(--ekcs-accent, #8b7658);
	outline-offset: 2px;
}
.ek-like--pop > svg {
	animation: ek-like-pop .32s cubic-bezier(.25, .6, .3, 1);
}
@keyframes ek-like-pop {
	0% { transform: scale(1); }
	45% { transform: scale(1.05); }
	100% { transform: scale(1); }
}

/* Over the product gallery, under the zoom control: each site mirrors its own zoom button (position, size, surface). */
.ek-like--pdp {
	position: absolute;
	top: 64px;
	right: 12px;
	z-index: 6;
	width: 44px;
	min-height: 44px;
	padding: 4px 0;
	background: var(--ekcs-paper, #fffdf9);
	border: 1px solid var(--ekcs-line, #e7e1d8);
}
body.ekcs-site-ek .ek-like--pdp {
	top: 78px;
	right: 0;
	width: 48px;
	min-height: 48px;
	border: 0;
	border-radius: 24px 0 0 24px;
	background: rgba(255, 255, 255, .9);
}
body.ekcs-site-smz .ek-like--pdp {
	top: 62px;
	right: 14px;
	width: 42px;
	min-height: 42px;
	border-color: currentColor;
	background: rgba(255, 255, 255, .92);
}
@media (max-width: 782px) {
	body.ekcs-site-ek .ek-like--pdp { top: 66px; }
	body.ekcs-site-smz .ek-like--pdp { top: 56px; right: 8px; width: 44px; min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
	.ek-like > svg { transition: none; }
	.ek-like--pop > svg { animation: none; }
}
