king-addons / includes / widgets / Mega_Menu / Mega_Menu.php

Mega_Menu.php in King Addons for Elementor – 80+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce, Mega Menu, Popup Builder 51.1.74, at includes/widgets/Mega_Menu/Mega_Menu.php

1,387 lines 51.7 KB

Raw Download Zip

1	<?php
2
3	namespace King_Addons;
4
5	use Elementor\Widget_Base;
6	use Elementor\Controls_Manager;
7	use Elementor\Group_Control_Typography;
8	use Elementor\Group_Control_Border;
9	use Elementor\Group_Control_Box_Shadow;
10
11	if (!defined('ABSPATH')) {
12	exit; // Exit if accessed directly.
13	}
14
15
16
17	/**
18	* Class Mega_Menu
19	*
20	* Elementor Mega Menu widget for King Addons plugin.
21	*
22	* Provides a flexible, customizable mega menu for Elementor, supporting WordPress menus and (in Pro) custom menu items, advanced dropdowns, and mobile layouts.
23	*
24	* @package King_Addons
25	*/
26	class Mega_Menu extends Widget_Base
27	{
28
29
30	/**
31	* Get widget unique name.
32	*
33	* @return string Widget name.
34	*/
35	public function get_name(): string
36	{
37	return 'king-addons-mega-menu';
38	}
39
40	/**
41	* Get widget display title.
42	*
43	* @return string Widget title.
44	*/
45	public function get_title(): string
46	{
47	return esc_html__('Mega Menu', 'king-addons');
48	}
49
50	/**
51	* Get widget icon for Elementor panel.
52	*
53	* @return string Icon class.
54	*/
55	public function get_icon(): string
56	{
57	return 'king-addons-icon king-addons-mega-menu';
58	}
59
60	/**
61	* Get style dependencies for the widget.
62	*
63	* @return array List of style handles.
64	*/
65	public function get_style_depends(): array
66	{
67	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-mega-menu-style'];
68	}
69
70	/**
71	* Get script dependencies for the widget.
72	*
73	* @return array List of script handles.
74	*/
75	public function get_script_depends(): array
76	{
77	return [KING_ADDONS_ASSETS_UNIQUE_KEY . '-mega-menu-script'];
78	}
79
80	/**
81	* Get widget categories for Elementor panel.
82	*
83	* @return array List of categories.
84	*/
85	public function get_categories(): array
86	{
87	return ['king-addons'];
88	}
89
90	/**
91	* Get widget keywords for Elementor search.
92	*
93	* @return array List of keywords.
94	*/
95	public function get_keywords(): array
96	{
97	return ['menu', 'nav', 'navigation', 'header', 'navbar', 'mega', 'dropdown', 'king', 'addons', 'kingaddons', 'king-addons'];
98	}
99
100	/**
101	* Get custom help URL for the widget.
102	*
103	* @return string Help URL.
104	*/
105	public function get_custom_help_url()
106	{
107	return 'mailto:bug@kingaddons.com?subject=Bug Report - King Addons&body=Please describe the issue';
108	}
109
110	/**
111	* Get available WordPress navigation menus.
112	*
113	* @return array Associative array of menu slugs => names.
114	*/
115	public function get_wp_nav_menus(): array
116	{
117	$menus = wp_get_nav_menus();
118	$options = [];
119
120	foreach ($menus as $menu) {
121	$options[$menu->slug] = $menu->name;
122	}
123
124	return $options;
125	}
126
127	/**
128	* Placeholder for Pro: Add controls for custom menu items.
129	*
130	* In Free, shows Pro upgrade notice if 'custom' menu source is selected.
131	*
132	* @return void
133	*/
134	public function add_custom_menu_items_controls()
135	{
136
137	$this->add_control(
138	'menu_source_pro_notice',
139	[
140	'raw' => 'Custom Menu Items and Elementor Templates as dropdown content are available in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-mega-menu-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
141	'type' => Controls_Manager::RAW_HTML,
142	'content_classes' => 'king-addons-pro-notice',
143	'condition' => [
144	'menu_source' => 'custom',
145	]
146	]
147	);
148	}
149
150	/**
151	* Placeholder for Pro: Add Lottie logo controls.
152	*
153	* Pro overrides this method to inject additional logo controls.
154	*
155	* @return void
156	*/
157	public function add_lottie_logo_controls(): void
158	{
159	// Intentionally empty in Free.
160	}
161
162	/**
163	* Placeholder for Pro: Add current menu item style controls.
164	*
165	* Pro overrides this method to add advanced current menu item styling.
166	*
167	* @return void
168	*/
169	public function add_current_menu_item_controls(): void
170	{
171	// Intentionally empty in Free.
172	}
173
174	/**
175	* Placeholder for Pro: Add controls for mobile menu layout.
176	*
177	* @return void
178	*/
179	public function add_mobile_menu_layout_controls() {}
180
181	/**
182	* Placeholder for Pro: Add advanced dropdown controls.
183	*
184	* @return void
185	*/
186	public function add_advanced_dropdown_controls() {}
187
188	public function add_advanced_dropdown_animation() {
189	// Dropdown Animation Control
190	$this->add_control(
191	'dropdown_animation',
192	[
193	'label' => esc_html__('Dropdown Animation', 'king-addons'),
194	'type' => Controls_Manager::SELECT,
195	'default' => 'fade',
196	'options' => [
197	'fade' => esc_html__('Fade', 'king-addons'),
198	'slide' => esc_html__('Slide', 'king-addons'),
199	'none' => esc_html__('None', 'king-addons'),
200	'pro-fade-up' => esc_html__('Fade Up (Pro)', 'king-addons'),
201	'pro-fade-down' => esc_html__('Fade Down (Pro)', 'king-addons'),
202	'pro-fade-left' => esc_html__('Fade Left (Pro)', 'king-addons'),
203	'pro-fade-right' => esc_html__('Fade Right (Pro)', 'king-addons'),
204	'pro-zoom-in' => esc_html__('Zoom In (Pro)', 'king-addons'),
205	'pro-zoom-out' => esc_html__('Zoom Out (Pro)', 'king-addons'),
206	],
207	]
208	);
209	}
210
211	/**
212	* Register Elementor controls for the widget.
213	*
214	* Defines all settings and style controls for the Mega Menu widget, including menu source, layout, logo, menu items, dropdown, and style options.
215	*
216	* @return void
217	*/
218	protected function register_controls()
219	{
220	$this->start_controls_section(
221	'section_mega_menu_general',
222	[
223	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('General', 'king-addons'),
224	'tab' => Controls_Manager::TAB_CONTENT,
225	]
226	);
227
228	$this->add_control(
229	'menu_source',
230	[
231	'label' => esc_html__('Menu Source', 'king-addons'),
232	'type' => Controls_Manager::SELECT,
233	'default' => 'wordpress',
234	'options' => [
235	'wordpress' => esc_html__('WordPress Menu', 'king-addons'),
236	'custom' => esc_html__('Custom Elementor Menu', 'king-addons'),
237	],
238	]
239	);
240
241	$this->add_control(
242	'wp_menu',
243	[
244	'label' => esc_html__('Select Menu', 'king-addons'),
245	'type' => Controls_Manager::SELECT,
246	'default' => array_keys($this->get_wp_nav_menus())[0] ?? '',
247	'options' => $this->get_wp_nav_menus(),
248	'condition' => [
249	'menu_source' => 'wordpress',
250	],
251	]
252	);
253
254	$this->add_control(
255	'show_logo',
256	[
257	'label' => esc_html__('Show Logo', 'king-addons'),
258	'type' => Controls_Manager::SWITCHER,
259	'default' => 'yes',
260	'label_on' => esc_html__('Yes', 'king-addons'),
261	'label_off' => esc_html__('No', 'king-addons'),
262	]
263	);
264
265	$this->add_control(
266	'logo_position',
267	[
268	'label' => esc_html__('Logo Position (Desktop)', 'king-addons'),
269	'type' => Controls_Manager::SELECT,
270	'default' => 'left',
271	'options' => [
272	'left' => esc_html__('Left', 'king-addons'),
273	'center' => esc_html__('Center Between', 'king-addons'),
274	'right' => esc_html__('Right', 'king-addons'),
275	],
276	'condition' => [
277	'show_logo' => 'yes',
278	],
279	]
280	);
281
282	$this->add_control(
283	'logo_position_tablet',
284	[
285	'label' => esc_html__('Logo Position (Tablet)', 'king-addons'),
286	'type' => Controls_Manager::SELECT,
287	'default' => 'left',
288	'options' => [
289	'left' => esc_html__('Left', 'king-addons'),
290	'center' => esc_html__('Center', 'king-addons'),
291	'right' => esc_html__('Right', 'king-addons'),
292	],
293	'condition' => [
294	'show_logo' => 'yes',
295	],
296	]
297	);
298
299	$this->add_control(
300	'logo_position_mobile',
301	[
302	'label' => esc_html__('Logo Position (Mobile)', 'king-addons'),
303	'type' => Controls_Manager::SELECT,
304	'default' => 'left',
305	'options' => [
306	'left' => esc_html__('Left', 'king-addons'),
307	'center' => esc_html__('Center', 'king-addons'),
308	'right' => esc_html__('Right', 'king-addons'),
309	],
310	'condition' => [
311	'show_logo' => 'yes',
312	],
313	]
314	);
315
316	$this->add_control(
317	'custom_logo',
318	[
319	'label' => esc_html__('Custom Logo', 'king-addons'),
320	'type' => Controls_Manager::MEDIA,
321	'default' => [
322	'url' => '',
323	],
324	'condition' => [
325	'show_logo' => 'yes',
326	],
327	]
328	);
329
330	$this->add_control(
331	'center_logo_split_at',
332	[
333	'label' => esc_html__('Split Menu After Item', 'king-addons'),
334	'type' => Controls_Manager::NUMBER,
335	'default' => 2,
336	'min' => 1,
337	'max' => 10,
338	'description' => esc_html__('Logo will be placed after this menu item number (e.g., 2 = after 2nd menu item)', 'king-addons'),
339	'condition' => [
340	'show_logo' => 'yes',
341	'logo_position' => 'center',
342	],
343	]
344	);
345
346	$this->add_control(
347	'center_logo_menu_alignment',
348	[
349	'label' => esc_html__('Menu Items Vertical Alignment', 'king-addons'),
350	'type' => Controls_Manager::SELECT,
351	'default' => 'center',
352	'options' => [
353	'start' => esc_html__('Top', 'king-addons'),
354	'center' => esc_html__('Center', 'king-addons'),
355	'end' => esc_html__('Bottom', 'king-addons'),
356	],
357	'selectors' => [
358	'{{WRAPPER}} .king-addons-logo-position-center.king-addons-mega-menu-horizontal .king-addons-menu-items' => 'align-items: {{VALUE}};',
359	],
360	'condition' => [
361	'show_logo' => 'yes',
362	'logo_position' => 'center',
363	],
364	]
365	);
366
367	$this->add_responsive_control(
368	'logo_size',
369	[
370	'label' => esc_html__('Logo Size', 'king-addons'),
371	'type' => Controls_Manager::SLIDER,
372	'size_units' => ['px', '%'],
373	'range' => [
374	'px' => [
375	'min' => 10,
376	'max' => 500,
377	],
378	'%' => [
379	'min' => 1,
380	'max' => 100,
381	],
382	],
383	'default' => [
384	'unit' => 'px',
385	'size' => 150,
386	],
387	'selectors' => [
388	'{{WRAPPER}} .king-addons-mega-menu-logo img' => 'max-width: {{SIZE}}{{UNIT}};',
389	'{{WRAPPER}} .king-addons-mega-menu-logo .king-addons-lottie-animations' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
390	'{{WRAPPER}} .king-addons-mega-menu-logo .king-addons-lottie-animations svg' => 'width: 100% !important; height: 100% !important;',
391	'{{WRAPPER}} .king-addons-mega-menu-logo .king-addons-lottie-animations canvas' => 'width: 100% !important; height: 100% !important;',
392	],
393	'condition' => [
394	'show_logo' => 'yes',
395	],
396	]
397	);
398
399	// Allow Pro to inject additional logo controls (e.g., Lottie logo type).
400	$this->add_lottie_logo_controls();
401
402	$this->add_control(
403	'menu_layout',
404	[
405	'label' => esc_html__('Menu Layout', 'king-addons'),
406	'type' => Controls_Manager::SELECT,
407	'default' => 'horizontal',
408	'options' => [
409	'horizontal' => esc_html__('Horizontal', 'king-addons'),
410	'vertical' => esc_html__('Vertical', 'king-addons'),
411	],
412	]
413	);
414
415	$this->add_control(
416	'horizontal_alignment',
417	[
418	'label' => esc_html__('Menu Alignment', 'king-addons'),
419	'type' => Controls_Manager::CHOOSE,
420	'options' => [
421	'flex-start' => [
422	'title' => esc_html__('Left', 'king-addons'),
423	'icon' => 'eicon-text-align-left',
424	],
425	'center' => [
426	'title' => esc_html__('Center', 'king-addons'),
427	'icon' => 'eicon-text-align-center',
428	],
429	'flex-end' => [
430	'title' => esc_html__('Right', 'king-addons'),
431	'icon' => 'eicon-text-align-right',
432	],
433	'space-between' => [
434	'title' => esc_html__('Justify', 'king-addons'),
435	'icon' => 'eicon-text-align-justify',
436	],
437	],
438	'default' => 'flex-end',
439	'selectors' => [
440	'{{WRAPPER}} .king-addons-mega-menu.king-addons-mega-menu-horizontal' => 'justify-content: {{VALUE}};',
441	],
442	'condition' => [
443	'menu_layout' => 'horizontal',
444	],
445	'render_type' => 'template',
446	]
447	);
448
449	$this->add_control(
450	'vertical_alignment',
451	[
452	'label' => esc_html__('Menu Alignment', 'king-addons'),
453	'type' => Controls_Manager::CHOOSE,
454	'options' => [
455	'flex-start' => [
456	'title' => esc_html__('Left', 'king-addons'),
457	'icon' => 'eicon-text-align-left',
458	],
459	'center' => [
460	'title' => esc_html__('Center', 'king-addons'),
461	'icon' => 'eicon-text-align-center',
462	],
463	'flex-end' => [
464	'title' => esc_html__('Right', 'king-addons'),
465	'icon' => 'eicon-text-align-right',
466	],
467	],
468	'default' => 'flex-start',
469	'selectors' => [
470	'{{WRAPPER}} .king-addons-mega-menu.king-addons-mega-menu-vertical .king-addons-menu-items' => 'align-items: {{VALUE}};',
471	],
472	'condition' => [
473	'menu_layout' => 'vertical',
474	],
475	'render_type' => 'template',
476	]
477	);
478
479	$this->add_mobile_menu_layout_controls();
480
481	$this->end_controls_section();
482
483	// Add Custom Menu Items Section - Only in Pro
484	$this->start_controls_section(
485	'section_mega_menu_custom_items',
486	[
487	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Custom Elementor Menu', 'king-addons'),
488	'tab' => Controls_Manager::TAB_CONTENT,
489	'condition' => [
490	'menu_source' => 'custom',
491	],
492	]
493	);
494
495	$this->add_custom_menu_items_controls();
496
497	$this->end_controls_section();
498
499	// TODO: Add dropdown settings
500	// Advanced Dropdown Settings - Only in Pro
501	$this->start_controls_section(
502	'section_mega_menu_dropdown',
503	[
504	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Dropdown Settings', 'king-addons'),
505	'tab' => Controls_Manager::TAB_CONTENT,
506	]
507	);
508
509	// TODO: Add dropdown width control
510	// $this->add_control(
511	// 'dropdown_width',
512	// [
513	// 'label' => sprintf(__('Dropdown Width %s', 'king-addons'), '<i class="eicon-pro-icon"></i>'),
514	// 'type' => Controls_Manager::SELECT,
515	// 'default' => 'default',
516	// 'options' => [
517	// 'default' => esc_html__('Default', 'king-addons'),
518	// 'custom' => esc_html__('Custom', 'king-addons'),
519	// 'full-width' => esc_html__('Full Width', 'king-addons'),
520	// ],
521	// 'classes' => 'king-addons-pro-control',
522	// ]
523	// );
524
525	$this->add_advanced_dropdown_animation();
526	$this->add_control(
527	'dropdown_animation_duration',
528	[
529	'label' => esc_html__('Animation Duration (ms)', 'king-addons'),
530	'type' => Controls_Manager::NUMBER,
531	'default' => 300,
532	'selectors' => [
533	'{{WRAPPER}} .king-addons-mega-menu .king-addons-menu-items ul.sub-menu' => 'transition-duration: {{VALUE}}ms;',
534	],
535	'condition' => [
536	'dropdown_animation!' => 'none',
537	],
538	]
539	);
540
541	$this->add_advanced_dropdown_controls();
542
543	$this->end_controls_section();
544
545	Core::renderProFeaturesSection(
546	$this,
547	Controls_Manager::TAB_CONTENT,
548	Controls_Manager::RAW_HTML,
549	'mega-menu',
550	[
551	esc_html__('Add Elementor templates as dropdown content', 'king-addons'),
552	esc_html__('Create custom menu items with icons', 'king-addons'),
553	esc_html__('Build nested dropdown menus with unlimited levels', 'king-addons'),
554	esc_html__('Advanced mobile menu layouts', 'king-addons'),
555	esc_html__('Set megamenu width and position', 'king-addons'),
556	esc_html__('Advanced transitions and animations', 'king-addons'),
557	]
558	);
559
560	// Style Sections
561	$this->start_controls_section(
562	'section_mega_menu_style',
563	[
564	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Menu Style', 'king-addons'),
565	'tab' => Controls_Manager::TAB_STYLE,
566	]
567	);
568
569	$this->add_control(
570	'menu_background',
571	[
572	'label' => esc_html__('Background (Desktop)', 'king-addons'),
573	'type' => Controls_Manager::COLOR,
574	'selectors' => [
575	'{{WRAPPER}} .king-addons-mega-menu' => 'background-color: {{VALUE}};',
576	],
577	]
578	);
579
580	$this->add_control(
581	'menu_background_tablet',
582	[
583	'label' => esc_html__('Background (Tablet)', 'king-addons'),
584	'type' => Controls_Manager::COLOR,
585	'selectors' => [
586	'(tablet){{WRAPPER}} .king-addons-mega-menu' => 'background-color: {{VALUE}};',
587	],
588	]
589	);
590
591	$this->add_control(
592	'menu_background_mobile',
593	[
594	'label' => esc_html__('Background (Mobile)', 'king-addons'),
595	'type' => Controls_Manager::COLOR,
596	'selectors' => [
597	'(mobile){{WRAPPER}} .king-addons-mega-menu' => 'background-color: {{VALUE}};',
598	],
599	]
600	);
601
602	$this->add_group_control(
603	Group_Control_Border::get_type(),
604	[
605	'name' => 'menu_border',
606	'selector' => '{{WRAPPER}} .king-addons-mega-menu',
607	]
608	);
609
610	$this->add_responsive_control(
611	'menu_border_radius',
612	[
613	'label' => esc_html__('Border Radius', 'king-addons'),
614	'type' => Controls_Manager::DIMENSIONS,
615	'size_units' => ['px', '%', 'em'],
616	'selectors' => [
617	'{{WRAPPER}} .king-addons-mega-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
618	],
619	]
620	);
621
622	$this->add_responsive_control(
623	'menu_padding',
624	[
625	'label' => esc_html__('Padding', 'king-addons'),
626	'type' => Controls_Manager::DIMENSIONS,
627	'size_units' => ['px', '%', 'em'],
628	'selectors' => [
629	'{{WRAPPER}} .king-addons-mega-menu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
630	],
631	]
632	);
633
634	$this->add_group_control(
635	Group_Control_Box_Shadow::get_type(),
636	[
637	'name' => 'menu_box_shadow',
638	'selector' => '{{WRAPPER}} .king-addons-mega-menu',
639	]
640	);
641
642
643
644
645	$this->end_controls_section();
646
647
648
649
650	// Menu Items Style
651	$this->start_controls_section(
652	'section_mega_menu_items_style',
653	[
654	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Menu Items', 'king-addons'),
655	'tab' => Controls_Manager::TAB_STYLE,
656	]
657	);
658
659	$this->add_group_control(
660	Group_Control_Typography::get_type(),
661	[
662	'name' => 'menu_item_typography',
663	'selector' => '{{WRAPPER}} .king-addons-menu-item > a, {{WRAPPER}} .king-addons-menu-items > li > a',
664	]
665	);
666
667	$this->add_responsive_control(
668	'menu_item_spacing',
669	[
670	'label' => esc_html__('Items Spacing', 'king-addons'),
671	'type' => Controls_Manager::SLIDER,
672	'range' => [
673	'px' => [
674	'min' => 0,
675	'max' => 100,
676	],
677	],
678	'selectors' => [
679	'{{WRAPPER}} .king-addons-mega-menu-horizontal .king-addons-menu-item' => 'margin-right: {{SIZE}}{{UNIT}};',
680	'{{WRAPPER}} .king-addons-mega-menu-vertical .king-addons-menu-item' => 'margin-bottom: {{SIZE}}{{UNIT}};',
681	'{{WRAPPER}} .king-addons-mega-menu-horizontal .king-addons-menu-items > li' => 'margin-right: {{SIZE}}{{UNIT}};',
682	'{{WRAPPER}} .king-addons-mega-menu-vertical .king-addons-menu-items > li' => 'margin-bottom: {{SIZE}}{{UNIT}};',
683	],
684	]
685	);
686
687	$this->add_responsive_control(
688	'menu_item_padding',
689	[
690	'label' => esc_html__('Item Padding', 'king-addons'),
691	'type' => Controls_Manager::DIMENSIONS,
692	'size_units' => ['px', 'em', '%'],
693	'selectors' => [
694	'{{WRAPPER}} .king-addons-menu-item > a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
695	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
696	],
697	]
698	);
699
700	$this->start_controls_tabs('menu_item_style_tabs');
701
702	// Normal State
703	$this->start_controls_tab(
704	'menu_item_style_normal',
705	[
706	'label' => esc_html__('Normal', 'king-addons'),
707	]
708	);
709
710	$this->add_control(
711	'menu_item_text_color',
712	[
713	'label' => esc_html__('Text Color', 'king-addons'),
714	'type' => Controls_Manager::COLOR,
715	'default' => '',
716	'selectors' => [
717	'{{WRAPPER}} .king-addons-menu-item > a' => 'color: {{VALUE}};',
718	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'color: {{VALUE}};',
719	],
720	]
721	);
722
723	$this->add_control(
724	'menu_item_background_color',
725	[
726	'label' => esc_html__('Background Color', 'king-addons'),
727	'type' => Controls_Manager::COLOR,
728	'selectors' => [
729	'{{WRAPPER}} .king-addons-menu-item > a' => 'background-color: {{VALUE}};',
730	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'background-color: {{VALUE}};',
731	],
732	]
733	);
734
735	$this->add_group_control(
736	Group_Control_Border::get_type(),
737	[
738	'name' => 'menu_item_border',
739	'selector' => '{{WRAPPER}} .king-addons-menu-item > a, {{WRAPPER}} .king-addons-menu-items > li > a',
740	]
741	);
742
743	$this->add_responsive_control(
744	'menu_item_border_radius',
745	[
746	'label' => esc_html__('Border Radius', 'king-addons'),
747	'type' => Controls_Manager::DIMENSIONS,
748	'size_units' => ['px', '%', 'em'],
749	'selectors' => [
750	'{{WRAPPER}} .king-addons-menu-item > a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
751	'{{WRAPPER}} .king-addons-menu-items > li > a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
752	],
753	]
754	);
755
756	$this->end_controls_tab();
757
758	// Hover State
759	$this->start_controls_tab(
760	'menu_item_style_hover',
761	[
762	'label' => esc_html__('Hover', 'king-addons'),
763	]
764	);
765
766	$this->add_control(
767	'menu_item_text_color_hover',
768	[
769	'label' => esc_html__('Text Color', 'king-addons'),
770	'type' => Controls_Manager::COLOR,
771	'selectors' => [
772	'{{WRAPPER}} .king-addons-menu-item > a:hover' => 'color: {{VALUE}};',
773	'{{WRAPPER}} .king-addons-menu-item:hover > a' => 'color: {{VALUE}};',
774	'{{WRAPPER}} .king-addons-menu-items > li > a:hover' => 'color: {{VALUE}};',
775	'{{WRAPPER}} .king-addons-menu-items > li:hover > a' => 'color: {{VALUE}};',
776	],
777	]
778	);
779
780	$this->add_control(
781	'menu_item_background_color_hover',
782	[
783	'label' => esc_html__('Background Color', 'king-addons'),
784	'type' => Controls_Manager::COLOR,
785	'selectors' => [
786	'{{WRAPPER}} .king-addons-menu-item > a:hover' => 'background-color: {{VALUE}};',
787	'{{WRAPPER}} .king-addons-menu-item:hover > a' => 'background-color: {{VALUE}};',
788	'{{WRAPPER}} .king-addons-menu-items > li > a:hover' => 'background-color: {{VALUE}};',
789	'{{WRAPPER}} .king-addons-menu-items > li:hover > a' => 'background-color: {{VALUE}};',
790	],
791	]
792	);
793
794	$this->add_control(
795	'menu_item_border_color_hover',
796	[
797	'label' => esc_html__('Border Color', 'king-addons'),
798	'type' => Controls_Manager::COLOR,
799	'selectors' => [
800	'{{WRAPPER}} .king-addons-menu-item > a:hover' => 'border-color: {{VALUE}};',
801	'{{WRAPPER}} .king-addons-menu-item:hover > a' => 'border-color: {{VALUE}};',
802	'{{WRAPPER}} .king-addons-menu-items > li > a:hover' => 'border-color: {{VALUE}};',
803	'{{WRAPPER}} .king-addons-menu-items > li:hover > a' => 'border-color: {{VALUE}};',
804	],
805	'condition' => [
806	'menu_item_border_border!' => '',
807	],
808	]
809	);
810
811	$this->end_controls_tab();
812
813	// Active State
814	$this->start_controls_tab(
815	'menu_item_style_active',
816	[
817	'label' => esc_html__('Active', 'king-addons'),
818	]
819	);
820
821	$this->add_control(
822	'menu_item_text_color_active',
823	[
824	'label' => esc_html__('Text Color', 'king-addons'),
825	'type' => Controls_Manager::COLOR,
826	'selectors' => [
827	'{{WRAPPER}} .king-addons-menu-item.current-menu-item > a' => 'color: {{VALUE}};',
828	'{{WRAPPER}} .king-addons-menu-item.current-menu-ancestor > a' => 'color: {{VALUE}};',
829	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-item > a' => 'color: {{VALUE}};',
830	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-ancestor > a' => 'color: {{VALUE}};',
831	],
832	]
833	);
834
835	$this->add_control(
836	'menu_item_background_color_active',
837	[
838	'label' => esc_html__('Background Color', 'king-addons'),
839	'type' => Controls_Manager::COLOR,
840	'selectors' => [
841	'{{WRAPPER}} .king-addons-menu-item.current-menu-item > a' => 'background-color: {{VALUE}};',
842	'{{WRAPPER}} .king-addons-menu-item.current-menu-ancestor > a' => 'background-color: {{VALUE}};',
843	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-item > a' => 'background-color: {{VALUE}};',
844	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-ancestor > a' => 'background-color: {{VALUE}};',
845	],
846	]
847	);
848
849	$this->add_control(
850	'menu_item_border_color_active',
851	[
852	'label' => esc_html__('Border Color', 'king-addons'),
853	'type' => Controls_Manager::COLOR,
854	'selectors' => [
855	'{{WRAPPER}} .king-addons-menu-item.current-menu-item > a' => 'border-color: {{VALUE}};',
856	'{{WRAPPER}} .king-addons-menu-item.current-menu-ancestor > a' => 'border-color: {{VALUE}};',
857	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-item > a' => 'border-color: {{VALUE}};',
858	'{{WRAPPER}} .king-addons-menu-items > li.current-menu-ancestor > a' => 'border-color: {{VALUE}};',
859	],
860	'condition' => [
861	'menu_item_border_border!' => '',
862	],
863	]
864	);
865
866	$this->end_controls_tab();
867
868	$this->end_controls_tabs();
869
870	$this->end_controls_section();
871
872	// Dropdown Style
873	$this->start_controls_section(
874	'section_mega_menu_dropdown_style',
875	[
876	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Dropdown Style', 'king-addons'),
877	'tab' => Controls_Manager::TAB_STYLE,
878	]
879	);
880
881	$this->add_control(
882	'dropdown_background',
883	[
884	'label' => esc_html__('Background', 'king-addons'),
885	'type' => Controls_Manager::COLOR,
886	'default' => '#fff',
887	'selectors' => [
888	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu' => 'background-color: {{VALUE}};',
889	'{{WRAPPER}} .king-addons-submenu' => 'background-color: {{VALUE}};',
890	],
891	]
892	);
893
894	$this->add_group_control(
895	Group_Control_Typography::get_type(),
896	[
897	'name' => 'dropdown_typography',
898	'selector' => '{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a, {{WRAPPER}} .king-addons-submenu li a',
899	]
900	);
901
902	$this->add_control(
903	'dropdown_text_color',
904	[
905	'label' => esc_html__('Text Color', 'king-addons'),
906	'type' => Controls_Manager::COLOR,
907	'selectors' => [
908	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a' => 'color: {{VALUE}};',
909	'{{WRAPPER}} .king-addons-submenu li a' => 'color: {{VALUE}};',
910	],
911	]
912	);
913
914	$this->add_control(
915	'dropdown_text_hover_color',
916	[
917	'label' => esc_html__('Text Hover Color', 'king-addons'),
918	'type' => Controls_Manager::COLOR,
919	'selectors' => [
920	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a:hover' => 'color: {{VALUE}};',
921	'{{WRAPPER}} .king-addons-submenu li a:hover' => 'color: {{VALUE}};',
922	],
923	]
924	);
925
926	$this->add_control(
927	'dropdown_item_hover_background',
928	[
929	'label' => esc_html__('Item Hover Background', 'king-addons'),
930	'type' => Controls_Manager::COLOR,
931	'selectors' => [
932	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu li a:hover' => 'background-color: {{VALUE}};',
933	'{{WRAPPER}} .king-addons-submenu li a:hover' => 'background-color: {{VALUE}};',
934	],
935	]
936	);
937
938	$this->add_group_control(
939	Group_Control_Border::get_type(),
940	[
941	'name' => 'dropdown_border',
942	'selector' => '{{WRAPPER}} .king-addons-menu-items ul.sub-menu, {{WRAPPER}} .king-addons-submenu',
943	]
944	);
945
946	$this->add_responsive_control(
947	'dropdown_border_radius',
948	[
949	'label' => esc_html__('Border Radius', 'king-addons'),
950	'type' => Controls_Manager::DIMENSIONS,
951	'size_units' => ['px', '%', 'em'],
952	'selectors' => [
953	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
954	'{{WRAPPER}} .king-addons-submenu' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
955	],
956	]
957	);
958
959	$this->add_responsive_control(
960	'dropdown_padding',
961	[
962	'label' => esc_html__('Padding', 'king-addons'),
963	'type' => Controls_Manager::DIMENSIONS,
964	'size_units' => ['px', '%', 'em'],
965	'selectors' => [
966	'{{WRAPPER}} .king-addons-menu-items ul.sub-menu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
967	'{{WRAPPER}} .king-addons-submenu' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
968	],
969	]
970	);
971
972	$this->add_group_control(
973	Group_Control_Box_Shadow::get_type(),
974	[
975	'name' => 'dropdown_box_shadow',
976	'selector' => '{{WRAPPER}} .king-addons-menu-items ul.sub-menu, {{WRAPPER}} .king-addons-submenu',
977	]
978	);
979
980	$this->end_controls_section();
981
982	// Mobile Menu Style
983	$this->start_controls_section(
984	'section_mega_menu_mobile_style',
985	[
986	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Mobile Menu', 'king-addons'),
987	'tab' => Controls_Manager::TAB_STYLE,
988	]
989	);
990
991	$this->add_control(
992	'mobile_toggle_color',
993	[
994	'label' => esc_html__('Toggle Button Color', 'king-addons'),
995	'type' => Controls_Manager::COLOR,
996	'selectors' => [
997	'{{WRAPPER}} .king-addons-mobile-menu-toggle' => 'color: {{VALUE}};',
998	],
999	]
1000	);
1001
1002	$this->add_control(
1003	'mobile_toggle_background',
1004	[
1005	'label' => esc_html__('Toggle Button Background', 'king-addons'),
1006	'type' => Controls_Manager::COLOR,
1007	'selectors' => [
1008	'{{WRAPPER}} .king-addons-mobile-menu-toggle' => 'background-color: {{VALUE}};',
1009	],
1010	]
1011	);
1012
1013	$this->add_control(
1014	'mobile_toggle_hover_color',
1015	[
1016	'label' => esc_html__('Toggle Button Hover Color', 'king-addons'),
1017	'type' => Controls_Manager::COLOR,
1018	'selectors' => [
1019	'{{WRAPPER}} .king-addons-mobile-menu-toggle:hover' => 'color: {{VALUE}};',
1020	],
1021	]
1022	);
1023
1024	$this->add_control(
1025	'mobile_toggle_hover_background',
1026	[
1027	'label' => esc_html__('Toggle Button Hover Background', 'king-addons'),
1028	'type' => Controls_Manager::COLOR,
1029	'selectors' => [
1030	'{{WRAPPER}} .king-addons-mobile-menu-toggle:hover' => 'background-color: {{VALUE}};',
1031	],
1032	]
1033	);
1034
1035	$this->add_control(
1036	'mobile_toggle_active_color',
1037	[
1038	'label' => esc_html__('Toggle Button Active Color', 'king-addons'),
1039	'type' => Controls_Manager::COLOR,
1040	'selectors' => [
1041	'{{WRAPPER}} .king-addons-mobile-menu-toggle.active' => 'color: {{VALUE}};',
1042	],
1043	]
1044	);
1045
1046	$this->add_control(
1047	'mobile_toggle_active_background',
1048	[
1049	'label' => esc_html__('Toggle Button Active Background', 'king-addons'),
1050	'type' => Controls_Manager::COLOR,
1051	'selectors' => [
1052	'{{WRAPPER}} .king-addons-mobile-menu-toggle.active' => 'background-color: {{VALUE}};',
1053	],
1054	]
1055	);
1056
1057	$this->add_control(
1058	'mobile_menu_background',
1059	[
1060	'label' => esc_html__('Menu Background', 'king-addons'),
1061	'type' => Controls_Manager::COLOR,
1062	'selectors' => [
1063	'{{WRAPPER}} .king-addons-mobile-menu' => 'background-color: {{VALUE}};',
1064	],
1065	]
1066	);
1067
1068	$this->add_control(
1069	'mobile_menu_text_color',
1070	[
1071	'label' => esc_html__('Text Color', 'king-addons'),
1072	'type' => Controls_Manager::COLOR,
1073	'selectors' => [
1074	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items a' => 'color: {{VALUE}} !important;',
1075	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items li a' => 'color: {{VALUE}} !important;',
1076	],
1077	]
1078	);
1079
1080	$this->add_control(
1081	'mobile_menu_text_hover_color',
1082	[
1083	'label' => esc_html__('Text Hover Color', 'king-addons'),
1084	'type' => Controls_Manager::COLOR,
1085	'selectors' => [
1086	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items a:hover' => 'color: {{VALUE}} !important;',
1087	'{{WRAPPER}} .king-addons-mobile-menu .king-addons-menu-items li a:hover' => 'color: {{VALUE}} !important;',
1088	],
1089	]
1090	);
1091
1092	$this->add_group_control(
1093	Group_Control_Typography::get_type(),
1094	[
1095	'name' => 'mobile_menu_typography',
1096	'selector' => '{{WRAPPER}} .king-addons-mobile-menu a',
1097	]
1098	);
1099
1100	$this->add_group_control(
1101	Group_Control_Border::get_type(),
1102	[
1103	'name' => 'mobile_menu_border',
1104	'selector' => '{{WRAPPER}} .king-addons-mobile-menu',
1105	]
1106	);
1107
1108	$this->add_group_control(
1109	Group_Control_Box_Shadow::get_type(),
1110	[
1111	'name' => 'mobile_menu_shadow',
1112	'selector' => '{{WRAPPER}} .king-addons-mobile-menu',
1113	]
1114	);
1115
1116	$this->end_controls_section();
1117
1118	// Logo Style
1119	$this->start_controls_section(
1120	'section_mega_menu_logo_style',
1121	[
1122	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Logo Style', 'king-addons'),
1123	'tab' => Controls_Manager::TAB_STYLE,
1124	'condition' => [
1125	'show_logo' => 'yes',
1126	],
1127	]
1128	);
1129
1130	$this->add_responsive_control(
1131	'logo_margin',
1132	[
1133	'label' => esc_html__('Margin', 'king-addons'),
1134	'type' => Controls_Manager::DIMENSIONS,
1135	'size_units' => ['px', '%', 'em'],
1136	'default' => [
1137	'top' => 0,
1138	'right' => 0,
1139	'bottom' => 0,
1140	'left' => 0,
1141	],
1142	'selectors' => [
1143	'{{WRAPPER}} .king-addons-mega-menu-logo' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1144	],
1145	]
1146	);
1147
1148	$this->add_responsive_control(
1149	'logo_padding',
1150	[
1151	'label' => esc_html__('Padding', 'king-addons'),
1152	'type' => Controls_Manager::DIMENSIONS,
1153	'size_units' => ['px', '%', 'em'],
1154	'default' => [
1155	'top' => 0,
1156	'right' => 0,
1157	'bottom' => 0,
1158	'left' => 0,
1159	],
1160	'selectors' => [
1161	'{{WRAPPER}} .king-addons-mega-menu-logo' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1162	],
1163	]
1164	);
1165
1166	$this->add_group_control(
1167	Group_Control_Border::get_type(),
1168	[
1169	'name' => 'logo_border',
1170	'selector' => '{{WRAPPER}} .king-addons-mega-menu-logo',
1171	]
1172	);
1173
1174	$this->add_responsive_control(
1175	'logo_border_radius',
1176	[
1177	'label' => esc_html__('Border Radius', 'king-addons'),
1178	'type' => Controls_Manager::DIMENSIONS,
1179	'size_units' => ['px', '%', 'em'],
1180	'selectors' => [
1181	'{{WRAPPER}} .king-addons-mega-menu-logo' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1182	],
1183	]
1184	);
1185
1186	$this->end_controls_section();
1187
1188	$this->add_menu_items_hover_effects_controls();
1189
1190	// Allow Pro to add current menu item styling controls.
1191	$this->add_current_menu_item_controls();
1192	}
1193
1194	/**
1195	* Render the widget output on the frontend.
1196	*
1197	* Outputs the Mega Menu HTML structure, including logo, menu, and mobile menu toggle. Handles both horizontal and vertical layouts, logo position, and menu source.
1198	*
1199	* @return void
1200	*/
1201	protected function render()
1202	{
1203	$settings = $this->get_settings_for_display();
1204	$menu_layout = $settings['menu_layout'];
1205	$logo_position = $settings['logo_position'];
1206	$logo_position_tablet = !empty($settings['logo_position_tablet']) ? $settings['logo_position_tablet'] : $logo_position;
1207	$logo_position_mobile = !empty($settings['logo_position_mobile']) ? $settings['logo_position_mobile'] : $logo_position;
1208	$logo_html = '';
1209
1210	if ($settings['show_logo'] === 'yes') {
1211	$site_url = get_home_url();
1212	$logo_content = '';
1213
1214	// Generate logo content
1215	if (!empty($settings['custom_logo']['url'])) {
1216	// Custom logo uploaded via Elementor
1217	$logo_content = '<img src="' . esc_url($settings['custom_logo']['url']) . '" alt="' . esc_attr(get_bloginfo('name')) . '">';
1218	} else {
1219	// Use WordPress theme logo
1220	$custom_logo_id = get_theme_mod('custom_logo');
1221	if ($custom_logo_id) {
1222	$logo_content = wp_get_attachment_image($custom_logo_id, 'full');
1223	} else {
1224	$logo_content = '<span class="site-title">' . esc_html(get_bloginfo('name')) . '</span>';
1225	}
1226	}
1227
1228	if (!empty($logo_content)) {
1229	$logo_classes = 'king-addons-mega-menu-logo';
1230	$logo_classes .= ' king-addons-logo-position-' . esc_attr($logo_position);
1231	$logo_classes .= ' king-addons-logo-position-tablet-' . esc_attr($logo_position_tablet);
1232	$logo_classes .= ' king-addons-logo-position-mobile-' . esc_attr($logo_position_mobile);
1233
1234	$logo_html = '<div class="' . esc_attr($logo_classes) . '">';
1235	$logo_html .= '<a href="' . esc_url($site_url) . '">';
1236	$logo_html .= $logo_content;
1237	$logo_html .= '</a>';
1238	$logo_html .= '</div>';
1239	}
1240	}
1241
1242	$menu_source = $settings['menu_source'];
1243	$menu_html = '';
1244	$menu_html_left = '';
1245	$menu_html_right = '';
1246
1247	if ($menu_source === 'wordpress' && !empty($settings['wp_menu'])) {
1248	$args = [
1249	'menu' => $settings['wp_menu'],
1250	'container' => false,
1251	'menu_class' => 'king-addons-menu-items',
1252	'echo' => false,
1253	'fallback_cb' => '__return_empty_string',
1254	'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
1255	'depth' => 3,
1256	'walker' => new King_Addons_Mega_Menu_Walker_Free(),
1257	];
1258
1259	$menu_html = wp_nav_menu($args);
1260
1261	// Store split position for center logo (will be handled by JavaScript)
1262	if ($logo_position === 'center' && !empty($logo_html)) {
1263	$split_at = isset($settings['center_logo_split_at']) ? (int)$settings['center_logo_split_at'] : 2;
1264	// We'll let JavaScript handle the splitting for more reliable results
1265	}
1266	}
1267
1268	// Mobile menu toggle button
1269	$mobile_toggle = '<button class="king-addons-mobile-menu-toggle"><i class="fas fa-bars"></i></button>';
1270
1271	// Applying styles for vertical alignment
1272	$vertical_alignment_style = '';
1273	$vertical_alignment_attr = '';
1274	if ($menu_layout === 'vertical' && !empty($settings['vertical_alignment'])) {
1275	$vertical_alignment_style = ' style="align-items: ' . esc_attr($settings['vertical_alignment']) . ';"';
1276	$vertical_alignment_attr = ' data-vertical-align="' . esc_attr($settings['vertical_alignment']) . '"';
1277	}
1278
1279	// Applying styles for horizontal alignment
1280	$horizontal_alignment_attr = '';
1281	if ($menu_layout === 'horizontal' && !empty($settings['horizontal_alignment'])) {
1282	$horizontal_alignment_attr = ' data-horizontal-align="' . esc_attr($settings['horizontal_alignment']) . '"';
1283	}
1284
1285	// Add data attributes to main menu wrapper
1286	$dropdown_animation = !empty($settings['dropdown_animation']) ? $settings['dropdown_animation'] : 'fade';
1287	$dropdown_animation_attr = ' data-dropdown-animation="' . esc_attr($dropdown_animation) . '"';
1288
1289	// Add center logo data attributes for responsive positions
1290	$center_logo_attrs = '';
1291	$has_center_logo = ($logo_position === 'center' \|\| $logo_position_tablet === 'center' \|\| $logo_position_mobile === 'center');
1292
1293	if ($has_center_logo && !empty($logo_html)) {
1294	$split_at = isset($settings['center_logo_split_at']) ? (int)$settings['center_logo_split_at'] : 2;
1295	$center_logo_attrs = ' data-center-logo="true" data-split-at="' . esc_attr($split_at) . '"';
1296	$center_logo_attrs .= ' data-logo-position-desktop="' . esc_attr($logo_position) . '"';
1297	$center_logo_attrs .= ' data-logo-position-tablet="' . esc_attr($logo_position_tablet) . '"';
1298	$center_logo_attrs .= ' data-logo-position-mobile="' . esc_attr($logo_position_mobile) . '"';
1299	}
1300
1301	?>
1302	<div class="king-addons-mega-menu king-addons-mega-menu-<?php echo esc_attr($menu_layout); ?> king-addons-logo-position-<?php echo esc_attr($logo_position); ?> king-addons-logo-position-tablet-<?php echo esc_attr($logo_position_tablet); ?> king-addons-logo-position-mobile-<?php echo esc_attr($logo_position_mobile); ?>" <?php echo $vertical_alignment_attr . $horizontal_alignment_attr . $dropdown_animation_attr . $center_logo_attrs; ?>>
1303
1304	<?php if ($logo_position === 'left' && !empty($logo_html)) : ?>
1305	<?php echo $logo_html; ?>
1306	<?php endif; ?>
1307
1308	<?php if (!empty($logo_html) && ($logo_position === 'center' \|\| $logo_position_tablet === 'center' \|\| $logo_position_mobile === 'center')) : ?>
1309	<!-- Center logo will be positioned by JavaScript -->
1310	<div class="king-addons-center-logo-placeholder">
1311	<?php echo $logo_html; ?>
1312	</div>
1313	<?php endif; ?>
1314
1315	<nav class="king-addons-menu-container" <?php echo $vertical_alignment_style; ?>>
1316	<?php echo $menu_html; ?>
1317	</nav>
1318
1319	<?php if ($logo_position === 'right' && !empty($logo_html)) : ?>
1320	<?php echo $logo_html; ?>
1321	<?php endif; ?>
1322
1323	<?php echo $mobile_toggle; ?>
1324	<div class="king-addons-mobile-menu">
1325	<?php echo $menu_html; ?>
1326	</div>
1327	</div>
1328	<?php
1329	}
1330
1331	public function add_menu_items_hover_effects_controls()
1332	{
1333	$this->start_controls_section(
1334	'section_menu_items_hover_effects',
1335	[
1336	'label' => KING_ADDONS_ELEMENTOR_ICON . esc_html__('Menu Items Hover Effects', 'king-addons'),
1337	'tab' => Controls_Manager::TAB_STYLE,
1338	]
1339	);
1340	$this->add_control(
1341	'dropdown_icon_heading',
1342	[
1343	'label' => esc_html__('Dropdown Icon', 'king-addons'),
1344	'type' => Controls_Manager::HEADING,
1345	'separator' => 'before',
1346	]
1347	);
1348	$this->add_control(
1349	'dropdown_icon_pro_notice',
1350	[
1351	'type' => Controls_Manager::RAW_HTML,
1352	'raw' => 'Dropdown icon customization is available in the <strong><a href="https://kingaddons.com/pricing/?utm_source=kng-module-mega-menu-settings-upgrade-pro&utm_medium=plugin&utm_campaign=kng" target="_blank">Pro version</a></strong>',
1353	'content_classes' => 'king-addons-pro-notice',
1354	]
1355	);
1356	$this->end_controls_section();
1357	}
1358	}
1359
1360	class King_Addons_Mega_Menu_Walker_Free extends \Walker_Nav_Menu {
1361	public function start_el( &$output, $item, $depth = 0, $args = [], $id = 0 ) {
1362	$classes = empty($item->classes) ? [] : (array) $item->classes;
1363	$is_dropdown = in_array('menu-item-has-children', $classes);
1364	$output .= '<li class="' . esc_attr(implode(' ', $classes)) . '">';
1365	$atts = [];
1366	$atts['href'] = !empty($item->url) ? $item->url : '';
1367	$atts['title'] = !empty($item->attr_title) ? $item->attr_title : '';
1368	$atts['target'] = !empty($item->target) ? $item->target : '';
1369	$atts['rel'] = !empty($item->xfn) ? $item->xfn : '';
1370	$attributes = '';
1371	foreach ($atts as $attr => $value) {
1372	if (!empty($value)) {
1373	$attributes .= ' ' . $attr . '="' . esc_attr($value) . '"';
1374	}
1375	}
1376	$output .= '<a' . $attributes . '>';
1377	$output .= '<span class="menu-item-text">' . apply_filters('the_title', $item->title, $item->ID) . '</span>';
1378	if ($is_dropdown) {
1379	$output .= '<span class="king-addons-dropdown-icon" style="margin-left:8px;"><i class="fas fa-angle-down"></i></span>';
1380	}
1381	$output .= '</a>';
1382	}
1383	public function end_el( &$output, $item, $depth = 0, $args = [] ) {
1384	$output .= '</li>';
1385	}
1386	}
1387