.items-grid {
	--items-grid-columns: 2;
	--items-grid-gap-row: var(--spacing-05);
	--items-grid-gap-column: var(--spacing-05);

	display: grid;
	grid-template-columns: repeat(var(--items-grid-columns), minmax(0, 1fr));
	gap: var(--items-grid-gap-row) var(--items-grid-gap-column);
	overflow-x: hidden;
}

.items-grid--large-content {
	--items-grid-columns: 1;
}

@media screen and (min-width: 48rem) {
	.items-grid {
		--items-grid-columns: 3;
		--items-grid-gap-row: var(--spacing-11);
		--items-grid-gap-column: 5.5rem;
	}

	.items-grid--centered {
		--items-grid-container-padding: 0px;
		--items-grid-item-width: calc((100% - (var(--items-grid-columns) - 1) * var(--items-grid-gap-column)) / var(--items-grid-columns));

		grid-auto-rows: max-content;
		align-content: center;
		min-height: calc(100vh - var(--items-grid-container-padding) * 2);
	}

	/* 3 columns - center if less than 3 items */
	.items-grid--centered:not(:has(> :nth-child(3))) {
		grid-template-columns: repeat(auto-fit, var(--items-grid-item-width));
		justify-content: center;
	}
}

@media screen and (min-width: 120rem) {
	.items-grid {
		--items-grid-gap-row: var(--spacing-10);
	}
}

@media screen and (min-width: 160rem) {
	.items-grid {
		--items-grid-columns: 4;
		--items-grid-gap-row: var(--spacing-13);
		--items-grid-gap-column: var(--spacing-15);
	}

	/* 4 columns - center if less than 4 items */
	.items-grid--centered:not(:has(> :nth-child(4))) {
		grid-template-columns: repeat(auto-fit, var(--items-grid-item-width));
		justify-content: center;
	}
}

.selectable-item {
	--selectable-item-size: 1.75rem;
	--selectable-item-icon-size: 1rem;

	position: relative;
	display: block;
	width: 100%;
}[dir] .selectable-item {
	cursor: pointer;
}

/* Selected state border for the image (first child of content) */
.selectable-item__content--selected > :first-child {
	position: relative;
}

.selectable-item__content--selected > :first-child::after {
	position: absolute;
	inset: 0;
	pointer-events: none;
	content: "";
}

[dir] .selectable-item__content--selected > :first-child::after {
	box-shadow:
		inset 0 0 0 0.03125rem var(--color-content-high),
		inset 0 0 0 0.28125rem var(--color-content-inverse);
}

.selectable-item__checkbox {
	position: absolute;
	top: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--selectable-item-size);
	height: var(--selectable-item-size);
}

[dir=ltr] .selectable-item__checkbox {
	right: 0;
}

[dir=rtl] .selectable-item__checkbox {
	left: 0;
}

[dir] .selectable-item__checkbox-icon {
	background-color: var(--color-background-base);
}

@media screen and (min-width: 48rem) {
	.selectable-item__checkbox {
		--selectable-item-size: 3.5rem;
	}

	.selectable-item__checkbox-icon {
		width: var(--selectable-item-icon-size);
		height: var(--selectable-item-icon-size);
	}
}

.user-product-image {
	position: relative;
	display: block;
}

.user-product-image__quantity {
	position: absolute;
	bottom: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1rem;
	height: 1rem;
	font-size: var(--font-size-label-xs);
	line-height: var(--line-height-label-xs);
	letter-spacing: var(--letter-spacing-label-xs);
	text-transform: var(--text-transform-label-xs);
	font-stretch: var(--font-stretch-label-xs);
	font-weight: var(--font-weight-label-xs);
}

[dir] .user-product-image__quantity {
	background-color: var(--color-background-base);
}

.user-product-image__placeholder {
	fill: none;
}

.wishlist-item-add-action {
	min-width: 100%;
}

.wishlist-item {
	--out-of-stock-item-opacity: 0.4;

	display: flex;
	flex-direction: column;
	list-style: none;
}

[dir=ltr] .wishlist-item__selectable {
	text-align: left;
}

[dir=rtl] .wishlist-item__selectable {
	text-align: right;
}

.wishlist-item__image {
	position: relative;
}

.wishlist-item__data {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--spacing-00);
	justify-content: space-between;
	font-size: var(--font-size-label-s);
	line-height: var(--line-height-label-s);
	letter-spacing: var(--letter-spacing-label-s);
	text-transform: var(--text-transform-label-s);
	font-stretch: var(--font-stretch-label-s);
	font-weight: var(--font-weight-label-s);
}

[dir] .wishlist-item__data {
	padding: var(--spacing-02) 0;
}

.wishlist-item__primary-info {
	display: flex;
	gap: var(--spacing-01);
	justify-content: space-between;
}

.wishlist-item__product-data {
	display: flex;
	min-width: 0;
}

[dir] .wishlist-item__product-data {
	padding-top: 0;
}

.wishlist-item__product-data .product-link {
	font-size: var(--font-size-label-l);
	line-height: var(--line-height-label-l);
	letter-spacing: var(--letter-spacing-label-l);
	text-transform: var(--text-transform-label-l);
	font-stretch: var(--font-stretch-label-l);
	font-weight: var(--font-weight-label-l);
}

.wishlist-item--disabled .wishlist-item__user-product-image,
.wishlist-item--disabled .price-future-promotion,
.wishlist-item--disabled .price-current {
	opacity: var(--out-of-stock-item-opacity);
}

.wishlist-item--disabled,
.wishlist-item--disabled .wishlist-item__product-data,
.wishlist-item--disabled .price-net-message {
	color: var(--color-content-low);
}

.wishlist-item__out-of-stock-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

[dir] .wishlist-item__out-of-stock-overlay {
	background-color: rgba(255, 255, 255, 0.6);
}

.wishlist-item__out-of-stock-label {
	width: 100%;
	font-size: var(--font-size-body-s);
	line-height: var(--line-height-body-s);
	letter-spacing: var(--letter-spacing-body-s);
	text-transform: var(--text-transform-body-s);
	font-stretch: var(--font-stretch-body-s);
	font-weight: var(--font-weight-body-s);
}

[dir] .wishlist-item__out-of-stock-label {
	padding: var(--spacing-04);
	text-align: center;
	background-color: var(--color-background-base);
}

.wishlist-item__delete-button {
	position: relative;
}

.wishlist-item__delete-button .wishlist-icon {
	--icon-size: 0.75rem;
}

/* Increase clickable area */
.wishlist-item__delete-button::before {
	position: absolute;
	top: -0.625rem;
	bottom: -0.625rem;
	max-height: 50%;
	content: "";
}
[dir=ltr] .wishlist-item__delete-button::before {
	right: -0.625rem;
	left: -0.625rem;
}
[dir=rtl] .wishlist-item__delete-button::before {
	left: -0.625rem;
	right: -0.625rem;
}

.wishlist-item__add-action {
	align-self: start;
}

[dir] .wishlist-item__add-action {
	margin-top: var(--spacing-02);
}

.wishlist-cart-button {
	min-width: 100%;
}

@media screen and (min-width: 48rem) {
	.wishlist-item__delete-button .wishlist-icon {
		--icon-size: 0.875rem;
	}

	.wishlist-item-size-selector {
		position: absolute;
		bottom: 0;
		width: 100%;
		height: 100%;
	}

	.wishlist-item-size-selector .product-purchase-intention-actions-size-selector__size-selector-wrapper--opened {
		max-height: 100%;
		overflow-y: auto;
		overscroll-behavior: contain;
	}
}

