/**
 * M M Sanidaz — Wishlist
 * ------------------------------------------------------------------
 * TI Wishlist's page (1288), rendered by the theme's TI template overrides
 * (woocommerce/ti-wishlist*.php, inc/wishlist.php). Only the page shell,
 * heading, empty state and pagination are styled here — the product cards
 * are the Shop's own (product-card.css, `body.mmsc-cards` section) and are
 * not restyled, so the Wishlist, Shop and Cart recommendations show one card.
 *
 * Scoped to body.mmsc-wishlist-page. Legacy rules neutralised (with
 * !important only where the legacy rule has it):
 *   `.page-id-1288 bdi { background-color: white !important; color: #52bf59 }`
 *   `h1 { font-family: poppins !important }`
 *   TI theme.css: `.tinv-wishlist { font-family: Georgia }`,
 *   `.tinv-wishlist a:not(.button) { color: #007acc; underline }`
 *
 * Breakpoints: mobile ≤767px · tablet 768–1023px · desktop 1024px+
 */

/* ---------------------------------------------------------------
   Page shell
------------------------------------------------------------------ */

body.mmsc-wishlist-page #right-sidebar {
	display: none;
}

body.mmsc-wishlist-page #primary.content-area {
	float: none;
	width: 100%;
}

/* OceanWP Customizer pads `#main #content-wrap` by 50px. */
body.mmsc-wishlist-page #main #content-wrap {
	padding-top: 40px;
	padding-bottom: 96px;
}

@media (max-width: 767px) {
	/* 16px phone gutter, same as Cart / Checkout / My Account. */
	body.mmsc-wishlist-page #main #content-wrap {
		width: auto;
		max-width: none;
		padding: 24px 16px 64px;
	}
}

body.mmsc-wishlist-page .single-page-article,
body.mmsc-wishlist-page .entry {
	margin: 0;
	padding: 0;
}

body .tinv-wishlist.mmsc-wishlist {
	color: var(--mmsc-color-text);
	font-family: var(--mmsc-font-body);
	font-size: var(--mmsc-text-sm);
	line-height: 1.55;
}

body.mmsc-wishlist-page .mmsc-wishlist bdi {
	background-color: transparent !important;
	color: inherit;
}

body.mmsc-wishlist-page .mmsc-wishlist__form {
	margin: 0;
}

body.mmsc-wishlist-page .mmsc-wishlist .woocommerce-notices-wrapper:empty {
	display: none;
}

/* ---------------------------------------------------------------
   Heading
------------------------------------------------------------------ */

.mmsc-wishlist-head {
	margin: 0 0 var(--mmsc-space-6);
	padding: 0 0 var(--mmsc-space-5);
	border-bottom: 1px solid var(--mmsc-color-border);
}

.mmsc-wishlist-head__eyebrow {
	margin: 0 0 var(--mmsc-space-2);
	font-family: var(--mmsc-font-body);
	font-size: var(--mmsc-text-xs);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--mmsc-color-primary) !important; /* legacy `.page-id-253 p, div { color: black !important }` */
}

body .mmsc-wishlist-head__title {
	margin: 0;
	font-family: var(--mmsc-font-heading) !important;
	font-size: 34px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.015em;
	color: var(--mmsc-color-text);
}

@media (min-width: 768px) {
	body .mmsc-wishlist-head__title {
		font-size: 44px;
	}
}

.mmsc-wishlist-head__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	margin: 12px 0 0;
	font-size: var(--mmsc-text-sm);
	line-height: 1.5;
	color: var(--mmsc-color-text-muted) !important;
}

.mmsc-wishlist-head__sep {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--mmsc-color-border);
}

body .mmsc-wishlist a.mmsc-wishlist-head__link {
	font-weight: 500;
	color: var(--mmsc-color-text);
	text-decoration: underline;
	text-decoration-color: var(--mmsc-color-border);
	text-underline-offset: 4px;
}

body .mmsc-wishlist a.mmsc-wishlist-head__link:hover {
	color: var(--mmsc-color-primary);
	text-decoration-color: currentColor;
}

/* ---------------------------------------------------------------
   Grid — the Shop's card grid (product-card.css) as is.
------------------------------------------------------------------ */

body.mmsc-wishlist-page .mmsc-wishlist ul.products.oceanwp-row {
	margin: 0;
}

/* OceanWP underlines every link in a page's content
   (`.page:not(.elementor-page):not(.woocommerce-page) .entry a:not(…):not(…)`,
   0-6-1) — the Shop cards live outside page content, so they never had to
   undo it. */
body.mmsc-wishlist-page .entry .mmsc-wishlist ul.products.oceanwp-row li.product.type-product a,
body.mmsc-wishlist-page .entry .tinv-wishlist.mmsc-wishlist .social-buttons ul li a.social {
	text-decoration: none;
}

/* ---------------------------------------------------------------
   TI's "Share on" row (share this list's public link)
------------------------------------------------------------------ */

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons {
	display: flex;
	align-items: center;
	gap: var(--mmsc-space-3);
	float: none;
	width: auto;
	margin: var(--mmsc-space-7) 0 0;
	padding: var(--mmsc-space-5) 0 0;
	border-top: 1px solid var(--mmsc-color-border);
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons > span {
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	color: var(--mmsc-color-text-muted);
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mmsc-space-2);
	margin: 0;
	padding: 0;
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons li {
	float: none;
	margin: 0;
}

body.mmsc-wishlist-page .entry .mmsc-wishlist .social-buttons li a.social {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--mmsc-color-border);
	border-radius: 50%;
	background: var(--mmsc-color-surface);
	color: var(--mmsc-color-text);
	font-size: 15px;
	text-decoration: none;
	transition: border-color var(--mmsc-transition-fast), color var(--mmsc-transition-fast);
}

body.mmsc-wishlist-page .entry .mmsc-wishlist .social-buttons li a.social:hover,
body.mmsc-wishlist-page .entry .mmsc-wishlist .social-buttons li a.social:focus-visible {
	border-color: var(--mmsc-color-primary);
	color: var(--mmsc-color-primary);
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons li a.social i {
	margin: 0;
	font-size: inherit;
	color: inherit;
}

/* Share row (woocommerce/ti-wishlist-social.php): Facebook, Instagram,
   WhatsApp, X — one line on every phone, label unwrapped. */
body.mmsc-wishlist-page .mmsc-wishlist .social-buttons.mmsc-share {
	flex-wrap: wrap;
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons .mmsc-share__label {
	white-space: nowrap;
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons ul {
	flex-wrap: nowrap;
}

body.mmsc-wishlist-page .mmsc-wishlist .social-buttons li a.social svg {
	display: block;
	width: 18px;
	height: 18px;
}

body.mmsc-wishlist-page .mmsc-wishlist .mmsc-share__status {
	flex-basis: 100%;
	font-size: 13px;
	color: var(--mmsc-color-text-muted);
}

body.mmsc-wishlist-page .mmsc-wishlist .mmsc-share__status:empty {
	display: none;
}

/* ---------------------------------------------------------------
   Pagination (TI, more than 10 saved styles)
------------------------------------------------------------------ */

body.mmsc-wishlist-page .mmsc-wishlist .tinv-lists-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--mmsc-space-4);
	margin: var(--mmsc-space-7) 0 0;
	font-size: var(--mmsc-text-sm);
	color: var(--mmsc-color-text-muted);
}

body.mmsc-wishlist-page .mmsc-wishlist .tinv-lists-nav:not(:has(a)) {
	display: none;
}

body.mmsc-wishlist-page .mmsc-wishlist .tinv-lists-nav a.button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 var(--mmsc-space-5);
	border: 1px solid var(--mmsc-color-border);
	border-radius: var(--mmsc-radius-pill);
	background: var(--mmsc-color-surface);
	font-family: var(--mmsc-font-body);
	font-size: var(--mmsc-text-sm);
	font-weight: 500;
	color: var(--mmsc-color-text) !important; /* legacy `.button { color … !important }` */
}

body.mmsc-wishlist-page .mmsc-wishlist .tinv-lists-nav a.button:hover,
body.mmsc-wishlist-page .mmsc-wishlist .tinv-lists-nav a.button:focus-visible {
	border-color: var(--mmsc-color-dark);
	background: var(--mmsc-color-surface);
}

/* ---------------------------------------------------------------
   Empty state — same composition as the Cart's.
------------------------------------------------------------------ */

.mmsc-wishlist-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 560px;
	margin: 24px auto 0;
	padding: 56px 32px 48px;
	border: 1px solid var(--mmsc-color-border);
	border-radius: var(--mmsc-radius-md);
	background: var(--mmsc-color-surface);
	text-align: center;
	box-sizing: border-box;
}

@media (max-width: 599px) {
	.mmsc-wishlist-empty {
		margin-top: 8px;
		padding: 40px 20px 32px;
	}
}

.mmsc-wishlist-empty__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin: 0 0 22px;
	border-radius: 50%;
	background: rgba(185, 121, 132, 0.08);
	color: var(--mmsc-color-primary);
}

body .mmsc-wishlist-empty__title {
	margin: 0;
	font-family: var(--mmsc-font-heading) !important;
	font-size: 38px;
	font-weight: 600;
	line-height: 1.08;
	letter-spacing: -0.015em;
	color: var(--mmsc-color-text);
}

@media (max-width: 767px) {
	body .mmsc-wishlist-empty__title {
		font-size: 30px;
	}
}

.mmsc-wishlist-empty__text {
	max-width: 380px;
	margin: 12px auto 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--mmsc-color-text-muted) !important;
}

/* Primary button — the Cart's "Continue Shopping" recipe. Colour
   !important: TI `.tinv-wishlist a:not(.button)` and legacy link colours. */
body .mmsc-wishlist a.mmsc-wishlist-empty__action {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 280px;
	min-height: 54px;
	margin: 28px 0 0;
	padding: 0 var(--mmsc-space-5);
	border: 1px solid var(--mmsc-color-dark);
	border-radius: var(--mmsc-radius-sm);
	background: var(--mmsc-color-dark);
	box-sizing: border-box;
	color: var(--mmsc-color-surface) !important;
	font-family: var(--mmsc-font-body);
	font-size: var(--mmsc-text-sm);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color var(--mmsc-transition-fast), border-color var(--mmsc-transition-fast);
}

body .mmsc-wishlist a.mmsc-wishlist-empty__action:hover,
body .mmsc-wishlist a.mmsc-wishlist-empty__action:focus-visible {
	border-color: var(--mmsc-color-dark-hover);
	background: var(--mmsc-color-dark-hover);
	color: var(--mmsc-color-surface) !important;
}

body .mmsc-wishlist a.mmsc-wishlist-empty__action:focus-visible {
	outline: 2px solid var(--mmsc-color-accent);
	outline-offset: 3px;
}

/* ---------------------------------------------------------------
   Recommended for You (inc/wishlist.php) — the Cart's row (cart.css
   §10): a hairline, a smaller heading, the Shop's cards four across
   from 768px and two-up on phones.
------------------------------------------------------------------ */

body.mmsc-wishlist-page .mmsc-wishlist-recs {
	min-width: 0;
	margin: 56px 0 0;
	padding: 40px 0 0;
	border-top: 1px solid var(--mmsc-color-border);
	color: var(--mmsc-color-text);
	font-family: var(--mmsc-font-body);
}

/* After the empty state's card, a little closer. */
body.mmsc-wishlist-page .mmsc-wishlist-recs--empty {
	margin-top: 48px;
}

body.mmsc-wishlist-page .mmsc-wishlist-recs .mmsc-recs__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin: 0 0 24px;
	color: var(--mmsc-color-text) !important; /* legacy `div { color: black !important }` */
}

body.mmsc-wishlist-page .mmsc-wishlist-recs .mmsc-recs__title {
	margin: 0;
	font-family: var(--mmsc-font-heading) !important; /* Customizer `h2 { font-family: Poppins }` */
	font-size: var(--mmsc-text-xl);
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--mmsc-color-text);
}

body.mmsc-wishlist-page .entry .mmsc-wishlist-recs a.mmsc-recs__all {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 6px;
	font-size: var(--mmsc-text-sm);
	font-weight: 500;
	white-space: nowrap;
	color: var(--mmsc-color-text);
	text-decoration: underline;
	text-decoration-color: var(--mmsc-color-border);
	text-underline-offset: 4px;
}

body.mmsc-wishlist-page .entry .mmsc-wishlist-recs a.mmsc-recs__all:hover {
	color: var(--mmsc-color-text);
	text-decoration-color: currentColor;
}

body.mmsc-cards.mmsc-wishlist-page .mmsc-wishlist-recs ul.products.oceanwp-row {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
}

body.mmsc-wishlist-page .entry .mmsc-wishlist-recs ul.products.oceanwp-row li.product.type-product a {
	text-decoration: none;
}

@media (min-width: 768px) {
	body.mmsc-cards.mmsc-wishlist-page .mmsc-wishlist-recs ul.products.oceanwp-row {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		column-gap: var(--mmsc-space-4);
	}
}

@media (min-width: 1080px) {
	body.mmsc-wishlist-page .mmsc-wishlist-recs .mmsc-recs__title {
		font-size: var(--mmsc-text-2xl);
	}

	body.mmsc-cards.mmsc-wishlist-page .mmsc-wishlist-recs ul.products.oceanwp-row {
		column-gap: var(--mmsc-space-5);
	}
}

@media (max-width: 767px) {
	body.mmsc-wishlist-page .mmsc-wishlist-recs {
		margin-top: 40px;
		padding-top: 32px;
	}

	body.mmsc-wishlist-page .mmsc-wishlist-recs .mmsc-recs__head {
		margin-bottom: 18px;
	}

	body.mmsc-wishlist-page .mmsc-wishlist-recs .mmsc-recs__title {
		font-size: 21px;
	}
}

/* Removing a product (wishlist-add.js): its card fades out the moment the
   heart is tapped; TI's re-rendered list replaces it when the server
   answers. TI's veil over the list only shows if that takes a while (the
   animation outranks blockUI's inline opacity, as on the Cart). */
body.mmsc-wishlist-page li.product.mmsc-wl-removing {
	opacity: 0.25;
	transform: scale(0.97);
	pointer-events: none;
	transition: opacity 180ms ease, transform 180ms ease;
}

body.mmsc-wishlist-page .tinv-wishlist .blockUI.blockOverlay {
	animation: mmsc-wl-veil 200ms ease 600ms both;
}

@keyframes mmsc-wl-veil {
	from {
		opacity: 0;
	}
	to {
		opacity: 0.5;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.mmsc-wishlist-page li.product.mmsc-wl-removing {
		transform: none;
		transition: none;
	}

	body.mmsc-wishlist-page .tinv-wishlist .blockUI.blockOverlay {
		animation-duration: 1ms;
	}
}
