/**
 * Sticky-note product tags — shared site-wide (all screen sizes).
 */

.xm-sticky-tags {
	display: block;
	margin: 0 0 0.4rem;
}

.xm-sticky-tags--homepage {
	margin: 0;
}

.xm-home-sticky-tags {
	margin: 0.25rem 0 0.45rem;
}

.xm-home-sticky-tags + .xm-home-section {
	padding-top: 0;
}

.xm-home-sticky-tags + .xm-home-section .xm-section-header {
	margin-top: 0;
}

.xm-home-section:has(+ .xm-home-sticky-tags) {
	padding-bottom: 0.5rem;
}

.xm-sticky-tags--footer {
	margin: 0 0 0.5rem;
}

.xm-sticky-tags--product {
	margin: 0 0 0.35rem;
}

.xm-sticky-tags--content {
	margin: 0 0 0.4rem;
}

.xm-sticky-tags--archive {
	margin: 0 0 0.35rem;
}

.xm-sticky-tags__viewport {
	overflow: hidden;
}

.xm-sticky-tags__track {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.5rem;
	width: max-content;
	padding: 0.1rem 0 0.2rem;
	will-change: transform;
}

.xm-sticky-tags__track.is-animating {
	animation: xm-sticky-tags-marquee 42s linear infinite;
}

.xm-sticky-tags__viewport:hover .xm-sticky-tags__track.is-animating,
.xm-sticky-tags__viewport.is-paused .xm-sticky-tags__track.is-animating {
	animation-play-state: paused;
}

@keyframes xm-sticky-tags-marquee {
	from {
		transform: translate3d(0, 0, 0);
	}

	to {
		transform: translate3d(-50%, 0, 0);
	}
}

.xm-sticky-tags__note {
	position: relative;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.15rem;
	padding: 0.42rem 0.75rem 0.5rem;
	border: 0;
	border-radius: 2px 2px 0 0;
	box-shadow: 1px 3px 7px rgba(15, 23, 42, 0.1);
	color: #2f2a22;
	font-size: 0.72rem;
	font-weight: var(--xm-font-weight-bold);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transform: none;
	clip-path: polygon(
		0% 0%,
		100% 0%,
		100% 78%,
		96% 88%,
		92% 79%,
		88% 90%,
		84% 80%,
		80% 91%,
		76% 81%,
		72% 89%,
		68% 80%,
		64% 90%,
		60% 82%,
		56% 91%,
		52% 81%,
		48% 89%,
		44% 80%,
		40% 90%,
		36% 82%,
		32% 91%,
		28% 81%,
		24% 89%,
		20% 80%,
		16% 90%,
		12% 82%,
		8% 91%,
		4% 81%,
		0% 88%
	);
	transition: box-shadow var(--xm-transition), background-color var(--xm-transition);
}

.xm-sticky-tags__note::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 0.85rem;
	height: 0.85rem;
	background: linear-gradient(225deg, rgba(255, 255, 255, 0.55) 50%, rgba(0, 0, 0, 0.06) 50%);
	pointer-events: none;
}

.xm-sticky-tags__note:hover,
.xm-sticky-tags__note:focus-visible {
	box-shadow: 2px 5px 12px rgba(15, 23, 42, 0.14);
	text-decoration: none;
	color: #2f2a22;
}

.xm-sticky-tags__note--1 {
	background: linear-gradient(160deg, #fff8d6 0%, #ffefb0 100%);
}

.xm-sticky-tags__note--2 {
	background: linear-gradient(160deg, #ffe8f1 0%, #ffd4e8 100%);
}

.xm-sticky-tags__note--3 {
	background: linear-gradient(160deg, #e8f3ff 0%, #cfe6ff 100%);
}

.xm-sticky-tags__note--4 {
	background: linear-gradient(160deg, #e9fbe8 0%, #d2f5cf 100%);
}

.xm-sticky-tags__note--5 {
	background: linear-gradient(160deg, #fff0e3 0%, #ffdfc8 100%);
}

.xm-sticky-tags__note--6 {
	background: linear-gradient(160deg, #f3e8ff 0%, #e4d0ff 100%);
}

.xm-sticky-tags__note--7 {
	background: linear-gradient(160deg, #fff9e8 0%, #ffefcc 100%);
}

.xm-sticky-tags__label {
	position: relative;
	z-index: 1;
	white-space: nowrap;
}

.xm-sticky-tags--product + .xm-product-detail__breadcrumbs {
	margin-top: 0;
	margin-bottom: var(--xm-space-md);
}

.xm-product-detail:has(.xm-sticky-tags--product) {
	padding-top: var(--xm-space-sm);
}

.xm-sticky-tags--content + .xm-content-hero,
.xm-sticky-tags--content + .xm-cart-header,
.xm-sticky-tags--content + .xm-blog-single__header,
.xm-sticky-tags--content + .xm-index__header {
	margin-top: 0;
}

.xm-content-page:has(.xm-sticky-tags--content) {
	padding-top: var(--xm-space-sm);
}

.xm-content-page:has(.xm-sticky-tags--content) .xm-content-hero {
	margin-bottom: var(--xm-space-md);
}

.xm-sticky-tags--footer + .xm-location-review__grid {
	margin-top: 0;
}

.xm-location-review:has(.xm-sticky-tags--footer) {
	padding-top: var(--xm-space-md);
}

.xm-sticky-tags--archive + .xm-archive-breadcrumbs {
	display: none;
}

.xm-sticky-tags--archive + .xm-archive-breadcrumbs + .xm-archive-header,
.xm-sticky-tags--archive + .xm-archive-header {
	margin-top: 0;
	margin-bottom: var(--xm-space-md);
}

@media (prefers-reduced-motion: reduce) {
	.xm-sticky-tags__track.is-animating {
		animation: none;
	}
}

/* Full-width edge-to-edge tag strip on tablet and phone */
@media (max-width: 1200px) {
	.xm-sticky-tags {
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
	}

	.xm-sticky-tags__viewport {
		width: 100%;
		margin: 0;
		padding: 0;
	}

	.xm-sticky-tags__track {
		padding-left: var(--xm-container-padding, 1rem);
		padding-right: var(--xm-container-padding, 1rem);
	}

	.xm-home-sticky-tags {
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
	}

	.xm-home-sticky-tags > .xm-container {
		width: 100%;
		max-width: none;
		padding-left: 0;
		padding-right: 0;
	}
}

@media (max-width: 767px) {
	.xm-home-sticky-tags {
		display: none !important;
	}

	.xm-site__main .xm-sticky-tags--product,
	.xm-site__main .xm-sticky-tags--archive,
	.xm-site__main .xm-sticky-tags--content {
		display: none !important;
	}

	.xm-sticky-tags--archive,
	.xm-sticky-tags--product,
	.xm-sticky-tags--content,
	.xm-sticky-tags--footer {
		margin-top: 0;
		margin-bottom: 0.2rem;
	}

	.xm-sticky-tags--header {
		margin: 0;
	}

	.xm-sticky-tags__track {
		padding-top: 0;
		padding-bottom: 0.05rem;
	}

	.xm-product-detail,
	.xm-product-detail:has(.xm-sticky-tags--product) {
		padding-top: 0;
	}

	.xm-single-product-page .xm-product-detail__breadcrumbs {
		margin-top: 0;
		margin-bottom: 0.35rem;
	}

	.xm-content-page,
	.xm-content-page:has(.xm-sticky-tags--content) {
		padding-top: 0;
	}
}

@media (min-width: 768px) {
	.xm-sticky-tags__note {
		min-height: 2.35rem;
		padding: 0.45rem 0.9rem 0.55rem;
		font-size: 0.8125rem;
	}

	.xm-sticky-tags--archive + .xm-archive-breadcrumbs {
		display: flex;
	}
}