/* =========================================================================
   VPR Fashion 8 — لایه اصلاحی ۸.۳.۰
   آخرین CSS لودشده. وابسته به: vpr-home-82
   -------------------------------------------------------------------------
   ۱) منوی دسکتاپ — دفاعی و مستقل از ساختار (چه <ul> باشد چه نباشد)
   ۲) گالری تک‌محصول + لایت‌باکس
   ۳) دکمه افزودن مستقیم واریاسیون
   ====================================================================== */


/* -------------------------------------------------------------------------
   ۱) منوی دسکتاپ

   باگ اصلی: fallback_cb وردپرس items_wrap را اعمال نمی‌کرد، پس <li>ها
   مستقیم فرزند <nav class="main-nav"> بودند و همه سلکتورهای
   «.main-nav > ul > li» بی‌اثر می‌ماندند → li با display:list-item
   رندر می‌شد (بولت سیاه) و padding بزرگ‌تر باعث شکست دوخطی می‌شد.

   PHP این را اصلاح کرد، ولی این بلاک هر دو ساختار را پوشش می‌دهد تا
   حتی با کش قدیمی یا منوی سفارشی کاربر هم منو سالم بماند.
   ---------------------------------------------------------------------- */

/* حذف مارکر در تمام سطوح، مستقل از ساختار */
.site-header .main-nav,
.site-header .main-nav ul,
.site-header .main-nav ol {
	list-style: none !important;
	margin: 0;
	padding: 0;
}

.site-header .main-nav li {
	list-style: none !important;
	list-style-type: none !important;
	list-style-image: none !important;
	list-style-position: outside !important;
}

.site-header .main-nav li::marker {
	content: none !important;
	color: transparent !important;
	font-size: 0 !important;
}

.site-header .main-nav li::-webkit-details-marker { display: none !important; }

@media (min-width: 1081px) {

	.site-header .header-inner {
		display: flex;
		align-items: center;
		gap: 18px;
		flex-wrap: nowrap;
	}

	.site-header .site-logo { flex: 0 0 auto; }

	/* nav خودش هم می‌تواند کانتینر فلکس آیتم‌ها باشد (حالت بدون ul) */
	.site-header .main-nav {
		display: flex !important;
		flex: 1 1 auto;
		min-width: 0;
		align-items: center;
		justify-content: center;
		flex-wrap: nowrap;
		gap: 2px;
	}

	.site-header .main-nav > ul,
	.site-header .main-nav > ul.vpr-menu {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center;
		gap: 2px;
		margin: 0;
		padding: 0;
		list-style: none;
		max-width: 100%;
		flex: 1 1 auto;
		justify-content: center;
	}

	/* هر دو حالت: li فرزند ul، یا li فرزند مستقیم nav */
	.site-header .main-nav > ul > li,
	.site-header .main-nav > li {
		position: relative;
		flex: 0 1 auto;
		min-width: 0;
		display: block !important;
		margin: 0;
		padding: 0;
	}

	.site-header .main-nav > ul > li > a,
	.site-header .main-nav > li > a {
		display: flex !important;
		align-items: center;
		gap: 4px;
		font-size: 14.5px !important;
		font-weight: 600;
		line-height: 1.4 !important;
		padding: 10px 11px !important;
		margin: 0 !important;
		white-space: nowrap !important;
		word-break: normal !important;
		overflow-wrap: normal !important;
		hyphens: none !important;
		color: var(--vpr-primary, #1F1B24);
		text-decoration: none;
		border-radius: 8px;
		transition: color .2s, background .2s;
	}

	.site-header .main-nav > ul > li > a:hover,
	.site-header .main-nav > li > a:hover,
	.site-header .main-nav > ul > li.current-menu-item > a,
	.site-header .main-nav > li.current-menu-item > a,
	.site-header .main-nav > ul > li.current-menu-parent > a {
		color: #C99B6B;
		background: rgba(201, 155, 107, .08);
	}

	/* زیرخط تکراری که در سه لایه CSS تعریف شده بود */
	.site-header .main-nav > ul > li > a::after,
	.site-header .main-nav > li > a::after {
		display: none !important;
		content: none !important;
	}

	.site-header .header-actions {
		flex: 0 0 auto;
		margin-inline-start: auto;
	}

	/* عرض‌های میانی: جستجو جمع شود تا منو نشکند */
	@media (max-width: 1340px) {
		.site-header .header-search { display: none !important; }
		.site-header .main-nav > ul > li > a,
		.site-header .main-nav > li > a {
			font-size: 13.5px !important;
			padding: 10px 8px !important;
		}
	}

	@media (max-width: 1160px) {
		.site-header .main-nav > ul > li > a,
		.site-header .main-nav > li > a {
			font-size: 13px !important;
			padding: 9px 6px !important;
		}
	}

	/* مگا-منو در هر دو ساختار */
	.site-header .main-nav > ul > li:hover .mega-menu,
	.site-header .main-nav > li:hover .mega-menu,
	.site-header .main-nav > ul > li:focus-within .mega-menu,
	.site-header .main-nav > li:focus-within .mega-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		pointer-events: auto;
	}
}

/* موبایل: منوی دسکتاپ مخفی بماند در هر ساختاری */
@media (max-width: 1080px) {
	.site-header .main-nav { display: none !important; }
}


/* -------------------------------------------------------------------------
   ۲) گالری تک‌محصول
   ---------------------------------------------------------------------- */

.vpr-product-gallery {
	position: relative;
}

.vpr-product-gallery .gallery-main {
	position: relative;
	overflow: hidden;
	border-radius: var(--vpr-radius-lg, 16px);
	background: #f6f2f4;
	cursor: zoom-in;
	aspect-ratio: 4 / 5;
}

.vpr-product-gallery .gallery-main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: opacity .22s ease, transform .35s ease;
}

/* زوم با حرکت موس (دسکتاپ) */
.vpr-product-gallery .gallery-main.is-zooming img {
	transform: scale(2);
	transition: transform .12s ease-out;
}

.vpr-product-gallery .gallery-main .zoom-hint {
	position: absolute;
	bottom: 14px;
	inset-inline-start: 14px;
	background: rgba(255, 255, 255, .9);
	backdrop-filter: blur(4px);
	padding: 6px 12px;
	border-radius: 99px;
	font-size: 11px;
	display: flex;
	align-items: center;
	gap: 5px;
	pointer-events: none;
	transition: opacity .2s;
	z-index: 2;
}

.vpr-product-gallery .gallery-main.is-zooming .zoom-hint { opacity: 0; }

.vpr-product-gallery .gallery-thumbs {
	display: flex;
	gap: 10px;
	margin-top: 14px;
	overflow-x: auto;
	scrollbar-width: none;
	padding-bottom: 4px;
}
.vpr-product-gallery .gallery-thumbs::-webkit-scrollbar { display: none; }

.vpr-product-gallery .gallery-thumbs img {
	flex: 0 0 auto;
	width: 74px;
	height: 92px;
	object-fit: cover;
	border-radius: 10px;
	border: 2px solid transparent;
	opacity: .65;
	cursor: pointer;
	transition: opacity .2s, border-color .2s, transform .2s;
}

.vpr-product-gallery .gallery-thumbs img:hover {
	opacity: 1;
	transform: translateY(-2px);
}

.vpr-product-gallery .gallery-thumbs img.active {
	border-color: var(--vpr-primary, #1F1B24);
	opacity: 1;
}

/* --- لایت‌باکس --- */
.vpr-lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: rgba(15, 12, 18, .94);
	display: none;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity .22s ease;
}

.vpr-lightbox.is-open { display: flex; opacity: 1; }

.vpr-lightbox img {
	max-width: 92vw;
	max-height: 88vh;
	object-fit: contain;
	border-radius: 8px;
	user-select: none;
	transition: transform .25s ease;
}

.vpr-lightbox .lb-btn {
	position: absolute;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .25);
	background: rgba(255, 255, 255, .1);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background .2s;
	padding: 0;
	backdrop-filter: blur(6px);
}
.vpr-lightbox .lb-btn:hover { background: rgba(255, 255, 255, .22); }
.vpr-lightbox .lb-btn svg { width: 22px; height: 22px; }

.vpr-lightbox .lb-close { top: 22px; inset-inline-end: 22px; }
.vpr-lightbox .lb-prev  { inset-inline-start: 22px; top: 50%; transform: translateY(-50%); }
.vpr-lightbox .lb-next  { inset-inline-end: 22px;   top: 50%; transform: translateY(-50%); }

.vpr-lightbox .lb-counter {
	position: absolute;
	bottom: 22px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
	font-size: 13px;
	background: rgba(255, 255, 255, .12);
	padding: 5px 14px;
	border-radius: 99px;
	backdrop-filter: blur(6px);
}

body.vpr-lightbox-open { overflow: hidden; }

@media (max-width: 860px) {
	.vpr-product-gallery .gallery-main { cursor: default; aspect-ratio: 3 / 4; }
	.vpr-product-gallery .gallery-thumbs img { width: 62px; height: 78px; }
	.vpr-lightbox .lb-prev, .vpr-lightbox .lb-next { display: none; }
}


/* -------------------------------------------------------------------------
   ۳) دکمه افزودن مستقیم واریاسیون در لوپ
   ---------------------------------------------------------------------- */

.vpr-products-section .wc-card-body .button,
ul.products li.product .button {
	white-space: nowrap;
}

/* توضیح screen-reader محصول متغیر که دیگر لازم نیست */
.vpr-direct-add + .screen-reader-text { display: none !important; }

a.vpr-direct-add.loading {
	opacity: .65;
	pointer-events: none;
	position: relative;
}

a.vpr-direct-add.added::after {
	content: '✓';
	margin-inline-start: 6px;
	font-weight: 700;
}

/* توست کوچک تأیید افزودن */
.vpr-toast {
	position: fixed;
	bottom: 24px;
	inset-inline-end: 24px;
	z-index: 99998;
	background: #1F1B24;
	color: #fff;
	padding: 12px 20px;
	border-radius: 12px;
	font-size: 14px;
	box-shadow: 0 12px 32px rgba(31, 27, 36, .3);
	display: flex;
	align-items: center;
	gap: 10px;
	opacity: 0;
	transform: translateY(14px);
	transition: opacity .25s ease, transform .25s ease;
	pointer-events: none;
}

.vpr-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}

.vpr-toast a {
	color: #E7C9A9;
	text-decoration: underline;
	white-space: nowrap;
}

@media (max-width: 600px) {
	.vpr-toast {
		inset-inline: 16px;
		bottom: 16px;
		justify-content: center;
	}
}