/* Карточки товаров iHerb — вывод на фронтенде */

.ahp-grid {
	display: grid;
	/* auto-fill (не auto-fit!) — пустые колонки в неполном последнем ряду
	   остаются зарезервированными, а не отдаются одинокой карточке. Именно
	   поэтому карточка в одиночном ряду не растягивается на всю ширину.
	   Компромисс: короткий последний ряд на десктопе прижат влево, а не
	   центрирован — но на мобильном (90% трафика) в ряду обычно ровно
	   одна карточка, там растягивание важнее центрирования ряда. */
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 5px;
	margin: 16px 0;
}

.ahp-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between; /* CTA прижимается к низу карточки независимо от длины названия — все кнопки в ряду выравниваются по одной линии */
	text-align: center;
	width: 100%;
	box-sizing: border-box;
	padding: 12px;
	border: 1px solid #ddd;
	border-radius: 8px;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.15s ease;
}
.ahp-card:hover {
	border-color: #458500;
}

.ahp-card__img {
	width: 72px;
	height: 72px;
	object-fit: contain;
	flex-shrink: 0;
	margin-bottom: 8px;
}

.ahp-card__body {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	min-width: 0;
}

.ahp-card__name {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	font-size: 18px;
	font-weight: 450;
	line-height: 1.2;
}

.ahp-card__rating {
	color: #b8860b;
	font-size: 0.9em;
}

.ahp-card__cta {
	display: inline-block;
	margin-top: 10px;
	border: 1px solid #458500;
	border-radius: 4px;
	padding: 6px 14px;
	color: #458500;
	background-color: #fff;
	font-size: 0.9em;
	font-weight: 500;
}
.ahp-card:hover .ahp-card__cta {
	background-color: #458500;
	color: #fff;
}