.ns-header {
	--nsh-grove: #063d27;
	--nsh-green: #0b6a42;
	--nsh-brand: #087b49;
	--nsh-glass: rgba(255, 255, 255, .12);
	--nsh-glass-line: rgba(255, 255, 255, .2);
	--nsh-glass-hover: rgba(255, 255, 255, .22);
	--nsh-gold: #ffc518;
}

@media (min-width: 769px) {
	.ns-header {
		position: sticky;
		top: 0;
		z-index: 990;
	}
}

.ns-header .ns-header-desktop,
.ns-header .ns-header-mobile {
	background:
		radial-gradient(600px 160px at 50% -60px, rgba(255, 255, 255, .14), transparent 70%),
		linear-gradient(270deg, var(--nsh-brand) 0%, var(--nsh-green) 55%, var(--nsh-grove) 100%) !important;
	border-bottom: 0 !important;
	box-shadow: 0 1px 0 rgba(255, 255, 255, .06) inset, 0 6px 20px -8px rgba(6, 61, 39, .45) !important;
}

.ns-header .ns-header-desktop::after,
.ns-header .ns-header-mobile::after {
	content: "";
	display: block;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(255, 197, 24, .75), transparent);
}

.ns-header .ns-header-row {
	min-height: 72px !important;
	gap: 16px !important;
}

.ns-header .ns-header-desktop .ns-header-control,
.ns-header .ns-header-desktop .ns-search-trigger,
.ns-header .ns-header-desktop #show-sidebar.ns-header-control {
	min-height: 44px;
	height: 44px;
	border: 1px solid var(--nsh-glass-line) !important;
	border-radius: 12px !important;
	background: var(--nsh-glass) !important;
	color: #fff !important;
	box-shadow: none;
	transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}

.ns-header .ns-header-desktop .ns-header-icon,
.ns-header .ns-header-desktop .ns-search-trigger,
.ns-header .ns-header-desktop #show-sidebar.ns-header-control {
	width: 44px;
	padding: 0 !important;
	font-size: 19px;
}

.ns-header .ns-header-desktop .ns-header-control i,
.ns-header .ns-header-desktop .ns-search-trigger svg {
	color: inherit !important;
	stroke: currentColor;
}

.ns-header .ns-header-desktop .ns-header-control:hover,
.ns-header .ns-header-desktop .ns-search-trigger:hover {
	border-color: rgba(255, 255, 255, .35) !important;
	background: var(--nsh-glass-hover) !important;
	color: #fff !important;
}

.ns-header .ns-header-desktop .ns-header-control:active,
.ns-header .ns-header-desktop .ns-search-trigger:active {
	transform: scale(.96);
}

.ns-header .ns-header-desktop .ns-header-account a.ns-header-control {
	padding: 0 18px;
	border-color: transparent !important;
	background: #fff !important;
	color: var(--nsh-brand) !important;
	font-weight: 700;
	box-shadow: 0 4px 12px -4px rgba(0, 0, 0, .25);
}

.ns-header .ns-header-desktop .ns-header-account a.ns-header-control:hover {
	background: #f1faf5 !important;
	color: var(--nsh-grove) !important;
}

.ns-header .ns-header-desktop #dropdownMenuLink2.ns-header-control {
	padding: 0 14px;
	font-weight: 600;
}

.ns-header .ns-header-site-brand {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px !important;
	height: 54px !important;
	border-radius: 16px !important;
	background: #fff !important;
	box-shadow: 0 0 0 4px rgba(255, 255, 255, .12), 0 8px 18px -8px rgba(0, 0, 0, .4);
	transition: transform .2s ease;
}

.ns-header .ns-header-site-brand:hover {
	transform: translateY(-1px);
}

.ns-header .ns-header-site-brand img {
	width: 40px !important;
	height: 40px !important;
	object-fit: contain;
}

.ns-header .ns-header-actions {
	gap: 8px !important;
}

.ns-header .circle-red-basket {
	border-color: var(--nsh-green) !important;
	background: #e11d48 !important;
}

.ns-header button:focus-visible,
.ns-header a:focus-visible {
	outline: 3px solid var(--nsh-gold) !important;
	outline-offset: 2px !important;
}

@media (max-width: 768px) {
	.ns-header .ns-header-mobile {
		padding: 10px 12px !important;
	}

	.ns-header .header_icon {
		width: 44px !important;
		height: 44px !important;
		border: 1px solid var(--nsh-glass-line) !important;
		border-radius: 12px !important;
		background: var(--nsh-glass) !important;
		color: #fff !important;
		font-size: 19px !important;
	}

	.ns-header .ns-header-mobile .ns-search-trigger {
		width: 44px !important;
		height: 44px !important;
		border: 1px solid var(--nsh-glass-line) !important;
		border-radius: 12px !important;
		background: var(--nsh-glass) !important;
		color: #fff !important;
	}

	.ns-header .ns-header-mobile .ns-search-trigger svg {
		stroke: currentColor;
		color: inherit;
	}

	.ns-header .header_icon i,
	.ns-header .header_icon svg {
		color: inherit !important;
	}

	.ns-header .header_icon:hover,
	.ns-header .header_icon:active {
		background: var(--nsh-glass-hover) !important;
		color: #fff !important;
	}
}

.ns-header .ns-header-site-brand {
	width: 64px !important;
	height: 64px !important;
	padding: 3px !important;
	border-radius: 20px !important;
	background: #fff !important;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, .18), 0 0 0 4px rgba(255, 197, 24, .55), 0 10px 22px -10px rgba(0, 0, 0, .5) !important;
	overflow: hidden;
}

.ns-header .ns-header-site-brand img {
	width: 100% !important;
	height: 100% !important;
	border-radius: 17px;
	object-fit: contain;
}

@media (max-width: 768px) {
	.ns-header .ns-header-mobile .ns-header-site-brand {
		display: flex !important;
		width: 58px !important;
		height: 58px !important;
		margin: 0 auto !important;
		border-radius: 18px !important;
	}

	.ns-header .ns-header-mobile .ns-header-site-brand img {
		border-radius: 15px;
	}
}

@media (min-width: 769px) {
	.ns-header .ns-header-desktop .ns-header-row {
		position: relative;
	}

	.ns-header .ns-header-desktop .ns-header-site-brand {
		position: absolute;
		grid-column: 1 / -1;
		grid-row: 1;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	}

	.ns-header .ns-header-desktop .ns-header-site-brand:hover {
		transform: translate(-50%, calc(-50% - 1px));
	}
}

@media (max-width: 768px) {
	.ns-header .ns-search-panel-input,
	.ns-header input[type="text"],
	.ns-header input[type="search"] {
		font-size: 16px !important;
	}

	.ns-header .ns-header-mobile {
		padding: 8px 10px !important;
	}

	.ns-header .ns-header-mobile > form {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 54px;
		height: auto !important;
	}

	.ns-header .ns-header-mobile .ns-header-site-brand {
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 2;
		width: 50px !important;
		height: 50px !important;
		margin: 0 !important;
		padding: 2px !important;
		border-radius: 15px !important;
		transform: translate(-50%, -50%);
	}

	.ns-header .ns-header-mobile .ns-header-site-brand img {
		border-radius: 13px;
	}

	.ns-header .ns-header-mobile .headerPage {
		flex: 1 1 auto;
		flex-wrap: nowrap !important;
		justify-content: flex-start !important;
		align-items: center;
		gap: 6px !important;
		min-height: 54px !important;
	}

	.ns-header .ns-header-mobile .headerPage > .ns-header-brand {
		margin-left: 0 !important;
		gap: 6px !important;
	}

	.ns-header .ns-header-mobile .ns-header-account {
		gap: 6px !important;
	}

	.ns-header .ns-header-mobile .headerPage > button.header_icon {
		margin-right: 0 !important;
	}

	.ns-header .ns-header-mobile .headerPage > .ns-search-trigger {
		margin-right: auto !important;
	}

	.ns-header .ns-header-mobile .header_icon,
	.ns-header .ns-header-mobile .ns-search-trigger,
	.ns-header .ns-header-mobile .onhover-div > .header_icon {
		width: 40px !important;
		height: 40px !important;
		min-width: 40px;
		font-size: 18px !important;
	}

	.ns-header .ns-header-mobile .mobile-club-customer,
	.ns-header .ns-header-mobile .btn-login-popup {
		display: inline-flex !important;
		align-items: center;
	}

	.ns-header .ns-header-mobile .mobile-club-customer img {
		width: 30px !important;
		height: 30px !important;
		object-fit: contain;
	}
}

@media (max-width: 359px) {
	.ns-header .ns-header-mobile .header_icon,
	.ns-header .ns-header-mobile .ns-search-trigger,
	.ns-header .ns-header-mobile .onhover-div > .header_icon {
		width: 36px !important;
		height: 36px !important;
		min-width: 36px;
	}

	.ns-header .ns-header-mobile .ns-header-site-brand {
		width: 44px !important;
		height: 44px !important;
	}
}

.ns-header .ns-header-site-brand,
.ns-header .ns-header-site-brand:hover {
	position: static !important;
	transform: none !important;
	box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .45) !important;
	border-radius: 14px !important;
	padding: 3px !important;
}

.ns-header .ns-header-site-brand img {
	border-radius: 11px !important;
}

@media (min-width: 769px) {
	.ns-header .ns-header-desktop .ns-header-row {
		grid-template-columns: auto auto minmax(0, 1fr) auto !important;
		gap: 14px !important;
	}

	.ns-header .ns-header-desktop .ns-header-site-brand {
		grid-column: 1 !important;
		grid-row: 1 !important;
		width: 54px !important;
		height: 54px !important;
	}

	.ns-header .ns-header-desktop .ns-header-row > .ns-header-brand {
		grid-column: 2 !important;
		grid-row: 1 !important;
	}

	.ns-header .ns-header-desktop .ns-header-search-section {
		grid-column: 3 !important;
	}

	.ns-header .ns-header-desktop .ns-header-actions {
		grid-column: 4 !important;
	}
}

@media (max-width: 768px) {
	.ns-header .ns-header-mobile > form {
		gap: 8px;
	}

	.ns-header .ns-header-mobile .ns-header-site-brand {
		flex: 0 0 46px;
		width: 46px !important;
		height: 46px !important;
		order: -1;
	}
}

@media (max-width: 359px) {
	.ns-header .ns-header-mobile .ns-header-site-brand {
		flex-basis: 40px;
		width: 40px !important;
		height: 40px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ns-header .ns-header-control,
	.ns-header .ns-search-trigger,
	.ns-header .ns-header-site-brand {
		transition: none !important;
	}
}
