king-addons / includes / admin / layouts / wishlist-page.php

wishlist-page.php in King Addons for Elementor – 100+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce Builder, Mega Menu, Popup Builder 51.1.84, at includes/admin/layouts/wishlist-page.php

488 lines 28.1 KB

Raw Download Zip

1	<?php
2	/**
3	* Wishlist admin settings page - V3 Premium style inspired design.
4	*
5	* @package King_Addons
6	*/
7
8	use King_Addons\Wishlist\Wishlist_Settings;
9
10	if (!defined('ABSPATH')) {
11	exit;
12	}
13
14	// Theme mode is per-user
15	$theme_mode = get_user_meta(get_current_user_id(), 'king_addons_theme_mode', true);
16	$allowed_theme_modes = ['dark', 'light', 'auto'];
17	if (!in_array($theme_mode, $allowed_theme_modes, true)) {
18	$theme_mode = 'auto';
19	}
20
21	$settings = Wishlist_Settings::get_settings();
22	$pages = get_pages(['sort_column' => 'post_title', 'sort_order' => 'ASC']);
23	$columns = Wishlist_Settings::get_column_options();
24	$is_pro = function_exists('king_addons_freemius') && king_addons_freemius()->can_use_premium_code__premium_only();
25
26	// Enqueue the shared CSS
27	$css_url = KING_ADDONS_URL . 'includes/admin/layouts/shared/admin-v3-styles.css';
28	$css_path = KING_ADDONS_PATH . 'includes/admin/layouts/shared/admin-v3-styles.css';
29	$css_version = file_exists($css_path) ? filemtime($css_path) : KING_ADDONS_VERSION;
30	?>
31
32	<link rel="stylesheet" href="<?php echo esc_url($css_url); ?>?v=<?php echo esc_attr($css_version); ?>">
33
34	<script>
35	document.body.classList.add('ka-admin-v3');
36	(function() {
37	const mode = '<?php echo esc_js($theme_mode); ?>';
38	const mql = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
39	const isDark = mode === 'auto' ? !!(mql && mql.matches) : mode === 'dark';
40	document.body.classList.toggle('ka-v3-dark', isDark);
41	document.documentElement.classList.toggle('ka-v3-dark', isDark);
42	})();
43	</script>
44
45	<div class="ka-admin-wrap">
46	<!-- Header -->
47	<div class="ka-admin-header">
48	<div class="ka-admin-header-left">
49	<div class="ka-admin-header-icon pink">
50	<span class="dashicons dashicons-heart"></span>
51	</div>
52	<div>
53	<h1 class="ka-admin-title"><?php esc_html_e('Wishlist', 'king-addons'); ?></h1>
54	<p class="ka-admin-subtitle"><?php esc_html_e('Configure WooCommerce wishlist functionality.', 'king-addons'); ?></p>
55	</div>
56	</div>
57	<div class="ka-admin-header-actions">
58	<span class="ka-status <?php echo !empty($settings['enabled']) ? 'ka-status-enabled' : 'ka-status-disabled'; ?>">
59	<span class="ka-status-dot"></span>
60	<?php echo !empty($settings['enabled']) ? esc_html__('Enabled', 'king-addons') : esc_html__('Disabled', 'king-addons'); ?>
61	</span>
62	<div class="ka-v3-segmented" id="ka-v3-theme-segment" role="radiogroup" aria-label="<?php echo esc_attr(esc_html__('Theme', 'king-addons')); ?>" data-active="<?php echo esc_attr($theme_mode); ?>">
63	<span class="ka-v3-segmented-indicator" aria-hidden="true"></span>
64	<button type="button" class="ka-v3-segmented-btn" data-theme="light" aria-pressed="<?php echo $theme_mode === 'light' ? 'true' : 'false'; ?>">
65	<span class="ka-v3-segmented-icon" aria-hidden="true">☀︎</span>
66	<?php esc_html_e('Light', 'king-addons'); ?>
67	</button>
68	<button type="button" class="ka-v3-segmented-btn" data-theme="dark" aria-pressed="<?php echo $theme_mode === 'dark' ? 'true' : 'false'; ?>">
69	<span class="ka-v3-segmented-icon" aria-hidden="true">☾</span>
70	<?php esc_html_e('Dark', 'king-addons'); ?>
71	</button>
72	<button type="button" class="ka-v3-segmented-btn" data-theme="auto" aria-pressed="<?php echo $theme_mode === 'auto' ? 'true' : 'false'; ?>">
73	<span class="ka-v3-segmented-icon" aria-hidden="true">◐</span>
74	<?php esc_html_e('Auto', 'king-addons'); ?>
75	</button>
76	</div>
77	<a href="<?php echo esc_url(admin_url('admin.php?page=king-addons-wishlist-analytics')); ?>" class="ka-btn ka-btn-pink">
78	<span class="dashicons dashicons-chart-bar"></span>
79	<?php esc_html_e('Analytics', 'king-addons'); ?>
80	</a>
81	</div>
82	</div>
83
84	<!-- Tabs Navigation -->
85	<div class="ka-tabs">
86	<button type="button" class="ka-tab active" data-tab="general"><?php esc_html_e('General', 'king-addons'); ?></button>
87	<button type="button" class="ka-tab" data-tab="buttons"><?php esc_html_e('Buttons & Icons', 'king-addons'); ?></button>
88	<button type="button" class="ka-tab" data-tab="page"><?php esc_html_e('Wishlist Page', 'king-addons'); ?></button>
89	<button type="button" class="ka-tab" data-tab="performance"><?php esc_html_e('Performance', 'king-addons'); ?></button>
90	<button type="button" class="ka-tab" data-tab="pro"><?php esc_html_e('Pro Features', 'king-addons'); ?><?php if (!$is_pro) : ?><span class="ka-pro-badge">PRO</span><?php endif; ?></button>
91	</div>
92
93	<form method="post" action="options.php" id="king-addons-wishlist-form">
94	<?php settings_fields('king_addons_wishlist'); ?>
95
96	<!-- General Tab -->
97	<div class="ka-tab-content active" data-tab="general">
98	<div class="ka-card">
99	<div class="ka-card-header">
100	<span class="dashicons dashicons-admin-settings pink"></span>
101	<h2><?php esc_html_e('General Settings', 'king-addons'); ?></h2>
102	</div>
103	<div class="ka-card-body">
104	<div class="ka-row">
105	<div class="ka-row-label"><?php esc_html_e('Enable Wishlist', 'king-addons'); ?></div>
106	<div class="ka-row-field">
107	<label class="ka-toggle">
108	<input type="checkbox" name="king_addons_wishlist_settings[enabled]" value="1" <?php checked(!empty($settings['enabled'])); ?> />
109	<span class="ka-toggle-slider"></span>
110	<span class="ka-toggle-label"><?php esc_html_e('Turn on wishlist functionality', 'king-addons'); ?></span>
111	</label>
112	</div>
113	</div>
114	<div class="ka-row">
115	<div class="ka-row-label"><?php esc_html_e('Wishlist Page', 'king-addons'); ?></div>
116	<div class="ka-row-field">
117	<select name="king_addons_wishlist_settings[wishlist_page_id]">
118	<option value="0"><?php esc_html_e('— Select page —', 'king-addons'); ?></option>
119	<?php foreach ($pages as $page) : ?>
120	<option value="<?php echo esc_attr($page->ID); ?>" <?php selected(intval($settings['wishlist_page_id']), $page->ID); ?>>
121	<?php echo esc_html($page->post_title); ?>
122	</option>
123	<?php endforeach; ?>
124	</select>
125	<p class="ka-row-desc"><?php esc_html_e('Choose the page that displays the wishlist or use the shortcode [ka_wishlist_page].', 'king-addons'); ?></p>
126	</div>
127	</div>
128	<div class="ka-row">
129	<div class="ka-row-label"><?php esc_html_e('Allow Guests', 'king-addons'); ?></div>
130	<div class="ka-row-field">
131	<label class="ka-toggle">
132	<input type="checkbox" name="king_addons_wishlist_settings[allow_guests]" value="1" <?php checked(!empty($settings['allow_guests'])); ?> />
133	<span class="ka-toggle-slider"></span>
134	<span class="ka-toggle-label"><?php esc_html_e('Guests can use wishlist with session', 'king-addons'); ?></span>
135	</label>
136	</div>
137	</div>
138	<div class="ka-row">
139	<div class="ka-row-label"><?php esc_html_e('Guest Notice', 'king-addons'); ?></div>
140	<div class="ka-row-field">
141	<textarea name="king_addons_wishlist_settings[guest_block_text]" rows="2" style="max-width:100%"><?php echo esc_textarea($settings['guest_block_text']); ?></textarea>
142	<p class="ka-row-desc"><?php esc_html_e('Message shown to guests when wishlist is disabled for them.', 'king-addons'); ?></p>
143	</div>
144	</div>
145	</div>
146	</div>
147	</div>
148
149	<!-- Buttons Tab -->
150	<div class="ka-tab-content" data-tab="buttons">
151	<div class="ka-card">
152	<div class="ka-card-header">
153	<span class="dashicons dashicons-button pink"></span>
154	<h2><?php esc_html_e('Button Settings', 'king-addons'); ?></h2>
155	</div>
156	<div class="ka-card-body">
157	<div class="ka-row">
158	<div class="ka-row-label"><?php esc_html_e('Default Text', 'king-addons'); ?></div>
159	<div class="ka-row-field">
160	<input type="text" name="king_addons_wishlist_settings[button_add_text]" value="<?php echo esc_attr($settings['button_add_text']); ?>" />
161	</div>
162	</div>
163	<div class="ka-row">
164	<div class="ka-row-label"><?php esc_html_e('Added Text', 'king-addons'); ?></div>
165	<div class="ka-row-field">
166	<input type="text" name="king_addons_wishlist_settings[button_added_text]" value="<?php echo esc_attr($settings['button_added_text']); ?>" />
167	</div>
168	</div>
169	<div class="ka-row">
170	<div class="ka-row-label"><?php esc_html_e('Display Mode', 'king-addons'); ?></div>
171	<div class="ka-row-field">
172	<div class="ka-radio-group">
173	<label class="ka-radio-item">
174	<input type="radio" name="king_addons_wishlist_settings[button_display_mode]" value="icon_text" <?php checked($settings['button_display_mode'], 'icon_text'); ?> />
175	<?php esc_html_e('Icon with text', 'king-addons'); ?>
176	</label>
177	<label class="ka-radio-item">
178	<input type="radio" name="king_addons_wishlist_settings[button_display_mode]" value="icon" <?php checked($settings['button_display_mode'], 'icon'); ?> />
179	<?php esc_html_e('Icon only', 'king-addons'); ?>
180	</label>
181	</div>
182	</div>
183	</div>
184	<div class="ka-row">
185	<div class="ka-row-label"><?php esc_html_e('Icon Class', 'king-addons'); ?></div>
186	<div class="ka-row-field">
187	<input type="text" name="king_addons_wishlist_settings[icon_choice]" value="<?php echo esc_attr($settings['icon_choice']); ?>" />
188	<p class="ka-row-desc"><?php esc_html_e('Built-in heart is used for the default class. Or paste another Elementor / Font Awesome class.', 'king-addons'); ?></p>
189	</div>
190	</div>
191	<div class="ka-row">
192	<div class="ka-row-label"><?php esc_html_e('Position', 'king-addons'); ?></div>
193	<div class="ka-row-field">
194	<select name="king_addons_wishlist_settings[button_position]">
195	<option value="before_add_to_cart" <?php selected($settings['button_position'], 'before_add_to_cart'); ?>><?php esc_html_e('Before Add to Cart', 'king-addons'); ?></option>
196	<option value="after_add_to_cart" <?php selected($settings['button_position'], 'after_add_to_cart'); ?>><?php esc_html_e('After Add to Cart', 'king-addons'); ?></option>
197	</select>
198	</div>
199	</div>
200	<div class="ka-row">
201	<div class="ka-row-label"><?php esc_html_e('Show on Single Product', 'king-addons'); ?></div>
202	<div class="ka-row-field">
203	<label class="ka-toggle">
204	<input type="checkbox" name="king_addons_wishlist_settings[show_on_single]" value="1" <?php checked(!empty($settings['show_on_single'])); ?> />
205	<span class="ka-toggle-slider"></span>
206	<span class="ka-toggle-label"><?php esc_html_e('Add the button next to Add to Cart / Buy Now', 'king-addons'); ?></span>
207	</label>
208	<p class="ka-row-desc"><?php esc_html_e('Off by default. Covers the product page and the King Addons Add to Cart widget. Use the Wishlist Button widget if you want it in a specific place instead.', 'king-addons'); ?></p>
209	</div>
210	</div>
211	<div class="ka-row">
212	<div class="ka-row-label"><?php esc_html_e('Show on Product Cards', 'king-addons'); ?></div>
213	<div class="ka-row-field">
214	<label class="ka-toggle">
215	<input type="checkbox" name="king_addons_wishlist_settings[show_in_archives]" value="1" <?php checked(!empty($settings['show_in_archives'])); ?> />
216	<span class="ka-toggle-slider"></span>
217	<span class="ka-toggle-label"><?php esc_html_e('Add the button to shop, category, and product grid cards', 'king-addons'); ?></span>
218	</label>
219	<p class="ka-row-desc"><?php esc_html_e('Off by default. Enable this if you want the wishlist button on product cards. The wishlist module and Elementor widgets stay available either way.', 'king-addons'); ?></p>
220	</div>
221	</div>
222	</div>
223	</div>
224	</div>
225
226	<!-- Page Tab -->
227	<div class="ka-tab-content" data-tab="page">
228	<div class="ka-card">
229	<div class="ka-card-header">
230	<span class="dashicons dashicons-editor-table pink"></span>
231	<h2><?php esc_html_e('Table Columns', 'king-addons'); ?></h2>
232	</div>
233	<div class="ka-card-body">
234	<div class="ka-row">
235	<div class="ka-row-label"><?php esc_html_e('Columns', 'king-addons'); ?></div>
236	<div class="ka-row-field">
237	<p class="ka-row-desc" style="margin-top:0;margin-bottom:12px"><?php esc_html_e('Drag to reorder. Check/uncheck to show/hide.', 'king-addons'); ?></p>
238	<ul id="ka-wishlist-columns" class="ka-sortable-list">
239	<?php foreach ($settings['wishlist_columns'] as $saved_key) : if (isset($columns[$saved_key])) : ?>
240	<li class="ka-sortable-item" data-column="<?php echo esc_attr($saved_key); ?>">
241	<span class="dashicons dashicons-menu ka-sortable-handle"></span>
242	<label>
243	<input type="checkbox" name="king_addons_wishlist_settings[wishlist_columns][]" value="<?php echo esc_attr($saved_key); ?>" checked />
244	<?php echo esc_html($columns[$saved_key]); ?>
245	</label>
246	</li>
247	<?php endif; endforeach; ?>
248	<?php foreach ($columns as $column_key => $label) : if (!in_array($column_key, $settings['wishlist_columns'], true)) : ?>
249	<li class="ka-sortable-item" data-column="<?php echo esc_attr($column_key); ?>">
250	<span class="dashicons dashicons-menu ka-sortable-handle"></span>
251	<label>
252	<input type="checkbox" name="king_addons_wishlist_settings[wishlist_columns][]" value="<?php echo esc_attr($column_key); ?>" />
253	<?php echo esc_html($label); ?>
254	</label>
255	</li>
256	<?php endif; endforeach; ?>
257	</ul>
258	</div>
259	</div>
260	</div>
261	</div>
262	</div>
263
264	<!-- Performance Tab -->
265	<div class="ka-tab-content" data-tab="performance">
266	<div class="ka-card">
267	<div class="ka-card-header">
268	<span class="dashicons dashicons-performance pink"></span>
269	<h2><?php esc_html_e('Performance', 'king-addons'); ?></h2>
270	</div>
271	<div class="ka-card-body">
272	<div class="ka-row">
273	<div class="ka-row-label"><?php esc_html_e('Frontend Cache', 'king-addons'); ?></div>
274	<div class="ka-row-field">
275	<label class="ka-toggle">
276	<input type="checkbox" name="king_addons_wishlist_settings[cache_enabled]" value="1" <?php checked(!empty($settings['cache_enabled'])); ?> />
277	<span class="ka-toggle-slider"></span>
278	<span class="ka-toggle-label"><?php esc_html_e('Cache wishlist fragments', 'king-addons'); ?></span>
279	</label>
280	<p class="ka-row-desc"><?php esc_html_e('Basic HTML cache. Disable if counts appear stale.', 'king-addons'); ?></p>
281	</div>
282	</div>
283	<div class="ka-row">
284	<div class="ka-row-label"><?php esc_html_e('Cache Lifetime', 'king-addons'); ?></div>
285	<div class="ka-row-field">
286	<input type="number" min="0" step="30" name="king_addons_wishlist_settings[cache_ttl]" value="<?php echo esc_attr(intval($settings['cache_ttl'])); ?>" style="max-width:120px" />
287	<span style="color:#86868b;margin-left:8px"><?php esc_html_e('seconds', 'king-addons'); ?></span>
288	</div>
289	</div>
290	</div>
291	</div>
292	</div>
293
294	<!-- Pro Tab -->
295	<div class="ka-tab-content" data-tab="pro">
296	<?php if (!$is_pro) : ?>
297	<div class="ka-upgrade-card">
298	<h3><?php esc_html_e('Upgrade to Pro', 'king-addons'); ?></h3>
299	<p><?php esc_html_e('Unlock powerful wishlist features for your WooCommerce store.', 'king-addons'); ?></p>
300	<ul>
301	<li><?php esc_html_e('Multiple wishlists with visibility control', 'king-addons'); ?></li>
302	<li><?php esc_html_e('Shareable links and social buttons', 'king-addons'); ?></li>
303	<li><?php esc_html_e('Email triggers for price drops and restocks', 'king-addons'); ?></li>
304	<li><?php esc_html_e('Wishlist analytics and CSV export', 'king-addons'); ?></li>
305	<li><?php esc_html_e('Product notes and advanced design controls', 'king-addons'); ?></li>
306	</ul>
307	<a href="https://kingaddons.com/pricing/?utm_source=kng-wishlist-admin&utm_medium=plugin&utm_campaign=kng" target="_blank" class="ka-btn ka-btn-pink">
308	<?php esc_html_e('View Pro Plans', 'king-addons'); ?>
309	</a>
310	</div>
311	<?php else :
312	$email_settings = class_exists('King_Addons\Wishlist\Wishlist_Email_Notifications')
313	? \King_Addons\Wishlist\Wishlist_Email_Notifications::get_settings()
314	: [];
315	?>
316	<div class="ka-card">
317	<div class="ka-card-header">
318	<span class="dashicons dashicons-email-alt pink"></span>
319	<h2><?php esc_html_e('Email Notifications', 'king-addons'); ?></h2>
320	</div>
321	<div class="ka-card-body">
322	<div class="ka-row">
323	<div class="ka-row-label"><?php esc_html_e('Price Drops', 'king-addons'); ?></div>
324	<div class="ka-row-field">
325	<label class="ka-toggle">
326	<input type="checkbox" name="king_addons_wishlist_email_settings[enable_price_drop]" value="1" <?php checked(!empty($email_settings['enable_price_drop'])); ?> />
327	<span class="ka-toggle-slider"></span>
328	<span class="ka-toggle-label"><?php esc_html_e('Notify on price reduction', 'king-addons'); ?></span>
329	</label>
330	</div>
331	</div>
332	<div class="ka-row">
333	<div class="ka-row-label"><?php esc_html_e('Back in Stock', 'king-addons'); ?></div>
334	<div class="ka-row-field">
335	<label class="ka-toggle">
336	<input type="checkbox" name="king_addons_wishlist_email_settings[enable_back_in_stock]" value="1" <?php checked(!empty($email_settings['enable_back_in_stock'])); ?> />
337	<span class="ka-toggle-slider"></span>
338	<span class="ka-toggle-label"><?php esc_html_e('Notify when product returns', 'king-addons'); ?></span>
339	</label>
340	</div>
341	</div>
342	<div class="ka-row">
343	<div class="ka-row-label"><?php esc_html_e('Weekly Digest', 'king-addons'); ?></div>
344	<div class="ka-row-field">
345	<label class="ka-toggle">
346	<input type="checkbox" name="king_addons_wishlist_email_settings[enable_digest]" value="1" <?php checked(!empty($email_settings['enable_digest'])); ?> />
347	<span class="ka-toggle-slider"></span>
348	<span class="ka-toggle-label"><?php esc_html_e('Send weekly wishlist summary', 'king-addons'); ?></span>
349	</label>
350	</div>
351	</div>
352	<div class="ka-row">
353	<div class="ka-row-label"><?php esc_html_e('Price Threshold', 'king-addons'); ?></div>
354	<div class="ka-row-field">
355	<input type="number" min="1" max="50" name="king_addons_wishlist_email_settings[price_threshold]" value="<?php echo esc_attr($email_settings['price_threshold'] ?? 5); ?>" style="max-width:80px" />
356	<span style="color:#86868b;margin-left:8px">%</span>
357	<p class="ka-row-desc"><?php esc_html_e('Minimum % drop to trigger notification', 'king-addons'); ?></p>
358	</div>
359	</div>
360	<div class="ka-row">
361	<div class="ka-row-label"><?php esc_html_e('Daily Limit', 'king-addons'); ?></div>
362	<div class="ka-row-field">
363	<input type="number" min="1" max="10" name="king_addons_wishlist_email_settings[daily_email_limit]" value="<?php echo esc_attr($email_settings['daily_email_limit'] ?? 3); ?>" style="max-width:80px" />
364	<span style="color:#86868b;margin-left:8px"><?php esc_html_e('emails/user/day', 'king-addons'); ?></span>
365	</div>
366	</div>
367	</div>
368	</div>
369	<?php endif; ?>
370	</div>
371
372	<div class="ka-card">
373	<div class="ka-submit">
374	<button type="submit" class="ka-btn ka-btn-pink">
375	<?php esc_html_e('Save Settings', 'king-addons'); ?>
376	</button>
377	</div>
378	</div>
379	</form>
380	</div>
381
382	<script>
383	(function($) {
384	'use strict';
385
386	$(document).ready(function() {
387	const ajaxUrl = '<?php echo esc_url(admin_url('admin-ajax.php')); ?>';
388	const nonce = '<?php echo esc_js(wp_create_nonce('king_addons_dashboard_ui')); ?>';
389
390	// Theme segmented control (dashboard-style)
391	const $themeSegment = $('#ka-v3-theme-segment');
392	const $themeSegmentButtons = $themeSegment.find('.ka-v3-segmented-btn');
393	const themeMql = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
394	let themeMode = ($themeSegment.attr('data-active') \|\| 'dark').toString();
395	let themeMqlHandler = null;
396
397	function saveUISetting(key, value) {
398	$.post(ajaxUrl, {
399	action: 'king_addons_save_dashboard_ui',
400	nonce: nonce,
401	key: key,
402	value: value
403	});
404	}
405
406	function updateSegment(mode) {
407	$themeSegment.attr('data-active', mode);
408	$themeSegmentButtons.each(function() {
409	const theme = $(this).data('theme');
410	$(this).attr('aria-pressed', theme === mode ? 'true' : 'false');
411	});
412	}
413
414	function applyThemeClass(isDark) {
415	$('body').toggleClass('ka-v3-dark', isDark);
416	document.documentElement.classList.toggle('ka-v3-dark', isDark);
417	}
418
419	function setThemeMode(mode, save) {
420	themeMode = mode;
421	updateSegment(mode);
422
423	if (themeMqlHandler && themeMql) {
424	if (themeMql.removeEventListener) {
425	themeMql.removeEventListener('change', themeMqlHandler);
426	} else if (themeMql.removeListener) {
427	themeMql.removeListener(themeMqlHandler);
428	}
429	themeMqlHandler = null;
430	}
431
432	if (mode === 'auto') {
433	applyThemeClass(!!(themeMql && themeMql.matches));
434	themeMqlHandler = function(e) {
435	if (themeMode !== 'auto') {
436	return;
437	}
438	applyThemeClass(!!e.matches);
439	};
440	if (themeMql) {
441	if (themeMql.addEventListener) {
442	themeMql.addEventListener('change', themeMqlHandler);
443	} else if (themeMql.addListener) {
444	themeMql.addListener(themeMqlHandler);
445	}
446	}
447	} else {
448	applyThemeClass(mode === 'dark');
449	}
450
451	if (save) {
452	saveUISetting('theme_mode', mode);
453	}
454	}
455
456	$themeSegment.on('click', '.ka-v3-segmented-btn', function(e) {
457	e.preventDefault();
458	const mode = ($(this).data('theme') \|\| 'dark').toString();
459	setThemeMode(mode, true);
460	});
461
462	// Ensure mode applies for Auto (listener + system state)
463	setThemeMode(themeMode, false);
464
465	// Tab navigation
466	$('.ka-tab').on('click', function() {
467	const target = $(this).data('tab');
468	$('.ka-tab').removeClass('active');
469	$(this).addClass('active');
470	$('.ka-tab-content').removeClass('active');
471	$(`.ka-tab-content[data-tab="${target}"]`).addClass('active');
472	});
473
474	// Sortable columns
475	if ($.fn.sortable) {
476	$('#ka-wishlist-columns').sortable({
477	handle: '.ka-sortable-handle',
478	placeholder: 'ui-sortable-placeholder',
479	axis: 'y',
480	cursor: 'move',
481	tolerance: 'pointer'
482	});
483	}
484	});
485	})(jQuery);
486	</script>
487	<?php wp_enqueue_script('jquery-ui-sortable'); ?>
488