/* AG Client wishlist. Colours and sizes come from the widget's Style controls (CSS variables). */
.agc-wl {
	--agc-wl-heart: #1b1b1b;
	--agc-wl-saved: #b4462b;
	--agc-wl-bg: rgba(255, 255, 255, .92);
	--agc-wl-text: inherit;
	--agc-wl-line: transparent;
	--agc-wl-size: 40px;
	--agc-wl-icon: 20px;
	--agc-wl-badge: #b4462b;
	--agc-wl-on-badge: #fff;
}
.agc-wl-heart { width: var(--agc-wl-icon); height: var(--agc-wl-icon); display: block; flex: none; overflow: visible; }
.agc-wl-heart__fill { fill: transparent; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; transition: fill .15s ease, stroke .15s ease; }

/* Heart button */
.agc-wl .agc-wl-btn,
.agc-wl-card .agc-wl-btn {
	all: unset;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	cursor: pointer;
	color: var(--agc-wl-heart);
	-webkit-tap-highlight-color: transparent;
	transition: transform .12s ease, background-color .15s ease;
}
.agc-wl .agc-wl-btn:not(.agc-wl-btn--text),
.agc-wl-card .agc-wl-btn {
	width: var(--agc-wl-size);
	height: var(--agc-wl-size);
	min-width: 32px;
	min-height: 32px;
	border-radius: 50%;
	background: var(--agc-wl-bg);
	border: 1px solid var(--agc-wl-line);
	box-shadow: 0 1px 4px rgba(0, 0, 0, .12);
}
.agc-wl .agc-wl-btn--text {
	padding: 10px 16px;
	border-radius: 999px;
	border: 1.5px solid var(--agc-wl-line, currentColor);
	background: var(--agc-wl-bg);
	color: var(--agc-wl-text);
	font-weight: 600;
	line-height: 1.2;
}
.agc-wl .agc-wl-btn--text .agc-wl-heart { color: var(--agc-wl-heart); }
.agc-wl-btn[aria-pressed="true"] .agc-wl-heart__fill { fill: var(--agc-wl-saved); stroke: var(--agc-wl-saved); }
.agc-wl-btn:hover .agc-wl-heart__fill { stroke: var(--agc-wl-saved); }
.agc-wl-btn:focus-visible { outline: 2px solid var(--agc-wl-saved); outline-offset: 2px; }
.agc-wl-btn:active { transform: scale(.92); }
.agc-wl-btn.is-pop .agc-wl-heart { animation: agc-wl-pop .32s ease; }
@keyframes agc-wl-pop { 0% { transform: scale(1); } 45% { transform: scale(1.28); } 100% { transform: scale(1); } }

/* Header link */
.agc-wl a.agc-wl-link,
.agc-wl a.agc-wl-link:hover,
.agc-wl a.agc-wl-link:focus,
.agc-wl a.agc-wl-link:visited { position: relative; display: inline-flex; align-items: center; gap: 8px; color: var(--agc-wl-heart); text-decoration: none; }
.agc-wl-link .agc-wl-heart__fill { stroke-width: 2.1; }
.agc-wl a.agc-wl-link:hover .agc-wl-heart__fill { stroke: var(--agc-wl-saved); }
.agc-wl-link__label { color: var(--agc-wl-text); }
.agc-wl-count {
	position: absolute;
	top: -7px;
	left: calc(var(--agc-wl-icon) - 9px);
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--agc-wl-badge);
	color: var(--agc-wl-on-badge);
	font: 700 11px/18px Inter, system-ui, sans-serif;
	text-align: center;
}
.agc-wl-count[hidden] { display: none; }

/* Wishlist page */
.agc-wl-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.agc-wl-grid[hidden], .agc-wl-empty[hidden] { display: none; }
.agc-wl-item { min-width: 0; transition: opacity .2s ease, transform .2s ease; }
.agc-wl-item.is-leaving { opacity: 0; transform: scale(.96); }
.agc-wl-empty { text-align: center; padding: 48px 16px; color: var(--agc-wl-text); }
.agc-wl-empty .agc-wl-heart { --agc-wl-icon: 44px; margin: 0 auto 14px; color: var(--agc-wl-saved); }
.agc-wl-empty__title { margin: 0 0 6px; font-size: 22px; font-weight: 700; }
.agc-wl-empty__text { margin: 0 auto 20px; max-width: 420px; }

/* Simple card (no Loop Item template chosen) */
.agc-wl-card { position: relative; display: grid; gap: 6px; }
.agc-wl-card__img img { display: block; width: 100%; height: auto; border-radius: 12px; }
.agc-wl-card__heart { position: absolute; top: 10px; right: 10px; }
.agc-wl-card__name { font-weight: 600; color: inherit; text-decoration: none; }

/* Announcement */
.agc-wl-toast {
	position: fixed;
	left: 16px;
	right: 16px;
	margin: 0 auto;
	width: fit-content;
	bottom: 24px;
	z-index: 99999;
	display: flex;
	align-items: center;
	gap: 10px;
	max-width: calc(100vw - 32px);
	padding: 12px 18px;
	border-radius: 999px;
	background: #1b1b1b;
	color: #fff;
	font: 500 14px/1.3 Inter, system-ui, sans-serif;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .2);
	opacity: 0;
	pointer-events: none;
	transform: translateY(12px);
	transition: opacity .2s ease, transform .2s ease;
}
.agc-wl-toast.is-shown { opacity: 1; pointer-events: auto; transform: translateY(0); }
.agc-wl-toast a { white-space: nowrap; color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.agc-wl-toast__dot { width: 8px; height: 8px; border-radius: 50%; background: #9a9a9a; flex: none; }
.agc-wl-toast__dot.is-on { background: #e0745a; }
@media (max-width: 767px) { .agc-wl-toast { bottom: 84px; } }
@media (prefers-reduced-motion: reduce) {
	.agc-wl-btn, .agc-wl-item, .agc-wl-toast { transition: none; }
	.agc-wl-btn.is-pop .agc-wl-heart { animation: none; }
}
.agc-wl-note { padding: 8px 10px; border: 1px dashed #c9c4bb; border-radius: 8px; font-size: 12px; color: #6b665e; margin-bottom: 10px; }

/* Keep the theme's global button hover/focus colours off the heart buttons. */
.agc-wl .agc-wl-btn:is(:hover, :focus, :active),
.agc-wl-card .agc-wl-btn:is(:hover, :focus, :active) { background: var(--agc-wl-bg); color: var(--agc-wl-heart); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
.agc-wl .agc-wl-btn--text:is(:hover, :focus, :active) { color: var(--agc-wl-text); box-shadow: none; }
