/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* ---------- Main menu: small four-point star between items ---------- */
.whb-header .wd-nav-main > li {
	position: relative;
}

.whb-header .wd-nav-main > li + li::before {
	content: "";
	position: absolute;
	top: 50%;
	inset-inline-start: calc(var(--nav-gap, 40px) / -2 - 4px);
	width: 8px;
	height: 8px;
	margin-top: -4px;
	background-color: var(--wd-primary-color, #a8825e);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C12.9 7.6 16.4 11.1 24 12C16.4 12.9 12.9 16.4 12 24C11.1 16.4 7.6 12.9 0 12C7.6 11.1 11.1 7.6 12 0Z'/%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'%3E%3Cpath d='M12 0C12.9 7.6 16.4 11.1 24 12C16.4 12.9 12.9 16.4 12 24C11.1 16.4 7.6 12.9 0 12C7.6 11.1 11.1 7.6 12 0Z'/%3E%3C/svg%3E") center / contain no-repeat;
	pointer-events: none;
}

/* =========================================================================
   Features ported from the Narciss child theme (colours set to the Narciss palette:
   accent #a8825e, dark #1a1a1a)
   ========================================================================= */

/* ---------- Soft loading (no full-page preloader) ---------- */

/* Image boxes keep their shape and show the ivory brand ground until the photo arrives. */
.wd-product-thumb,
.promo-banner .banner-image,
.wd-post-img {
	background-color: #f7f7f7;
}

.narciss-loading {
	position: relative;
	overflow: hidden;
}

.narciss-loading::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(100deg, rgba(246, 243, 239, 0) 30%, rgba(255, 255, 255, 0.55) 50%, rgba(246, 243, 239, 0) 70%);
	background-size: 220% 100%;
	animation: narciss-sheen 1.6s ease-in-out infinite;
}

@keyframes narciss-sheen {
	from { background-position: 120% 0; }
	to { background-position: -120% 0; }
}

img.narciss-fade {
	opacity: 0;
	transition: opacity 0.5s ease;
}

img.narciss-fade.narciss-in {
	opacity: 1;
}

/* Hero: poster shows at once as the box background, the video fades in when it plays. */
.wd-video-hosted.narciss-video-wait {
	background-color: #f7f7f7;
	background-position: center;
	background-size: cover;
}

.wd-video-hosted.narciss-video-wait video {
	opacity: 0;
	transition: opacity 0.8s ease;
}

.wd-video-hosted.narciss-video-on video {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	.narciss-loading::after {
		animation: none;
	}

	img.narciss-fade,
	.wd-video-hosted.narciss-video-wait video {
		transition: none;
	}
}

/* ---------- Support button (bottom right) ---------- */

.narciss-support {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 390;
	display: flex;
	flex-direction: column;
	/* RTL: flex-start is the right edge, so the button stays in the right corner. */
	align-items: flex-start;
	gap: 12px;
	direction: rtl;
}

.narciss-support svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.narciss-support-toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 52px;
	min-height: 52px;
	padding: 0 18px 0 20px;
	border: 0;
	border-radius: 26px;
	background-color: #1a1a1a;
	color: #fff;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	text-transform: none;
	letter-spacing: 0;
	box-shadow: 0 8px 24px rgba(26, 26, 26, 0.28);
	cursor: pointer;
	transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.narciss-support-toggle:hover {
	background-color: #a8825e;
	color: #fff;
	box-shadow: 0 10px 28px rgba(26, 26, 26, 0.34);
}

.narciss-support-toggle:focus-visible {
	outline: 2px solid #1a1a1a;
	outline-offset: 3px;
}

.narciss-support-open,
.narciss-support-close {
	display: inline-flex;
}

.narciss-support-close,
.narciss-support.is-open .narciss-support-open {
	display: none;
}

.narciss-support.is-open .narciss-support-close {
	display: inline-flex;
}

.narciss-support-panel {
	width: 320px;
	max-width: calc(100vw - 40px);
	overflow: hidden;
	border: 1px solid #ece5de;
	border-radius: 12px;
	background-color: #fff;
	box-shadow: 0 18px 48px rgba(26, 26, 26, 0.16);
	opacity: 0;
	transform: translateY(8px);
	transform-origin: bottom right;
	transition: opacity 0.2s ease, transform 0.2s ease;
}

.narciss-support.is-open .narciss-support-panel {
	opacity: 1;
	transform: none;
}

.narciss-support-head {
	padding: 20px 20px 16px;
	background-color: #1a1a1a;
	color: #fff;
}

.narciss-support-head p {
	margin: 0;
}

.narciss-support-kicker {
	color: rgba(255, 255, 255, 0.75);
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	direction: ltr;
	text-align: right;
}

.narciss-support-title {
	margin-top: 4px !important;
	color: #fff;
	font-size: 18px;
	font-weight: 500;
}

.narciss-support-sub {
	margin-top: 8px !important;
	color: rgba(255, 255, 255, 0.85);
	font-size: 13px;
	line-height: 1.8;
}

.narciss-support-list {
	margin: 0;
	padding: 8px;
	list-style: none;
}

.narciss-support-list li {
	margin: 0;
}

.narciss-support-list a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	border-radius: 8px;
	color: #1a1a1a;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.narciss-support-list a:hover,
.narciss-support-list a:focus-visible {
	background-color: #f7f2ec;
	color: #a8825e;
	outline: none;
}

.narciss-support-icon {
	display: inline-flex;
	flex: 0 0 40px;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: #f7f2ec;
	color: #1a1a1a;
}

.narciss-support-list a:hover .narciss-support-icon {
	background-color: #fff;
}

.narciss-support-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.narciss-support-text strong {
	font-size: 14px;
	font-weight: 500;
}

.narciss-support-text small {
	color: #7a6e6a;
	font-size: 12px;
	line-height: 1.6;
}

@media (max-width: 768px) {
	.narciss-support {
		right: 16px;
		bottom: 16px;
	}

	.narciss-support-toggle {
		width: 52px;
		padding: 0;
		justify-content: center;
		border-radius: 50%;
	}

	.narciss-support-label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.narciss-support-panel {
		width: calc(100vw - 32px);
		max-width: 360px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.narciss-support-toggle,
	.narciss-support-panel {
		transition: none;
	}
}

@media print {
	.narciss-support {
		display: none;
	}
}


/* ---------- Contact channels shortcode ---------- */
.narciss-channels {
	display: grid;
	gap: 10px;
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}

.narciss-channels li {
	margin: 0;
}

.narciss-channels a {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
	border: 1px solid #e4dbd2;
	border-radius: 10px;
	background: #fff;
	color: #1a1a1a;
	text-decoration: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.narciss-channels a:hover,
.narciss-channels a:focus-visible {
	border-color: #1a1a1a;
	box-shadow: 0 8px 22px rgba(26, 26, 26, 0.07);
}

.narciss-channels-icon {
	display: grid;
	flex: 0 0 44px;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #f6f3ef;
	color: #1a1a1a;
}

.narciss-channels-icon svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.narciss-channels-text {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 2px;
}

.narciss-channels-text strong {
	font-size: 15px;
	font-weight: 500;
}

.narciss-channels-text small {
	color: #7a6e6a;
	font-size: 12px;
}

.narciss-channels-arrow {
	color: #a8825e;
	font-size: 18px;
	transition: transform 0.2s ease;
}

.narciss-channels a:hover .narciss-channels-arrow {
	transform: translateX(-4px);
}

/* ---------- Single product: rating row, SnappPay box, trust list ---------- */
/* Rating row under the title. */
.narciss-rating-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 4px;
}

.narciss-stars {
	position: relative;
	display: inline-block;
	width: 92px;
	height: 16px;
	background: no-repeat 0 0 / 18.4px 16px repeat-x;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 21'%3E%3Cpath d='M12 1.5l3 6.6 7.1.7-5.4 4.8 1.6 7-6.3-3.8-6.3 3.8 1.6-7L1.9 8.8 9 8.1z' fill='none' stroke='%23a8825e' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
	direction: ltr;
}

.narciss-stars-fill {
	position: absolute;
	inset: 0 auto 0 0;
	overflow: hidden;
	background: no-repeat 0 0 / 18.4px 16px repeat-x;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 21'%3E%3Cpath d='M12 1.5l3 6.6 7.1.7-5.4 4.8 1.6 7-6.3-3.8-6.3 3.8 1.6-7L1.9 8.8 9 8.1z' fill='%23a8825e' stroke='%23a8825e' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.narciss-rating-avg {
	color: #1a1a1a;
	font-size: 14px;
	font-weight: 600;
}

.narciss-rating-link {
	padding-bottom: 1px;
	border-bottom: 1px solid currentColor;
	color: #1a1a1a;
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
}

.narciss-rating-link:hover {
	color: #a8825e;
}

/* ---------- SnappPay box: SnappPay logo and blue (#008efa) ---------- */

.narciss-snappay {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 22px;
	padding: 14px 16px;
	border: 1px solid #cfe6fe;
	border-radius: 12px;
	background: #f2f8ff;
}

.narciss-snappay-logo {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	border-radius: 10px;
}

.narciss-snappay-body {
	min-width: 0;
}

.narciss-snappay .narciss-snappay-title {
	margin: 0 0 2px;
	color: #0078d4;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.6;
}

.narciss-snappay .narciss-snappay-text {
	margin: 0;
	color: #3d4a57;
	font-size: 14px;
	line-height: 1.8;
}

.narciss-snappay-amount {
	margin-inline: 4px;
	color: #0078d4;
	font-size: 16px;
	font-weight: 700;
}

.narciss-snappay-amount .woocommerce-Price-currencySymbol {
	margin-inline-start: 3px;
	font-size: 12px;
	font-weight: 500;
}

.narciss-snappay-note {
	color: #008efa;
	font-size: 12px;
	font-weight: 500;
}


.narciss-single-trust {
	display: grid;
	gap: 10px;
	margin: 0 0 22px;
	padding: 16px 0 0;
	border-top: 1px solid #ece5de;
	list-style: none;
}

.narciss-single-trust li {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	color: #5f5552;
	font-size: 13px;
}

.narciss-single-trust svg {
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	fill: none;
	stroke: #1a1a1a;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* =========================================================================
   Smooth page transitions (cross-document View Transitions)
   Browsers that support it fade between pages; the header and support button stay put.
   Others simply load the next page as before.
   ========================================================================= */

@view-transition {
	navigation: auto;
}

::view-transition-old(root),
::view-transition-new(root) {
	animation-duration: 0.28s;
	animation-timing-function: ease;
}

/*
 * No view-transition-name on the header: it would make the header its own stacking context
 * and trap the account dropdown and the sticky menu under page content. The header is the
 * same on every page, so the root cross-fade already keeps it visually still.
 */

.narciss-support {
	view-transition-name: narciss-support;
}

@media (prefers-reduced-motion: reduce) {
	@view-transition {
		navigation: none;
	}
}

/* =========================================================================
   Mobile buy bar (product pages, phones only)
   ========================================================================= */

.narciss-buybar {
	display: none;
}

@media (max-width: 767px) {
	.narciss-buybar {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 380;
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
		border-top: 1px solid #e4dbd2;
		background: rgba(255, 255, 255, 0.98);
		box-shadow: 0 -10px 30px rgba(26, 26, 26, 0.1);
		backdrop-filter: blur(8px);
		direction: rtl;
	}

	.narciss-buybar-price {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		min-width: 0;
		line-height: 1.3;
	}

	.narciss-buybar-label {
		color: #9b8f8b;
		font-size: 11px;
	}

	.narciss-buybar-amount {
		overflow: hidden;
		color: #1a1a1a;
		font-size: 15px;
		font-weight: 700;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.narciss-buybar-qty {
		display: inline-flex;
		flex: 0 0 auto;
		align-items: center;
		height: 44px;
		border: 1px solid #e4dbd2;
		border-radius: 10px;
		background: #fff;
	}

	.narciss-buybar-qty button {
		width: 32px;
		height: 100%;
		padding: 0;
		border: 0;
		background: transparent;
		color: #1a1a1a;
		font-size: 18px;
		line-height: 1;
	}

	.narciss-buybar-count {
		min-width: 22px;
		color: #1a1a1a;
		font-size: 15px;
		font-weight: 600;
		text-align: center;
	}

	.narciss-buybar-add {
		display: inline-flex;
		flex: 0 0 auto;
		align-items: center;
		justify-content: center;
		gap: 6px;
		min-width: 128px;
		height: 44px;
		padding: 0 14px;
		border: 0;
		border-radius: 10px;
		background: #1a1a1a;
		color: #f6f3ef;
		font-size: 14px;
		font-weight: 600;
		box-shadow: 0 8px 18px rgba(26, 26, 26, 0.22);
		transition: background-color 0.2s ease, opacity 0.2s ease;
	}

	.narciss-buybar-add::before {
		content: "";
		width: 18px;
		height: 18px;
		background: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.4 8h11.2l-.7 11.1a1 1 0 0 1-1 .9H8.1a1 1 0 0 1-1-.9L6.4 8z'/%3E%3Cpath d='M9 8V6.8a3 3 0 0 1 6 0V8'/%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='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.4 8h11.2l-.7 11.1a1 1 0 0 1-1 .9H8.1a1 1 0 0 1-1-.9L6.4 8z'/%3E%3Cpath d='M9 8V6.8a3 3 0 0 1 6 0V8'/%3E%3C/svg%3E") center / contain no-repeat;
	}

	.narciss-buybar.is-loading .narciss-buybar-add {
		opacity: 0.75;
		pointer-events: none;
	}

	.narciss-buybar.is-added .narciss-buybar-add {
		background: #2e7d4f;
		box-shadow: none;
	}

	.narciss-buybar.is-added .narciss-buybar-add::before {
		display: none;
	}

	/* Room for the bar at the end of the page, and floating buttons above it. */
	body.has-narciss-buybar {
		padding-bottom: calc(66px + env(safe-area-inset-bottom));
	}

	body.has-narciss-buybar .narciss-support,
	body.has-narciss-buybar .scrollToTop {
		bottom: calc(78px + env(safe-area-inset-bottom));
	}

	/* Woodmart's own mobile sticky bar is replaced by this one. */
	body.has-narciss-buybar .wd-sticky-btn {
		display: none;
	}
}

@media (max-width: 359px) {
	.narciss-buybar {
		gap: 8px;
		padding-inline: 10px;
	}

	.narciss-buybar-add {
		min-width: 0;
		padding: 0 10px;
		font-size: 13px;
	}

	.narciss-buybar-add::before {
		display: none;
	}
}


/* =========================================================================
   Home page
   ========================================================================= */

/* ---------- Shopping promises row ---------- */
.narciss-features {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	border-block: 1px solid #ece5de;
}

.narciss-features li {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0;
	padding: 26px 22px;
}

.narciss-features li + li {
	border-inline-start: 1px solid #ece5de;
}

.narciss-features-icon {
	display: grid;
	flex: 0 0 46px;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: #f7f2ec;
	color: #a8825e;
}

.narciss-features-icon svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.narciss-features-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.narciss-features-text strong {
	color: #1a1a1a;
	font-size: 14px;
	font-weight: 600;
}

.narciss-features-text small {
	color: #7a726c;
	font-size: 12px;
	line-height: 1.7;
}

@media (max-width: 1024px) {
	.narciss-features {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.narciss-features li:nth-child(3) {
		border-inline-start: 0;
	}

	.narciss-features li:nth-child(n + 3) {
		border-top: 1px solid #ece5de;
	}
}

@media (max-width: 575px) {
	.narciss-features li {
		flex-direction: column;
		gap: 8px;
		padding: 18px 10px;
		text-align: center;
	}

	.narciss-features-text small {
		font-size: 11px;
	}
}

/* ---------- Shop by colour ---------- */
.narciss-colors {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.narciss-colors li {
	margin: 0;
}

.narciss-colors a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	color: #1a1a1a;
	text-decoration: none;
}

.narciss-colors-dot {
	width: 64px;
	height: 64px;
	border: 4px solid #fff;
	border-radius: 50%;
	background: var(--dot);
	box-shadow: 0 0 0 1px #e4dbd2;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.narciss-colors a:hover .narciss-colors-dot,
.narciss-colors a:focus-visible .narciss-colors-dot {
	box-shadow: 0 0 0 2px #a8825e;
	transform: translateY(-2px);
}

.narciss-colors-name {
	font-size: 14px;
	font-weight: 500;
}

.narciss-colors-count {
	color: #9b928b;
	font-size: 12px;
}

@media (max-width: 575px) {
	.narciss-colors {
		gap: 14px 18px;
	}

	.narciss-colors-dot {
		width: 52px;
		height: 52px;
	}
}

/* ---------- Shop by category: [narciss_categories] ---------- */
.narciss-cats {
	display: grid;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: 24px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.narciss-cats li {
	margin: 0;
	list-style: none;
}

.narciss-cats a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	color: #1a1a1a;
	text-align: center;
	text-decoration: none;
}

.narciss-cats-photo {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	margin-bottom: 8px;
	overflow: hidden;
	border-radius: 20px;
	background: #f6ebe1;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.narciss-cats-photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.narciss-cats a:hover .narciss-cats-photo,
.narciss-cats a:focus-visible .narciss-cats-photo {
	box-shadow: 0 14px 30px rgba(91, 58, 30, 0.14);
	transform: translateY(-3px);
}

.narciss-cats a:hover .narciss-cats-photo img,
.narciss-cats a:focus-visible .narciss-cats-photo img {
	transform: scale(1.05);
}

.narciss-cats-name {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.5;
}

.narciss-cats-count {
	color: #9b928b;
	font-size: 12px;
}

@media (min-width: 768px) and (max-width: 1024px) {
	.narciss-cats {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Phones: one row to swipe, the next card peeking in. */
@media (max-width: 767px) {
	/* Full width of the screen, so cards slide off at the screen edge, not inside the page. */
	.narciss-cats {
		display: flex;
		gap: 12px;
		margin-inline: calc(50% - 50vw);
		padding: 0 16px 6px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: 16px;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	.narciss-cats::-webkit-scrollbar {
		display: none;
	}

	.narciss-cats li {
		flex: 0 0 38%;
		scroll-snap-align: start;
	}

	.narciss-cats-photo {
		border-radius: 16px;
	}

	.narciss-cats-name {
		font-size: 13px;
	}

	.narciss-cats-count {
		font-size: 11px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.narciss-cats-photo,
	.narciss-cats-photo img {
		transition: none;
	}
}

/* ---------- Hero: starts right under the header ---------- */
.home .wd-content-layout {
	padding-top: 0;
}

.narciss-hero .banner-title {
	font-weight: 600;
	line-height: 1.5;
}

.narciss-hero .banner-inner {
	color: #5f5752;
	font-size: 15px;
	line-height: 2;
}

/* Phones: a taller crop that keeps both models in view, with the text under the photo. */
@media (max-width: 767px) {
	.narciss-hero .banner-image img {
		width: 100%;
		height: 300px;
		object-fit: cover;
		object-position: 26% center;
	}

	.narciss-hero .wrapper-content-banner {
		position: static;
		padding: 22px 16px 6px;
	}

	.narciss-hero .content-banner {
		width: 100% !important;
		max-width: none !important;
		text-align: center !important;
	}

	.narciss-hero .banner-title {
		font-size: 24px;
	}

	.narciss-hero .banner-inner {
		font-size: 14px;
	}

	.narciss-hero .banner-btn-wrapper .wd-button-wrapper {
		text-align: center;
	}
}

/* ---------- Category tiles: product photo on white, title under it ---------- */
.narciss-cats .banner-image {
	border: 1px solid #ece5de;
	background: #fff;
}

.narciss-cats .banner-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: contain;
	padding: 24px;
	transition: transform 0.4s ease;
}

.narciss-cats .promo-banner:hover .banner-image img {
	transform: scale(1.03);
}

.narciss-cats .wrapper-content-banner {
	position: static;
	padding: 18px 0 0;
}

.narciss-cats .banner-btn-wrapper {
	display: none;
}

@media (max-width: 767px) {
	.narciss-cats .banner-image img {
		aspect-ratio: 3 / 4;
		padding: 10px;
	}

	.narciss-cats .wrapper-content-banner {
		padding-top: 10px;
	}

	.narciss-cats .banner-title {
		font-size: 18px;
	}
}

.narciss-cats .content-banner {
	width: 100% !important;
	max-width: none !important;
}

@media (max-width: 767px) {
	.narciss-cats .banner-title {
		font-size: 18px !important;
		white-space: nowrap;
	}
}

/* =========================================================================
   Footer (footer.php): dark ground, gold accent
   ========================================================================= */

.wd-footer.narciss-foot {
	--nf-bg: #161514;
	--nf-bg-2: #1f1d1b;
	--nf-ink: #f4efe9;
	--nf-muted: #a49c94;
	--nf-line: rgba(255, 255, 255, 0.09);
	--nf-gold: #c2a07c;
	background: var(--nf-bg);
	color: var(--nf-muted);
	font-size: 14px;
}

.narciss-foot-wrap {
	width: min(1220px, calc(100% - 48px));
	margin-inline: auto;
}

.narciss-foot svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.narciss-foot ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.narciss-foot li {
	margin: 0;
}

.narciss-foot a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

/* ---------- Consultation band ---------- */
.narciss-foot-cta {
	background: var(--nf-bg-2);
	border-bottom: 1px solid var(--nf-line);
}

.narciss-foot-cta .narciss-foot-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px 40px;
	padding-block: 36px;
}

.narciss-foot-cta p {
	margin: 0;
}

.narciss-foot-kicker {
	color: var(--nf-gold);
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.narciss-foot-cta-title {
	margin-top: 6px !important;
	color: var(--nf-ink);
	font-size: 22px;
	font-weight: 500;
	line-height: 1.6;
}

.narciss-foot-cta-sub {
	margin-top: 4px !important;
	font-size: 14px;
	line-height: 1.9;
}

.narciss-foot-cta-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.narciss-foot-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 48px;
	padding: 0 22px;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 24px;
	color: var(--nf-ink) !important;
	font-size: 14px;
	font-weight: 500;
}

.narciss-foot-btn:hover {
	border-color: var(--nf-gold);
	color: var(--nf-gold) !important;
}

.narciss-foot-btn.is-primary {
	border-color: #a8825e;
	background: #a8825e;
	color: #fff !important;
}

.narciss-foot-btn.is-primary:hover {
	border-color: #93714f;
	background: #93714f;
	color: #fff !important;
}

/* ---------- Main columns ---------- */
.narciss-foot-main {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) repeat(2, minmax(0, 1fr)) minmax(0, 1.25fr);
	gap: 40px;
	padding-block: 56px 48px;
}

.narciss-foot-logo {
	display: inline-block;
}

.narciss-foot-logo img {
	width: auto;
	height: 74px;
	/* The logo artwork is black; turn it light on the dark ground. */
	filter: brightness(0) invert(0.95);
}

.narciss-foot-logo span {
	color: var(--nf-ink);
	font-size: 28px;
}

.narciss-foot-about {
	max-width: 340px;
	margin: 18px 0 0;
	font-size: 14px;
	line-height: 2.1;
}

.narciss-foot-social {
	display: flex;
	gap: 10px;
	margin-top: 22px;
}

.narciss-foot-social a {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid var(--nf-line);
	border-radius: 50%;
	color: var(--nf-ink);
}

.narciss-foot-social a:hover {
	border-color: var(--nf-gold);
	color: var(--nf-gold);
}

.narciss-foot-col h2 {
	position: relative;
	margin: 0 0 22px;
	padding-bottom: 12px;
	color: var(--nf-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.5;
	text-transform: none;
}

.narciss-foot-col h2::after {
	content: "";
	position: absolute;
	bottom: 0;
	inset-inline-start: 0;
	width: 28px;
	height: 2px;
	background: var(--nf-gold);
}

.narciss-foot-col li + li {
	margin-top: 12px;
}

.narciss-foot-col a:hover {
	color: var(--nf-gold);
}

.narciss-foot-contact a {
	display: flex;
	align-items: center;
	gap: 12px;
}

.narciss-foot-ci {
	display: grid;
	flex: 0 0 40px;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.06);
	color: var(--nf-gold);
}

.narciss-foot-ct {
	display: flex;
	flex-direction: column;
	line-height: 1.6;
}

.narciss-foot-ct strong {
	color: var(--nf-ink);
	font-size: 14px;
	font-weight: 500;
}

.narciss-foot-ct small {
	font-size: 12px;
}

.narciss-foot-contact a:hover .narciss-foot-ct strong {
	color: var(--nf-gold);
}

.narciss-foot-enamad {
	display: inline-block;
	margin-top: 20px;
	padding: 6px;
	border-radius: 10px;
	background: #fff;
}

.narciss-foot-enamad img {
	display: block;
	width: 84px;
	height: auto;
}

/* ---------- Bottom bar ---------- */
.narciss-foot-bottom {
	border-top: 1px solid var(--nf-line);
}

.narciss-foot-bottom .narciss-foot-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
	padding-block: 20px;
	font-size: 13px;
}

.narciss-foot-copy {
	margin: 0;
}

.narciss-foot-legal {
	display: flex;
	gap: 18px;
}

.narciss-foot-legal a:hover {
	color: var(--nf-gold);
}

.narciss-foot-pay {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.narciss-foot-pay li {
	padding: 4px 12px;
	border: 1px solid var(--nf-line);
	border-radius: 14px;
	color: var(--nf-ink);
	font-size: 12px;
}

/* ---------- Tablet and phone ---------- */
@media (max-width: 1024px) {
	.narciss-foot-main {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.narciss-foot-wrap {
		width: calc(100% - 32px);
	}

	.narciss-foot-cta .narciss-foot-wrap {
		padding-block: 28px;
		text-align: center;
		justify-content: center;
	}

	.narciss-foot-cta-title {
		font-size: 18px;
	}

	.narciss-foot-cta-btns {
		width: 100%;
	}

	.narciss-foot-btn {
		flex: 1 1 0;
		justify-content: center;
		padding: 0 12px;
	}

	.narciss-foot-main {
		gap: 32px 20px;
		padding-block: 40px 32px;
	}

	.narciss-foot-brand,
	.narciss-foot-contact {
		grid-column: 1 / -1;
	}

	.narciss-foot-brand {
		text-align: center;
	}

	.narciss-foot-about {
		margin-inline: auto;
	}

	.narciss-foot-social {
		justify-content: center;
	}

	.narciss-foot-bottom .narciss-foot-wrap {
		flex-direction: column;
		text-align: center;
	}
}

/* ---------- Shopping promises as a full-width band ---------- */
.narciss-features-band .narciss-features {
	border-block: 1px solid #ece5de;
	background: #fff;
}

.narciss-features-band .narciss-features li {
	justify-content: center;
	padding-block: 28px;
}

/* Blog cards on the home page */
.home .wd-blog-holder .wd-post-img img,
.home .wd-blog-element .wd-post-img img {
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

/* Phones: the support button sits above Woodmart's bottom toolbar instead of covering it. */
@media (max-width: 1024px) {
	body.sticky-toolbar-on .narciss-support {
		bottom: calc(55px + 14px + env(safe-area-inset-bottom));
	}

	body.sticky-toolbar-on.has-narciss-buybar .narciss-support {
		bottom: calc(55px + 78px + env(safe-area-inset-bottom));
	}
}

@media (max-width: 767px) {
	body.sticky-toolbar-on .narciss-buybar {
		bottom: calc(55px + env(safe-area-inset-bottom));
		padding-bottom: 10px;
	}

	body.sticky-toolbar-on.has-narciss-buybar {
		padding-bottom: calc(55px + 66px + env(safe-area-inset-bottom));
	}

	body.sticky-toolbar-on.has-narciss-buybar .scrollToTop {
		bottom: calc(55px + 78px + env(safe-area-inset-bottom));
	}
}

/* Phones: taller hero photo (both models in view), and only the title and button under it. */
@media (max-width: 767px) {
	.narciss-hero .banner-image {
		--wd-img-height: 340px;
	}

	.narciss-hero .banner-image img {
		height: var(--wd-img-height);
		object-position: 27% center;
	}

	.narciss-hero .banner-subtitle,
	.narciss-hero .banner-inner {
		display: none;
	}

	.narciss-hero .wrapper-content-banner {
		padding: 16px 16px 0;
	}

	.narciss-hero .banner-title {
		margin-bottom: 12px;
		font-size: 20px;
	}

	.narciss-hero .banner-btn-wrapper .btn {
		min-height: 42px;
		padding-inline: 28px;
	}
}

@media (max-width: 767px) {
	.narciss-hero .banner-image {
		object-position: 24% center;
	}
}

/* Promise row adapts to the number of items (SnappPay appears only while its gateway is on). */
@media (min-width: 1025px) {
	.narciss-features {
		grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr));
	}
}

/* =========================================================================
   English labels in Bodoni Moda (the display serif from the Velora hero and titles)
   ========================================================================= */
@font-face {
	font-family: "Bodoni Moda";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("fonts/bodoni-moda-600-latin.woff2") format("woff2");
}

.narciss-hero .banner-subtitle,
.elementor-widget-wd_title .title-subtitle,
.narciss-foot-kicker,
.narciss-support-kicker,
.narciss-foot-logo span {
	font-family: "Bodoni Moda", "Times New Roman", serif !important;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	direction: ltr;
	unicode-bidi: isolate;
}

.narciss-hero .banner-subtitle {
	font-size: 15px;
}

.elementor-widget-wd_title .title-subtitle {
	color: #a8825e;
	font-size: 13px;
}

/* ---------- Product cards: no add-to-cart button in the loops ---------- */
.wd-product .wd-add-btn {
	display: none !important;
}

/* =========================================================================
   Support button: round brand-brown button with a gold ring, ivory panel
   ========================================================================= */
.narciss-support {
	right: 22px;
	bottom: 22px;
	align-items: flex-start;
}

.narciss-support-toggle {
	width: 58px;
	height: 58px;
	min-height: 58px;
	padding: 0;
	justify-content: center;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 25%, #c09a74 0%, #a8825e 55%, #8c6a4a 100%);
	box-shadow: 0 0 0 4px #fff, 0 0 0 5px rgba(168, 130, 94, 0.45), 0 12px 26px rgba(80, 56, 34, 0.28);
}

.narciss-support-toggle:hover {
	background: radial-gradient(circle at 30% 25%, #b58f69 0%, #93714f 60%, #7a5b3f 100%);
	box-shadow: 0 0 0 4px #fff, 0 0 0 6px rgba(168, 130, 94, 0.6), 0 14px 30px rgba(80, 56, 34, 0.32);
	transform: translateY(-2px);
}

.narciss-support-toggle:focus-visible {
	outline: 2px solid #a8825e;
	outline-offset: 6px;
}

.narciss-support-toggle svg {
	width: 26px;
	height: 26px;
}

/* The word "پشتیبانی" becomes a small tag beside the button on desktop. */
.narciss-support-label {
	position: absolute;
	top: 50%;
	right: calc(100% + 12px);
	padding: 6px 12px;
	border-radius: 8px;
	background: #1a1a1a;
	color: #fff;
	font-size: 12px;
	white-space: nowrap;
	opacity: 0;
	transform: translate(6px, -50%);
	transition: opacity 0.2s ease, transform 0.2s ease;
	pointer-events: none;
}

.narciss-support-toggle:hover .narciss-support-label,
.narciss-support-toggle:focus-visible .narciss-support-label {
	opacity: 1;
	transform: translate(0, -50%);
}

.narciss-support.is-open .narciss-support-label {
	opacity: 0;
}

.narciss-support-panel {
	width: 300px;
	border: 0;
	border-radius: 18px;
	box-shadow: 0 24px 60px rgba(40, 28, 18, 0.22);
	transform: translateY(10px) scale(0.98);
}

.narciss-support.is-open .narciss-support-panel {
	transform: none;
}

.narciss-support-head {
	padding: 22px 22px 18px;
	border-bottom: 1px solid #efe6dc;
	background: #f8f4ef;
	color: #1a1a1a;
}

.narciss-support-kicker {
	color: #a8825e;
	font-size: 11px;
	text-align: right;
}

.narciss-support-title {
	color: #1a1a1a;
}

.narciss-support-sub {
	color: #6f6760;
}

.narciss-support-list {
	padding: 10px;
}

.narciss-support-list a:hover,
.narciss-support-list a:focus-visible {
	background-color: #f8f4ef;
	color: #1a1a1a;
}

.narciss-support-icon {
	border-radius: 12px;
	background-color: #f1e9e0;
	color: #8c6a4a;
}

.narciss-support-list a:hover .narciss-support-icon {
	background-color: #a8825e;
	color: #fff;
}

@media (max-width: 768px) {
	.narciss-support {
		right: 16px;
	}

	.narciss-support-toggle {
		width: 52px;
		height: 52px;
		min-height: 52px;
	}

	.narciss-support-label {
		display: none;
	}
}

/* =========================================================================
   Single product page
   ========================================================================= */

.single-product .summary-inner .product_title {
	margin-bottom: 6px;
	color: #1a1a1a;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.5;
}

.single-product .summary-inner .wd-breadcrumbs,
.single-product .summary-inner .wd-breadcrumbs a {
	color: #9b928b;
	font-size: 12px;
}

/* Rating link and share button on one line. */
.narciss-rating-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 4px;
}

.narciss-share {
	position: relative;
	margin-inline-start: auto;
}

.narciss-share-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 34px;
	min-height: 34px;
	padding: 0 14px;
	border: 1px solid #e4dbd2;
	border-radius: 17px;
	background: #fff;
	color: #1a1a1a;
	font-size: 12px;
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0;
}

.narciss-share-btn:hover {
	border-color: #a8825e;
	background: #fff;
	color: #a8825e;
}

.narciss-share-btn svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.narciss-share-menu {
	position: absolute;
	top: calc(100% + 6px);
	inset-inline-end: 0;
	z-index: 30;
	display: flex;
	flex-direction: column;
	min-width: 150px;
	padding: 6px;
	border: 1px solid #efe6dc;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 14px 34px rgba(40, 28, 18, 0.14);
}

.narciss-share-menu[hidden] {
	display: none;
}

.narciss-share-menu a,
.narciss-share-menu button {
	display: block;
	min-height: 0;
	padding: 9px 12px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: #1a1a1a;
	font-size: 13px;
	font-weight: 400;
	text-align: start;
	text-transform: none;
	letter-spacing: 0;
}

.narciss-share-menu a:hover,
.narciss-share-menu button:hover {
	background: #f8f4ef;
	color: #1a1a1a;
}

/* Price and short description. */
.single-product .summary-inner > .price {
	margin: 14px 0 16px;
	color: #a8825e;
	font-size: 26px;
	font-weight: 700;
}

.single-product .summary-inner > .price .woocommerce-Price-currencySymbol {
	margin-inline-start: 4px;
	color: #7a726c;
	font-size: 14px;
	font-weight: 400;
}

.single-product .woocommerce-product-details__short-description {
	margin-bottom: 20px;
	padding-top: 16px;
	border-top: 1px solid #efe6dc;
	color: #5f5752;
	font-size: 14px;
	line-height: 2.1;
}

/* Colour: label with the chosen name, then photo swatches. */
.single-product .variations,
.single-product .variations tbody,
.single-product .variations tr,
.single-product .variations th,
.single-product .variations td {
	display: block;
	padding: 0;
	border: 0;
}

.single-product .variations th.label {
	margin-bottom: 10px;
}

.single-product .variations th.label label {
	color: #1a1a1a;
	font-size: 14px;
	font-weight: 600;
}

.single-product .variations th.label label::after {
	content: ":";
}

.narciss-color-name {
	margin-inline-start: 6px;
	color: #7a726c;
	font-weight: 400;
}

.single-product .wd-swatches-single {
	gap: 10px;
}

.single-product .wd-swatches-single .wd-swatch.wd-bg {
	width: 58px;
	height: 76px;
	padding: 3px;
	border-radius: 10px;
	box-shadow: inset 0 0 0 1px #e4dbd2;
	transition: box-shadow 0.15s ease;
}

.single-product .wd-swatches-single .wd-swatch.wd-bg .wd-swatch-bg {
	width: 100%;
	height: 100%;
	border-radius: 7px;
	overflow: hidden;
	background: #fff;
}

.single-product .wd-swatches-single .wd-swatch.wd-bg img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.single-product .wd-swatches-single .wd-swatch.wd-bg:hover {
	box-shadow: inset 0 0 0 1px #c9b49c;
}

.single-product .wd-swatches-single .wd-swatch.wd-bg.wd-active {
	box-shadow: inset 0 0 0 2px #a8825e;
}

.single-product .wd-swatches-single .wd-swatch.wd-bg::after,
.single-product .wd-swatches-single .wd-swatch.wd-bg::before {
	display: none;
}

.single-product .reset_variations {
	display: none !important;
}

.single-product .woocommerce-variation-price,
.single-product .woocommerce-variation-availability {
	display: none;
}

/* Quantity and add to cart: one tall row. */
.single-product .summary-inner form.cart .woocommerce-variation-add-to-cart,
.single-product .summary-inner form.cart:not(.variations_form) {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 10px;
	margin-top: 18px;
}

.single-product .summary-inner form.cart .quantity {
	height: 52px;
	margin: 0;
	border: 1px solid #e4dbd2;
	border-radius: 12px;
	overflow: hidden;
}

.single-product .summary-inner form.cart .quantity :is(.minus, .plus) {
	width: 40px;
	height: 100%;
	border: 0;
	background: #fff;
}

.single-product .summary-inner form.cart .quantity input.qty {
	height: 100%;
	border: 0;
	font-weight: 600;
}

.single-product .summary-inner form.cart .single_add_to_cart_button {
	flex: 1 1 auto;
	height: 52px;
	border-radius: 12px;
	font-size: 15px;
	font-weight: 600;
	box-shadow: 0 10px 22px rgba(168, 130, 94, 0.25);
}

/* Promises as three compact cards. */
.narciss-single-trust {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin: 22px 0;
	padding: 0;
	border: 0;
}

.narciss-single-trust li {
	flex-direction: column;
	gap: 6px;
	padding: 14px 8px;
	border-radius: 12px;
	background: #f8f4ef;
	color: #4f4843;
	font-size: 12px;
	line-height: 1.7;
	text-align: center;
}

.narciss-single-trust svg {
	stroke: #a8825e;
}

.single-product .summary-inner .product_meta {
	padding-top: 14px;
	border-top: 1px solid #efe6dc;
	color: #9b928b;
	font-size: 12px;
}

.single-product .summary-inner .product_meta a {
	color: #1a1a1a;
}

/* Tabs and description. */
.single-product .wd-nav-tabs > li > a .nav-link-text,
.single-product .woocommerce-tabs .tabs .nav-link-text {
	font-size: 16px;
	font-weight: 600;
	text-transform: none;
}

.single-product .woocommerce-Tabs-panel--description {
	max-width: 820px;
	margin-inline: auto;
	color: #4f4843;
	font-size: 15px;
	line-height: 2.1;
}

.single-product .woocommerce-Tabs-panel--description h2,
.single-product .woocommerce-Tabs-panel--description h3 {
	margin: 26px 0 10px;
	color: #1a1a1a;
	font-size: 18px;
	font-weight: 600;
}

.single-product .woocommerce-Tabs-panel--description ul {
	padding-inline-start: 18px;
}

.single-product .woocommerce-Tabs-panel--description li {
	margin-bottom: 6px;
}

.single-product .woocommerce-product-attributes {
	max-width: 620px;
	margin-inline: auto;
}

@media (max-width: 767px) {
	.single-product .summary-inner .product_title {
		font-size: 22px;
	}

	.single-product .summary-inner > .price {
		font-size: 22px;
	}

	.single-product .wd-swatches-single .wd-swatch.wd-bg {
		width: 52px;
		height: 68px;
	}

	.narciss-share-btn span {
		display: none;
	}

	.narciss-share-btn {
		width: 34px;
		padding: 0;
		justify-content: center;
	}
}

/* =========================================================================
   Header: search field and icon buttons
   ========================================================================= */

/* Search: plain light-grey field, no border, slightly rounded corners. */
.whb-general-header .wd-header-search-form .searchform {
	--wd-form-height: 46px;
}

.whb-general-header .wd-header-search-form .searchform input[type="text"] {
	height: 46px;
	padding-inline: 18px 50px;
	border: 0;
	border-radius: 8px;
	background: #f2f2f2;
	color: #1a1a1a;
	font-size: 14px;
	box-shadow: none;
	transition: background-color 0.2s ease;
}

.whb-general-header .wd-header-search-form .searchform input[type="text"]::placeholder {
	color: #8f8f8f;
}

.whb-general-header .wd-header-search-form .searchform input[type="text"]:hover {
	background: #ececec;
}

.whb-general-header .wd-header-search-form .searchform input[type="text"]:focus {
	background: #ececec;
	box-shadow: none;
	outline: none;
}

.whb-general-header .wd-header-search-form .searchform .searchsubmit {
	width: 46px;
	background: transparent;
	color: #6f6f6f;
}

.whb-general-header .wd-header-search-form .searchform .searchsubmit:hover {
	background: transparent;
	color: #1a1a1a;
}

/* Results and suggestions dropdown. */
.whb-general-header .wd-dropdown-results,
.whb-general-header .wd-search-results-wrapper .wd-dropdown {
	margin-top: 8px;
	overflow: hidden;
	border: 1px solid #ececec;
	border-radius: 10px;
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.10);
}

.whb-general-header .wd-search-requests .wd-search-requests-text,
.wd-search-requests .wd-search-requests-text,
.wd-search-history .wd-search-title,
.wd-search-requests .title {
	color: #7a726c;
	font-size: 12px;
}

.wd-search-requests-list li a,
.wd-search-history-list li a {
	border-radius: 6px !important;
	background: #f2f2f2 !important;
	color: #1a1a1a !important;
	font-size: 13px;
}

.wd-search-requests-list li a:hover,
.wd-search-history-list li a:hover {
	background: #a8825e !important;
	color: #fff !important;
}

.wd-dropdown-results .wd-suggestion:hover,
.wd-dropdown-results .wd-suggestion.wd-active {
	background: #faf7f3;
}

.wd-dropdown-results .wd-suggestion-title {
	color: #1a1a1a;
	font-weight: 500;
}

.wd-dropdown-results .price {
	color: #a8825e;
}

/* Account and cart: square-ish buttons with a light grey border, count badge on the cart. */
.whb-general-header :is(.wd-header-my-account, .wd-header-cart, .wd-header-mobile-nav) > a {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	background: #fff;
	color: #1a1a1a;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.whb-general-header :is(.wd-header-my-account, .wd-header-cart, .wd-header-mobile-nav) > a:hover {
	border-color: #cfcfcf;
	background: #fff;
	color: #1a1a1a;
}

.whb-general-header :is(.wd-header-my-account, .wd-header-cart, .wd-header-mobile-nav) .wd-tools-icon {
	position: relative;
	display: inline-flex;
	font-size: 19px;
}

.whb-general-header :is(.wd-header-my-account, .wd-header-cart) .wd-tools-icon::before {
	color: inherit;
}

.whb-general-header .wd-header-cart .wd-tools-count {
	position: absolute;
	top: -9px;
	inset-inline-end: -11px;
	min-width: 19px;
	height: 19px;
	padding: 0 5px;
	border: 2px solid #fff;
	border-radius: 10px;
	background: #a8825e;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 15px;
	text-align: center;
}

.whb-general-header .wd-header-cart .wd-tools-count span {
	display: none;
}

.whb-general-header .wd-header-my-account,
.whb-general-header .wd-header-cart {
	margin-inline: 4px;
}

/* Top bar: social icons in the brand gold. */
.whb-top-bar .wd-social-icons a {
	color: #d9c3a8 !important;
}

.whb-top-bar .wd-social-icons a:hover {
	color: #fff !important;
}

/* =========================================================================
   Header banner (HTML block "بنر سربرگ"): one calm line about the bags,
   with a short link. The whole bar links to the shop (Theme Settings → Header banner).
   ========================================================================= */
.wd-hb-wrapp .header-banner {
	overflow: hidden;
	background: #2b1d14;
}

.wd-hb-wrapp .header-banner > .container {
	max-width: none;
	height: 100%;
	padding: 0;
}

.narciss-hb {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	height: 100%;
	min-height: 44px;
	padding: 0 48px;
	color: #f6ede3;
	font-size: 13px;
	line-height: 1.4;
	white-space: nowrap;
}

.narciss-hb-text strong {
	color: #e9c99a;
	font-weight: 700;
}

.narciss-hb-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: rgba(233, 201, 154, 0.55);
}

.narciss-hb-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #e9c99a;
	font-size: 12px;
	font-weight: 600;
	transition: gap 0.2s ease;
}

.narciss-hb-link svg {
	width: 13px;
	height: 13px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.wd-hb-wrapp .header-banner:hover .narciss-hb-link {
	gap: 8px;
}

.wd-hb-wrapp .header-banner .wd-hb-close {
	z-index: 3;
}

.wd-hb-wrapp .header-banner .wd-hb-close a {
	color: rgba(246, 237, 227, 0.7);
}

@media (max-width: 767px) {
	.narciss-hb {
		gap: 10px;
		min-height: 40px;
		padding: 0 36px 0 12px;
		font-size: 12px;
	}

	.narciss-hb-long,
	.narciss-hb-dot {
		display: none;
	}
}

/* =========================================================================
   Archive header (page title band) and shop filters
   ========================================================================= */

/* Title band: light ivory, compact, dark text. */
.wd-page-title {
	padding-block: 34px 26px;
	border-bottom: 1px solid #efe8df;
}

.wd-page-title .entry-title,
.wd-page-title .title {
	color: #1a1a1a;
	font-size: 30px;
	font-weight: 700;
}

.wd-page-title .wd-breadcrumbs,
.wd-page-title .wd-breadcrumbs a,
.wd-page-title .breadcrumbs a {
	color: #8f8780;
	font-size: 12px;
}

/* Categories under the title as pill chips (no counts). */
.wd-page-title .wd-nav-product-cat {
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 18px;
}

.wd-page-title .wd-nav-product-cat > li {
	margin: 0;
}

.wd-page-title .wd-nav-product-cat > li > a {
	padding: 9px 16px !important;
	border: 1px solid #e6dccf;
	border-radius: 8px;
	background: #fff;
	color: #1a1a1a;
	font-size: 13px;
	font-weight: 500;
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.wd-page-title .wd-nav-product-cat > li > a:hover {
	border-color: #a8825e;
	background: #faf6f1;
	color: #a8825e;
}

.wd-page-title .wd-nav-product-cat > li.wd-active > a,
.wd-page-title .wd-nav-product-cat > li.current-cat > a {
	border-color: #a8825e;
	background: #a8825e;
	color: #fff;
}

.wd-page-title .wd-nav-product-cat .nav-link-count,
.wd-page-title .wd-nav-product-cat .wd-cat-count,
.wd-page-title .wd-nav-product-cat .category-image-wrapp {
	display: none !important;
}

.wd-page-title .wd-nav-product-cat .nav-link-text {
	font-size: 13px;
	font-weight: 500;
	text-transform: none;
}

@media (max-width: 1024px) {
	.wd-page-title {
		padding-block: 22px 18px;
	}

	.wd-page-title .entry-title,
	.wd-page-title .title {
		font-size: 22px;
	}

	/* Phones: one scrolling row of chips. */
	.wd-page-title .wd-nav-product-cat {
		flex-wrap: nowrap;
		justify-content: flex-start;
		overflow-x: auto;
		padding-bottom: 4px;
		scrollbar-width: none;
	}

	.wd-page-title .wd-nav-product-cat::-webkit-scrollbar {
		display: none;
	}

	.wd-page-title .wd-nav-product-cat > li > a {
		white-space: nowrap;
	}
}

/* Filters sidebar. */
.sidebar-container .widget-title,
.wd-sidebar .widget-title,
.sidebar-container .widgettitle {
	margin-bottom: 14px;
	color: #1a1a1a;
	font-size: 15px;
	font-weight: 700;
	text-transform: none;
}

.sidebar-container .widget,
.wd-sidebar .widget {
	padding-bottom: 22px;
	margin-bottom: 22px;
	border-bottom: 1px solid #efe8df;
}

.sidebar-container .widget:last-child {
	border-bottom: 0;
}

.sidebar-container .widget_product_categories ul li a {
	color: #3f3934;
	font-size: 14px;
}

.sidebar-container .widget_product_categories ul li.current-cat > a,
.sidebar-container .widget_product_categories ul li a:hover {
	color: #a8825e;
}

/* Colour filter: swatch with name, active ring in the brand colour. */
.sidebar-container .woodmart-woocommerce-layered-nav .wd-swatch.wd-active,
.sidebar-container .woodmart-woocommerce-layered-nav .chosen .wd-swatch {
	box-shadow: 0 0 0 2px #a8825e;
}

.sidebar-container .woodmart-woocommerce-layered-nav .layered-nav-link:hover {
	color: #a8825e;
}

/* Price slider in brand colours. */
.sidebar-container .price_slider .ui-slider-range,
.sidebar-container .price_slider .ui-slider-handle {
	background-color: #a8825e;
}

.sidebar-container .price_slider_amount .button {
	border-radius: 8px;
	background: #1a1a1a;
	color: #fff;
}

/* Active filters as removable chips. */
.widget_layered_nav_filters ul li a {
	padding: 6px 10px;
	border-radius: 8px;
	background: #f2ece5;
	color: #1a1a1a;
}

/* =========================================================================
   Hover style: no underline. Main menu gets a soft rounded highlight,
   archive category chips keep their outline/fill states.
   ========================================================================= */
.whb-header .wd-nav-main .nav-link-text::after,
.wd-page-title .wd-nav-product-cat .nav-link-text::after {
	display: none !important;
}

.whb-header .wd-nav-main > li > a {
	padding: 8px 10px;
	border-radius: 8px;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.whb-header .wd-nav-main > li > a:hover,
.whb-header .wd-nav-main > li:hover > a,
.whb-header .wd-nav-main > li.wd-opened > a {
	background: #f6f0e8;
	color: #a8825e;
}

.whb-header .wd-nav-main > li.current-menu-item > a,
.whb-header .wd-nav-main > li.current-menu-ancestor > a,
.whb-header .wd-nav-main > li.current-product_cat-ancestor > a {
	background: #f6f0e8;
	color: #a8825e;
	font-weight: 600;
}

/* Keep the menu as wide as before: the highlight padding replaces part of the gap. */
.whb-header .wd-nav-main {
	--nav-gap: 16px;
}

/* Smaller laptops: keep the main menu on one line. */
@media (min-width: 1025px) and (max-width: 1260px) {
	.whb-header .wd-nav-main {
		--nav-gap: 8px;
	}

	.whb-header .wd-nav-main > li > a {
		padding: 7px 7px;
	}

	.whb-header .wd-nav-main > li > a .nav-link-text {
		font-size: 13px;
	}
}

/* Hero slider image: square corners (Woodmart's global radius is 12px). */
.narciss-hero .promo-banner,
.narciss-hero .banner-image,
.narciss-hero .banner-image img {
	border-radius: 0 !important;
}

/* =========================================================================
   Home slider [narciss_hero_slider]
   ========================================================================= */
.narciss-hs {
	position: relative;
	overflow: hidden;
	background: #ece6df;
}

.narciss-hs-track {
	position: relative;
	display: grid;
}

.narciss-hs-slide {
	position: relative;
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.9s ease, visibility 0s linear 0.9s;
}

.narciss-hs-slide.is-active {
	z-index: 1;
	opacity: 1;
	visibility: visible;
	transition: opacity 0.9s ease, visibility 0s;
}

.narciss-hs-media {
	display: block;
	overflow: hidden;
}

.narciss-hs-media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 1;
	object-fit: cover;
	transform: scale(1.06);
	transition: transform 7s ease-out;
}

.narciss-hs-slide.is-active .narciss-hs-media img {
	transform: scale(1);
}

/* Text over the empty right side of the photo. */
.narciss-hs-content {
	position: absolute;
	top: 50%;
	right: 5%;
	width: 38%;
	max-width: 520px;
	text-align: right;
	transform: translateY(-50%);
}

.narciss-hs-content > * {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.narciss-hs-slide.is-active .narciss-hs-content > * {
	opacity: 1;
	transform: none;
}

.narciss-hs-slide.is-active .narciss-hs-content > :nth-child(1) { transition-delay: 0.35s; }
.narciss-hs-slide.is-active .narciss-hs-content > :nth-child(2) { transition-delay: 0.5s; }
.narciss-hs-slide.is-active .narciss-hs-content > :nth-child(3) { transition-delay: 0.65s; }
.narciss-hs-slide.is-active .narciss-hs-content > :nth-child(4) { transition-delay: 0.8s; }

.narciss-hs-kicker {
	margin: 0 0 10px;
	color: #a8825e;
	font-family: "Bodoni Moda", "Times New Roman", serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	direction: ltr;
	unicode-bidi: isolate;
}

.narciss-hs-title {
	margin: 0 0 12px;
	color: #1a1a1a;
	font-size: clamp(26px, 2.6vw, 40px);
	font-weight: 700;
	line-height: 1.45;
}

.narciss-hs-text {
	margin: 0 0 22px;
	color: #5f5752;
	font-size: 15px;
	line-height: 2;
}

.narciss-hs-btn {
	display: inline-flex;
	align-items: center;
	height: 48px;
	padding: 0 28px;
	border-radius: 24px;
	background: #a8825e;
	color: #fff !important;
	font-size: 14px;
	font-weight: 600;
	transition: background-color 0.2s ease;
}

.narciss-hs-btn:hover {
	background: #93714f;
}

/* Light text for slides on a darker photo, with a soft shade behind it. */
.narciss-hs-slide.is-light .narciss-hs-media::after {
	content: "";
	position: absolute;
	inset: 0 0 0 45%;
	background: linear-gradient(270deg, rgba(40, 22, 10, 0.55), rgba(40, 22, 10, 0));
	pointer-events: none;
}

.narciss-hs-slide.is-light .narciss-hs-kicker { color: #f3d6a6; }
.narciss-hs-slide.is-light .narciss-hs-title { color: #fff; text-shadow: 0 2px 16px rgba(0, 0, 0, 0.25); }
.narciss-hs-slide.is-light .narciss-hs-text { color: rgba(255, 255, 255, 0.9); }

/* Arrows and dots. */
.narciss-hs-arrow {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	min-height: 44px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.85);
	color: #1a1a1a;
	opacity: 0;
	transform: translateY(-50%);
	transition: opacity 0.25s ease, background-color 0.2s ease;
}

.narciss-hs:hover .narciss-hs-arrow,
.narciss-hs-arrow:focus-visible {
	opacity: 1;
}

.narciss-hs-arrow:hover {
	background: #fff;
}

.narciss-hs-arrow.is-prev { right: 18px; }
.narciss-hs-arrow.is-next { left: 18px; }

.narciss-hs-arrow svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.narciss-hs-dots {
	position: absolute;
	bottom: 18px;
	left: 50%;
	z-index: 3;
	display: flex;
	gap: 8px;
	transform: translateX(-50%);
}

.narciss-hs-dots button {
	display: block;
	width: 28px;
	height: 4px;
	min-height: 0;
	padding: 0;
	overflow: hidden;
	border: 0;
	border-radius: 2px;
	background: rgba(255, 255, 255, 0.55);
}

.narciss-hs-dots button span {
	display: block;
	width: 0;
	height: 100%;
	background: #fff;
}

.narciss-hs-dots button.is-active span {
	width: 100%;
}

/* While autoplaying, the active dot fills up over the slide's time. */
.narciss-hs.is-playing .narciss-hs-dots button.is-active span {
	animation: narciss-hs-progress 6.5s linear;
}

@keyframes narciss-hs-progress {
	from { width: 0; }
	to { width: 100%; }
}

/* Phones: 5:4 crop, text under the photo, dots on the photo. */
@media (max-width: 767px) {
	.narciss-hs-media img {
		aspect-ratio: 5 / 4;
	}

	.narciss-hs-slide.is-light .narciss-hs-media::after {
		display: none;
	}

	.narciss-hs-content {
		position: static;
		width: auto;
		max-width: none;
		padding: 16px 16px 4px;
		text-align: center;
		transform: none;
	}

	.narciss-hs-kicker,
	.narciss-hs-text {
		display: none;
	}

	.narciss-hs-title,
	.narciss-hs-slide.is-light .narciss-hs-title {
		margin-bottom: 12px;
		color: #1a1a1a;
		font-size: 20px;
		text-shadow: none;
	}

	.narciss-hs-btn {
		height: 42px;
		padding: 0 26px;
	}

	.narciss-hs {
		background: #fff;
	}

	.narciss-hs-dots {
		bottom: auto;
		top: calc(100vw * 0.8 - 22px);
	}

	.narciss-hs-arrow {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.narciss-hs-slide,
	.narciss-hs-media img,
	.narciss-hs-content > * {
		transition: none;
	}

	.narciss-hs-media img {
		transform: none;
	}
}

/* =========================================================================
   Product video: visible "تماشای ویدئو" pill on the gallery, vertical player popup
   ========================================================================= */
.product-additional-galleries .product-video-button > a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: auto;
	height: 42px;
	padding: 0 16px 0 6px;
	border-radius: 21px;
	background: rgba(26, 26, 26, 0.82);
	color: #fff;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
	backdrop-filter: blur(4px);
	transition: background-color 0.2s ease;
}

.product-additional-galleries .product-video-button > a:hover {
	background: #a8825e;
	color: #fff;
}

.product-additional-galleries .product-video-button .wd-action-icon {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #fff;
	color: #1a1a1a;
}

.product-additional-galleries .product-video-button .wd-action-icon::before {
	color: #1a1a1a;
	font-size: 12px;
}

.product-additional-galleries .product-video-button .wd-action-text {
	position: static !important;
	display: inline !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	overflow: visible !important;
	opacity: 1 !important;
	visibility: visible !important;
	background: none !important;
	color: inherit !important;
	font-size: 13px;
	font-weight: 600;
	transform: none !important;
	white-space: nowrap;
}

/* Vertical player popup. */
html.narciss-vp-open {
	overflow: hidden;
}

.narciss-vp {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	padding: 24px;
	background: rgba(10, 8, 6, 0.82);
	opacity: 0;
	transition: opacity 0.25s ease;
}

.narciss-vp.is-open {
	opacity: 1;
}

.narciss-vp[hidden] {
	display: none;
}

.narciss-vp-box {
	position: relative;
	height: min(86vh, 860px);
	aspect-ratio: 9 / 16;
	max-width: 92vw;
	overflow: hidden;
	border-radius: 14px;
	background: #000;
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
	transform: scale(0.96);
	transition: transform 0.25s ease;
}

.narciss-vp.is-open .narciss-vp-box {
	transform: none;
}

.narciss-vp video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	background: #000;
}

.narciss-vp-close {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	min-height: 38px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	color: #1a1a1a;
}

.narciss-vp-close svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
}

@media (max-width: 767px) {
	.narciss-vp {
		padding: 12px;
	}

	.narciss-vp-box {
		height: auto;
		width: 100%;
		max-height: 88vh;
	}
}

.product-additional-galleries .product-video-button.wd-action-btn > a {
	min-width: 0 !important;
	width: auto !important;
	height: 42px !important;
	padding: 0 16px 0 6px !important;
	border-radius: 21px !important;
	background: rgba(26, 26, 26, 0.82) !important;
	color: #fff !important;
}

.product-additional-galleries .product-video-button.wd-action-btn > a:hover {
	background: #a8825e !important;
}

.product-additional-galleries .product-video-button.wd-action-btn .wd-action-icon {
	width: 30px !important;
	height: 30px !important;
	min-width: 30px;
	border-radius: 50% !important;
	background: #fff !important;
}

/* Video pill: same height as the zoom button, icon at the start with breathing room. */
.product-additional-galleries .product-video-button.wd-action-btn > a {
	gap: 10px !important;
	height: 50px !important;
	padding: 0 !important;
	padding-inline-start: 6px !important;
	padding-inline-end: 20px !important;
	border-radius: 25px !important;
}

.product-additional-galleries .product-video-button.wd-action-btn .wd-action-icon {
	flex: 0 0 38px;
	width: 38px !important;
	height: 38px !important;
	margin: 0 !important;
}

.product-additional-galleries .product-video-button.wd-action-btn .wd-action-icon::before {
	font-size: 13px;
	line-height: 1;
	/* The play triangle looks centred when nudged toward its point. */
	transform: translateX(-1px);
}

.product-additional-galleries .product-video-button.wd-action-btn .wd-action-text {
	line-height: 1 !important;
}

/* Slider drag: vertical page scroll stays native, horizontal moves are the slider's. */
.narciss-hs {
	touch-action: pan-y;
	user-select: none;
	-webkit-user-select: none;
	cursor: grab;
}

.narciss-hs.is-dragging {
	cursor: grabbing;
}

.narciss-hs-slide {
	transition: opacity 0.9s ease, visibility 0s linear 0.9s, transform 0.35s ease;
}

.narciss-hs-slide.is-active {
	transition: opacity 0.9s ease, visibility 0s, transform 0.35s ease;
}

.narciss-hs.is-dragging .narciss-hs-slide {
	transition: opacity 0.9s ease, visibility 0s;
}

.narciss-hs-btn,
.narciss-hs-arrow,
.narciss-hs-dots button {
	cursor: pointer;
}

/* Phones: small gallery thumbnails floating over the bottom of the main image. */
@media (max-width: 767px) {
	.single-product .woocommerce-product-gallery.wd-has-thumb {
		position: relative;
	}

	.single-product .woocommerce-product-gallery .wd-gallery-thumb {
		position: absolute;
		bottom: 12px;
		left: 12px;
		z-index: 5;
		width: auto;
		max-width: calc(100% - 150px);
		margin: 0 !important;
		padding: 0 !important;
	}

	.single-product .wd-gallery-thumb .wd-carousel-inner,
	.single-product .wd-gallery-thumb .wd-carousel {
		margin: 0 !important;
		padding: 0 !important;
		overflow: visible;
	}

	.single-product .wd-gallery-thumb .wd-carousel-wrap {
		display: flex;
		gap: 6px;
		transform: none !important;
	}

	.single-product .wd-gallery-thumb .wd-carousel-item {
		flex: 0 0 auto;
		width: 40px !important;
		height: 53px;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden;
		border: 2px solid #fff;
		border-radius: 6px;
		background: #fff;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
		opacity: 0.85;
		transition: border-color 0.2s ease, opacity 0.2s ease;
	}

	.single-product .wd-gallery-thumb .wd-carousel-item img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.single-product .wd-gallery-thumb .wd-carousel-item.wd-thumb-active {
		border-color: #a8825e;
		opacity: 1;
	}

	.single-product .wd-gallery-thumb .wd-nav-arrows,
	.single-product .wd-gallery-thumb .wd-btn-arrow,
	.single-product .wd-gallery-thumb .wd-carousel-scrollbar {
		display: none !important;
	}
}

/* Share button: in the summary on desktop, on the image (above full screen) on phones. */
.narciss-share.is-gallery {
	display: none;
}

@media (max-width: 767px) {
	.narciss-share.is-summary {
		display: none;
	}

	.product-additional-galleries .narciss-share.is-gallery {
		position: relative;
		display: block;
		margin: 0;
	}

	.narciss-share.is-gallery .narciss-share-btn {
		display: grid;
		place-items: center;
		width: 45px;
		height: 45px;
		min-height: 45px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: #fff;
		color: #1a1a1a;
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.08);
	}

	.narciss-share.is-gallery .narciss-share-btn span {
		display: none;
	}

	.narciss-share.is-gallery .narciss-share-btn svg {
		width: 18px;
		height: 18px;
	}

	/* Fallback menu (no system share sheet): opens beside the button, over the image. */
	.narciss-share.is-gallery .narciss-share-menu {
		top: auto;
		bottom: 0;
		inset-inline-end: calc(100% + 8px);
	}

	/* The rating row keeps its spacing without the share button. */
	.narciss-rating-row:empty {
		display: none;
	}

	/* Thumbnails centred along the bottom of the image. */
	.single-product .woocommerce-product-gallery .wd-gallery-thumb {
		left: 50%;
		right: auto;
		max-width: calc(100% - 140px);
		transform: translateX(-50%);
	}
}

.narciss-snappay-note {
	white-space: nowrap;
}

@media (max-width: 767px) {
	.narciss-snappay-note {
		display: block;
		margin-top: 2px;
	}
}

/* Phones: product image buttons — share and full screen at the top-right, video at the
   top-left; a light divider under the gallery before the breadcrumbs. */
@media (max-width: 767px) {
	.single-product .wd-gallery-images .product-additional-galleries {
		position: static;
	}

	.single-product .wd-gallery-images .product-additional-galleries > * {
		position: absolute;
		z-index: 6;
		margin: 0 !important;
	}

	.single-product .wd-gallery-images .product-additional-galleries > .narciss-share.is-gallery {
		top: 12px;
		right: 12px;
	}

	.single-product .wd-gallery-images .product-additional-galleries > .wd-show-product-gallery-wrap {
		top: 67px;
		right: 12px;
	}

	.single-product .wd-gallery-images .product-additional-galleries > .product-video-button {
		top: 12px;
		left: 12px;
	}

	.single-product .woocommerce-product-gallery {
		padding-bottom: 16px;
		margin-bottom: 16px;
		border-bottom: 1px solid #ececec;
	}
}

@media (max-width: 767px) {
	/* Thumbnails stay on the image above the gallery's bottom padding. */
	.single-product .woocommerce-product-gallery .wd-gallery-thumb {
		bottom: 28px;
	}
}

/* Phones: the slider shows only the photo (the photo itself links to the shop).
   The text is hidden visually only, so the page's H1 still counts for search engines
   and screen readers. */
@media (max-width: 767px) {
	.narciss-hs-content {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		padding: 0 !important;
		margin: -1px !important;
		overflow: hidden !important;
		clip: rect(0 0 0 0) !important;
		white-space: nowrap !important;
		border: 0 !important;
	}
}

/* Support button on the left (away from the thumb's natural reach on the right). */
.narciss-support {
	right: auto !important;
	left: 22px;
	/* RTL: flex-end is the left edge, so the button and panel line up on the left. */
	align-items: flex-end;
}

.narciss-support-panel {
	transform-origin: bottom left;
}

.narciss-support-label {
	right: auto;
	left: calc(100% + 12px);
	transform: translate(-6px, -50%);
}

.narciss-support-toggle:hover .narciss-support-label,
.narciss-support-toggle:focus-visible .narciss-support-label {
	transform: translate(0, -50%);
}

@media (max-width: 768px) {
	.narciss-support {
		left: 16px;
	}
}

/* Phones: image buttons closer to the edges of the photo. */
@media (max-width: 767px) {
	.single-product .wd-gallery-images .product-additional-galleries > .narciss-share.is-gallery {
		top: 6px;
		right: 6px;
	}

	.single-product .wd-gallery-images .product-additional-galleries > .wd-show-product-gallery-wrap {
		top: 59px;
		right: 6px;
	}

	.single-product .wd-gallery-images .product-additional-galleries > .product-video-button {
		top: 6px;
		left: 6px;
	}

	.single-product .woocommerce-product-gallery .wd-gallery-thumb {
		bottom: 22px;
	}
}

/* Phones: the share menu opens to the left of the round button, inside the screen
   (the gallery carousel is LTR internally, so logical sides are avoided here). */
@media (max-width: 767px) {
	.narciss-share.is-gallery .narciss-share-menu {
		top: 0 !important;
		bottom: auto !important;
		right: calc(100% + 8px) !important;
		left: auto !important;
		inset-inline-end: auto;
		direction: rtl;
		min-width: 140px;
		text-align: right;
	}
}

/* Selected colour name (Woodmart's .wd-attr-selected) after "رنگ:". */
.single-product .variations th.label .wd-attr-selected {
	margin-inline-start: 6px;
	color: #7a726c;
	font-size: 14px;
	font-weight: 400;
}

/* =========================================================================
   Colour sheet (product page, phones): opened by the buy bar's "انتخاب رنگ".
   Markup and script: inc/narciss-color-sheet.php
   ========================================================================= */
html.narciss-cs-open {
	overflow: hidden;
}

.narciss-cs {
	position: fixed;
	inset: 0;
	z-index: 100005;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.narciss-cs[hidden] {
	display: none;
}

.narciss-cs-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(26, 20, 16, 0.45);
	opacity: 0;
	transition: opacity 0.28s ease;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

.narciss-cs-panel {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 520px;
	max-height: 80vh;
	max-height: 80dvh;
	padding: 10px 16px calc(18px + env(safe-area-inset-bottom));
	border-radius: 24px 24px 0 0;
	background: #fff;
	box-shadow: 0 -18px 50px rgba(26, 20, 16, 0.18);
	direction: rtl;
	transform: translateY(100%);
	transition: transform 0.34s cubic-bezier(0.2, 0.8, 0.2, 1);
	outline: none;
}

.narciss-cs.is-open .narciss-cs-backdrop {
	opacity: 1;
}

.narciss-cs.is-open .narciss-cs-panel {
	transform: translateY(0);
}

.narciss-cs-handle {
	width: 40px;
	height: 4px;
	margin: 0 auto 12px;
	border-radius: 2px;
	background: #e4dbd2;
}

.narciss-cs-head {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 14px;
}

.narciss-cs-title {
	margin: 0;
	color: #1a1a1a;
	font-size: 16px;
	font-weight: 700;
}

.narciss-cs-count {
	padding: 3px 9px;
	border-radius: 20px;
	background: #f7f2ec;
	color: #8a6a4c;
	font-size: 11px;
	font-weight: 600;
}

.narciss-cs .narciss-cs-close {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	min-height: 0;
	margin-inline-start: auto;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #f5f0ea;
	color: #1a1a1a;
	box-shadow: none;
}

.narciss-cs-close svg {
	width: 18px;
	height: 18px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
}

.narciss-cs-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px 10px;
	margin: 0 -6px;
	padding: 6px 6px 4px;
	overflow-y: auto;
	list-style: none;
	overscroll-behavior: contain;
}

.narciss-cs-list li {
	margin: 0;
	list-style: none;
}

.narciss-cs .narciss-cs-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	width: 100%;
	min-height: 0;
	margin: 0;
	padding: 0 0 4px;
	border: 0;
	border-radius: 14px;
	background: none;
	box-shadow: none;
	color: #1a1a1a;
	font: inherit;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.narciss-cs-photo {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 4;
	margin-bottom: 4px;
	overflow: hidden;
	border-radius: 12px;
	background: #f7f2ec;
	box-shadow: 0 0 0 1px #ece4db;
	transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.narciss-cs-photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.narciss-cs-photo.is-dot {
	width: 56px;
	height: 56px;
	aspect-ratio: auto;
	border-radius: 50%;
}

.narciss-cs-item:active .narciss-cs-photo {
	transform: scale(0.97);
}

.narciss-cs-item.is-active .narciss-cs-photo {
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px #1a1a1a;
}

.narciss-cs-check {
	position: absolute;
	top: 6px;
	right: 6px;
	display: none;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #1a1a1a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat;
}

.narciss-cs-item.is-active .narciss-cs-check {
	display: block;
}

.narciss-cs-name {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
}

.narciss-cs-meta {
	color: #8c8480;
	font-size: 11px;
	line-height: 1.3;
}

.narciss-cs-item.is-out {
	cursor: not-allowed;
}

.narciss-cs-item.is-out .narciss-cs-photo {
	opacity: 0.5;
	filter: grayscale(0.7);
}

.narciss-cs-item.is-out .narciss-cs-name {
	color: #a59d98;
}

.narciss-cs-item.is-out .narciss-cs-meta {
	color: #b1543b;
}

@media (prefers-reduced-motion: reduce) {
	.narciss-cs-backdrop,
	.narciss-cs-panel {
		transition: none;
	}
}

/* =========================================================================
   Login modal (WooFlow OTP login): brand look; on phones the sheet rises with
   the keyboard. Script: inc/narciss-login-modal.php (--narciss-kb, --narciss-vvh).
   The #wf-login-modal id outranks WooFlow's own !important rules.
   ========================================================================= */
#wf-login-modal .wf-login-modal__backdrop {
	background: rgba(26, 20, 16, 0.5);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

#wf-login-modal .wf-login-modal__dialog {
	max-width: 400px;
	padding: 30px 28px 24px;
	border-radius: 22px;
	box-shadow: 0 30px 80px rgba(26, 20, 16, 0.28);
}

#wf-login-modal .wf-login-modal__close {
	top: 14px;
	background: #f5f0ea !important;
	color: #1a1a1a !important;
}

#wf-login-modal .wf-login-modal__close:hover {
	background: #ece4db !important;
}

/* Logo in place of the phone icon. */
#wf-login-modal .wf-otp__brand {
	margin: 0 0 16px;
}

#wf-login-modal .wf-otp__brand-icon {
	width: 92px;
	height: 72px;
	border-radius: 0;
	background: var(--narciss-login-logo) center / contain no-repeat;
}

#wf-login-modal .wf-otp__brand-icon svg {
	display: none;
}

#wf-login-modal .wf-otp__head {
	margin: 0 0 22px;
}

#wf-login-modal .wf-otp__title {
	margin: 0 0 6px;
	color: #1a1a1a;
	font-size: 19px;
	font-weight: 700;
	letter-spacing: 0;
}

#wf-login-modal .wf-otp__hint {
	color: #7a726c;
	font-size: 13px;
	line-height: 1.8;
}

/* Field: a fixed label above a calm, roomy input. */
#wf-login-modal .wf-otp__field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0 0 14px;
}

#wf-login-modal .wf-otp__label {
	position: static;
	order: -1;
	max-width: none;
	padding: 0;
	background: none;
	color: #5d544e;
	font-size: 13px;
	font-weight: 600;
	transform: none;
	transition: color 0.15s ease;
}

#wf-login-modal .wf-otp__field:focus-within .wf-otp__label {
	top: auto;
	color: #8a6a4c;
	font-size: 13px;
}

#wf-login-modal .wf-otp input.wf-otp__phone {
	min-height: 54px !important;
	padding: 12px 16px !important;
	border: 1px solid #e4dbd2 !important;
	border-radius: 12px !important;
	background: #faf7f3 !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	letter-spacing: 0.12em !important;
	text-align: center !important;
	direction: ltr;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

#wf-login-modal .wf-otp input.wf-otp__phone:focus,
#wf-login-modal .wf-otp input.wf-otp__pin:focus {
	border-color: #a8825e !important;
	background: #fff !important;
	box-shadow: 0 0 0 4px rgba(168, 130, 94, 0.16) !important;
}

#wf-login-modal .wf-otp input.wf-otp__pin {
	border: 1px solid #e4dbd2 !important;
	border-radius: 12px !important;
	background: #faf7f3 !important;
}

#wf-login-modal .wf-otp .wf-otp__btn.wf-btn {
	min-height: 52px !important;
	border-radius: 12px !important;
	border-color: #1a1a1a !important;
	background: #1a1a1a !important;
	color: #fff !important;
	font-size: 15px !important;
	transition: background-color 0.2s ease, transform 0.15s ease;
}

#wf-login-modal .wf-otp .wf-otp__btn.wf-btn:hover {
	opacity: 1;
	background: #2e2925 !important;
}

#wf-login-modal .wf-otp .wf-otp__btn.wf-btn:active {
	transform: scale(0.99);
}

#wf-login-modal .wf-otp__sent {
	margin-bottom: 14px;
	color: #7a726c;
}

#wf-login-modal .wf-otp__msg {
	border-radius: 10px;
}

/* What an account gives (phone-number step only). */
.narciss-login-perks {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 14px;
	margin: 20px 0 0;
	padding: 16px 0 0;
	border-top: 1px solid #f0e9e2;
	list-style: none;
}

.narciss-login-perks li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	color: #7a726c;
	font-size: 12px;
	list-style: none;
}

.narciss-login-perks li::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #c9ab8b;
}

#wf-login-modal .wf-otp:has([data-otp-step="code"]:not([hidden])) .narciss-login-perks {
	display: none;
}

@media (max-width: 767px) {
	#wf-login-modal .wf-login-modal__dialog {
		/* Rise with the keyboard and never be taller than what stays visible above it. */
		margin-bottom: var(--narciss-kb, 0px);
		max-height: calc(var(--narciss-vvh, 100dvh) - 12px);
		padding: 12px 20px calc(20px + env(safe-area-inset-bottom));
		border-radius: 24px 24px 0 0;
		transition: transform 0.32s cubic-bezier(0.2, 0.8, 0.2, 1), margin-bottom 0.18s ease-out;
	}

	#wf-login-modal .wf-login-modal__handle {
		background: #e4dbd2;
	}

	#wf-login-modal .wf-otp__brand-icon {
		width: 76px;
		height: 60px;
	}

	/* Keyboard up: drop the logo and the perks so the field and button fit. */
	#wf-login-modal.narciss-has-kb .wf-otp__brand,
	#wf-login-modal.narciss-has-kb .narciss-login-perks {
		display: none;
	}

	#wf-login-modal.narciss-has-kb .wf-login-modal__dialog {
		padding-bottom: 16px;
	}

	#wf-login-modal.narciss-has-kb .wf-otp__head {
		margin-bottom: 14px;
	}
}