/* Menú gooey del encabezado. Solo actúa cuando gooey.js añade .selvo-gooey al menú (escritorio). */
.e-n-menu.selvo-gooey {
	--gooey-bar: var(--e-global-color-vamtam_accent_3, #FEFAE0);
	--gooey-text: var(--e-global-color-vamtam_accent_1, #283618);
	--gooey-active: var(--e-global-color-vamtam_accent_2, #DDA15E);
	--gooey-active-text: var(--e-global-color-vamtam_accent_1, #283618);
}
/* Encabezado transparente del inicio: barra oscura, activo en crema. */
.vamtam-sticky-header--transparent-header .e-n-menu.selvo-gooey {
	--gooey-bar: #3D4A2B;
	--gooey-text: #fff;
	--gooey-active: var(--e-global-color-vamtam_accent_3, #FEFAE0);
}

.e-n-menu.selvo-gooey > .e-n-menu-wrapper > .e-n-menu-heading { gap: 0 !important; }
/* el tema separa los ítems con margen derecho; aquí la separación la pone el resorte (margin-left) */
.e-n-menu.selvo-gooey > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item { margin-right: 0 !important; }

.e-n-menu.selvo-gooey > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title {
	position: relative;
	padding-inline: 20px;
	background-color: var(--gooey-bar) !important;
	/* al dejar de estar activo el color vuelve sin fundido, como en el componente original */
	transition: background-color 0s !important;
}
.e-n-menu.selvo-gooey > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title.selvo-gooey-on {
	background-color: var(--gooey-active) !important;
	transition: background-color .4s ease !important;
}

.e-n-menu.selvo-gooey .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title,
.e-n-menu.selvo-gooey .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title :is(a, span, button, i) {
	color: var(--gooey-text) !important;
	fill: var(--gooey-text) !important;
	transition: color 0s !important;
}
.e-n-menu.selvo-gooey .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title.selvo-gooey-on,
.e-n-menu.selvo-gooey .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title.selvo-gooey-on :is(a, span, button, i) {
	color: var(--gooey-active-text) !important;
	fill: var(--gooey-active-text) !important;
	transition: color .4s ease !important;
}

.selvo-gooey-neck {
	position: absolute;
	top: 0;
	right: 100%;
	height: 100%;
	pointer-events: none;
	overflow: visible;
}
.selvo-gooey-neck stop { stop-color: var(--gooey-bar); transition: stop-color 0s; }
.selvo-gooey-neck stop.is-on { stop-color: var(--gooey-active); transition: stop-color .4s ease; }