/* =============================================================================
   GallerImage Studio — Favorites / Wishlist
   ============================================================================= */

/* Heart button (loop cards) — floats over the product thumbnail */
.gis-fav-wrap {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 5;
}
/* Make sure the WooCommerce loop item can anchor the heart */
.woocommerce ul.products li.product { position: relative; }

.gis-fav-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	border: 1px solid var(--gis-line);
	background: rgba( 255, 255, 255, .92 );
	backdrop-filter: blur( 4px );
	color: var(--gis-faint);
	width: 40px; height: 40px;
	padding: 0;
	border-radius: var(--gis-r-pill);
	cursor: pointer;
	box-shadow: var(--gis-shadow-sm);
	transition: transform var(--gis-fast) var(--gis-ease),
		color var(--gis-fast) var(--gis-ease),
		background var(--gis-fast) var(--gis-ease),
		border-color var(--gis-fast) var(--gis-ease);
}
.gis-fav-btn:hover { transform: scale( 1.08 ); color: var(--gis-fav); border-color: var(--gis-fav); }
.gis-fav-btn:active { transform: scale( .94 ); }
.gis-fav-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--gis-fav-bg); }

.gis-fav-btn__icon svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.8; }
.gis-fav-btn.is-active { color: var(--gis-fav); border-color: var(--gis-fav); background: #fff; }
.gis-fav-btn.is-active .gis-fav-btn__icon svg { fill: var(--gis-fav); stroke: var(--gis-fav); }
.gis-fav-btn.is-loading { opacity: .7; pointer-events: none; }

/* Single product: pill with label */
.gis-fav-single { margin: 1rem 0; }
.gis-fav-single .gis-fav-btn {
	width: auto; height: auto;
	padding: .7rem 1.15rem;
	font-size: .9rem; font-weight: 600;
	color: var(--gis-ink); background: var(--gis-surface);
}
.gis-fav-single .gis-fav-btn.is-active { color: var(--gis-fav); }
.gis-fav-btn__label { white-space: nowrap; }

/* Pop animation on add */
.gis-fav-burst .gis-fav-btn__icon { animation: gis-heart-pop .45s var(--gis-ease); }
@keyframes gis-heart-pop {
	0%   { transform: scale( 1 ); }
	35%  { transform: scale( 1.45 ); }
	60%  { transform: scale( .85 ); }
	100% { transform: scale( 1 ); }
}

/* Header count chip (optional, themers can place [data-gis-fav-count]) */
.gis-fav-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 20px; height: 20px; padding: 0 6px;
	font-size: .72rem; font-weight: 700;
	color: #fff; background: var(--gis-fav);
	border-radius: var(--gis-r-pill);
}
.gis-fav-count.is-empty { display: none; }

/* ----- Favorites page grid ----- */
.gis-fav-grid {
	display: grid;
	grid-template-columns: repeat( var(--gis-fav-cols, 4), 1fr );
	gap: 1.25rem;
}
.gis-fav-card {
	position: relative;
	background: var(--gis-surface);
	border: 1px solid var(--gis-line);
	border-radius: var(--gis-r-lg);
	overflow: hidden;
	box-shadow: var(--gis-shadow-xs);
	transition: transform var(--gis-base) var(--gis-ease),
		box-shadow var(--gis-base) var(--gis-ease),
		opacity var(--gis-base) var(--gis-ease);
}
.gis-fav-card:hover { transform: translateY( -4px ); box-shadow: var(--gis-shadow); }
.gis-fav-card--leaving { opacity: 0; transform: scale( .96 ); }

.gis-fav-card__media { display: block; aspect-ratio: 4 / 3; background: var(--gis-line-soft); }
.gis-fav-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.gis-fav-card__heart { position: absolute; top: 10px; right: 10px; }

.gis-fav-card__body { padding: .9rem 1rem 1.1rem; }
.gis-fav-card__title { font-size: .95rem; font-weight: 600; margin: 0 0 .3rem; line-height: 1.3; }
.gis-fav-card__title a { color: var(--gis-ink); text-decoration: none; }
.gis-fav-card__title a:hover { color: var(--gis-accent); }
.gis-fav-card__price { color: var(--gis-muted); font-size: .9rem; }
.gis-fav-card__price .amount { color: var(--gis-ink); font-weight: 650; }

@media ( max-width: 900px ) { .gis-fav-grid { grid-template-columns: repeat( 3, 1fr ); } }
@media ( max-width: 640px ) { .gis-fav-grid { grid-template-columns: repeat( 2, 1fr ); } }