/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — LOCKED FINAL 1.0
|--------------------------------------------------------------------------
| Flat retail architecture / RTL / Responsive / Accessible
| Titles: 16px
| Links + secondary text: 14px
|--------------------------------------------------------------------------
*/


/* ==========================================================================
   0. Remove WoodMart native header
   ========================================================================== */

header.whb-header,
.whb-header {
	display: none !important;
}


/* ==========================================================================
   1. Variables
   ========================================================================== */

.bargchi-header-topbar,
.bargchi-header-main,
.bargchi-mobile-drawer-layer {
	--bh-navy: #0f2b5b;
	--bh-navy-hover: #173b70;
	--bh-orange: #e97018;
	--bh-text: #263548;
	--bh-muted: #748195;
	--bh-border: #e3e8ee;
	--bh-border-strong: #d4dce5;
	--bh-soft: #f8fafc;
	--bh-white: #ffffff;

	direction: rtl;
}


/* ==========================================================================
   2. Top Utility Bar
   ========================================================================== */

.bargchi-header-topbar {
	width: 100%;

	background: #ffffff;

	border-bottom: 1px solid var(--bh-border);
}


.bargchi-header-topbar__container {
	display: flex;

	align-items: center;
	justify-content: space-between;

	gap: 22px;

	width: min(calc(100% - 40px), 1280px);
	min-height: 34px;

	margin-inline: auto;
}


.bargchi-header-topbar__intro,
.bargchi-header-topbar__items,
.bargchi-header-topbar__item {
	display: flex;

	align-items: center;
}


.bargchi-header-topbar__intro {
	gap: 6px;

	color: var(--bh-navy);

	font-size: 12px;
	font-weight: 700;

	white-space: nowrap;
}


.bargchi-header-topbar__items {
	gap: 0;

	min-width: 0;
}


.bargchi-header-topbar__item {
	position: relative;

	gap: 6px;

	padding-inline: 13px;

	color: var(--bh-muted);

	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;

	text-decoration: none;

	white-space: nowrap;
}


.bargchi-header-topbar__item:not(:last-child)::after {
	position: absolute;

	left: 0;

	width: 1px;
	height: 14px;

	background: var(--bh-border);

	content: "";
}


.bargchi-header-topbar__icon {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	flex: 0 0 15px;

	width: 15px;
	height: 15px;

	color: var(--bh-navy);
}


.bargchi-header-topbar__icon svg {
	display: block;

	width: 15px;
	height: 15px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-header-topbar__intro
.bargchi-header-topbar__icon {
	color: var(--bh-orange);
}


.bargchi-header-topbar__phone:hover {
	color: var(--bh-navy);
}


/* ==========================================================================
   3. Main Header
   ========================================================================== */

.bargchi-header-main {
	position: relative;

	z-index: 50;

	width: 100%;

	background: #ffffff;
}


.bargchi-header-main__row {
	border-bottom: 1px solid var(--bh-border);
}


.bargchi-header-main__container {
	display: grid;

	grid-template-columns:
		210px
		minmax(360px, 1fr)
		auto;

	grid-template-areas:
		"brand search utility";

	align-items: center;

	gap: 38px;

	width: min(calc(100% - 40px), 1280px);
	min-height: 72px;

	margin-inline: auto;
}


/* ==========================================================================
   4. Brand
   ========================================================================== */

.bargchi-header-brand {
	grid-area: brand;

	display: inline-flex;

	align-items: center;

	gap: 10px;

	min-width: 0;

	color: var(--bh-navy);

	text-decoration: none;
}


.bargchi-header-brand:hover {
	color: var(--bh-navy);
}


.bargchi-header-brand__logo {
	display: block;

	flex: 0 0 46px;

	width: 46px;
	height: 46px;

	object-fit: contain;
}


.bargchi-header-brand__text {
	display: flex;

	flex-direction: column;

	gap: 1px;

	min-width: 0;

	text-align: right;
}


.bargchi-header-brand__text strong {
	color: var(--bh-navy);

	font-size: 22px;
	font-weight: 900;
	line-height: 1.25;
}


.bargchi-header-brand__text small {
	color: var(--bh-muted);

	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;

	white-space: nowrap;
}


/* ==========================================================================
   5. Search — flat and real
   ========================================================================== */

.bargchi-header-search {
	grid-area: search;

	display: grid !important;

	grid-template-columns:
		22px
		minmax(0, 1fr)
		40px;

	align-items: center;

	gap: 10px;

	width: 100%;
	max-width: 690px;
	height: 46px;

	margin: 0 auto !important;
	padding: 0 12px 0 3px !important;

	background: #ffffff;

	border: 1px solid var(--bh-border-strong);
	border-radius: 8px;

	box-shadow: none;

	transition:
		border-color 150ms ease,
		box-shadow 150ms ease;
}


.bargchi-header-search:hover {
	border-color: #bdc9d6;
}


.bargchi-header-search:focus-within {
	border-color: #8fa3b9;

	box-shadow:
		0 0 0 2px rgba(15, 43, 91, 0.04);
}


.bargchi-header-search__icon {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	width: 22px;
	height: 22px;

	color: #8e9aa9;
}


.bargchi-header-search__icon svg {
	display: block;

	width: 18px;
	height: 18px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-header-search__input {
	display: block !important;

	width: 100% !important;
	min-width: 0 !important;
	height: 42px !important;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--bh-text) !important;

	background: transparent !important;

	border: 0 !important;
	border-radius: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;

	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 42px !important;

	text-align: right !important;
}


.bargchi-header-search__input::placeholder {
	color: #8c98a7;

	font-size: 14px;

	opacity: 1;
}


.bargchi-header-search__submit {
	display: inline-flex !important;

	align-items: center;
	justify-content: center;

	width: 40px;
	height: 40px;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--bh-navy) !important;

	background: transparent !important;

	border: 0 !important;
	border-radius: 7px !important;

	box-shadow: none !important;

	font-size: 0 !important;

	cursor: pointer;

	transition:
		background-color 150ms ease,
		color 150ms ease;
}


.bargchi-header-search__submit:hover {
	color: #ffffff !important;

	background: var(--bh-navy) !important;
}


.bargchi-header-search__submit svg {
	width: 19px;
	height: 19px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.75;
	stroke-linecap: round;
	stroke-linejoin: round;
}


/* ==========================================================================
   6. Utility Actions
   ========================================================================== */

.bargchi-header-utility-actions {
	grid-area: utility;

	display: flex;

	align-items: center;

	gap: 6px;

	justify-self: end;
}


.bargchi-header-account,
.bargchi-header-cart {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	min-height: 40px;

	color: var(--bh-navy);

	background: transparent;

	border: 0;

	border-radius: 7px;

	text-decoration: none;

	transition:
		background-color 150ms ease;
}


.bargchi-header-account:hover,
.bargchi-header-cart:hover {
	color: var(--bh-navy);

	background: var(--bh-soft);
}


.bargchi-header-account {
	width: 40px;
}


.bargchi-header-account svg {
	display: block;

	width: 22px;
	height: 22px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-header-cart {
	gap: 6px;

	padding-inline: 8px;
}


.bargchi-header-cart__icon {
	position: relative;

	display: inline-flex;
}


.bargchi-header-cart__icon > svg {
	display: block;

	width: 22px;
	height: 22px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-header-cart__label {
	color: var(--bh-navy);

	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;

	white-space: nowrap;
}


.bargchi-header-cart__count {
	position: absolute;

	top: -7px;
	right: -8px;

	display: inline-flex;

	align-items: center;
	justify-content: center;

	min-width: 18px;
	height: 18px;

	padding-inline: 4px;

	color: #ffffff;

	background: var(--bh-orange);

	border: 2px solid #ffffff;
	border-radius: 999px;

	font-size: 11px;
	font-weight: 800;
	line-height: 1;
}


.bargchi-header-cart__count.is-empty {
	display: none;
}


/* ==========================================================================
   7. Navigation
   ========================================================================== */

.bargchi-header-nav {
	position: relative;

	background: #ffffff;

	border-bottom: 1px solid var(--bh-border);
}


.bargchi-header-nav__container {
	display: grid;

	grid-template-columns:
		auto
		minmax(0, 1fr)
		auto;

	align-items: center;

	gap: 18px;

	width: min(calc(100% - 40px), 1280px);
	min-height: 48px;

	margin-inline: auto;
}


/* Categories */

.bargchi-header-categories {
	position: relative;

	align-self: stretch;
}


.bargchi-header-categories__trigger {
	display: inline-flex;

	align-items: center;

	gap: 8px;

	height: 100%;

	padding-inline: 3px 12px;

	color: var(--bh-navy);

	background: transparent;

	border-left: 1px solid var(--bh-border);

	font-size: 14px;
	font-weight: 800;

	text-decoration: none;
}


.bargchi-header-categories__trigger:hover {
	color: var(--bh-navy);
}


.bargchi-header-categories__trigger > svg {
	width: 15px;
	height: 15px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-header-categories__menu-icon {
	display: inline-flex;

	flex-direction: column;

	gap: 3px;

	width: 17px;
}


.bargchi-header-categories__menu-icon span {
	display: block;

	width: 17px;
	height: 1.5px;

	background: currentColor;

	border-radius: 10px;
}



/* Main links */

.bargchi-header-nav__links {
	display: flex;

	align-items: center;

	gap: 0;

	margin: 0;
	padding: 0;

	list-style: none;
}


.bargchi-header-nav__links li {
	margin: 0;
	padding: 0;
}


.bargchi-header-nav__links a {
	position: relative;

	display: inline-flex;

	align-items: center;

	min-height: 46px;

	padding-inline: 10px;

	color: var(--bh-text);

	font-size: 14px;
	font-weight: 700;

	text-decoration: none;
}


.bargchi-header-nav__links a::after {
	position: absolute;

	right: 10px;
	bottom: 0;

	width: 0;
	height: 2px;

	background: var(--bh-orange);

	content: "";

	transition: width 140ms ease;
}


.bargchi-header-nav__links a:hover {
	color: var(--bh-navy);
}


.bargchi-header-nav__links a:hover::after {
	width: 18px;
}


/* Support / wholesale */

.bargchi-header-nav__actions {
	display: flex;

	align-items: center;

	gap: 2px;
}


.bargchi-header-nav__action {
	display: inline-flex;

	align-items: center;

	gap: 5px;

	min-height: 36px;

	padding-inline: 7px;

	color: var(--bh-navy);

	font-size: 14px;
	font-weight: 700;

	text-decoration: none;
}


.bargchi-header-nav__action:hover {
	color: var(--bh-navy);
}


.bargchi-header-nav__action--wholesale {
	color: #a8521a;
}


.bargchi-header-nav__action--wholesale:hover {
	color: #934616;
}


.bargchi-header-nav__action svg {
	width: 16px;
	height: 16px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-header-nav__divider {
	display: block;

	width: 1px;
	height: 18px;

	margin-inline: 2px;

	background: var(--bh-border);
}


/* ==========================================================================
   8. Mobile Toggle
   ========================================================================== */

.bargchi-header-mobile-toggle {
	display: none;

	align-items: center;
	justify-content: center;
	flex-direction: column;

	gap: 4px;

	width: 40px;
	height: 40px;

	padding: 0;

	color: var(--bh-navy);

	background: transparent;

	border: 0;
	border-radius: 7px;

	cursor: pointer;
}


.bargchi-header-mobile-toggle:hover {
	background: var(--bh-soft);
}


.bargchi-header-mobile-toggle span {
	display: block;

	width: 20px;
	height: 1.7px;

	background: currentColor;

	border-radius: 10px;
}


/* ==========================================================================
   9. Mobile Drawer
   ========================================================================== */

.bargchi-mobile-drawer-layer {
	position: fixed;

	inset: 0;

	z-index: 99999;

	display: none;

	pointer-events: none;
}


.bargchi-mobile-drawer-layer.is-open {
	pointer-events: auto;
}


.bargchi-mobile-drawer-layer__backdrop {
	position: absolute;

	inset: 0;

	width: 100%;
	height: 100%;

	padding: 0;

	background: rgba(15, 27, 45, 0.30);

	border: 0;

	opacity: 0;

	transition: opacity 170ms ease;
}


.bargchi-mobile-drawer {
	position: absolute;

	top: 0;
	right: 0;
	bottom: 0;

	width: min(88vw, 350px);

	overflow-y: auto;

	background: #ffffff;

	box-shadow:
		-10px 0 30px rgba(15, 43, 91, 0.12);

	transform: translateX(105%);

	transition: transform 190ms ease;
}


.bargchi-mobile-drawer-layer.is-open
.bargchi-mobile-drawer-layer__backdrop {
	opacity: 1;
}


.bargchi-mobile-drawer-layer.is-open
.bargchi-mobile-drawer {
	transform: translateX(0);
}


html.bargchi-menu-open {
	overflow: hidden;
}


.bargchi-mobile-drawer__head {
	position: sticky;

	top: 0;

	z-index: 2;

	display: flex;

	align-items: center;
	justify-content: space-between;

	gap: 12px;

	min-height: 62px;

	padding: 8px 12px;

	background: #ffffff;

	border-bottom: 1px solid var(--bh-border);
}


.bargchi-mobile-drawer__brand {
	display: inline-flex;

	align-items: center;

	gap: 7px;

	color: var(--bh-navy);

	font-size: 18px;
	font-weight: 900;

	text-decoration: none;
}


.bargchi-mobile-drawer__brand img {
	display: block;

	width: 38px;
	height: 38px;

	object-fit: contain;
}


.bargchi-mobile-drawer__close {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	width: 38px;
	height: 38px;

	padding: 0;

	color: var(--bh-navy);

	background: transparent;

	border: 0;
	border-radius: 7px;

	cursor: pointer;
}


.bargchi-mobile-drawer__close:hover {
	background: var(--bh-soft);
}


.bargchi-mobile-drawer__close svg {
	width: 19px;
	height: 19px;

	fill: none;

	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-mobile-drawer__body {
	padding: 14px 12px 22px;
}


.bargchi-mobile-drawer__section + .bargchi-mobile-drawer__section {
	margin-top: 20px;
}


.bargchi-mobile-drawer__section h2 {
	margin: 0 0 7px;
	padding: 0;

	color: var(--bh-navy);

	font-size: 16px;
	font-weight: 900;
	line-height: 1.5;
}


.bargchi-mobile-drawer__section ul,
.bargchi-mobile-drawer__categories {
	margin: 0;
	padding: 0;

	list-style: none;
}


.bargchi-mobile-drawer__section li {
	margin: 0;
	padding: 0;
}


.bargchi-mobile-drawer__section li a {
	display: flex;

	align-items: center;
	justify-content: space-between;

	gap: 12px;

	min-height: 44px;

	padding-inline: 4px;

	color: var(--bh-text);

	border-bottom: 1px solid #edf1f5;

	font-size: 14px;
	font-weight: 600;

	text-decoration: none;
}


.bargchi-mobile-drawer__section li a:hover {
	color: var(--bh-navy);
}


.bargchi-mobile-drawer__section li svg {
	width: 15px;
	height: 15px;

	fill: none;

	stroke: #9aa6b4;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.bargchi-mobile-drawer__actions {
	display: flex;

	flex-direction: column;

	gap: 0;

	margin-top: 20px;

	border-top: 1px solid var(--bh-border);
}


.bargchi-mobile-drawer__actions a {
	display: flex;

	align-items: center;
	justify-content: space-between;

	min-height: 48px;

	padding-inline: 4px;

	color: var(--bh-navy);

	border-bottom: 1px solid var(--bh-border);

	font-size: 14px;
	font-weight: 800;

	text-decoration: none;
}


.bargchi-mobile-drawer__actions small {
	color: var(--bh-muted);

	font-size: 12px;
	font-weight: 500;
}


.bargchi-mobile-drawer__wholesale {
	color: #a8521a !important;
}


/* ==========================================================================
   10. Focus
   ========================================================================== */

.bargchi-header-brand:focus-visible,
.bargchi-header-search__submit:focus-visible,
.bargchi-header-account:focus-visible,
.bargchi-header-cart:focus-visible,
.bargchi-header-categories__trigger:focus-visible,
.bargchi-header-nav__links a:focus-visible,
.bargchi-header-nav__action:focus-visible,
.bargchi-header-mobile-toggle:focus-visible,
.bargchi-mobile-drawer a:focus-visible,
.bargchi-mobile-drawer button:focus-visible {
	outline: 2px solid var(--bh-navy);
	outline-offset: 2px;
}


/* ==========================================================================
   11. Tablet
   ========================================================================== */

@media (max-width: 1100px) {

	.bargchi-header-main__container {
		grid-template-columns:
			180px
			minmax(300px, 1fr)
			auto;

		gap: 22px;
	}


	.bargchi-header-brand__text small {
		display: none;
	}


	.bargchi-header-nav__container {
		gap: 8px;
	}


	.bargchi-header-nav__links a {
		padding-inline: 7px;

		font-size: 14px;
	}


	.bargchi-header-nav__actions span {
		display: none;
	}


	.bargchi-header-nav__divider {
		display: none;
	}


	.bargchi-header-nav__action {
		width: 34px;

		padding: 0;

		justify-content: center;
	}

}


/* ==========================================================================
   12. Mobile
   ========================================================================== */

@media (max-width: 767px) {

	.bargchi-header-topbar,
	.bargchi-header-nav {
		display: none;
	}


	.bargchi-header-main__container {
		display: grid;

		grid-template-columns:
			auto
			minmax(0, 1fr)
			auto;

		grid-template-areas:
			"toggle brand utility"
			"search search search";

		gap: 8px 6px;

		width: calc(100% - 20px);
		min-height: auto;

		padding-block: 8px 10px;
	}


	.bargchi-header-mobile-toggle {
		grid-area: toggle;

		display: inline-flex;
	}


	.bargchi-header-brand {
		grid-area: brand;

		justify-self: center;

		gap: 6px;
	}


	.bargchi-header-brand__logo {
		flex-basis: 36px;

		width: 36px;
		height: 36px;
	}


	.bargchi-header-brand__text strong {
		font-size: 18px;
	}


	.bargchi-header-brand__text small {
		display: none;
	}


	.bargchi-header-utility-actions {
		grid-area: utility;

		gap: 0;

		justify-self: end;
	}


	.bargchi-header-account {
		width: 38px;
		min-height: 38px;
	}


	.bargchi-header-account svg {
		width: 20px;
		height: 20px;
	}


	.bargchi-header-cart {
		min-width: 38px;
		min-height: 38px;

		padding: 0;
	}


	.bargchi-header-cart__icon > svg {
		width: 20px;
		height: 20px;
	}


	.bargchi-header-cart__label {
		display: none;
	}


	.bargchi-header-search {
		grid-area: search;

		grid-template-columns:
			20px
			minmax(0, 1fr)
			36px;

		gap: 7px;

		max-width: none;
		height: 44px;

		margin: 0 !important;
		padding: 0 9px 0 3px !important;

		border-radius: 8px;
	}


	.bargchi-header-search__icon {
		width: 20px;
		height: 20px;
	}


	.bargchi-header-search__icon svg {
		width: 17px;
		height: 17px;
	}


	.bargchi-header-search__input {
		height: 40px !important;

		font-size: 14px !important;
		line-height: 40px !important;
	}


	.bargchi-header-search__submit {
		width: 36px;
		height: 36px;

		border-radius: 6px !important;
	}


	.bargchi-header-search__submit svg {
		width: 18px;
		height: 18px;
	}


	.bargchi-mobile-drawer-layer {
		display: block;
	}

}


/* ==========================================================================
   13. Very Small Mobile
   ========================================================================== */

@media (max-width: 390px) {

	.bargchi-header-main__container {
		width: calc(100% - 16px);
	}


	.bargchi-header-brand__logo {
		flex-basis: 34px;

		width: 34px;
		height: 34px;
	}


	.bargchi-header-brand__text strong {
		font-size: 17px;
	}

}


/* ==========================================================================
   14. Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

	.bargchi-header-search,
	.bargchi-header-search__submit,
	.bargchi-header-account,
	.bargchi-header-cart,
	.bargchi-header-categories__dropdown,
	.bargchi-header-nav__links a::after,
	.bargchi-mobile-drawer,
	.bargchi-mobile-drawer-layer__backdrop {
		transition: none;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — SMART STICKY
|--------------------------------------------------------------------------
| Scroll down  : Main header only
| Scroll up    : Main header + navigation
|--------------------------------------------------------------------------
*/

@media (min-width: 768px) {

	/* --------------------------------------------------------------
	   Remove mobile hamburger on desktop
	   -------------------------------------------------------------- */

	body .bargchi-header-main .bargchi-header-mobile-toggle {
		display: none !important;
		visibility: hidden !important;

		width: 0 !important;
		height: 0 !important;

		margin: 0 !important;
		padding: 0 !important;

		overflow: hidden !important;

		pointer-events: none !important;
	}


	/* --------------------------------------------------------------
	   15px breathing room above main header content
	   -------------------------------------------------------------- */

	.bargchi-header-main__row {
		width: 100%;

		margin: 0 !important;

		padding-top: 15px !important;

		background: #ffffff;
	}


	/* --------------------------------------------------------------
	   Navigation attached directly to main row
	   -------------------------------------------------------------- */

	.bargchi-header-nav {
		width: 100%;

		margin: 0 !important;
		padding: 0 !important;

		background: #ffffff;
	}


	/* ==============================================================
	   SCROLL DOWN
	   Only main header remains fixed.
	   Navigation is NOT sticky.
	   ============================================================== */

	.bargchi-header-main.is-scroll-down {
		padding-top:
			var(--bargchi-main-row-height, 87px);
	}


	.bargchi-header-main.is-scroll-down
	.bargchi-header-main__row {
		position: fixed !important;

		top: var(--bargchi-sticky-top, 0px);
		right: 0;
		left: 0;

		z-index: 1002;

		background: #ffffff;

		box-shadow:
			0 2px 8px
			rgba(15, 43, 91, 0.04);
	}


	.bargchi-header-main.is-scroll-down
	.bargchi-header-nav {
		position: relative !important;

		top: auto !important;
		right: auto !important;
		left: auto !important;

		z-index: auto;

		box-shadow: none;
	}


	/* ==============================================================
	   SCROLL UP
	   Main header + navigation both remain visible.
	   Navigation sits directly under main header.
	   ============================================================== */

	.bargchi-header-main.is-scroll-up {
		padding-top:
			calc(
				var(--bargchi-main-row-height, 87px)
				+
				var(--bargchi-nav-height, 48px)
			);
	}


	.bargchi-header-main.is-scroll-up
	.bargchi-header-main__row {
		position: fixed !important;

		top: var(--bargchi-sticky-top, 0px);
		right: 0;
		left: 0;

		z-index: 1002;

		background: #ffffff;

		box-shadow: none;
	}


	.bargchi-header-main.is-scroll-up
	.bargchi-header-nav {
		position: fixed !important;

		top:
			calc(
				var(--bargchi-sticky-top, 0px)
				+
				var(--bargchi-main-row-height, 87px)
			);

		right: 0;
		left: 0;

		z-index: 1001;

		background: #ffffff;

		box-shadow:
			0 3px 9px
			rgba(15, 43, 91, 0.045);
	}


	/* --------------------------------------------------------------
	   Normal state at top of page
	   -------------------------------------------------------------- */

	.bargchi-header-main:not(.is-scroll-down):not(.is-scroll-up) {
		padding-top: 0;
	}


	.bargchi-header-main:not(.is-scroll-down):not(.is-scroll-up)
	.bargchi-header-main__row,
	.bargchi-header-main:not(.is-scroll-down):not(.is-scroll-up)
	.bargchi-header-nav {
		position: relative;

		top: auto;
		right: auto;
		left: auto;
	}

}


/* ==========================================================================
   WordPress admin bar
   ========================================================================== */

@media (min-width: 783px) {

	body.admin-bar .bargchi-header-main {
		--bargchi-sticky-top: 32px;
	}

}


@media (min-width: 768px) and (max-width: 782px) {

	body.admin-bar .bargchi-header-main {
		--bargchi-sticky-top: 46px;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — POLISH
|--------------------------------------------------------------------------
| 1. True vertical centering
| 2. Main header always fixed on mobile/tablet
| 3. Minimal mobile menu / close controls
| 4. Minimal desktop category icon
|--------------------------------------------------------------------------
*/


/* ==========================================================================
   1. DESKTOP — TRUE VERTICAL CENTER
   ========================================================================== */

@media (min-width: 1025px) {

	/*
	 * قبلاً 15px فقط از بالا اضافه شده بود.
	 * حالا همان 15px بین بالا و پایین تقسیم می‌شود
	 * تا ارتفاع کلی تقریباً تغییر نکند ولی محتوا وسط قرار بگیرد.
	 */

	body .bargchi-header-main .bargchi-header-main__row {
		padding-top: 7px !important;
		padding-bottom: 8px !important;
	}


	body .bargchi-header-main .bargchi-header-main__container {
		display: grid !important;

		align-items: center !important;

		min-height: 72px !important;

		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}


	body .bargchi-header-main .bargchi-header-brand,
	body .bargchi-header-main .bargchi-header-search,
	body .bargchi-header-main .bargchi-header-utility-actions {
		align-self: center !important;

		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}


	body .bargchi-header-main .bargchi-header-brand {
		align-items: center !important;
	}


	body .bargchi-header-main .bargchi-header-utility-actions {
		align-items: center !important;
	}

}


/* ==========================================================================
   2. TABLET + MOBILE
   MAIN HEADER ALWAYS FIXED
   ========================================================================== */

@media (max-width: 1024px) {

	/*
	 * فضای واقعی هدر را در صفحه نگه می‌داریم
	 * تا محتوای سایت زیر هدر نپرد.
	 */

	body .bargchi-header-main,
	body .bargchi-header-main.is-scroll-down,
	body .bargchi-header-main.is-scroll-up {
		padding-top:
			var(
				--bargchi-main-row-height,
				105px
			) !important;
	}


	/*
	 * مهم:
	 * این قوانین عمداً کلاس‌های scroll-up و scroll-down
	 * را هم پوشش می‌دهند تا Smart Sticky دسکتاپ
	 * نتواند در تبلت جای هدر را تغییر دهد.
	 */

	body .bargchi-header-main .bargchi-header-main__row,
	body .bargchi-header-main.is-scroll-down .bargchi-header-main__row,
	body .bargchi-header-main.is-scroll-up .bargchi-header-main__row {

		position: fixed !important;

		top:
			var(
				--bargchi-sticky-top,
				0px
			) !important;

		right: 0 !important;
		left: 0 !important;

		z-index: 1100 !important;

		width: 100% !important;

		margin: 0 !important;

		background: #ffffff !important;

		border-bottom:
			1px solid
			var(--bh-border) !important;

		box-shadow:
			0 3px 12px
			rgba(15, 43, 91, 0.055) !important;
	}


	/*
	 * Vertical centering در تبلت و موبایل
	 */

	body .bargchi-header-main .bargchi-header-main__container {
		align-items: center !important;
	}


	body .bargchi-header-main .bargchi-header-brand,
	body .bargchi-header-main .bargchi-header-search,
	body .bargchi-header-main .bargchi-header-utility-actions,
	body .bargchi-header-main .bargchi-header-mobile-toggle {
		align-self: center !important;
	}

}


/* WordPress admin bar */

@media (min-width: 783px) and (max-width: 1024px) {

	body.admin-bar .bargchi-header-main {
		--bargchi-sticky-top: 32px;
	}

}


@media (max-width: 782px) {

	body.admin-bar .bargchi-header-main {
		--bargchi-sticky-top: 46px;
	}

}


/* ==========================================================================
   3. MOBILE / TABLET MENU BUTTON
   ========================================================================== */

@media (max-width: 1024px) {

	/*
	 * Open menu button
	 *
	 * Selector عمداً قوی نوشته شده چون WoodMart
	 * روی button استایل عمومی اعمال می‌کند.
	 */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle {

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;
		flex-direction: column !important;

		gap: 3px !important;

		width: 36px !important;
		min-width: 36px !important;
		max-width: 36px !important;

		height: 36px !important;
		min-height: 36px !important;
		max-height: 36px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: var(--bh-navy) !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 7px !important;

		outline: 0 !important;
		box-shadow: none !important;

		appearance: none !important;
		-webkit-appearance: none !important;

		visibility: visible !important;

		overflow: visible !important;

		cursor: pointer !important;

		pointer-events: auto !important;
	}


	body .bargchi-header-main
	button.bargchi-header-mobile-toggle:hover {

		background: #f6f8fb !important;
	}


	body .bargchi-header-main
	button.bargchi-header-mobile-toggle span {

		display: block !important;

		width: 18px !important;
		height: 1.6px !important;

		margin: 0 !important;

		background: currentColor !important;

		border: 0 !important;
		border-radius: 20px !important;

		box-shadow: none !important;
	}


	/* خط وسط کمی کوتاه‌تر */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle span:nth-child(2) {

		width: 13px !important;
	}


	/*
	|--------------------------------------------------------------------------
	| Drawer close button
	|--------------------------------------------------------------------------
	*/

	body .bargchi-mobile-drawer
	button.bargchi-mobile-drawer__close {

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		width: 36px !important;
		min-width: 36px !important;
		max-width: 36px !important;

		height: 36px !important;
		min-height: 36px !important;
		max-height: 36px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: var(--bh-navy) !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 7px !important;

		outline: 0 !important;
		box-shadow: none !important;

		appearance: none !important;
		-webkit-appearance: none !important;

		cursor: pointer !important;
	}


	body .bargchi-mobile-drawer
	button.bargchi-mobile-drawer__close:hover {

		background: #f6f8fb !important;
	}


	body .bargchi-mobile-drawer
	button.bargchi-mobile-drawer__close svg {

		display: block !important;

		width: 18px !important;
		height: 18px !important;

		margin: 0 !important;

		fill: none !important;

		stroke: currentColor !important;
		stroke-width: 1.7 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

}


/* ==========================================================================
   4. DESKTOP CATEGORY ICON
   Remove arrow + replace hamburger with minimal category grid
   ========================================================================== */

@media (min-width: 768px) {

	/*
	 * Arrow
	 */

	body .bargchi-header-main
	.bargchi-header-categories__trigger > svg {

		display: none !important;
	}


	/*
	 * Category trigger
	 */

	body .bargchi-header-main
	.bargchi-header-categories__trigger {

		display: inline-flex !important;

		align-items: center !important;

		gap: 9px !important;

		padding-inline:
			4px
			12px !important;
	}


	/*
	 * Old three-line hamburger is removed
	 */

	body .bargchi-header-main
	.bargchi-header-categories__menu-icon {

		position: relative !important;

		display: inline-block !important;

		flex: 0 0 18px !important;

		width: 18px !important;
		height: 18px !important;

		margin: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__menu-icon span {

		display: none !important;
	}


	/*
	 * 4-square minimal category icon
	 */

	body .bargchi-header-main
	.bargchi-header-categories__menu-icon::before {

		position: absolute;

		top: 3px;
		right: 3px;

		width: 4px;
		height: 4px;

		background: currentColor;

		border-radius: 1px;

		box-shadow:
			8px 0 0 currentColor,
			0 8px 0 currentColor,
			8px 8px 0 currentColor;

		content: "";

		opacity: 0.88;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI MOBILE HEADER — ZERO TOP GAP FIX
|--------------------------------------------------------------------------
*/

@media (max-width: 767px) {

	/*
	 * در موبایل هدر باید کاملاً به بالای viewport بچسبد،
	 * حتی اگر کاربر وارد وردپرس باشد.
	 */

	body .bargchi-header-main,
	body.admin-bar .bargchi-header-main {
		--bargchi-sticky-top: 0px !important;
	}


	body .bargchi-header-main .bargchi-header-main__row,
	body .bargchi-header-main.is-scroll-down .bargchi-header-main__row,
	body .bargchi-header-main.is-scroll-up .bargchi-header-main__row,
	body.admin-bar .bargchi-header-main .bargchi-header-main__row,
	body.admin-bar .bargchi-header-main.is-scroll-down .bargchi-header-main__row,
	body.admin-bar .bargchi-header-main.is-scroll-up .bargchi-header-main__row {

		position: fixed !important;

		top: 0 !important;
		right: 0 !important;
		left: 0 !important;

		width: 100% !important;

		margin-top: 0 !important;

		z-index: 1100 !important;
	}
}

/*
|--------------------------------------------------------------------------
| BARGCHI DESKTOP NAV — ORANGE ACCENT + DIRECTIONAL UNDERLINE
|--------------------------------------------------------------------------
*/

@media (min-width: 768px) {

	/* ==============================================================
	   Category trigger
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-categories {
		align-self: center !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger {
		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		gap: 8px !important;

		height: 38px !important;

		padding-inline: 13px !important;

		color: var(--bh-navy) !important;

		background: #fff7f1 !important;

		border: 1px solid #f1c8ad !important;
		border-radius: 8px !important;

		font-size: 14px !important;
		font-weight: 800 !important;

		box-shadow: none !important;

		transition:
			background-color 150ms ease,
			border-color 150ms ease,
			color 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger:hover {
		color: #b95314 !important;

		background: #fff2e8 !important;

		border-color: #e97018 !important;
	}


	/* Category icon */

	body .bargchi-header-main
	.bargchi-header-categories__menu-icon {
		color: #e97018 !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__menu-icon::before {
		background: currentColor !important;

		box-shadow:
			8px 0 0 currentColor,
			0 8px 0 currentColor,
			8px 8px 0 currentColor !important;
	}


	/* ==============================================================
	   Main navigation links
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-nav__links a {
		position: relative !important;

		overflow: hidden;

		color: var(--bh-text);

		text-decoration: none !important;
	}


	/*
	 * Underline width equals actual text area,
	 * excluding horizontal link padding.
	 */

	body .bargchi-header-main
	.bargchi-header-nav__links a::after {
		position: absolute !important;

		right: 10px !important;
		left: 10px !important;
		bottom: 2px !important;

		width: auto !important;
		height: 2px !important;

		background: #e97018 !important;

		border-radius: 999px !important;

		content: "" !important;

		opacity: 1 !important;

		transform: scaleX(0);

		transform-origin:
			var(--bargchi-hover-origin, right)
			center;

		transition:
			transform 190ms
			cubic-bezier(
				0.22,
				0.61,
				0.36,
				1
			) !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__links a.is-bargchi-hovered::after {
		transform: scaleX(1);
	}


	/*
	 * Keep category trigger and action links
	 * completely outside this underline system.
	 */

	body .bargchi-header-main
	.bargchi-header-categories__trigger::after,
	body .bargchi-header-main
	.bargchi-header-nav__actions a::after {
		display: none !important;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI DESKTOP CATEGORY
|--------------------------------------------------------------------------
*/

@media (min-width: 768px) {

	body .bargchi-header-main
	.bargchi-header-categories__trigger {

		color: #ffffff !important;

		background: #e97018 !important;

		border: 1px solid #e97018 !important;
		border-radius: 7px !important;

		padding-inline: 13px !important;

		box-shadow: none !important;

		transition:
			background-color 150ms ease,
			border-color 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger:hover,
	body .bargchi-header-main
	.bargchi-header-categories__trigger:focus {

		color: #ffffff !important;

		background: #c9570f !important;

		border-color: #c9570f !important;
	}


	/* متن همیشه سفید */

	body .bargchi-header-main
	.bargchi-header-categories__trigger span {

		color: #ffffff !important;
	}


	/* آیکن دسته‌بندی هم سفید */

	body .bargchi-header-main
	.bargchi-header-categories__menu-icon {

		color: #ffffff !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__menu-icon::before {

		background: currentColor !important;

		box-shadow:
			8px 0 0 currentColor,
			0 8px 0 currentColor,
			8px 8px 0 currentColor !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI NAV ACTION ICONS
|--------------------------------------------------------------------------
*/

@media (min-width: 768px) {

	body .bargchi-header-main
	.bargchi-header-nav__action {

		gap: 7px !important;

		color: var(--bh-navy);

		font-size: 14px;
		font-weight: 700;

		transition:
			color 150ms ease,
			opacity 150ms ease;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action svg {

		flex: 0 0 18px;

		width: 18px !important;
		height: 18px !important;

		fill: none !important;

		stroke: currentColor !important;
		stroke-width: 1.65 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}


	/* پیام به پشتیبانی */

	body .bargchi-header-main
	.bargchi-header-nav__action:not(
		.bargchi-header-nav__action--wholesale
	) {

		color: #0f2b5b !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action:not(
		.bargchi-header-nav__action--wholesale
	):hover {

		color: #173b70 !important;
	}


	/* فروش عمده */

	body .bargchi-header-main
	.bargchi-header-nav__action--wholesale {

		color: #c45b13 !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action--wholesale:hover {

		color: #e97018 !important;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — DESKTOP HUMAN POLISH
|--------------------------------------------------------------------------
| Real retail look / less component-like / less AI-looking
|--------------------------------------------------------------------------
*/

@media (min-width: 1025px) {

	/* ==============================================================
	   MAIN HEADER
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-main__container {

		grid-template-columns:
			210px
			minmax(420px, 1fr)
			auto !important;

		gap: 34px !important;

		min-height: 72px !important;

		align-items: center !important;
	}


	/* ==============================================================
	   BRAND
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-brand {

		gap: 10px !important;

		align-items: center !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__logo {

		width: 46px !important;
		height: 46px !important;

		flex-basis: 46px !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text strong {

		font-size: 22px !important;
		font-weight: 900 !important;

		line-height: 1.25 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text small {

		color: #7a8796 !important;

		font-size: 14px !important;
		font-weight: 500 !important;

		line-height: 1.45 !important;
	}


	/* ==============================================================
	   SEARCH — CLEAN REAL STORE STYLE
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-search {

		display: grid !important;

		grid-template-columns:
			22px
			minmax(0, 1fr) !important;

		align-items: center !important;

		gap: 10px !important;

		width: 100% !important;
		max-width: 690px !important;

		height: 46px !important;

		margin: 0 auto !important;

		padding:
			0
			13px !important;

		background: #f8fafc !important;

		border:
			1px solid
			#dbe3eb !important;

		border-radius: 9px !important;

		box-shadow: none !important;

		transition:
			background-color 150ms ease,
			border-color 150ms ease,
			box-shadow 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-search:hover {

		background: #ffffff !important;

		border-color: #c7d2de !important;
	}


	body .bargchi-header-main
	.bargchi-header-search:focus-within {

		background: #ffffff !important;

		border-color: #9eb0c2 !important;

		box-shadow:
			0 0 0 3px
			rgba(15, 43, 91, 0.04) !important;
	}


	/* Single search icon */

	body .bargchi-header-main
	.bargchi-header-search__icon {

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		width: 22px !important;
		height: 22px !important;

		color: #8190a1 !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__icon svg {

		width: 18px !important;
		height: 18px !important;

		stroke-width: 1.7 !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input {

		width: 100% !important;

		height: 42px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: #263548 !important;

		background: transparent !important;

		border: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;

		font-size: 14px !important;
		font-weight: 500 !important;

		line-height: 42px !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input::placeholder {

		color: #8794a4 !important;

		font-size: 14px !important;
		font-weight: 500 !important;

		opacity: 1 !important;
	}


	/* Safety: old search button must never appear */

	body .bargchi-header-main
	.bargchi-header-search__submit {

		display: none !important;
	}


	/* ==============================================================
	   ACCOUNT + CART
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-utility-actions {

		gap: 6px !important;
	}


	body .bargchi-header-main
	.bargchi-header-account {

		width: 40px !important;
		height: 40px !important;
		min-height: 40px !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 7px !important;
	}


	body .bargchi-header-main
	.bargchi-header-account:hover {

		background: #f5f7fa !important;
	}


	body .bargchi-header-main
	.bargchi-header-account svg {

		width: 21px !important;
		height: 21px !important;

		stroke-width: 1.65 !important;
	}


	body .bargchi-header-main
	.bargchi-header-cart {

		min-height: 40px !important;

		gap: 6px !important;

		padding-inline: 7px !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 7px !important;
	}


	body .bargchi-header-main
	.bargchi-header-cart:hover {

		background: #f5f7fa !important;
	}


	body .bargchi-header-main
	.bargchi-header-cart__label {

		font-size: 14px !important;
		font-weight: 700 !important;
	}


	/* ==============================================================
	   NAVIGATION BAR
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-nav {

		background: #ffffff !important;

		border-top: 0 !important;

		border-bottom:
			1px solid
			#e5eaf0 !important;

		box-shadow: none !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__container {

		min-height: 48px !important;

		gap: 18px !important;
	}


	/* ==============================================================
	   CATEGORY BUTTON
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-categories {

		align-self: center !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger {

		height: 36px !important;

		gap: 8px !important;

		padding-inline:
			12px !important;

		color: #ffffff !important;

		background: #e97018 !important;

		border:
			1px solid
			#e97018 !important;

		border-radius: 6px !important;

		box-shadow: none !important;

		font-size: 14px !important;
		font-weight: 800 !important;

		transition:
			background-color 150ms ease,
			border-color 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger:hover {

		color: #ffffff !important;

		background: #d45f12 !important;

		border-color: #d45f12 !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger span {

		color: #ffffff !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__menu-icon {

		color: #ffffff !important;
	}


	/* ==============================================================
	   MAIN NAV LINKS
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-nav__links {

		gap: 2px !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__links a {

		min-height: 46px !important;

		padding-inline:
			10px !important;

		color: #2d3a4c !important;

		font-size: 14px !important;
		font-weight: 700 !important;

		letter-spacing: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__links a:hover {

		color: #0f2b5b !important;
	}


	/*
	 * Directional orange underline
	 * JS already controls --bargchi-hover-origin
	 */

	body .bargchi-header-main
	.bargchi-header-nav__links a::after {

		right: 10px !important;
		left: 10px !important;

		bottom: 1px !important;

		height: 2px !important;

		background: #e97018 !important;

		border-radius: 999px !important;

		transform:
			scaleX(0);

		transform-origin:
			var(
				--bargchi-hover-origin,
				right
			)
			center !important;

		transition:
			transform 180ms
			cubic-bezier(
				0.22,
				0.61,
				0.36,
				1
			) !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__links
	a.is-bargchi-hovered::after {

		transform:
			scaleX(1);
	}


	/* ==============================================================
	   SUPPORT + WHOLESALE ACTIONS
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-nav__actions {

		gap: 3px !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action {

		min-height: 34px !important;

		gap: 6px !important;

		padding-inline:
			7px !important;

		border-radius: 6px !important;

		font-size: 14px !important;
		font-weight: 700 !important;

		transition:
			background-color 150ms ease,
			color 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action:not(
		.bargchi-header-nav__action--wholesale
	) {

		color: #0f2b5b !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action:not(
		.bargchi-header-nav__action--wholesale
	):hover {

		color: #0f2b5b !important;

		background: #f4f7fa !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action--wholesale {

		color: #bd5511 !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action--wholesale:hover {

		color: #a94a0d !important;

		background: #fff6ef !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action svg {

		width: 17px !important;
		height: 17px !important;

		stroke-width: 1.6 !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__divider {

		height: 17px !important;

		background: #dfe5eb !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — DESKTOP POLISH
|--------------------------------------------------------------------------
| Search refinement
| Navigation action refinement
| Category trigger refinement
|--------------------------------------------------------------------------
*/

@media (min-width: 1025px) {

	/* ==============================================================
	   1. SEARCH
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-search {
		max-width: 660px !important;
		height: 46px !important;

		padding-inline: 13px !important;

		background: #f7f9fc !important;

		border:
			1px solid
			#cfd9e4 !important;

		border-radius: 8px !important;

		box-shadow:
			inset 0 1px 0
			rgba(255, 255, 255, 0.7) !important;

		transition:
			background-color 150ms ease,
			border-color 150ms ease,
			box-shadow 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-search:hover {
		background: #ffffff !important;

		border-color: #b9c7d5 !important;
	}


	body .bargchi-header-main
	.bargchi-header-search:focus-within {
		background: #ffffff !important;

		border-color: #8fa4ba !important;

		box-shadow:
			0 0 0 3px
			rgba(15, 43, 91, 0.045) !important;
	}


	/* Search icon */

	body .bargchi-header-main
	.bargchi-header-search__icon {
		color: #78889a !important;

		transition:
			color 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-search:focus-within
	.bargchi-header-search__icon {
		color: #0f2b5b !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__icon svg {
		width: 18px !important;
		height: 18px !important;

		stroke-width: 1.7 !important;
	}


	/* Search input */

	body .bargchi-header-main
	.bargchi-header-search__input {
		font-size: 14px !important;
		font-weight: 500 !important;

		color: #273548 !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input::placeholder {
		color: #7f8c9c !important;

		font-size: 14px !important;
		font-weight: 500 !important;

		opacity: 1 !important;
	}


	/* Search submit button stays removed */

	body .bargchi-header-main
	.bargchi-header-search__submit {
		display: none !important;
	}



	/* ==============================================================
	   2. CATEGORY BUTTON
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-categories__trigger {
		height: 34px !important;

		padding-inline:
			11px !important;

		gap: 7px !important;

		color: #ffffff !important;

		background: #e97018 !important;

		border:
			1px solid
			#e97018 !important;

		border-radius: 6px !important;

		box-shadow: none !important;

		font-size: 14px !important;
		font-weight: 800 !important;

		line-height: 1 !important;

		transition:
			background-color 150ms ease,
			border-color 150ms ease,
			transform 150ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger:hover {
		color: #ffffff !important;

		background: #cf5c12 !important;

		border-color: #cf5c12 !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger:active {
		transform:
			translateY(1px);
	}


	body .bargchi-header-main
	.bargchi-header-categories__trigger span {
		color: #ffffff !important;
	}


	body .bargchi-header-main
	.bargchi-header-categories__menu-icon {
		color: #ffffff !important;
	}



	/* ==============================================================
	   3. SUPPORT + WHOLESALE
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-nav__actions {
		display: flex !important;

		align-items: center !important;

		gap: 3px !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action {
		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		gap: 6px !important;

		min-height: 34px !important;

		padding-inline:
			8px !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 6px !important;

		box-shadow: none !important;

		font-size: 14px !important;
		font-weight: 700 !important;

		transition:
			color 150ms ease,
			background-color 150ms ease !important;
	}


	/* Support */

	body .bargchi-header-main
	.bargchi-header-nav__action:not(
		.bargchi-header-nav__action--wholesale
	) {
		color: #0f2b5b !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action:not(
		.bargchi-header-nav__action--wholesale
	):hover {
		color: #0f2b5b !important;

		background: #f2f5f8 !important;
	}


	/* Wholesale */

	body .bargchi-header-main
	.bargchi-header-nav__action--wholesale {
		color: #b85212 !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__action--wholesale:hover {
		color: #a3480e !important;

		background: #fff5ed !important;
	}


	/* Action icons */

	body .bargchi-header-main
	.bargchi-header-nav__action svg {
		flex: 0 0 17px !important;

		width: 17px !important;
		height: 17px !important;

		fill: none !important;

		stroke: currentColor !important;
		stroke-width: 1.65 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}


	/* Divider between support / wholesale */

	body .bargchi-header-main
	.bargchi-header-nav__divider {
		width: 1px !important;
		height: 16px !important;

		margin-inline:
			3px !important;

		background: #dde4eb !important;
	}



	/* ==============================================================
	   4. SLIGHTLY BETTER NAV RHYTHM
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-nav__container {
		min-height: 48px !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__links {
		gap: 3px !important;
	}


	body .bargchi-header-main
	.bargchi-header-nav__links a {
		padding-inline:
			11px !important;

		font-size: 14px !important;

		white-space: nowrap;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI MOBILE HEADER — STEP 1
|--------------------------------------------------------------------------
| فقط ردیف بالایی موبایل
| Menu | Brand | Account + Cart
|--------------------------------------------------------------------------
*/

@media (max-width: 767px) {

	/* ==============================================================
	   MAIN MOBILE ROW
	   سه ستون متقارن برای وسط ماندن واقعی لوگو
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-main__container {

		grid-template-columns:
			84px
			minmax(0, 1fr)
			84px !important;

		grid-template-areas:
			"toggle brand utility"
			"search search search" !important;

		align-items: center !important;

		gap:
			8px
			6px !important;

		width: calc(100% - 20px) !important;

		padding-top: 8px !important;
		padding-bottom: 9px !important;
	}


	/* ==============================================================
	   BRAND — EXACT CENTER
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-brand {

		grid-area: brand !important;

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		justify-self: center !important;
		align-self: center !important;

		gap: 6px !important;

		margin: 0 !important;

		white-space: nowrap;
	}


	body .bargchi-header-main
	.bargchi-header-brand__logo {

		flex: 0 0 34px !important;

		width: 34px !important;
		height: 34px !important;

		margin: 0 !important;

		object-fit: contain !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text {

		display: flex !important;

		align-items: center !important;
		justify-content: center !important;

		margin: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text strong {

		margin: 0 !important;

		color: #0f2b5b !important;

		font-size: 18px !important;
		font-weight: 900 !important;

		line-height: 1.2 !important;
	}


	/* زیرعنوان برند در موبایل نمایش داده نشود */

	body .bargchi-header-main
	.bargchi-header-brand__text small {

		display: none !important;
	}


	/* ==============================================================
	   ACCOUNT + CART
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-utility-actions {

		grid-area: utility !important;

		display: flex !important;

		align-items: center !important;
		justify-content: flex-start !important;

		justify-self: stretch !important;

		gap: 4px !important;

		margin: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-account,
	body .bargchi-header-main
	.bargchi-header-cart {

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		flex: 0 0 38px !important;

		width: 38px !important;
		min-width: 38px !important;

		height: 38px !important;
		min-height: 38px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: #0f2b5b !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 8px !important;

		box-shadow: none !important;
	}


	body .bargchi-header-main
	.bargchi-header-account:active,
	body .bargchi-header-main
	.bargchi-header-cart:active {

		background: #f4f7fa !important;
	}


	body .bargchi-header-main
	.bargchi-header-account svg,
	body .bargchi-header-main
	.bargchi-header-cart__icon > svg {

		width: 21px !important;
		height: 21px !important;

		stroke-width: 1.65 !important;
	}


	/* در موبایل متن سبد خرید نمایش داده نشود */

	body .bargchi-header-main
	.bargchi-header-cart__label {

		display: none !important;
	}


	/* ==============================================================
	   MENU BUTTON
	   مینیمال، بدون قاب کارتونی
	   ============================================================== */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle {

		grid-area: toggle !important;

		display: inline-flex !important;

		flex-direction: column !important;

		align-items: center !important;
		justify-content: center !important;

		justify-self: end !important;
		align-self: center !important;

		gap: 3px !important;

		width: 38px !important;
		min-width: 38px !important;

		height: 38px !important;
		min-height: 38px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: #0f2b5b !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 8px !important;

		box-shadow: none !important;

		appearance: none !important;
		-webkit-appearance: none !important;
	}


	body .bargchi-header-main
	button.bargchi-header-mobile-toggle:active {

		background: #f4f7fa !important;
	}


	body .bargchi-header-main
	button.bargchi-header-mobile-toggle span {

		display: block !important;

		width: 18px !important;
		height: 1.6px !important;

		margin: 0 !important;

		background: currentColor !important;

		border-radius: 20px !important;
	}


	/* خط وسط کمی کوتاه‌تر؛ ظاهر ظریف‌تر */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle span:nth-child(2) {

		width: 13px !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI MOBILE HEADER — EDGE ALIGNMENT FIX
|--------------------------------------------------------------------------
*/

@media (max-width: 767px) {

	body .bargchi-header-main
	.bargchi-header-main__container {

		width: 100% !important;

		margin-right: 0 !important;
		margin-left: 0 !important;

		padding-right: 7px !important;
		padding-left: 7px !important;

		box-sizing: border-box !important;
	}


	/*
	 * Menu opener should sit close to the right edge
	 */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle {

		justify-self: end !important;

		margin-right: 0 !important;
		margin-left: 0 !important;
	}


	/*
	 * Keep opposite side balanced
	 * so the logo stays genuinely centered.
	 */

	body .bargchi-header-main
	.bargchi-header-utility-actions {

		margin-right: 0 !important;
		margin-left: 0 !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — LAYOUT FIXES
|--------------------------------------------------------------------------
| 1. Desktop search must never overlap brand
| 2. Mobile menu icon closer to right edge
| 3. Slider controls must stay behind sticky mobile header
|--------------------------------------------------------------------------
*/


/* ==========================================================================
   1. DESKTOP — SEARCH / BRAND COLLISION FIX
   ========================================================================== */

@media (min-width: 1025px) {

	body .bargchi-header-main
	.bargchi-header-main__container {

		grid-template-columns:
			245px
			minmax(0, 1fr)
			155px !important;

		column-gap: 32px !important;

		align-items: center !important;
	}


	/*
	 * Brand keeps its own dedicated space.
	 */

	body .bargchi-header-main
	.bargchi-header-brand {

		min-width: 0 !important;
		max-width: 245px !important;

		overflow: hidden !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text {

		min-width: 0 !important;
	}


	/*
	 * Search is limited strictly to its grid column.
	 * It can no longer extend underneath the logo.
	 */

	body .bargchi-header-main
	.bargchi-header-search {

		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;

		margin: 0 !important;

		justify-self: stretch !important;

		box-sizing: border-box !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input {

		min-width: 0 !important;
		max-width: 100% !important;

		box-sizing: border-box !important;
	}

}


/* ==========================================================================
   2. MOBILE — MENU ICON TO RIGHT EDGE
   ========================================================================== */

@media (max-width: 767px) {

	body .bargchi-header-main
	.bargchi-header-main__container {

		position: relative !important;

		width: 100% !important;

		margin-right: 0 !important;
		margin-left: 0 !important;

		padding-right: 5px !important;
		padding-left: 5px !important;

		box-sizing: border-box !important;
	}


	/*
	 * We position the hamburger physically from the right.
	 * This avoids RTL grid alignment ambiguity.
	 */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle {

		position: absolute !important;

		top: 8px !important;
		right: 2px !important;

		z-index: 4 !important;

		margin: 0 !important;

		justify-self: auto !important;
	}


	/*
	 * Keep brand visually centered despite absolute hamburger.
	 */

	body .bargchi-header-main
	.bargchi-header-brand {

		justify-self: center !important;
		margin-inline: auto !important;
	}

}


/* ==========================================================================
   3. MOBILE — STICKY HEADER ABOVE SLIDER CONTROLS
   ========================================================================== */

@media (max-width: 767px) {

	/*
	 * Create a strong stacking layer for the whole custom header.
	 */

	body .bargchi-header-main {

		position: relative !important;

		z-index: 99990 !important;

		isolation: isolate !important;

		background: #ffffff !important;
	}


	body .bargchi-header-main
	.bargchi-header-main__row,

	body .bargchi-header-main.is-scroll-down
	.bargchi-header-main__row,

	body .bargchi-header-main.is-scroll-up
	.bargchi-header-main__row {

		z-index: 99999 !important;

		background: #ffffff !important;

		isolation: isolate !important;
	}


	body .bargchi-header-main
	.bargchi-header-main__container {

		position: relative !important;

		z-index: 5 !important;

		background: #ffffff !important;
	}


	/*
	 * Search also receives an opaque layer,
	 * so slider arrows cannot visually bleed through it.
	 */

	body .bargchi-header-main
	.bargchi-header-search {

		position: relative !important;

		z-index: 6 !important;

		background: #ffffff !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input {

		position: relative !important;

		z-index: 2 !important;

		background: #ffffff !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI HEADER — PRECISION POLISH
|--------------------------------------------------------------------------
| 1. Desktop search breathing room
| 2. Restore full brand visibility
| 3. Mobile top-row exact alignment
| 4. Unified keyline-style header icons
|--------------------------------------------------------------------------
*/


/* ==========================================================================
   1. DESKTOP — SEARCH + BRAND BALANCE
   ========================================================================== */

@media (min-width: 1025px) {

	/*
	 * فضای واقعی برند را برمی‌گردانیم.
	 * قبلاً overflow باعث بریده/محو شدن زیرعنوان لوگو شده بود.
	 */

	body .bargchi-header-main
	.bargchi-header-brand {

		width: auto !important;
		min-width: 250px !important;
		max-width: none !important;

		overflow: visible !important;

		flex-shrink: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text {

		min-width: 0 !important;

		overflow: visible !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text small {

		display: block !important;

		overflow: visible !important;

		white-space: nowrap !important;
	}


	/*
	|--------------------------------------------------------------------------
	| Search
	|--------------------------------------------------------------------------
	| کمی از هر دو طرف کوچک‌تر می‌شود.
	| دیگر به لوگو نزدیک نمی‌شود و سمت چپ هم نفس می‌کشد.
	*/

	body .bargchi-header-main
	.bargchi-header-search {

		width: calc(100% - 70px) !important;

		max-width: 620px !important;
		min-width: 420px !important;

		margin-inline: auto !important;

		justify-self: center !important;
	}


	/*
	 * ساختار Grid را طوری نگه می‌داریم که
	 * ستون برند هیچ‌وقت توسط Search خورده نشود.
	 */

	body .bargchi-header-main
	.bargchi-header-main__container {

		grid-template-columns:
			260px
			minmax(420px, 1fr)
			130px !important;

		column-gap: 30px !important;
	}


	/*
	 * Search در محدوده خودش باقی بماند.
	 */

	body .bargchi-header-main
	.bargchi-header-search__input {

		min-width: 0 !important;
		width: 100% !important;
	}

}


/* ==========================================================================
   2. MOBILE — TOP ROW ARCHITECTURE
   ========================================================================== */

@media (max-width: 767px) {

	/*
	|--------------------------------------------------------------------------
	| سه ستون متقارن
	|--------------------------------------------------------------------------
	| منو        لوگو       حساب + سبد
	|
	| دو ستون کناری برابرند؛
	| بنابراین لوگو واقعاً وسط صفحه می‌ماند.
	*/

	body .bargchi-header-main
	.bargchi-header-main__container {

		grid-template-columns:
			76px
			minmax(0, 1fr)
			76px !important;

		grid-template-areas:
			"toggle brand utility"
			"search search search" !important;

		align-items: center !important;

		column-gap: 4px !important;
		row-gap: 8px !important;

		width: 100% !important;

		margin: 0 !important;

		padding:
			7px
			4px
			10px !important;

		box-sizing: border-box !important;
	}


	/* ==============================================================
	   MENU BUTTON — remove absolute positioning
	   ============================================================== */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle {

		position: static !important;

		top: auto !important;
		right: auto !important;
		left: auto !important;

		grid-area: toggle !important;

		align-self: center !important;
		justify-self: start !important;

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		flex-direction: column !important;

		gap: 3px !important;

		width: 36px !important;
		min-width: 36px !important;

		height: 36px !important;
		min-height: 36px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: #0f2b5b !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 8px !important;

		box-shadow: none !important;

		transform: none !important;

		transition:
			background-color 140ms ease,
			transform 100ms ease !important;
	}


	body .bargchi-header-main
	button.bargchi-header-mobile-toggle:active {

		background: #f2f5f8 !important;

		transform: scale(0.96) !important;
	}


	/*
	 * Keyline hamburger:
	 * خطوط سبک‌تر و هندسی‌تر
	 */

	body .bargchi-header-main
	button.bargchi-header-mobile-toggle span {

		display: block !important;

		width: 17px !important;
		height: 1.5px !important;

		margin: 0 !important;

		background: currentColor !important;

		border-radius: 999px !important;
	}


	body .bargchi-header-main
	button.bargchi-header-mobile-toggle span:nth-child(2) {

		width: 12px !important;
	}


	/* ==============================================================
	   BRAND — vertically perfect
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-brand {

		grid-area: brand !important;

		align-self: center !important;
		justify-self: center !important;

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		gap: 6px !important;

		height: 38px !important;

		margin: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__logo {

		display: block !important;

		flex: 0 0 34px !important;

		width: 34px !important;
		height: 34px !important;

		margin: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text {

		display: flex !important;

		align-items: center !important;
		justify-content: center !important;

		height: 34px !important;

		margin: 0 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text strong {

		display: block !important;

		margin: 0 !important;

		font-size: 18px !important;
		font-weight: 900 !important;

		line-height: 34px !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text small {

		display: none !important;
	}


	/* ==============================================================
	   ACCOUNT + CART
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-utility-actions {

		grid-area: utility !important;

		align-self: center !important;
		justify-self: end !important;

		display: flex !important;

		align-items: center !important;
		justify-content: flex-end !important;

		gap: 2px !important;

		height: 38px !important;

		margin: 0 !important;
		padding: 0 !important;
	}


	/*
	|--------------------------------------------------------------------------
	| Unified icon buttons
	|--------------------------------------------------------------------------
	*/

	body .bargchi-header-main
	.bargchi-header-account,

	body .bargchi-header-main
	.bargchi-header-cart {

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		flex: 0 0 36px !important;

		width: 36px !important;
		min-width: 36px !important;

		height: 36px !important;
		min-height: 36px !important;

		margin: 0 !important;
		padding: 0 !important;

		color: #0f2b5b !important;

		background: transparent !important;

		border: 0 !important;
		border-radius: 8px !important;

		box-shadow: none !important;

		transition:
			background-color 140ms ease,
			transform 100ms ease !important;
	}


	body .bargchi-header-main
	.bargchi-header-account:active,

	body .bargchi-header-main
	.bargchi-header-cart:active {

		background: #f2f5f8 !important;

		transform: scale(0.96);
	}


	/* ==============================================================
	   KEYLINE ICON LANGUAGE
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-account svg,

	body .bargchi-header-main
	.bargchi-header-cart__icon > svg {

		display: block !important;

		width: 20px !important;
		height: 20px !important;

		margin: 0 !important;

		fill: none !important;

		stroke: currentColor !important;
		stroke-width: 1.55 !important;

		stroke-linecap: round !important;
		stroke-linejoin: round !important;

		overflow: visible !important;
	}


	body .bargchi-header-main
	.bargchi-header-cart__label {

		display: none !important;
	}


	/*
	 * Counter کمی ظریف‌تر
	 */

	body .bargchi-header-main
	.bargchi-header-cart__count {

		top: -5px !important;
		right: -6px !important;

		min-width: 16px !important;
		height: 16px !important;

		padding-inline: 3px !important;

		border-width: 1.5px !important;

		font-size: 9px !important;
		font-weight: 800 !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI DESKTOP HEADER — COMPACT PROFESSIONAL PASS
|--------------------------------------------------------------------------
*/

@media (min-width: 1025px) {

	/* ==============================================================
	   TOP BAR
	   ============================================================== */

	body .bargchi-header-topbar__container {
		min-height: 31px !important;

		padding-top: 0 !important;
		padding-bottom: 0 !important;

		align-items: center !important;
	}


	body .bargchi-header-topbar__intro,
	body .bargchi-header-topbar__item {
		height: 31px !important;

		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		line-height: 1 !important;
	}


	body .bargchi-header-topbar__intro {
		gap: 7px !important;

		font-size: 12px !important;
		font-weight: 700 !important;
	}


	body .bargchi-header-topbar__items {
		height: 31px !important;

		align-items: center !important;
	}


	body .bargchi-header-topbar__item {
		gap: 7px !important;

		padding-inline: 12px !important;

		font-size: 12px !important;
		font-weight: 500 !important;
	}


	/* ==============================================================
	   TOP BAR ICONS
	   ============================================================== */

	body .bargchi-header-topbar__icon {
		display: inline-flex !important;

		align-items: center !important;
		justify-content: center !important;

		flex: 0 0 16px !important;

		width: 16px !important;
		height: 16px !important;

		margin: 0 !important;

		color: #0f2b5b !important;

		transform: none !important;
	}


	body .bargchi-header-topbar__icon svg {
		display: block !important;

		width: 16px !important;
		height: 16px !important;

		margin: 0 !important;

		fill: none !important;

		stroke: currentColor !important;
		stroke-width: 1.55 !important;

		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}


	/* فقط آیکن معرفی فروشگاه نارنجی */

	body .bargchi-header-topbar__intro
	.bargchi-header-topbar__icon {
		color: #e97018 !important;
	}


	/* Separatorها ظریف‌تر */

	body .bargchi-header-topbar__item:not(:last-child)::after {
		height: 13px !important;

		background: #e2e7ed !important;
	}


	/* ==============================================================
	   MAIN HEADER HEIGHT
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-main__row {
		padding-top: 4px !important;
		padding-bottom: 4px !important;
	}


	body .bargchi-header-main
	.bargchi-header-main__container {
		min-height: 58px !important;

		align-items: center !important;

		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}


	/* ==============================================================
	   BRAND
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-brand {
		align-items: center !important;

		gap: 9px !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__logo {
		flex-basis: 42px !important;

		width: 42px !important;
		height: 42px !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text strong {
		font-size: 20px !important;

		line-height: 1.2 !important;
	}


	body .bargchi-header-main
	.bargchi-header-brand__text small {
		font-size: 13px !important;

		line-height: 1.35 !important;
	}


	/* ==============================================================
	   SEARCH
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-search {
		height: 42px !important;

		max-width: 590px !important;

		border-radius: 7px !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input {
		height: 38px !important;

		line-height: 38px !important;

		font-size: 14px !important;
	}


	body .bargchi-header-main
	.bargchi-header-search__input::placeholder {
		font-size: 14px !important;
	}


	/* ==============================================================
	   ACCOUNT + CART
	   ============================================================== */

	body .bargchi-header-main
	.bargchi-header-utility-actions {
		height: 42px !important;

		align-items: center !important;

		gap: 3px !important;
	}


	body .bargchi-header-main
	.bargchi-header-account,
	body .bargchi-header-main
	.bargchi-header-cart {
		min-height: 36px !important;

		height: 36px !important;

		align-items: center !important;
	}


	body .bargchi-header-main
	.bargchi-header-account {
		width: 36px !important;
	}


	body .bargchi-header-main
	.bargchi-header-account svg,
	body .bargchi-header-main
	.bargchi-header-cart__icon > svg {
		width: 19px !important;
		height: 19px !important;

		stroke-width: 1.55 !important;
	}


	body .bargchi-header-main
	.bargchi-header-cart__label {
		font-size: 14px !important;
	}

}

@media (min-width: 1025px) {

	/* هدر اصلی جمع‌وجورتر */
	body .bargchi-header-main {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	body .bargchi-header-main__container {
		min-height: 52px !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		align-items: center !important;
	}

	/* لوگو کوچک‌تر */
	body .bargchi-header-brand {
		gap: 8px !important;
		align-items: center !important;
	}

	body .bargchi-header-brand__logo {
		width: 34px !important;
		height: 34px !important;
		flex: 0 0 34px !important;
	}

	body .bargchi-header-brand__text strong {
		font-size: 18px !important;
		line-height: 1.1 !important;
	}

	body .bargchi-header-brand__text span,
	body .bargchi-header-brand__text small {
		font-size: 12px !important;
		line-height: 1.2 !important;
	}

	/* باکس جستجو کمی کوچک‌تر */
	body .bargchi-header-search {
		flex: 0 1 560px !important;
		max-width: 560px !important;
		height: 38px !important;
		margin-inline: 18px !important;
		border-radius: 8px !important;
	}

	body .bargchi-header-search__input {
		height: 38px !important;
		font-size: 13px !important;
		padding-inline: 14px !important;
	}

	body .bargchi-header-search__input::placeholder {
		font-size: 13px !important;
	}

	/* آیکن‌های حساب و سبد خرید کوچک‌تر و وسط‌چین */
	body .bargchi-header-actions,
	body .bargchi-header-utility-actions {
		align-items: center !important;
		gap: 6px !important;
	}

	body .bargchi-header-account,
	body .bargchi-header-cart,
	body .bargchi-header-icon-action {
		width: 34px !important;
		min-width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		padding: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
	}

	body .bargchi-header-account svg,
	body .bargchi-header-cart svg,
	body .bargchi-header-icon-action svg {
		width: 18px !important;
		height: 18px !important;
	}

	/* شمارنده سبد خرید */
	body .bargchi-header-cart__count {
		top: -4px !important;
		inset-inline-end: -4px !important;
		font-size: 10px !important;
		min-width: 16px !important;
		height: 16px !important;
		line-height: 16px !important;
	}

}
/*
|--------------------------------------------------------------------------
| BARGCHI MOBILE DRAWER — LOCKED
|--------------------------------------------------------------------------
| Authoritative mobile drawer block.
| Level 1 = parent category
| Level 2 = direct child, 14px / bold
| Level 3+ = final/deeper child, 12px / comfortable vertical rhythm
| No desktop mega-menu rules are changed here.
|--------------------------------------------------------------------------
*/

@media (max-width: 767px) {

	/* Shell: fixed viewport; only the body scrolls. */
	body .bargchi-mobile-drawer-layer {
		height: 100vh !important;
		height: 100dvh !important;
		overflow: hidden !important;
	}

	body .bargchi-mobile-drawer {
		display: flex !important;
		flex-direction: column !important;
		top: 0 !important;
		right: 0 !important;
		bottom: auto !important;
		width: min(88vw, 360px) !important;
		height: 100vh !important;
		height: 100dvh !important;
		max-height: 100vh !important;
		max-height: 100dvh !important;
		overflow: hidden !important;
		overscroll-behavior: contain !important;
		background: #ffffff !important;
		color: #263548 !important;
		direction: rtl !important;
		font-family: "IRANYekan", "IRANYekanX", "IranYekan", Tahoma, sans-serif !important;
		box-shadow: -10px 0 30px rgba(15, 43, 91, 0.12) !important;
	}

	/* Header */
	body .bargchi-mobile-drawer__head {
		position: sticky !important;
		top: 0 !important;
		z-index: 5 !important;
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		flex: 0 0 auto !important;
		min-height: 54px !important;
		padding: 7px 12px !important;
		background: #ffffff !important;
		border-bottom: 1px solid #e8edf2 !important;
	}

	body .bargchi-mobile-drawer__brand {
		display: inline-flex !important;
		align-items: center !important;
		gap: 6px !important;
		min-width: 0 !important;
		margin: 0 !important;
		color: #0f2b5b !important;
		text-decoration: none !important;
	}

	body .bargchi-mobile-drawer__brand img {
		display: block !important;
		flex: 0 0 30px !important;
		width: 30px !important;
		height: 30px !important;
		margin: 0 !important;
		object-fit: contain !important;
	}

	body .bargchi-mobile-drawer__brand span {
		font-size: 15px !important;
		font-weight: 800 !important;
		line-height: 1.35 !important;
	}

	body .bargchi-mobile-drawer button.bargchi-mobile-drawer__close {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		flex: 0 0 34px !important;
		width: 34px !important;
		min-width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		margin: 0 !important;
		padding: 0 !important;
		color: #536276 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 7px !important;
		box-shadow: none !important;
		cursor: pointer !important;
	}

	body .bargchi-mobile-drawer button.bargchi-mobile-drawer__close:active {
		background: #f3f6f9 !important;
		transform: scale(.96) !important;
	}

	body .bargchi-mobile-drawer__close svg {
		display: block !important;
		width: 17px !important;
		height: 17px !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.65 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

	/* Scrollable body */
	body .bargchi-mobile-drawer__body {
		flex: 1 1 auto !important;
		min-height: 0 !important;
		max-height: none !important;
		padding: 4px 12px 18px !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		touch-action: pan-y !important;
		overscroll-behavior-y: contain !important;
		-webkit-overflow-scrolling: touch !important;
		scrollbar-width: thin !important;
		scrollbar-color: #cfd7e2 transparent !important;
	}

	body .bargchi-mobile-drawer__body::-webkit-scrollbar {
		width: 4px !important;
	}

	body .bargchi-mobile-drawer__body::-webkit-scrollbar-thumb {
		background: #cfd7e2 !important;
		border-radius: 999px !important;
	}

	/* Sections */
	body .bargchi-mobile-drawer__section {
		margin: 0 !important;
		padding: 8px 0 4px !important;
	}

	body .bargchi-mobile-drawer__section + .bargchi-mobile-drawer__section {
		margin-top: 5px !important;
		padding-top: 12px !important;
		border-top: 1px solid #edf1f5 !important;
	}

	body .bargchi-mobile-drawer__section h2 {
		margin: 0 0 7px !important;
		padding: 0 !important;
		color: #0f2b5b !important;
		font-size: 14px !important;
		font-weight: 800 !important;
		line-height: 1.7 !important;
		text-align: right !important;
	}

	body .bargchi-mobile-drawer__section ul,
	body .bargchi-mobile-drawer__categories,
	body .bargchi-mobile-drawer__subcategories {
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	body .bargchi-mobile-drawer__section li,
	body .bargchi-mobile-drawer__categories li,
	body .bargchi-mobile-drawer__subcategories li {
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}

	/* Quick links */
	body .bargchi-mobile-drawer__section:not(.bargchi-mobile-drawer__section--categories) li > a {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 8px !important;
		min-height: 38px !important;
		padding: 0 3px !important;
		color: #33445a !important;
		background: transparent !important;
		border-bottom: 1px solid #eef2f5 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		line-height: 1.55 !important;
		text-decoration: none !important;
	}

	body .bargchi-mobile-drawer__section:not(.bargchi-mobile-drawer__section--categories) li:last-child > a {
		border-bottom: 0 !important;
	}

	body .bargchi-mobile-drawer__section:not(.bargchi-mobile-drawer__section--categories) li > a svg {
		flex: 0 0 13px !important;
		width: 13px !important;
		height: 13px !important;
		color: #a5afbc !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.5 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

	/* ================================================================
	   PRODUCT CATEGORIES — true hierarchy
	   ================================================================ */

	body .bargchi-mobile-drawer__category-item {
		border-bottom: 1px solid #edf1f5 !important;
	}

	body .bargchi-mobile-drawer__category-item:last-child {
		border-bottom: 0 !important;
	}

	/* Level 1 row */
	body .bargchi-mobile-drawer__category-row {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 36px !important;
		align-items: center !important;
		gap: 2px !important;
		min-height: 44px !important;
	}

	body .bargchi-mobile-drawer__category-link {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		min-width: 0 !important;
		min-height: 44px !important;
		margin: 0 !important;
		padding: 0 2px !important;
		color: #263548 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		line-height: 2.17 !important;
		text-decoration: none !important;
	}

	body .bargchi-mobile-drawer__category-link:active,
	body .bargchi-mobile-drawer__category-item.is-open > .bargchi-mobile-drawer__category-row .bargchi-mobile-drawer__category-link {
		color: #e97018 !important;
	}

	body .bargchi-mobile-drawer__category-icon {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		flex: 0 0 17px !important;
		width: 17px !important;
		height: 17px !important;
		color: #67778a !important;
	}

	body .bargchi-mobile-drawer__category-item.is-open .bargchi-mobile-drawer__category-icon {
		color: #e97018 !important;
	}

	body .bargchi-mobile-drawer__category-icon svg {
		display: block !important;
		width: 17px !important;
		height: 17px !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.55 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

	body .bargchi-mobile-drawer__category-name {
		min-width: 0 !important;
		white-space: normal !important;
	}

	/* Critical fix: override WoodMart/global button styling. */
	body .bargchi-mobile-drawer button.bargchi-mobile-drawer__category-toggle {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		justify-self: end !important;
		width: 34px !important;
		min-width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		margin: 0 !important;
		padding: 0 !important;
		color: #7f8b9b !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 7px !important;
		box-shadow: none !important;
		font-size: 0 !important;
		line-height: 1 !important;
		cursor: pointer !important;
		appearance: none !important;
		-webkit-appearance: none !important;
	}

	body .bargchi-mobile-drawer button.bargchi-mobile-drawer__category-toggle:active {
		background: #f3f6f9 !important;
	}

	body .bargchi-mobile-drawer button.bargchi-mobile-drawer__category-toggle svg {
		display: block !important;
		width: 15px !important;
		height: 15px !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.65 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
		transition: transform 150ms ease !important;
	}

	body .bargchi-mobile-drawer__category-item.is-open > .bargchi-mobile-drawer__category-row button.bargchi-mobile-drawer__category-toggle {
		color: #e97018 !important;
		background: #fff7f1 !important;
	}

	body .bargchi-mobile-drawer__category-item.is-open > .bargchi-mobile-drawer__category-row button.bargchi-mobile-drawer__category-toggle svg {
		transform: rotate(180deg) !important;
	}

	/* Expanded child area: flat, no cards. */
	body .bargchi-mobile-drawer__subcategories {
		margin: 0 0 5px !important;
		padding: 2px 0 5px !important;
		background: #fbfcfd !important;
		border-right: 2px solid #edf1f5 !important;
	}

	body .bargchi-mobile-drawer__subcategories[hidden] {
		display: none !important;
	}

	body .bargchi-mobile-drawer__subcategory-link {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 8px !important;
		width: 100% !important;
		margin: 0 !important;
		color: #4a596c !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		text-decoration: none !important;
	}

	/* Actual Level 2 (flattened helper depth-0): ALWAYS 14px/bold. */
	body .bargchi-mobile-drawer__subcategory-link.depth-0 {
		min-height: 40px !important;
		padding: 4px 18px 4px 7px !important;
		color: #263548 !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		line-height: 1.65 !important;
	}

	/* Actual Level 3 and deeper: 12px, slightly more vertical air. */
	body .bargchi-mobile-drawer__subcategory-link.depth-1,
	body .bargchi-mobile-drawer__subcategory-link.depth-2,
	body .bargchi-mobile-drawer__subcategory-link.depth-3,
	body .bargchi-mobile-drawer__subcategory-link.depth-4 {
		min-height: 36px !important;
		padding-top: 3px !important;
		padding-bottom: 3px !important;
		font-size: 12px !important;
		font-weight: 500 !important;
		line-height: 1.85 !important;
	}

	body .bargchi-mobile-drawer__subcategory-link.depth-1 { padding-right: 31px !important; padding-left: 7px !important; }
	body .bargchi-mobile-drawer__subcategory-link.depth-2 { padding-right: 42px !important; padding-left: 7px !important; }
	body .bargchi-mobile-drawer__subcategory-link.depth-3,
	body .bargchi-mobile-drawer__subcategory-link.depth-4 { padding-right: 52px !important; padding-left: 7px !important; }

	body .bargchi-mobile-drawer__subcategory-link:active {
		color: #e97018 !important;
		background: #fff8f3 !important;
	}

	body .bargchi-mobile-drawer__subcategory-link svg {
		flex: 0 0 13px !important;
		width: 13px !important;
		height: 13px !important;
		color: #a3adba !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.45 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

	/* Actions — compact and unobtrusive. */
	body .bargchi-mobile-drawer__actions {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 6px !important;
		margin-top: 12px !important;
		padding-top: 12px !important;
		border-top: 1px solid #e7ecf1 !important;
	}

	body .bargchi-mobile-drawer__support,
	body .bargchi-mobile-drawer__wholesale {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		gap: 8px !important;
		min-height: 42px !important;
		padding: 5px 9px !important;
		border-radius: 7px !important;
		box-shadow: none !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		line-height: 1.45 !important;
		text-decoration: none !important;
	}

	body .bargchi-mobile-drawer__support {
		color: #0f2b5b !important;
		background: #f7f9fc !important;
		border: 1px solid #dfe6ed !important;
	}

	body .bargchi-mobile-drawer__wholesale {
		color: #a8521a !important;
		background: #fff8f3 !important;
		border: 1px solid #f0d5c1 !important;
	}

	body .bargchi-mobile-drawer__support small,
	body .bargchi-mobile-drawer__wholesale small {
		color: #7e8b9c !important;
		font-size: 11px !important;
		font-weight: 500 !important;
		line-height: 1.4 !important;
	}

	body .bargchi-mobile-drawer a:focus-visible,
	body .bargchi-mobile-drawer button:focus-visible {
		outline: 2px solid #0f2b5b !important;
		outline-offset: 2px !important;
	}

	body .bargchi-mobile-drawer-layer__backdrop {
		background: rgba(15, 43, 91, .48) !important;
		backdrop-filter: blur(1.5px);
		-webkit-backdrop-filter: blur(1.5px);
	}

	html.bargchi-menu-open,
	html.bargchi-menu-open body {
		overflow: hidden !important;
	}
}

/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media
	(max-width: 767px)
	and
	(prefers-reduced-motion: reduce) {

	body .bargchi-mobile-drawer *,
	body .bargchi-mobile-drawer *::before,
	body .bargchi-mobile-drawer *::after {
		transition: none !important;
	}

}

/*
|--------------------------------------------------------------------------
| BARGCHI DESKTOP NAV + MEGA MENU — LOCKED
|--------------------------------------------------------------------------
| One authoritative final block.
| - Navigation row is deliberately compact.
| - Mega height is fixed and much shorter.
| - Mega width switches between 3-column and 4-column layouts.
| - Internal scrolling handles long category lists; the shell never grows.
|--------------------------------------------------------------------------
*/

@media (min-width: 1025px) {

	/* ======================================================================
	   COMPACT DESKTOP NAVIGATION ROW
	   ====================================================================== */

	body .bargchi-header-main .bargchi-header-nav__container {
		min-height: 42px !important;
		gap: 12px !important;
	}

	body .bargchi-header-main .bargchi-header-categories {
		display: flex !important;
		align-items: center !important;
		align-self: stretch !important;
	}

	body .bargchi-header-main .bargchi-header-categories__trigger {
		height: 36px !important;
		min-height: 36px !important;
		gap: 7px !important;
		padding: 0 11px !important;
		font-size: 13px !important;
		font-weight: 800 !important;
		line-height: 1 !important;
	}

	body .bargchi-header-main .bargchi-header-categories__menu-icon {
		width: 15px !important;
		gap: 2.5px !important;
	}

	body .bargchi-header-main .bargchi-header-categories__menu-icon span {
		width: 15px !important;
		height: 1.4px !important;
	}

	body .bargchi-header-main .bargchi-header-categories__trigger > svg {
		width: 13px !important;
		height: 13px !important;
	}

	body .bargchi-header-main .bargchi-header-nav__links a {
		min-height: 40px !important;
		padding-inline: 8px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		line-height: 1.2 !important;
	}

	body .bargchi-header-main .bargchi-header-nav__links a::after {
		bottom: 0 !important;
		height: 2px !important;
	}

	body .bargchi-header-main .bargchi-header-nav__actions {
		gap: 0 !important;
	}

	body .bargchi-header-main .bargchi-header-nav__action {
		min-height: 32px !important;
		gap: 4px !important;
		padding-inline: 6px !important;
		font-size: 13px !important;
		font-weight: 700 !important;
		line-height: 1.2 !important;
	}

	body .bargchi-header-main .bargchi-header-nav__action svg {
		width: 14px !important;
		height: 14px !important;
	}

	body .bargchi-header-main .bargchi-header-nav__divider {
		height: 15px !important;
		margin-inline: 1px !important;
	}

	/* ======================================================================
	   SMART-WIDTH, SHORT-HEIGHT MEGA MENU
	   ====================================================================== */

	body .bargchi-header-main {
		--bargchi-mega-height: 300px;
		--bargchi-mega-rail-width: 198px;
		--bargchi-mega-promo-width: 182px;
	}

	body .bargchi-header-main .bargchi-header-categories__dropdown {
		position: absolute !important;
		top: 100% !important;
		right: 0 !important;
		left: auto !important;
		z-index: 99980 !important;
		height: var(--bargchi-mega-height) !important;
		max-height: var(--bargchi-mega-height) !important;
		min-width: 0 !important;
		max-width: calc(100vw - 24px) !important;
		margin: 0 !important;
		padding: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
		opacity: 0 !important;
		transform: translateY(2px) !important;
		transform-origin: top right !important;
		background: #ffffff !important;
		border: 1px solid #e5e8ec !important;
		border-top: 0 !important;
		border-radius: 0 0 8px 8px !important;
		box-shadow: 0 10px 24px rgba(15, 43, 91, 0.09) !important;
		overflow: hidden !important;
		transition: width 140ms ease, opacity 110ms ease, transform 110ms ease, visibility 110ms ease !important;
	}

	/* Minimum three columns. */
	body .bargchi-header-main .bargchi-header-categories__dropdown[data-bargchi-columns="3"] {
		width: clamp(900px, 69vw, 960px) !important;
	}

	/* Maximum four columns. */
	body .bargchi-header-main .bargchi-header-categories__dropdown[data-bargchi-columns="4"] {
		width: clamp(1020px, 79vw, 1100px) !important;
	}

	body .bargchi-header-main .bargchi-header-categories:hover > .bargchi-header-categories__dropdown,
	body .bargchi-header-main .bargchi-header-categories:focus-within > .bargchi-header-categories__dropdown {
		visibility: visible !important;
		pointer-events: auto !important;
		opacity: 1 !important;
		transform: translateY(0) !important;
	}

	body .bargchi-header-main .bargchi-header-mega {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) var(--bargchi-mega-rail-width) !important;
		grid-template-areas: "panels rail" !important;
		width: 100% !important;
		height: 100% !important;
		min-width: 0 !important;
		direction: ltr !important;
		background: #ffffff !important;
		font-family: "IRANYekan", "IranYekan", "IRANYekanX", Tahoma, sans-serif !important;
	}

	body .bargchi-header-main .bargchi-header-mega.has-promo {
		grid-template-columns: var(--bargchi-mega-promo-width) minmax(0, 1fr) var(--bargchi-mega-rail-width) !important;
		grid-template-areas: "promo panels rail" !important;
	}

	/* Right parent rail */
	body .bargchi-header-main .bargchi-header-mega__rail {
		grid-area: rail !important;
		height: 100% !important;
		min-height: 0 !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		overscroll-behavior-y: contain !important;
		direction: rtl !important;
		background: #f7f8f9 !important;
		border-left: 1px solid #eceef1 !important;
		scrollbar-gutter: stable !important;
		scrollbar-width: thin !important;
		scrollbar-color: #cfd3d8 transparent !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail::-webkit-scrollbar,
	body .bargchi-header-main .bargchi-header-mega__panel::-webkit-scrollbar {
		width: 6px !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail::-webkit-scrollbar-thumb,
	body .bargchi-header-main .bargchi-header-mega__panel::-webkit-scrollbar-thumb {
		background: #cfd5dc !important;
		border-radius: 999px !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail::-webkit-scrollbar-track,
	body .bargchi-header-main .bargchi-header-mega__panel::-webkit-scrollbar-track {
		background: transparent !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-item {
		position: relative !important;
		display: flex !important;
		align-items: center !important;
		gap: 8px !important;
		min-height: 40px !important;
		padding: 0 12px !important;
		color: #414954 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		line-height: 2.17 !important;
		text-align: right !important;
		text-decoration: none !important;
		white-space: normal !important;
		transition: color 110ms ease, background-color 110ms ease, box-shadow 110ms ease !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-item::after {
		position: absolute !important;
		top: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		width: 2px !important;
		background: #e97018 !important;
		content: "" !important;
		opacity: 0 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-item:hover,
	body .bargchi-header-main .bargchi-header-mega__rail-item.is-active,
	body .bargchi-header-main .bargchi-header-mega__rail-item:focus-visible {
		color: #d85f11 !important;
		background: #ffffff !important;
		box-shadow: inset -2px 0 0 #e97018 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-item:hover::after,
	body .bargchi-header-main .bargchi-header-mega__rail-item.is-active::after {
		opacity: 1 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-icon {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		flex: 0 0 18px !important;
		width: 18px !important;
		height: 18px !important;
		color: #68727e !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-item:hover .bargchi-header-mega__rail-icon,
	body .bargchi-header-main .bargchi-header-mega__rail-item.is-active .bargchi-header-mega__rail-icon {
		color: #e97018 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__rail-icon svg {
		display: block !important;
		width: 16px !important;
		height: 16px !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.55 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
		vector-effect: non-scaling-stroke !important;
	}

	/* Center content */
	body .bargchi-header-main .bargchi-header-mega__panels {
		grid-area: panels !important;
		position: relative !important;
		min-width: 0 !important;
		min-height: 0 !important;
		height: 100% !important;
		direction: rtl !important;
		background: #ffffff !important;
	}

	body .bargchi-header-main .bargchi-header-mega__panel {
		position: absolute !important;
		inset: 0 !important;
		display: none !important;
		height: 100% !important;
		min-height: 0 !important;
		padding: 13px 18px 16px !important;
		overflow-y: auto !important;
		overflow-x: hidden !important;
		overscroll-behavior-y: contain !important;
		background: #ffffff !important;
		scrollbar-gutter: stable !important;
		scrollbar-width: thin !important;
		scrollbar-color: #ccd1d7 transparent !important;
	}

	body .bargchi-header-main .bargchi-header-mega__panel.is-active {
		display: block !important;
	}

	body .bargchi-header-main .bargchi-header-mega__panel-all {
		display: inline-flex !important;
		align-items: center !important;
		gap: 3px !important;
		margin: 0 0 11px !important;
		padding: 0 !important;
		color: #176ea8 !important;
		background: transparent !important;
		border: 0 !important;
		font-size: 11.7px !important;
		font-weight: 700 !important;
		line-height: 1.45 !important;
		text-decoration: none !important;
	}

	body .bargchi-header-main .bargchi-header-mega__panel-all:hover {
		color: #e97018 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__panel-all svg {
		width: 11px !important;
		height: 11px !important;
		fill: none !important;
		stroke: currentColor !important;
		stroke-width: 1.6 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

	body .bargchi-header-main .bargchi-header-mega__groups {
		display: grid !important;
		justify-content: start !important;
		align-items: start !important;
		align-content: start !important;
		direction: rtl !important;
		gap: 11px 18px !important;
	}

	/* Exactly three visual columns for categories with <= 3 first-level groups. */
	body .bargchi-header-main .bargchi-header-categories__dropdown[data-bargchi-columns="3"] .bargchi-header-mega__groups {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}

	/* Exactly four visual columns once a category has 4+ first-level groups. */
	body .bargchi-header-main .bargchi-header-categories__dropdown[data-bargchi-columns="4"] .bargchi-header-mega__groups {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group {
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group-title {
		position: relative !important;
		display: inline-flex !important;
		align-items: center !important;
		gap: 3px !important;
		max-width: 100% !important;
		min-height: 22px !important;
		margin: 0 0 4px !important;
		padding: 0 8px 0 0 !important;
		color: #252a31 !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		line-height: 1.55 !important;
		text-decoration: none !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group-title::before {
		position: absolute !important;
		top: 3px !important;
		right: 0 !important;
		width: 2px !important;
		height: 14px !important;
		background: #e97018 !important;
		border-radius: 2px !important;
		content: "" !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group-title:hover {
		color: #e97018 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group-title svg {
		width: 10px !important;
		height: 10px !important;
		fill: none !important;
		stroke: #707782 !important;
		stroke-width: 1.55 !important;
		stroke-linecap: round !important;
		stroke-linejoin: round !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group ul {
		display: flex !important;
		flex-direction: column !important;
		gap: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group li {
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Level 3 and deeper: final category links are always 12px.
	   Level 2 is handled exclusively by .bargchi-header-mega__group-title above,
	   so a second-level category never drops to the smaller leaf style merely
	   because it has no children. */
	body .bargchi-header-main .bargchi-header-mega__group li.is-level-3-plus > a {
		display: block !important;
		min-height: 27px !important;
		margin: 0 0 2px !important;
		padding: 2px 0 !important;
		color: #7a818b !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		font-size: 12px !important;
		font-weight: 400 !important;
		line-height: 1.85 !important;
		text-decoration: none !important;
		transition: color 100ms ease !important;
	}

	/* Visual depth for level 3+ without changing the typography hierarchy. */
	body .bargchi-header-main .bargchi-header-mega__group li.depth-1 > a {
		padding-right: 9px !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group li.depth-2 > a {
		padding-right: 18px !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group li.depth-3 > a,
	body .bargchi-header-main .bargchi-header-mega__group li.depth-4 > a {
		padding-right: 27px !important;
	}

	body .bargchi-header-main .bargchi-header-mega__group li > a:hover {
		color: #e97018 !important;
	}

	body .bargchi-header-main .bargchi-header-mega a:focus-visible {
		outline: 2px solid #0f2b5b !important;
		outline-offset: 2px !important;
	}

	/* Optional promo */
	body .bargchi-header-main .bargchi-header-mega__promo {
		grid-area: promo !important;
		position: relative !important;
		display: block !important;
		height: 100% !important;
		overflow: hidden !important;
		background: #f6f8fb !important;
		border-left: 1px solid #edf0f3 !important;
		text-decoration: none !important;
	}

	body .bargchi-header-main .bargchi-header-mega__promo img {
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
	}

	body .bargchi-header-main .bargchi-header-mega__promo-copy {
		position: absolute !important;
		right: 10px !important;
		bottom: 10px !important;
		left: 10px !important;
		display: flex !important;
		flex-direction: column !important;
		gap: 2px !important;
		padding: 8px 9px !important;
		direction: rtl !important;
		background: rgba(255, 255, 255, .94) !important;
		border-radius: 6px !important;
		color: #263548 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__promo-copy strong {
		font-size: 12px !important;
		font-weight: 800 !important;
	}

	body .bargchi-header-main .bargchi-header-mega__promo-copy small {
		font-size: 11px !important;
		font-weight: 500 !important;
		color: #748195 !important;
	}
}

/* On the narrowest desktop widths, never let the smart menu escape the viewport. */
@media (min-width: 1025px) and (max-width: 1120px) {
	body .bargchi-header-main .bargchi-header-categories__dropdown[data-bargchi-columns="3"],
	body .bargchi-header-main .bargchi-header-categories__dropdown[data-bargchi-columns="4"] {
		width: calc(100vw - 24px) !important;
	}

	body .bargchi-header-main {
		--bargchi-mega-rail-width: 192px;
	}
}

@media (max-width: 1024px) {
	body .bargchi-header-main .bargchi-header-categories__dropdown {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body .bargchi-header-main .bargchi-header-categories__dropdown,
	body .bargchi-header-main .bargchi-header-mega__rail-item {
		transition: none !important;
	}
}

/* ==========================================================================
   BARGCHI HEADER — DESKTOP EDGE ALIGNMENT WITH 3-HOUR SHIPPING BAR
   ==========================================================================
   هدف:
   لبه راست و چپ سه ردیف هدر در دسکتاپ دقیقاً با نوار «ارسال ۳ ساعته»
   هم‌راستا شود، بدون تغییر موبایل و تبلت.
   ========================================================================== */

@media (min-width: 1025px) {

	body .bargchi-header-topbar__container,
	body .bargchi-header-main .bargchi-header-main__container,
	body .bargchi-header-main .bargchi-header-nav__container {

		width: calc(100% - 16px) !important;
		max-width: 1360px !important;

		margin-right: auto !important;
		margin-left: auto !important;

		box-sizing: border-box !important;
	}


	/*
	 * Top utility bar:
	 * نگذار اولین/آخرین آیتم به‌خاطر padding داخلی دوباره از لبه فاصله بگیرد.
	 */
	body .bargchi-header-topbar__items
	.bargchi-header-topbar__item:first-child {
		padding-right: 4px !important;
	}

	body .bargchi-header-topbar__items
	.bargchi-header-topbar__item:last-child {
		padding-left: 4px !important;
	}


	/*
	 * Navigation:
	 * دسته‌بندی کالاها و اکشن‌های سمت مقابل، نزدیک‌تر به لبه مشترک.
	 * فقط فاصله بیرونی اصلاح می‌شود؛ فاصله بین لینک‌های وسط دست‌نخورده است.
	 */
	body .bargchi-header-main
	.bargchi-header-categories__trigger {
		margin-right: 0 !important;
	}

	body .bargchi-header-main
	.bargchi-header-nav__actions {
		margin-left: 0 !important;
	}


	/*
	 * Main row:
	 * Utility / brand should use the full aligned container rather than
	 * creating an extra visual gutter at the two physical edges.
	 */
	body .bargchi-header-main
	.bargchi-header-brand {
		margin-right: 0 !important;
	}

	body .bargchi-header-main
	.bargchi-header-utility-actions {
		margin-left: 0 !important;
	}
}

/* =========================================================
   BARGCHI HEADER CART — DIGIKALA STYLE
   ========================================================= */

body .bargchi-header-main
.bargchi-header-utility-actions {
    align-items: center !important;
    gap: 10px !important;
}


/* خود دکمه سبد — ساده و بدون کادر */
body .bargchi-header-main
.bargchi-header-cart {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 42px !important;

    width: 42px !important;
    min-width: 42px !important;

    height: 42px !important;
    min-height: 42px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #0f2b5b !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 8px !important;

    box-shadow: none !important;
}


/* هاور خیلی ملایم */
body .bargchi-header-main
.bargchi-header-cart:hover {
    background: #f5f7fa !important;
}


/* خط جداکننده بین حساب و سبد */
body .bargchi-header-main
.bargchi-header-cart::before {
    content: "";

    position: absolute;

    top: 50%;
    right: -6px;

    width: 1px;
    height: 24px;

    background: #dfe4ea;

    transform: translateY(-50%);
}


/* آیکن سبد */
body .bargchi-header-main
.bargchi-header-cart__icon {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 28px !important;
    height: 28px !important;
}


/* SVG سبد */
body .bargchi-header-main
.bargchi-header-cart__icon > svg {
    width: 25px !important;
    height: 25px !important;

    fill: none !important;

    stroke: #0f2b5b !important;
    stroke-width: 1.7 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


/* شمارشگر — شبیه دیجی‌کالا ولی نارنجی برقچی */
body .bargchi-header-main
.bargchi-header-cart__count {
    position: absolute !important;

    top: auto !important;
    right: -6px !important;
    bottom: -5px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 17px !important;
    height: 17px !important;

    padding: 0 4px !important;

    color: #ffffff !important;

    background: #e97018 !important;

    border: 2px solid #ffffff !important;
    border-radius: 5px !important;

    box-shadow: none !important;

    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    z-index: 3 !important;
}


/* سبد خالی */
body .bargchi-header-main
.bargchi-header-cart__count.is-empty {
    display: none !important;
}


/* موبایل */
@media (max-width: 767px) {

    body .bargchi-header-main
    .bargchi-header-utility-actions {
        gap: 8px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart {
        flex-basis: 38px !important;

        width: 38px !important;
        min-width: 38px !important;

        height: 38px !important;
        min-height: 38px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart__icon > svg {
        width: 23px !important;
        height: 23px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart::before {
        right: -5px;

        height: 21px;
    }

    body .bargchi-header-main
    .bargchi-header-cart__count {
        right: -5px !important;
        bottom: -4px !important;

        min-width: 16px !important;
        height: 16px !important;

        padding-inline: 3px !important;

        font-size: 8.5px !important;
    }
}

/* =========================================================
   BARGCHI CART — DIGIKALA-LIKE FINAL
   فقط ظاهر آیکن و شمارشگر
   ========================================================= */

body .bargchi-header-main .bargchi-header-cart {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    min-width: 42px !important;
    height: 40px !important;
    min-height: 40px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;

    color: #0f2b5b !important;
}

/* حالت کلیک / فوکوس؛ دیگر کادر نقطه‌چین نداشته باشد */
body .bargchi-header-main .bargchi-header-cart:focus,
body .bargchi-header-main .bargchi-header-cart:focus-visible,
body .bargchi-header-main .bargchi-header-cart:active {
    background: transparent !important;
    border: 0 !important;
    outline: none !important;
    box-shadow: none !important;
}

/* خود محفظه آیکن */
body .bargchi-header-main .bargchi-header-cart__icon {
    position: relative !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 27px !important;
    height: 27px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}

/* آیکن سبد */
body .bargchi-header-main .bargchi-header-cart__icon > svg {
    display: block !important;

    width: 25px !important;
    height: 25px !important;

    margin: 0 !important;

    fill: none !important;
    stroke: #263447 !important;
    stroke-width: 1.7 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;

    overflow: visible !important;
}

/* Badge دقیقاً روی گوشه پایین آیکن */
body .bargchi-header-main .bargchi-header-cart__count {
    position: absolute !important;

    top: auto !important;
    right: -5px !important;
    bottom: -4px !important;
    left: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 15px !important;
    width: auto !important;
    height: 15px !important;

    padding: 0 3px !important;
    margin: 0 !important;

    color: #ffffff !important;
    background: #e97018 !important;

    border: 1.5px solid #ffffff !important;
    border-radius: 4px !important;

    box-shadow: none !important;

    font-size: 8.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    z-index: 5 !important;
}

/* عدد تک‌رقمی تقریباً مربعی مثل دیجی‌کالا */
body .bargchi-header-main
.bargchi-header-cart__count:not(.is-empty) {
    min-width: 15px !important;
}

/* سبد خالی */
body .bargchi-header-main
.bargchi-header-cart__count.is-empty {
    display: none !important;
}

/* Hover بسیار ملایم؛ بدون باکس */
body .bargchi-header-main .bargchi-header-cart:hover {
    background: transparent !important;
    color: #0f2b5b !important;
}


/* موبایل */
@media (max-width: 767px) {

    body .bargchi-header-main .bargchi-header-cart {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart__icon {
        width: 25px !important;
        height: 25px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart__icon > svg {
        width: 23px !important;
        height: 23px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart__count {
        right: -4px !important;
        bottom: -3px !important;

        min-width: 14px !important;
        height: 14px !important;

        padding: 0 3px !important;

        border-radius: 4px !important;

        font-size: 8px !important;
    }
}
/* =========================================================
   BARGCHI CART — FINAL SIZE TUNING
   ========================================================= */

/* آیکن سبد کمی بزرگ‌تر */
body .bargchi-header-main
.bargchi-header-cart__icon {
    width: 30px !important;
    height: 30px !important;
}

body .bargchi-header-main
.bargchi-header-cart__icon > svg {
    width: 28px !important;
    height: 28px !important;
    stroke-width: 1.65 !important;
}


/* Badge بزرگ‌تر و خواناتر مثل دیجی‌کالا */
body .bargchi-header-main
.bargchi-header-cart__count {
    right: -5px !important;
    bottom: -5px !important;

    min-width: 19px !important;
    height: 19px !important;

    padding: 0 4px !important;

    border: 2px solid #ffffff !important;
    border-radius: 5px !important;

    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}


/* موبایل */
@media (max-width: 767px) {

    body .bargchi-header-main
    .bargchi-header-cart__icon {
        width: 28px !important;
        height: 28px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart__icon > svg {
        width: 26px !important;
        height: 26px !important;
    }

    body .bargchi-header-main
    .bargchi-header-cart__count {
        right: -5px !important;
        bottom: -5px !important;

        min-width: 23px !important;
        height: 23px !important;

        padding: 0 4px !important;

        font-size: 9.5px !important;
        border-radius: 5px !important;
    }
}

/* کمی بزرگ‌تر کردن باکس عدد سبد خرید */
body .bargchi-header-main
.bargchi-header-cart__count {
    min-width: 23px !important;
    height: 23px !important;
    padding: 0 5px !important;
    font-size: 15px !important;
    border-radius: 6px !important;
    right: -10px !important;
    bottom: -10px !important;
}

@media (max-width: 767px) {
    body .bargchi-header-main
    .bargchi-header-cart__count {
        min-width: 19px !important;
        height: 20px !important;
        padding: 0 4px !important;
        font-size: 12px !important;
        border-radius: 6px !important;
        right: -6px !important;
        bottom: -6px !important;
    }
}