/* PM Color Siblings — свотчи цвета (каталог + страница товара).
   Базовый вид кружка наследуем из стилей темы Merchant
   (.product-variation-item__color), здесь — только наши дополнения. */

.pmcs-loop.product-variation-items {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 8px 0 0;
}

/* Блок «Цвет» на странице товара — в стиле выбора «Размер». */
.pmcs-single {
	margin: 0 0 20px;
}

.pmcs-single__title {
	display: block;
	margin: 0 0 12px;
	font-size: 16px;
	line-height: 1.2;
	color: #111;
}

.pmcs-single__items.product-variation-items {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
}

.pmcs-swatch,
.pmcs-swatch-single {
	cursor: pointer;
	display: inline-flex;
	line-height: 0;
	text-decoration: none;
}

/* Гарантируем видимый кружок (в т.ч. белый на белом фоне). */
.pmcs-swatch .product-variation-item__color,
.pmcs-swatch-single .product-variation-item__color {
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	box-sizing: border-box;
	border: 1px solid rgba( 0, 0, 0, .2 );
}

/* Выбранный цвет. */
.pmcs-swatch.selected .product-variation-item__color,
.pmcs-swatch-single.selected .product-variation-item__color {
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px currentColor;
}

.pmcs-swatch,
.pmcs-swatch-single {
	color: #222;
}

/* Индикатор загрузки при свопе картинки. */
.woocommerce-LoopProduct-link.image-loading {
	opacity: .55;
	transition: opacity .2s ease;
}