/* AMG pet-recs — C4b: група «Для {Ім'я}» з чипами (#amg-h2-refill.amg-group). Токени CLAUDE.md.
   Секція живе в тій самій сірій смузі, що й група рекомендацій; шапка = .amg-sec__head/.amg-recs__head з 10-home2.css. */

html.amg-home2 #amg-h2-refill.amg-group[hidden] { display: none !important; }

/* шапка: аватар 44 + «Для {Ім'я}» + підрядок профілю + пігулки інших тварин */
html.amg-home2 .amg-group .amg-recs__head { align-items: center; margin-bottom: 16px; }
html.amg-home2 .amg-group .amg-recs__av {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 auto;
	margin-right: 12px;
	background: #f5f5f5;
}
/* 16.09: без фото = маскот виду (icon_cat/icon_dog) у світлому кружку, як у шапці й дровері; лапи-SVG більше нема */
html.amg-home2 .amg-group .amg-recs__av--mascot { display: inline-flex; align-items: center; justify-content: center; background: #f5f5f5; border: 1px solid #ebebeb; box-sizing: border-box; }
html.amg-home2 .amg-group .amg-recs__av--mascot img { width: 28px !important; height: 28px !important; max-height: none !important; object-fit: contain; border-radius: 0; display: block; }
html.amg-home2 .amg-group .amg-recs__tx { flex: 1; min-width: 0; }
html.amg-home2 .amg-group .amg-recs__sub { display: block; font: 500 14px/1.3 Nunito, Arial, Helvetica, sans-serif; color: #4b5563; margin-top: 2px; }
html.amg-home2 .amg-group .amg-sec__more { font: 700 15px/1.2 Nunito, Arial, Helvetica, sans-serif; color: #1c49c2; text-decoration: none; white-space: nowrap; }
html.amg-home2 .amg-group .amg-sec__more:hover { color: #143795; text-decoration: underline; }

html.amg-home2 .amg-group .amg-group__pets { display: inline-flex; flex-wrap: wrap; gap: 6px; }
html.amg-home2 .amg-group button.amg-group__pet.amg-group__pet {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 0;
	height: 34px;
	margin: 0;
	padding: 0 12px 0 5px;
	border: 1.5px solid #ebebeb;
	border-radius: 999px;
	background: #fff;
	box-shadow: none;
	color: #190a03;
	font: 700 13px/1 Nunito, Arial, Helvetica, sans-serif;
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
	transition: border-color .15s, background .15s;
}
html.amg-home2 .amg-group button.amg-group__pet.amg-group__pet img.amg-group__pet-av { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
html.amg-home2 .amg-group button.amg-group__pet.amg-group__pet .amg-group__pet-av--mascot { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: #f5f5f5; flex: 0 0 auto; }
html.amg-home2 .amg-group button.amg-group__pet.amg-group__pet .amg-group__pet-av--mascot img { width: 17px !important; height: 17px !important; max-height: none !important; object-fit: contain; display: block; }
html.amg-home2 .amg-group button.amg-group__pet.amg-group__pet:hover { border-color: #d9e6f4; }
html.amg-home2 .amg-group button.amg-group__pet.amg-group__pet.is-on { border-color: #1c49c2; background: #f0f6fc; color: #143795; }

/* ряд чипів: пігулки, стан active = синій */
html.amg-home2 .amg-group .amg-group__chips {
	display: flex;
	gap: 8px;
	margin: 0 0 10px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 2px;
}
html.amg-home2 .amg-group .amg-group__chips::-webkit-scrollbar { display: none; }
html.amg-home2 .amg-group button.amg-group__chip.amg-group__chip {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	min-height: 0;
	height: 38px;
	margin: 0;
	padding: 0 16px;
	border: 1.5px solid #e5e5e5;
	border-radius: 999px;
	background: #fff;
	box-shadow: none;
	color: #190a03;
	font: 700 14px/1 Nunito, Arial, Helvetica, sans-serif;
	text-transform: none;
	letter-spacing: normal;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color .15s, background .15s, color .15s;
}
html.amg-home2 .amg-group button.amg-group__chip.amg-group__chip:hover { border-color: #d9e6f4; }
html.amg-home2 .amg-group button.amg-group__chip.amg-group__chip.is-on { border-color: #1c49c2; background: #f0f6fc; color: #143795; }
html.amg-home2 .amg-group button.amg-group__chip.amg-group__chip:focus-visible { outline: 2px solid #1c49c2; outline-offset: 2px; }

/* полиця: одразу під чипами (B2fix D12: без h3 і без рядка-пояснення), слот = живий слайдер */
html.amg-home2 .amg-group .amg-group__chips { margin-bottom: 16px; }
html.amg-home2 .amg-group .amg-group__slot { min-height: 300px; }

/* низ: лише «Оновити рекомендації» (тиха пігулка праворуч); «Дивитися ще» прибрано 16.09 */
html.amg-home2 .amg-group .amg-group__foot { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
html.amg-home2 .amg-group .amg-group__foot:not(:has(button:not([hidden]))) { display: none; }
html.amg-home2 .amg-group button.amg-group__refresh.amg-group__refresh {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 0;
	height: 40px;
	margin: 0;
	padding: 0 16px;
	border: 1px solid #e5e5e5;
	border-radius: 999px;
	background: #fff;
	box-shadow: none;
	color: #190a03;
	font: 800 14px/1 Nunito, Arial, Helvetica, sans-serif;
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
}
html.amg-home2 .amg-group button.amg-group__refresh.amg-group__refresh svg { width: 16px; height: 16px; color: #6b7280; }
html.amg-home2 .amg-group button.amg-group__refresh.amg-group__refresh:hover { border-color: #d9e6f4; }
html.amg-home2 .amg-group button.amg-group__refresh.amg-group__refresh[hidden] { display: none; }

/* старі полиці amigo-pets для користувачів з профілем: рядок-запрошення «Розкажи нам про свого кота…» не потрібен */
html.amg-petrecs #amg-h2-recs .amigo-recs-label { display: none !important; }

@media (max-width: 1024px) {
	html.amg-home2 .amg-group .amg-recs__head { margin-bottom: 12px; flex-wrap: wrap; row-gap: 8px; }
	/* пігулки тварин і запрошення увійти на мобільному йдуть окремим рядком під заголовком, не тиснуть його */
	html.amg-home2 .amg-group .amg-recs__head > .amg-group__pets,
	html.amg-home2 .amg-group .amg-recs__head > a.amg-sec__more { flex: 1 1 100%; margin-left: 0; white-space: normal; }
	html.amg-home2 .amg-group .amg-recs__tx { flex: 1 1 200px; }
	html.amg-home2 .amg-group .amg-recs__av { width: 40px; height: 40px; margin-right: 10px; }
	html.amg-home2 .amg-group .amg-group__chips { margin-right: calc(50% - 50vw); padding-right: 16px; }
	html.amg-home2 .amg-group button.amg-group__chip.amg-group__chip { height: 36px; padding: 0 14px; font-size: 13px; }
	html.amg-home2 .amg-group .amg-group__chips { margin-bottom: 14px; }
}
