:root{
	--wpfav-color: currentColor;
	--wpfav-active: #e11d48; /* rose-600 */
	--wpfav-bg: rgba(17,24,39,.96); /* gray-900 */
	--wpfav-toast: #fff;
	--wpfav-border: rgba(0,0,0,.08);
	--wpfav-radius: 999px;
	--wpfav-font: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

.wpfav-btn{
	display:inline-flex;
	align-items:center;
	gap:.5rem;
	border:1px solid var(--wpfav-border);
	background:#fff;
	color:#111827;
	font:600 14px/1 var(--wpfav-font);
	padding:.5rem .75rem;
	border-radius: var(--wpfav-radius);
	cursor:pointer;
	transition:transform .05s ease, box-shadow .2s ease, border-color .2s ease, color .2s ease, background .2s ease;
	box-shadow: 0 1px 1px rgba(0,0,0,.03);
}
.wpfav-btn:hover{ transform: translateY(-1px); box-shadow: 0 4px 10px rgba(0,0,0,.06); }
.wpfav-btn:active{ transform: translateY(0); }
.wpfav-btn[disabled]{ opacity:.6; cursor:not-allowed; }

/* Icon sprite via CSS masks */
.wpfav-btn__icon{
	width:1.1rem; height:1.1rem; display:inline-block;
	background: currentColor;
	mask-size: cover; -webkit-mask-size: cover;
}
.wpfav-icon--heart .wpfav-btn__icon{
	mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 21s-6.716-4.297-9.428-7.009A6.5 6.5 0 1 1 12 4.6a6.5 6.5 0 1 1 9.428 9.391C18.716 16.703 12 21 12 21z"/></svg>');
	-webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 21s-6.716-4.297-9.428-7.009A6.5 6.5 0 1 1 12 4.6a6.5 6.5 0 1 1 9.428 9.391C18.716 16.703 12 21 12 21z"/></svg>');
}
.wpfav-icon--bookmark .wpfav-btn__icon{
	mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6 3h12a1 1 0 0 1 1 1v17l-7-4-7 4V4a1 1 0 0 1 1-1z"/></svg>');
	-webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6 3h12a1 1 0 0 1 1 1v17l-7-4-7 4V4a1 1 0 0 1 1-1z"/></svg>');
}
.wpfav-icon--star .wpfav-btn__icon{
	mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 17.3l6.18 3.7-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>');
	-webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 17.3l6.18 3.7-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>');
}
.wpfav-btn.is-active{
	color: var(--wpfav-active);
	border-color: rgba(225,29,72,.25);
	background: rgba(225,29,72,.04);
}
.wpfav-btn__count{ font-weight:600; opacity:.8; }

/* Toasts */
.wpfav-toast-holder{
	position: fixed;
	z-index: 999999;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
	display: flex;
	flex-direction: column;
	gap: .5rem;
	pointer-events: none;
}
.wpfav-toast{
	background: var(--wpfav-bg);
	color: var(--wpfav-toast);
	border-radius: 12px;
	padding: .6rem .9rem;
	font: 600 14px/1.2 var(--wpfav-font);
	box-shadow: 0 10px 30px rgba(0,0,0,.25);
	opacity: 0; transform: translateY(10px);
	transition: opacity .2s ease, transform .2s ease;
}
.wpfav-toast.is-shown{ opacity:1; transform: translateY(0); }

/* Inline block wrapper so content injectors won't shift around */
.wpfav-inline{ display:block; margin:.75rem 0; }
.wpfav-inline--top{ margin-bottom:1rem; }
.wpfav-inline--bottom{ margin-top:1rem; }

/* ---------- BuddyPress Favorites Grid (strict square crop + better alignment) ---------- */
.wpfav-grid{
	display:grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
@media (min-width: 480px){
	.wpfav-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px){
	.wpfav-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 1024px){
	.wpfav-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.wpfav-card{
	border:1px solid var(--wpfav-border);
	border-radius: 14px;
	overflow:hidden;
	background:#fff;
	box-shadow: 0 1px 1px rgba(0,0,0,.03);
	display:flex;
	flex-direction:column;
	transition: box-shadow .2s ease, transform .05s ease;
}
.wpfav-card:hover{ box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-1px); }
.wpfav-card.is-removing{ opacity:0; transform: scale(.98); transition: opacity .2s ease, transform .2s ease; }

.wpfav-card__thumb{
	display:block;
	position:relative;
	aspect-ratio: 1 / 1; /* Square layout */
	background: #f3f4f6; /* gray-100 */
	overflow:hidden;
}
.wpfav-card__thumb img{
	position:absolute;
	inset:0;
	width:100%;
	height:100% !important; /* defeat aggressive theme rules */
	object-fit:cover;
	display:block;
}
.wpfav-card__placeholder{
	width:100%; height:100%; background: linear-gradient(135deg,#f3f4f6,#e5e7eb);
}

.wpfav-card__body{ padding: 12px; display:flex; flex-direction:column; gap: 10px; }
.wpfav-card__title{
	font: 700 15px/1.3 var(--wpfav-font);
	margin:0;
	display:-webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow:hidden;
	min-height: 2.6em; /* 2 lines × 1.3 line-height */
}
.wpfav-card__title a{ color:#111827; text-decoration:none; }
.wpfav-card__title a:hover{ text-decoration:underline; }

.wpfav-card__actions{ margin-top:auto; }
.wpfav-btn--wide{ width:100%; justify-content:center; }

.wpfav-btn--remove{
	border-color: rgba(225,29,72,.3);
	background: #fff;
	color: #e11d48;
}
.wpfav-btn--remove.is-active{ background: rgba(225,29,72,.06); }

/* Empty state */
.wpfav-empty{
	color:#6b7280; /* gray-500 */
	font: 500 14px/1.4 var(--wpfav-font);
}

/* Load more */
.wpfav-load-more-wrap{
	margin-top: 16px;
	display:flex; justify-content:center;
}
.wpfav-load-more{
	border:1px solid var(--wpfav-border);
	background:#fff;
	color:#111827;
	padding:.6rem 1rem;
	border-radius: 999px;
	font:600 14px/1 var(--wpfav-font);
	cursor:pointer;
	transition: box-shadow .2s ease, transform .05s ease;
}
.wpfav-load-more:hover{ transform: translateY(-1px); box-shadow: 0 8px 24px rgba(0,0,0,.08); }
.wpfav-load-more.is-loading{ opacity:.7; cursor:progress; }
