/**
 * Mahis Commerce header.
 */

.mc-header {
	--mc-header-border-width: 1px;
	--mc-header-focus-width: 2px;
	--mc-header-focus-offset: 2px;

	color: var(--mc-header-text, var(--mc-color-text-primary));
	font-size: var(--mc-font-size-sm);
	line-height: var(--mc-line-height-control);
	background: var(--mc-header-background, var(--mc-color-surface));
	border-block-end: var(--mc-header-border-width) solid var(--mc-color-border);
}

.mc-header--sticky {
	position: sticky;
	z-index: 900;
	inset-block-start: 0;
}

.mc-header__topbar {
	padding: var(--mc-space-xs) var(--mc-container-padding-mobile);
	color: var(--mc-header-topbar-text, inherit);
	text-align: center;
	background: var(--mc-header-topbar-background, var(--mc-color-primary));
}

.mc-header__topbar a { color: inherit; }

.mc-header__secondary { display: none; border-block-start: 1px solid var(--mc-color-border); }
.mc-header__secondary-inner { width: 100%; max-width: var(--mc-container-width); margin-inline: auto; padding-inline: var(--mc-container-padding-desktop); }
.mc-header__secondary-inner, .mc-header__secondary-extras, .mc-header__secondary-menu > ul, .mc-header__socials { align-items: center; }
.mc-header__secondary-inner { display: flex; gap: var(--mc-space-lg); justify-content: space-between; min-height: 2.75rem; }
.mc-header__secondary-menu > ul, .mc-header__socials, .mc-header__secondary-extras { display: flex; gap: var(--mc-space-md); }
.mc-header__secondary-menu li { position: relative; }
.mc-header__secondary-menu a { display: block; padding-block: var(--mc-space-sm); }
.mc-header__secondary-menu .menu-item-has-children > a,
.mc-header-builder__menu .menu-item-has-children > a { display: inline-flex; gap: .45rem; align-items: center; }
.mc-header__secondary-menu .menu-item-has-children > a::after,
.mc-header-builder__menu .menu-item-has-children > a::after { width: .42rem; height: .42rem; border-right: 2px solid #111; border-bottom: 2px solid #111; content: ""; flex: 0 0 auto; transform: rotate(45deg) translateY(-.12rem); }
.mc-header__secondary-menu .sub-menu .menu-item-has-children > a::after,
.mc-header-builder__menu .sub-menu .menu-item-has-children > a::after { margin-inline-start: auto; transform: rotate(45deg) translateY(-.12rem); }
.mc-header__secondary-menu .sub-menu { position: absolute; z-index: 20; inset-block-start: 100%; inset-inline-start: 0; display: none; min-width: 12rem; padding: var(--mc-space-sm); background: var(--mc-header-background, var(--mc-color-surface)); border: 1px solid var(--mc-color-border); border-radius: var(--mc-radius-card); box-shadow: var(--mc-shadow-small); }
.mc-header__secondary-menu li:hover > .sub-menu, .mc-header__secondary-menu li:focus-within > .sub-menu { display: block; }
.mc-header__phone { display: inline-flex; gap: var(--mc-space-xs); align-items: center; white-space: nowrap; }
.mc-header__phone svg, .mc-header__socials svg { width: 1.25rem; height: 1.25rem; }
.mc-header__socials { margin: 0; }
.mc-header__socials a { display: grid; place-items: center; }
.mc-header__mobile-action:has(.mc-header__mobile-action-label) { width: auto; padding-inline: var(--mc-space-sm); }

.mc-header-builder__row { border-block-end: 1px solid var(--mc-color-border); }
.mc-header-builder__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--mc-space-md); align-items: center; width: 100%; max-width: var(--mc-container-width); min-height: var(--mc-header-mobile-height, 4rem); padding: var(--mc-space-sm) var(--mc-container-padding-mobile); margin-inline: auto; }
.mc-header-builder__column { display: flex; grid-column: span var(--mc-header-column-span); gap: var(--mc-space-sm); align-items: center; min-width: 0; }
.mc-header-builder__column.is-center { justify-content: center; }.mc-header-builder__column.is-end { justify-content: flex-end; }
.mc-header-builder__logo img { display: block; width: auto; max-width: var(--mc-header-mobile-logo-width, 7rem); max-height: 3rem; }
.mc-header-builder__site-name { font-weight: var(--mc-font-weight-bold); white-space: nowrap; }
.mc-header-builder__search { flex: 1; min-width: 10rem; }.mc-header-builder__search form { display: flex; margin: 0; }.mc-header-builder__search label { flex: 1; }.mc-header-builder__search input[type="search"] { width: 100%; }
.mc-header-builder__spacer { flex: 1; }
.mc-header-builder__element { position: relative; display: inline-flex; gap: var(--mc-space-xs); align-items: center; justify-content: center; padding: var(--mc-button-padding-block) var(--mc-button-padding-inline); color: var(--mc-element-color, inherit); background: var(--mc-element-bg, transparent); border: 1px solid var(--mc-color-border); border-radius: var(--mc-element-radius, var(--mc-radius-button)); white-space: nowrap; }
.mc-header-builder__element svg, .mc-header-builder__socials svg { width: 1.25rem; height: 1.25rem; }.mc-header-builder__element b { position: absolute; inset-block-start: -.45rem; inset-inline-end: -.45rem; min-width: 1.2rem; padding: .1rem; text-align: center; background: var(--mc-color-primary); border-radius: 999px; }
.mc-header-builder__socials { display: inline-flex; gap: var(--mc-space-sm); }.mc-header-builder__socials a { display: grid; place-items: center; }
.mc-header-builder__menu > ul { display: flex; gap: var(--mc-space-md); }.mc-header-builder__menu li { position: relative; }.mc-header-builder__menu .sub-menu { position: absolute; z-index: 30; inset-block-start: 100%; inset-inline-start: 0; display: none; min-width: 12rem; padding: var(--mc-space-sm); background: var(--mc-header-background, var(--mc-color-surface)); border: 1px solid var(--mc-color-border); }.mc-header-builder__menu li:hover > .sub-menu, .mc-header-builder__menu li:focus-within > .sub-menu { display: block; }
@media (min-width:64rem) { .mc-header-builder__inner { min-height: var(--mc-header-desktop-height, 5rem); padding-inline: var(--mc-container-padding-desktop); }.mc-header-builder__logo img { max-width: var(--mc-header-desktop-logo-width, 9rem); } }
@media (max-width:63.999rem) { .mc-header-builder__column { grid-column: 1 / -1; justify-content: center; flex-wrap: wrap; }.mc-header-builder__menu > ul { flex-wrap: wrap; justify-content: center; } }

.mc-header a {
	color: inherit;
	text-decoration: none;
}

.mc-header ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

.mc-header a:focus-visible,
.mc-header button:focus-visible,
.mc-header input:focus-visible {
	outline: var(--mc-header-focus-width) solid var(--mc-color-primary);
	outline-offset: var(--mc-header-focus-offset);
}

.mc-header__desktop {
	display: none;
}

.mc-header__mobile {
	display: block;
}

.mc-header__main-row,
.mc-header__mobile-row,
.mc-header__mobile-search {
	width: 100%;
	max-width: var(--mc-container-width);
	margin-inline: auto;
	padding-inline: var(--mc-container-padding-mobile);
}

.mc-header__mobile-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	gap: var(--mc-space-md);
	align-items: center;
	min-height: var(--mc-header-mobile-height, 4rem);
}

.mc-header__logo {
	min-width: 0;
	font-size: var(--mc-font-size-lg);
	font-weight: var(--mc-font-weight-bold);
	text-align: center;
}

.mc-header__brand {
	display: inline-flex;
	max-width: 100%;
	gap: var(--mc-space-sm);
	align-items: center;
	justify-content: center;
}

.mc-header__brand-image {
	display: inline-flex;
	flex: none;
}

.mc-header__logo img {
	display: block;
	width: auto;
	max-width: var(--mc-header-mobile-logo-width, 7rem);
	max-height: 2.5rem;
	height: auto;
	margin-inline: auto;
}

.mc-header__site-name {
	min-width: 0;
	overflow: hidden;
	font-size: var(--mc-font-size-sm);
	font-weight: var(--mc-font-weight-bold);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mc-header__menu-toggle,
.mc-header__mobile-action,
.mc-header__action-link {
	position: relative;
	display: inline-flex;
	gap: var(--mc-space-xs);
	align-items: center;
	justify-content: center;
	min-height: calc((var(--mc-button-padding-block) * 2) + 1.5rem);
	padding: var(--mc-button-padding-block) var(--mc-button-padding-inline);
	font: inherit;
	font-weight: var(--mc-button-font-weight);
	background: transparent;
	border: var(--mc-header-border-width) solid var(--mc-color-border);
	border-radius: var(--mc-radius-button);
	transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.mc-header__menu-toggle,
.mc-header__mobile-action {
	width: calc((var(--mc-button-padding-block) * 2) + 1.5rem);
	height: calc((var(--mc-button-padding-block) * 2) + 1.5rem);
	min-height: 0;
	padding: 0;
}

.mc-header__action-icon {
	width: 1.35rem;
	height: 1.35rem;
	flex: none;
}

.mc-header__action--account .mc-header__action-icon,
.mc-header__mobile-action--account,
.mc-header__menu-toggle {
	color: var(--mc-color-primary);
}

.mc-header__action--cart .mc-header__action-link,
.mc-header__mobile-action--cart {
	color: var(--mc-color-button-text);
	background: var(--mc-color-primary);
	border-color: var(--mc-color-primary);
}

.mc-header__action-link,
.mc-header__mobile-action--account,
.mc-header__mobile-action--cart {
	border-radius: var(--mc-header-action-radius, var(--mc-radius-button));
}

/* Icon-only actions keep equal dimensions, so a large radius creates a true circle. */
.mc-header__action-link.is-icon-only,
.mc-header__mobile-action.is-icon-only {
	width: calc((var(--mc-button-padding-block) * 2) + 1.5rem);
	height: calc((var(--mc-button-padding-block) * 2) + 1.5rem);
	min-height: 0;
	padding: 0;
}

.mc-header__action--cart .mc-header__action-link.is-icon-only .mc-header__cart-count,
.mc-header__mobile-action--cart.is-icon-only .mc-header__cart-count {
	position: absolute;
	inset-block-start: -0.35rem;
	inset-inline-end: -0.35rem;
	min-width: 1.25rem;
	min-height: 1.25rem;
	padding-inline: 0.2rem;
}

.mc-header__action--cart .mc-header__action-link:hover,
.mc-header__mobile-action--cart:hover,
.mc-header__search button:hover,
.mc-header__search input[type="submit"]:hover,
.mc-header__mobile-search button:hover,
.mc-header__mobile-search input[type="submit"]:hover {
	color: var(--mc-color-button-text);
	background: var(--mc-color-primary-hover);
	border-color: var(--mc-color-primary-hover);
}

.mc-header__mobile-actions ul {
	display: flex;
	gap: var(--mc-space-xs);
	align-items: center;
}

.mc-header__mobile-search {
	padding-block-end: var(--mc-space-md);
}

.mc-header__mobile-search[hidden] { display: none; }
.mc-header__mobile-action--search { color: var(--mc-color-primary); cursor: pointer; }
.mc-header__mobile-action--search.is-active { color: var(--mc-color-button-text); background: var(--mc-color-primary); border-color: var(--mc-color-primary); }

.mc-header__search form,
.mc-header__mobile-search form {
	display: flex;
	width: 100%;
	margin: 0;
}

.mc-header__search form > label,
.mc-header__mobile-search form > label {
	display: flex;
	flex: 1;
	min-width: 0;
}

.mc-header__search input[type="search"],
.mc-header__mobile-search input[type="search"] {
	flex: 1;
	width: 100%;
	min-width: 0;
	padding: var(--mc-space-sm) var(--mc-space-md);
	font: inherit;
	color: var(--mc-color-text-primary);
	background: var(--mc-color-background);
	border: var(--mc-header-border-width) solid var(--mc-color-border);
	border-start-start-radius: var(--mc-radius-button);
	border-start-end-radius: 0;
	border-end-start-radius: var(--mc-radius-button);
	border-end-end-radius: 0;
}

.mc-header__search button,
.mc-header__search input[type="submit"],
.mc-header__mobile-search button,
.mc-header__mobile-search input[type="submit"] {
	padding: var(--mc-space-sm) var(--mc-space-md);
	font: inherit;
	color: var(--mc-color-button-text);
	font-weight: var(--mc-button-font-weight);
	background: var(--mc-color-primary);
	border: var(--mc-header-border-width) solid var(--mc-color-primary);
	border-start-start-radius: 0;
	border-start-end-radius: var(--mc-radius-button);
	border-end-start-radius: 0;
	border-end-end-radius: var(--mc-radius-button);
	transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.mc-header__cart-count {
	display: inline-grid;
	place-items: center;
	min-width: 1.5rem;
	min-height: 1.5rem;
	padding-inline: var(--mc-space-xs);
	font-size: var(--mc-font-size-xs);
	color: var(--mc-color-button-text);
	background: var(--mc-color-primary);
	border-radius: var(--mc-radius-full);
}

.mc-header__cart-count[hidden] {
	display: none;
}

.mc-header__action--cart .mc-header__cart-count,
.mc-header__mobile-action--cart .mc-header__cart-count {
	color: var(--mc-color-primary);
	background: var(--mc-color-button-text);
}

.mc-header__mobile-action--cart .mc-header__cart-count {
	position: absolute;
	inset-block-start: calc(var(--mc-space-xs) * -1);
	inset-inline-end: calc(var(--mc-space-xs) * -1);
	min-width: 1.25rem;
	min-height: 1.25rem;
}

.mc-header-drawer-layer[hidden] {
	display: none;
}

body.mc-mobile-menu-open {
	overflow: hidden;
}
body.mc-general-menu-open { overflow: hidden; }

.mc-header-drawer-layer,
.mc-header-drawer__overlay,
.mc-header-drawer {
	position: fixed;
	inset-block: 0;
}

.mc-header-drawer-layer {
	inset-inline: 0;
	z-index: 1000;
}

.mc-header-drawer__overlay {
	inset-inline: 0;
	background: rgb(17 24 39 / 38%);
	opacity: 0;
	transition: opacity 300ms ease;
}

.mc-header-drawer {
	inset-inline-start: 0;
	inset-inline-end: auto;
	z-index: 1;
	display: flex;
	flex-direction: column;
	width: min(86vw, 22rem);
	max-width: 100%;
	overflow: hidden;
	color: var(--mc-color-text-primary);
	text-align: right;
	background: var(--mc-color-surface);
	box-shadow: var(--mc-shadow-large);
	transform: translateX(100%);
	transition: transform 300ms ease;
}

.mc-header-drawer-layer.is-open .mc-header-drawer__overlay {
	opacity: 1;
}

.mc-header-drawer-layer.is-open .mc-header-drawer {
	transform: translateX(0);
}

.mc-header-drawer__header {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: space-between;
	min-height: 4rem;
	padding: var(--mc-space-md);
	border-block-end: 1px solid var(--mc-color-border);
}

.mc-header-drawer__header h2 {
	margin: 0;
	font-size: var(--mc-mobile-font-size-section-title);
	font-weight: var(--mc-font-weight-bold);
	line-height: 1.5;
}

.mc-header-drawer__close {
	display: inline-grid;
	flex: none;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	color: var(--mc-color-text-primary);
	background: transparent;
	border: 1px solid var(--mc-color-border);
	border-radius: var(--mc-radius-button);
	cursor: pointer;
}

.mc-header-drawer__close svg,
.mc-header-drawer__chevron {
	width: 1.25rem;
	height: 1.25rem;
}

.mc-header-drawer__navigation {
	min-height: 0;
	padding: var(--mc-space-sm) var(--mc-space-md) var(--mc-space-xl);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.mc-header-drawer__category-browser { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); min-height: 24rem; }
.mc-header-drawer__category-tabs { padding-inline-end: var(--mc-space-xs); border-inline-end: 1px solid var(--mc-color-border); }
.mc-header-drawer__category-tabs button { display: grid; width: 100%; min-height: 4.5rem; padding: var(--mc-space-xs); place-items: center; gap: .2rem; color: var(--mc-color-text-secondary); font: inherit; font-size: var(--mc-font-size-xs); text-align: center; background: transparent; border: 0; border-radius: var(--mc-radius-small); }
.mc-header-drawer__category-tabs button.is-active { color: var(--mc-color-primary); font-weight: 700; background: color-mix(in srgb, var(--mc-color-primary) 9%, transparent); }
.mc-header-drawer__category-tabs .mc-header-drawer__category-media { width: 2.25rem; height: 2.25rem; }
.mc-header-drawer__category-panels { min-width: 0; padding-inline-start: var(--mc-space-md); }
.mc-header-drawer__category-panels section[hidden] { display: none; }
.mc-header-drawer__all-category { color: var(--mc-color-primary); font-weight: 700; }
.mc-header-drawer__children, .mc-header-drawer__utilities { margin: 0; padding: 0; list-style: none; }
.mc-header-drawer__children .mc-header-drawer__children { padding-inline-start: var(--mc-space-md); }
.mc-header-drawer__children a, .mc-header-drawer__children button { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; width: 100%; min-height: 2.8rem; padding: var(--mc-space-xs) 0; color: inherit; font: inherit; font-size: var(--mc-font-size-sm); font-weight: 500; text-align: start; text-decoration: none; background: transparent; border: 0; }
.mc-header-drawer__children svg { width: 1rem; height: 1rem; }
.mc-header-drawer__children li > .mc-header-drawer__children { display: none; }
.mc-header-drawer__children li.is-expanded > .mc-header-drawer__children { display: block; }
.mc-header-drawer__children button svg { transition: transform 160ms ease; }
.mc-header-drawer__children li.is-expanded > button svg { transform: rotate(-90deg); }
.mc-header-drawer__utilities { margin-block-start: var(--mc-space-md); border-block-start: 1px solid var(--mc-color-border); }
.mc-header-general-drawer__navigation { min-height: 0; padding: var(--mc-space-md); overflow-y: auto; }
.mc-header-general-drawer__navigation ul { margin: 0; padding: 0; list-style: none; }
.mc-header-general-drawer__navigation li + li { border-block-start: 1px solid var(--mc-color-border); }
.mc-header-general-drawer__navigation a { display: flex; align-items: center; min-height: 3.6rem; padding: var(--mc-space-sm); color: inherit; font-weight: 600; text-decoration: none; }
.mc-header-general-drawer__navigation a:hover, .mc-header-general-drawer__navigation a:focus-visible { color: var(--mc-color-primary); background: color-mix(in srgb, var(--mc-color-primary) 7%, transparent); }
.mc-header-general-drawer__navigation .sub-menu { display: none; padding-inline-start: var(--mc-space-md); border-inline-start: 2px solid color-mix(in srgb, var(--mc-color-primary) 24%, transparent); }
.mc-header-general-drawer__navigation .menu-item-has-children.is-submenu-open > .sub-menu { display: block; }
.mc-header-general-drawer__navigation .menu-item-has-children > a::after { width: .45rem; height: .45rem; margin-inline-start: auto; border-right: 2px solid #111; border-bottom: 2px solid #111; content: ""; flex: 0 0 auto; transform: rotate(45deg); }
.mc-header-general-drawer__contact { display: flex; align-items: center; justify-content: space-between; margin-block-start: auto; padding: var(--mc-space-md); border-block-start: 1px solid var(--mc-color-border); font-weight: 700; }
.mc-header-general-drawer__contact a { display: grid; width: 2.75rem; height: 2.75rem; color: var(--mc-color-button-text); background: var(--mc-color-primary); border-radius: 50%; place-items: center; }
.mc-header-general-drawer__contact svg { width: 1.65rem; height: 1.65rem; }
.mc-header-general-drawer__contact .mc-bale-logo { width: 2.4rem; height: 2.4rem; }

.mc-header-drawer__navigation li + li {
	border-block-start: 1px solid var(--mc-color-border);
}

.mc-header-drawer__navigation a {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--mc-space-sm);
	align-items: center;
	min-height: 3.5rem;
	padding-block: var(--mc-space-sm);
	font-size: var(--mc-mobile-font-size-body);
	font-weight: var(--mc-font-weight-semibold);
}

.mc-header-drawer__navigation a.has-thumbnail {
	grid-template-columns: auto minmax(0, 1fr) auto;
}

.mc-header-drawer__navigation a:hover,
.mc-header-drawer__navigation a:focus-visible {
	color: var(--mc-color-primary);
	background: color-mix(in srgb, var(--mc-color-primary) 7%, transparent);
}

.mc-header-drawer__category-media {
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	overflow: hidden;
	border-radius: var(--mc-radius-small);
	background: var(--mc-color-background);
}

.mc-header-drawer__category-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.mc-header-drawer__category-name {
	min-width: 0;
}

.mc-header-drawer__chevron {
	color: var(--mc-color-text-secondary);
}

.mc-header__topbar {
	padding: var(--mc-space-sm) var(--mc-container-padding-mobile);
	font-size: var(--mc-font-size-sm);
	color: var(--mc-header-topbar-text, var(--mc-color-text-secondary));
	text-align: center;
	background: var(--mc-header-topbar-background, var(--mc-color-background));
}

@media (max-width: 47.999rem) {
	.mc-header {
		font-size: var(--mc-mobile-font-size-body);
		line-height: var(--mc-mobile-line-height-control);
	}

	.mc-header__logo {
		font-size: var(--mc-mobile-font-size-section-title);
	}

	.mc-header__site-name {
		font-size: var(--mc-mobile-font-size-card-title);
	}

	.mc-header__cart-count {
		font-size: var(--mc-mobile-font-size-xs);
	}

	.mc-header__topbar {
		font-size: var(--mc-mobile-font-size-sm);
	}
}

@media (min-width: 64rem) {
	.mc-header__secondary { display: block; }
	.mc-header__desktop {
		display: block;
	}

	.mc-header__mobile {
		display: none;
	}

	.mc-header__main-row {
		display: grid;
		/* Equal side tracks keep the search field on the true page center. */
		grid-template-columns: minmax(0, 1fr) minmax(20rem, 2fr) minmax(0, 1fr);
		gap: var(--mc-space-xl);
		align-items: center;
		min-height: var(--mc-header-desktop-height, 5rem);
		padding-inline: var(--mc-container-padding-desktop);
	}

	.mc-header__desktop.has-no-search .mc-header__main-row {
		grid-template-columns: minmax(10rem, 1fr) auto;
	}

	.mc-header__logo {
		justify-self: start;
		text-align: start;
	}

	.mc-header__search {
		width: 100%;
		min-width: 0;
	}

	.mc-header__actions {
		justify-self: end;
	}

	.mc-header__brand {
		justify-content: flex-start;
	}

	.mc-header__logo img {
		max-width: var(--mc-header-desktop-logo-width, 9rem);
		max-height: 3rem;
	}

	.mc-header__site-name {
		font-size: var(--mc-font-size-lg);
	}

	.mc-header__actions ul {
		display: flex;
		gap: var(--mc-space-sm);
		align-items: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mc-header__menu-toggle,
	.mc-header__mobile-action,
	.mc-header__action-link,
	.mc-header__search button,
	.mc-header__search input[type="submit"],
	.mc-header__mobile-search button,
	.mc-header__mobile-search input[type="submit"] {
		transition: none;
	}

	.mc-header-drawer,
	.mc-header-drawer__overlay {
		transition: none;
	}
}