/**
 * Mochabun Menu Auto Contrast
 *
 * The JavaScript controller writes --mac-foreground and data-mac-tone on
 * semantic header groups. These rules intentionally beat Elementor and theme
 * colors without changing the search overlay itself.
 */

[data-elementor-type="header"].elementor-location-header.mac-auto-contrast {
	--mac-overlay-offset: 0px;
	--mac-sticky-top: 0px;
	margin-bottom: var(--mac-overlay-offset);
	position: relative;
	transition: background-color .2s ease, box-shadow .2s ease;
	z-index: 99990;
}

[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky {
	background: #fff !important;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
	isolation: isolate;
	left: 0;
	margin-bottom: 0;
	position: fixed;
	right: 0;
	top: var(--mac-sticky-top);
	width: 100%;
}

/*
 * Elementor may paint the visible header through an inner section/container
 * while the template wrapper itself stays transparent. Paint both levels so
 * the hero can never show through the sticky menu.
 */
[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky::before {
	background: #fff;
	content: "";
	inset: 0;
	pointer-events: none;
	position: absolute;
	z-index: -1;
}

[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky > .elementor-element,
[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky > .e-con,
[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky > .elementor-section,
[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky > .elementor-section-wrap > .elementor-section,
[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky > .elementor > .elementor-element,
[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky > .elementor > .e-con {
	background: #fff !important;
	background-image: none !important;
}

[data-elementor-type="header"].elementor-location-header.mac-auto-contrast.mac-is-sticky [data-mac-group][data-mac-tone] {
	--mac-foreground: #000;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone="light"] {
	--mac-foreground: #000;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone="dark"] {
	--mac-foreground: #fff;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item.elementor-item-active,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-widget-button .elementor-button,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-menu-toggle {
	color: var(--mac-foreground) !important;
	fill: var(--mac-foreground) !important;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item svg,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item svg path,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger svg,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger svg path,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-widget-button .elementor-button svg,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-widget-button .elementor-button svg path,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-menu-toggle svg,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-menu-toggle svg path {
	color: inherit !important;
	fill: currentColor !important;
	stroke: currentColor;
}

/*
 * The Search icon is an outline. Keep its centre transparent even when the
 * generic header icon rules above apply the current foreground color.
 */
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger .msg-search-trigger__icon,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger .msg-search-trigger__icon circle,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger .msg-search-trigger__icon path {
	fill: none !important;
	stroke: currentColor !important;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-widget-button .elementor-button,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-menu-toggle,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] svg,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] svg path {
	transition: color .22s ease, fill .22s ease, stroke .22s ease;
}

/* Preserve Mochabun's accepted brand interaction color. */
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item:hover,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-nav-menu--main .elementor-item:focus,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger:hover,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger:focus,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button.msg-search-trigger.msg-search-trigger:focus-visible,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-widget-button .elementor-button:hover,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-widget-button .elementor-button:focus,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-menu-toggle:hover,
[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-menu-toggle:focus {
	color: #bf7950 !important;
	fill: #bf7950 !important;
}

/* The mobile dropdown owns a white panel and must not inherit the hero tone. */
[data-elementor-type="header"].elementor-location-header [data-mac-group="navigation"] .elementor-nav-menu--dropdown {
	background-color: #fff;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group="navigation"] .elementor-nav-menu--dropdown .elementor-item,
[data-elementor-type="header"].elementor-location-header [data-mac-group="navigation"] .elementor-nav-menu--dropdown .elementor-item.elementor-item-active {
	color: #000 !important;
	fill: #000 !important;
}

[data-elementor-type="header"].elementor-location-header [data-mac-group="navigation"] .elementor-nav-menu--dropdown .elementor-item:hover,
[data-elementor-type="header"].elementor-location-header [data-mac-group="navigation"] .elementor-nav-menu--dropdown .elementor-item:focus {
	color: #bf7950 !important;
	fill: #bf7950 !important;
}

@media (prefers-reduced-motion: reduce) {
	[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-item,
	[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] button,
	[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] .elementor-button,
	[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] svg,
	[data-elementor-type="header"].elementor-location-header [data-mac-group][data-mac-tone] svg path {
		transition: none !important;
	}
}
