/* ---------------------------------------------------------------------------
 * Заглушка вместо фото товара.
 *
 * Фото в каталоге пока нет (пришёл прайс поставщика), поэтому вместо серого
 * квадрата WooCommerce показываем спокойный нейтральный квадрат в цветах
 * сайта: лёгкий фон, тонкая рамка, силуэт кадра. Размер и пропорции — те же,
 * что у снимка, поэтому загрузка фото ничего не сдвинет.
 *
 * Разметку собирает inc/ms-media.php (ms_placeholder / ms_product_media).
 * ------------------------------------------------------------------------- */

.ms-ph {
	box-sizing: border-box;
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: var(--ms-r-sm, 8px);
	background: linear-gradient(180deg, #f7f9f9 0%, #eef3f2 100%);
	box-shadow: inset 0 0 0 1px rgba(27, 71, 71, .07);
	color: #b7c5c3;
}

.ms-ph__icon {
	flex: 0 0 auto;
	stroke-width: 1.5;
}

/* Мелкие списки кабинета и корзины (56×56): без скруглений побольше ---------- */
.ms-ph--xs { border-radius: 4px; }

/* Галерея товара: тот же квадрат, что у снимка ------------------------------- */
.ms-ph--pdp {
	border-radius: var(--ms-r-md, 14px);
	background: linear-gradient(180deg, #f8fafa 0%, #ecf1f0 100%);
}

/* Плитки мелких превью (кабинет продавца, импорт прайса) -------------------- */
.ms-ph--card { border-radius: var(--ms-r-sm, 8px); }