/* ==============================================================
   Yanshur — Wishlist page
   1. Tokens + page head
   2. Grid + remove control
   3. Empty state
   Loaded only on the page holding the [rh_get_user_favorites]
   shortcode (see functions.php section 23).

   The cards themselves are the shop cards — the same
   woocommerce/content-product.php and css/shop-card.css the
   marketplace uses, which is why the grid keeps the
   .yanshur-shop-grid class. Nothing here restyles the card; it
   only lays the page out around it and turns ReHub's heart
   button into a remove control.
   ============================================================== */

.ysw-wrap{
	--ysc-ink:#182430;
	--ysc-paper:#F8F5EE;
	--ysc-card:#FFFFFF;
	--ysc-red:#C33F31;
	--ysc-red-dark:#8f2e23;
	--ysc-slate:#69707E;
	--ysc-line:rgba(24,36,48,0.10);
	--ysc-r-md:14px;

	font-family:'Inter',sans-serif;
	color:var(--ysc-ink);
	margin-top:6px;
}

/* The grid keeps its display:grid from shop-card.css, which beats the
   UA stylesheet's [hidden] rule — so hiding has to be spelled out here.
   Same for the head, which is a flex row. */
.ysw-wrap [hidden],
.yanshur-shop-grid.ysw-grid[hidden]{ display:none; }

/* ---------- 1. Page head ---------- */
.yanshur-wishlist .rh-post-wrapper .title .entry-title{
	font-family:'Fraunces',serif;
	font-weight:700;
	font-size:32px;
	line-height:1.2;
	color:var(--ysc-ink);
	margin:0;
}

.ysw-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	flex-wrap:wrap;
	gap:14px;
	margin:16px 0 24px;
	padding-bottom:16px;
	border-bottom:1px solid var(--ysc-line);
}
.ysw-count{
	font-family:'IBM Plex Mono',monospace;
	font-size:11.5px;
	letter-spacing:0.06em;
	text-transform:uppercase;
	color:var(--ysc-slate);
}
.ysw-count b{
	font-family:'Fraunces',serif;
	font-size:18px;
	font-weight:700;
	color:var(--ysc-ink);
	margin-right:4px;
}
.ysw-browse{
	display:inline-block;
	padding:9px 18px;
	border:1px solid var(--ysc-line);
	border-radius:9px;
	background:var(--ysc-card);
	font-size:12.5px;
	font-weight:600;
	color:var(--ysc-ink);
	text-decoration:none;
	transition:.18s;
}
.ysw-browse:hover{
	background:var(--ysc-paper);
	border-color:rgba(24,36,48,.28);
	color:var(--ysc-ink);
}

/* Guests keep their wishlist in an IP transient that expires after 30 days,
   so the page has to say so rather than let them lose a shortlist silently. */
.ysw-note{
	display:flex;
	align-items:flex-start;
	gap:10px;
	margin:0 0 24px;
	padding:12px 16px;
	background:var(--ysc-paper);
	border-radius:var(--ysc-r-md);
	font-size:13px;
	line-height:1.55;
	color:var(--ysc-slate);
}
.ysw-note::before{
	content:'';
	flex:0 0 auto;
	width:16px;
	height:16px;
	margin-top:2px;
	background:var(--ysc-slate);
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E") center/contain no-repeat;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E") center/contain no-repeat;
}
.ysw-note a{
	color:var(--ysc-red);
	font-weight:600;
	text-decoration:none;
}
.ysw-note a:hover{ text-decoration:underline; }

/* ---------- 2. Grid ---------- */
.yanshur-shop-grid.ysw-grid{ margin-bottom:10px; }

/* One wrapper per card so the remove control can sit over the card without
   content-product.php — shared with the shop grid — knowing about it. */
.ysw-item{
	position:relative;
	display:flex;
	transition:opacity .28s ease, transform .28s ease;
}
.ysw-item > .ysc-card{
	flex:1 1 auto;
	width:100%;
	min-width:0;
}
.ysw-item.is-removing{
	opacity:0;
	transform:scale(.96);
	pointer-events:none;
}

/* Language badge moves left to clear the remove button. */
.ysw-item .ysc-badge--lang{ right:52px; }

/* ---------- 2b. Remove control ---------- */
/* ReHub's own heart button, so wishcount.js keeps ownership of the ajax
   call and its nonce. Only the appearance is replaced: a cross, because on
   this page the single meaning of the button is "take it off the list".
   The selectors carry .ysw-item to outrank the theme's own
   .heart_thumb_wrap .heartplus rules in style.css. */
.ysw-item .heart_thumb_wrap{
	position:absolute;
	top:10px;
	right:10px;
	z-index:3;
	margin:0;
	line-height:0;
}
.ysw-item .heart_thumb_wrap .thumbscount{ display:none; }
.ysw-item .heart_thumb_wrap .cell_wishlist{ display:block; }
.ysw-item .heart_thumb_wrap .heartplus{
	display:flex;
	align-items:center;
	justify-content:center;
	width:30px;
	height:30px;
	margin:0;
	border:1px solid var(--ysc-line);
	border-radius:50%;
	background:var(--ysc-card);
	color:var(--ysc-slate);
	font-size:11px;
	line-height:1;
	box-shadow:0 8px 18px -10px rgba(24,36,48,.5);
	transition:.18s;
}
.ysw-item .heart_thumb_wrap .heartplus:before,
.ysw-item .heart_thumb_wrap .heartplus.alreadywish:before,
.ysw-item .heart_thumb_wrap:hover .heartplus.alreadywish:before{
	content:"\f00d";
	color:inherit;
	line-height:1;
}
.ysw-item .heart_thumb_wrap .heartplus.loading:before{ content:"\f3f4"; }
.ysw-item .heart_thumb_wrap .heartplus:hover{
	background:var(--ysc-red);
	border-color:var(--ysc-red);
	color:#fff;
}

/* ---------- 2c. Card for a non-product wishlist entry ---------- */
/* The wishlist accepts any post type. Products get the marketplace card;
   anything else gets the same shell with just a title and a link, so a
   stray blog post cannot break the row. */
.ysw-postcard .ysc-body{ padding-top:16px; }
.ysw-postcard .ysc-media{ background:var(--ysc-paper); }
.ysw-postcard .ysc-foot{ justify-content:flex-end; }
.ysw-postcard .ysc-btn{
	display:inline-block;
	text-decoration:none;
	color:#fff;
}

/* ---------- 3. Empty state ---------- */
.ysw-empty{
	background:var(--ysc-card);
	border:1px solid var(--ysc-line);
	border-radius:var(--ysc-r-md);
	padding:54px 26px;
	text-align:center;
}
.ysw-empty-icon{
	display:block;
	width:30px;
	height:30px;
	margin:0 auto 18px;
	background:var(--ysc-slate);
	-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20.5l-1.4-1.3C5.6 14.7 2.5 11.9 2.5 8.4 2.5 5.6 4.7 3.5 7.4 3.5c1.6 0 3.1.7 4.1 1.9 1-1.2 2.5-1.9 4.1-1.9 2.7 0 4.9 2.1 4.9 4.9 0 3.5-3.1 6.3-8.1 10.8z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20.5l-1.4-1.3C5.6 14.7 2.5 11.9 2.5 8.4 2.5 5.6 4.7 3.5 7.4 3.5c1.6 0 3.1.7 4.1 1.9 1-1.2 2.5-1.9 4.1-1.9 2.7 0 4.9 2.1 4.9 4.9 0 3.5-3.1 6.3-8.1 10.8z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.ysw-empty-title{
	font-family:'Fraunces',serif;
	font-size:22px;
	font-weight:700;
	color:var(--ysc-ink);
	margin:0 0 10px;
}
.ysw-empty-text{
	font-size:14px;
	line-height:1.65;
	color:var(--ysc-slate);
	max-width:440px;
	margin:0 auto 22px;
}
.ysw-empty-btn{
	display:inline-block;
	padding:12px 24px;
	border-radius:9px;
	background:var(--ysc-red);
	border:1px solid var(--ysc-red);
	font-size:13.5px;
	font-weight:600;
	color:#fff;
	text-decoration:none;
	transition:.18s;
}
.ysw-empty-btn:hover{
	background:var(--ysc-red-dark);
	border-color:var(--ysc-red-dark);
	color:#fff;
}

@media(max-width:620px){
	.yanshur-wishlist .rh-post-wrapper .title .entry-title{ font-size:26px; }
	.ysw-head{ margin-top:12px; }
	.ysw-browse{ width:100%; text-align:center; }
	.ysw-empty{ padding:40px 20px; }
}