https://tecidoskite.com.br/wp-content/themes/tecidoskite/assets/js…?ver=e7e10faf67b54c017dd06f033c6fbca0

1( function () {
2	'use strict';
3
4	const header      = document.querySelector( '.header' );
5	const hamburger   = document.querySelector( '.header__hamburger' );
6	const mobilePanel = document.querySelector( '.header__mobile-panel' );
7	const overlay     = document.querySelector( '.header__overlay' );
8	const mobileClose = document.querySelector( '.header__mobile-close' );
9	const body        = document.body;
10
11	if ( ! header ) return;
12
13	// ─── Topo Colorido: header claro quando fundo for claro ───────
14	const warmHero = document.querySelector( '.page-hero--warm' );
15	if ( warmHero ) {
16		const lightBgClasses = [
17			'has-warm-surface-background-color',
18			'has-background-background-color',
19			'has-white-background-color',
20			'has-neutral-50-background-color',
21			'has-primary-50-background-color',
22		];
23		if ( lightBgClasses.some( cls => warmHero.classList.contains( cls ) ) ) {
24			header.classList.add( 'header--light' );
25		}
26	}
27
28	// ─── Scroll detection ────────────────────────────────────────
29	function onScroll() {
30		if ( window.scrollY > 50 ) {
31			header.classList.add( 'header--scrolled' );
32		} else {
33			header.classList.remove( 'header--scrolled' );
34		}
35	}
36
37	window.addEventListener( 'scroll', onScroll, { passive: true } );
38	onScroll(); // estado inicial
39
40	// ─── Mobile menu ─────────────────────────────────────────────
41	function openMobileMenu() {
42		mobilePanel.classList.add( 'is-open' );
43		overlay.classList.add( 'is-open' );
44		mobilePanel.setAttribute( 'aria-hidden', 'false' );
45		hamburger.setAttribute( 'aria-expanded', 'true' );
46		body.style.overflow = 'hidden';
47		mobileClose && mobileClose.focus();
48	}
49
50	function closeMobileMenu() {
51		mobilePanel.classList.remove( 'is-open' );
52		overlay.classList.remove( 'is-open' );
53		mobilePanel.setAttribute( 'aria-hidden', 'true' );
54		hamburger.setAttribute( 'aria-expanded', 'false' );
55		body.style.overflow = '';
56		hamburger && hamburger.focus();
57	}
58
59	hamburger  && hamburger.addEventListener( 'click', openMobileMenu );
60	mobileClose && mobileClose.addEventListener( 'click', closeMobileMenu );
61	overlay    && overlay.addEventListener( 'click', closeMobileMenu );
62
63	// ─── Mobile accordion ────────────────────────────────────────
64	document.querySelectorAll( '.header__mobile-link--parent' ).forEach( function ( btn ) {
65		btn.addEventListener( 'click', function () {
66			const item    = btn.closest( '.header__mobile-item--has-children' );
67			const isOpen  = item.dataset.open === 'true';
68			const submenu = item.querySelector( '.header__mobile-submenu' );
69
70			item.dataset.open = isOpen ? 'false' : 'true';
71			btn.setAttribute( 'aria-expanded', String( ! isOpen ) );
72
73			if ( submenu ) {
74				submenu.hidden = isOpen;
75			}
76		} );
77
78		// Fechar por padrão
79		const submenu = btn.closest( '.header__mobile-item--has-children' )
80			?.querySelector( '.header__mobile-submenu' );
81		if ( submenu ) submenu.hidden = true;
82	} );
83
84	// ─── Fechar com Escape ────────────────────────────────────────
85	document.addEventListener( 'keydown', function ( e ) {
86		if ( e.key !== 'Escape' ) return;
87
88		if ( mobilePanel && mobilePanel.classList.contains( 'is-open' ) ) {
89			closeMobileMenu();
90			return;
91		}
92
93		// Fechar dropdown aberto
94		const openDropdown = header.querySelector(
95			'.header__nav-item--has-dropdown:focus-within .header__dropdown'
96		);
97		if ( openDropdown ) {
98			const trigger = openDropdown.closest( '.header__nav-item--has-dropdown' )
99				?.querySelector( '.header__nav-link--btn' );
100			trigger && trigger.focus();
101		}
102	} );
103
104	// ─── Highlight item ativo ─────────────────────────────────────
105	const currentPath = window.location.pathname;
106	header.querySelectorAll( '.header__nav-link, .header__dropdown-link, .header__mobile-link' ).forEach( function ( link ) {
107		if ( link.tagName === 'A' && link.getAttribute( 'href' ) === currentPath ) {
108			link.classList.add( 'active' );
109			link.setAttribute( 'aria-current', 'page' );
110		}
111	} );
112
113} )();