PluginProbe
King Addons for Elementor – 100+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce Builder, Mega Menu, Popup Builder / 51.1.84
King Addons for Elementor – 100+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce Builder, Mega Menu, Popup Builder v51.1.84
51.1.86 51.1.84 51.1.85 51.1.83 51.1.82 51.1.81 51.1.79 51.1.78 51.1.77 51.1.76 51.1.74 51.1.75 51.1.65 51.1.64 51.1.63 trunk 51.1.14 51.1.2 51.1.35 51.1.36 51.1.37 51.1.38 51.1.39 51.1.44 51.1.45 All 40 releases
king-addons / includes / extensions / Age_Gate / templates / admin-page.php

admin-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/extensions/Age_Gate/templates/admin-page.php

880 lines 54.2 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 /**
3 * Admin page for Age Gate - V3 Premium style inspired Design.
4 *
5 * @package King_Addons
6 */
7
8 use King_Addons\Age_Gate;
9
10 if (!defined('ABSPATH')) {
11 exit;
12 }
13
14 // Enqueue shared V3 styles
15 wp_enqueue_style(
16 'king-addons-admin-v3',
17 KING_ADDONS_URL . 'includes/admin/layouts/shared/admin-v3-styles.css',
18 [],
19 KING_ADDONS_VERSION
20 );
21
22 $pages = get_pages(['number' => 200]);
23 $page_options = [];
24 foreach ($pages as $page) {
25 $page_options[$page->ID] = $page->post_title;
26 }
27
28 $post_types = get_post_types(['public' => true], 'objects');
29 $elementor_templates = get_posts([
30 'post_type' => 'elementor_library',
31 'posts_per_page' => 50,
32 ]);
33
34 // Normalize options to prevent undefined index notices on fresh installs/older saved settings.
35 $options = (isset($options) && is_array($options)) ? $options : [];
36 $is_premium = isset($is_premium) ? (bool) $is_premium : false;
37
38 $options['general'] = wp_parse_args($options['general'] ?? [], [
39 'enabled' => 0,
40 'audience' => 'guests',
41 'mode' => 'confirm',
42 'min_age' => 18,
43 'cookie_days' => 30,
44 ]);
45
46 $options['display'] = wp_parse_args($options['display'] ?? [], [
47 'scope' => 'site',
48 'exclude_ids' => [],
49 'mode' => 'global',
50 'cpt_scope' => [],
51 'archives' => 0,
52 'woo' => [
53 'enabled' => 0,
54 'apply_to' => 'product',
55 'categories' => [],
56 ],
57 ]);
58 $options['display']['exclude_ids'] = array_map('intval', (array) $options['display']['exclude_ids']);
59 $options['display']['cpt_scope'] = array_values(array_map('strval', (array) $options['display']['cpt_scope']));
60 $options['display']['woo'] = wp_parse_args($options['display']['woo'] ?? [], [
61 'enabled' => 0,
62 'apply_to' => 'product',
63 'categories' => [],
64 ]);
65 $options['display']['woo']['categories'] = array_map('intval', (array) $options['display']['woo']['categories']);
66
67 $product_cats = [];
68 if (taxonomy_exists('product_cat')) {
69 $woo_terms = get_terms([
70 'taxonomy' => 'product_cat',
71 'hide_empty' => false,
72 ]);
73 if (!is_wp_error($woo_terms)) {
74 foreach ($woo_terms as $woo_term) {
75 $product_cats[(int) $woo_term->term_id] = $woo_term->name;
76 }
77 }
78 }
79
80 $options['design'] = wp_parse_args($options['design'] ?? [], [
81 'template' => 'center-card',
82 'overlay_color' => '#000000',
83 'overlay_opacity' => 0.6,
84 'card_background' => '#ffffff',
85 'card_width' => 420,
86 'title' => __('Age Verification', 'king-addons'),
87 'subtitle' => __('You must be 18+ to enter.', 'king-addons'),
88 'text_color' => '#111111',
89 'button_yes' => __('Yes', 'king-addons'),
90 'button_no' => __('No', 'king-addons'),
91 'title_size' => 24,
92 'body_size' => 16,
93 'title_weight' => 700,
94 'body_weight' => 400,
95 'button_yes_color' => '#ffffff',
96 'button_yes_bg' => '#6d28d9',
97 'button_no_color' => '#111111',
98 'button_no_bg' => '#e5e7eb',
99 'button_yes_hover_bg' => '#5b21b6',
100 'button_yes_hover_color' => '#ffffff',
101 'button_no_hover_bg' => '#d1d5db',
102 'button_no_hover_color' => '#111111',
103 'animation' => 'fade',
104 'elementor_template' => 0,
105 'logo' => '',
106 'background_image' => '',
107 ]);
108 $options['design']['elementor_template'] = (int) $options['design']['elementor_template'];
109
110 $options['behaviour'] = wp_parse_args($options['behaviour'] ?? [], [
111 'deny_action' => 'redirect_url',
112 'deny_redirect_page' => 0,
113 'deny_redirect_url' => 'https://google.com',
114 'block_message' => __('Access denied.', 'king-addons'),
115 'reset_on_rule_change' => 0,
116 'repeat_mode' => 'days',
117 'consent_checkbox' => 0,
118 ]);
119 $options['behaviour']['deny_action'] = ($options['behaviour']['deny_action'] === 'redirect') ? 'redirect_page' : $options['behaviour']['deny_action'];
120 $options['behaviour']['deny_redirect_page'] = (int) $options['behaviour']['deny_redirect_page'];
121 $options['behaviour']['deny_redirect_url'] = is_string($options['behaviour']['deny_redirect_url']) ? trim($options['behaviour']['deny_redirect_url']) : 'https://google.com';
122
123 $options['dob'] = wp_parse_args($options['dob'] ?? [], [
124 'format' => 'dmy',
125 'max_age' => 120,
126 'error_invalid' => __('Please enter a valid date.', 'king-addons'),
127 'error_denied' => __('You do not meet the minimum age requirement.', 'king-addons'),
128 ]);
129 $options['dob']['max_age'] = (int) $options['dob']['max_age'];
130
131 $options['geo'] = wp_parse_args($options['geo'] ?? [], [
132 'enabled' => 0,
133 'default_age' => 18,
134 'map' => [],
135 ]);
136 $options['geo']['default_age'] = (int) $options['geo']['default_age'];
137 if (is_string($options['geo']['map'])) {
138 $map = [];
139 foreach (preg_split('/\r\n|\r|\n/', $options['geo']['map']) as $line) {
140 $line = trim($line);
141 if ($line === '' || strpos($line, '=') === false) {
142 continue;
143 }
144 [$code, $age] = array_map('trim', explode('=', $line, 2));
145 if ($code === '') {
146 continue;
147 }
148 $map[strtoupper($code)] = (int) $age;
149 }
150 $options['geo']['map'] = $map;
151 }
152 if (!is_array($options['geo']['map'])) {
153 $options['geo']['map'] = [];
154 }
155
156 // Theme mode is per-user
157 $theme_mode = get_user_meta(get_current_user_id(), 'king_addons_theme_mode', true);
158 $allowed_theme_modes = ['dark', 'light', 'auto'];
159 if (!in_array($theme_mode, $allowed_theme_modes, true)) {
160 $theme_mode = 'auto';
161 }
162 ?>
163 <script>
164 (function() {
165 const mode = '<?php echo esc_js($theme_mode); ?>';
166 const mql = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
167 const isDark = mode === 'auto' ? !!(mql && mql.matches) : mode === 'dark';
168 document.documentElement.classList.toggle('ka-v3-dark', isDark);
169 document.body && document.body.classList.add('ka-admin-v3');
170 document.body && document.body.classList.toggle('ka-v3-dark', isDark);
171 })();
172 </script>
173
174 <div class="ka-admin-wrap">
175 <!-- Header -->
176 <div class="ka-admin-header">
177 <div class="ka-admin-header-left">
178 <div class="ka-admin-header-icon purple">
179 <span class="dashicons dashicons-lock"></span>
180 </div>
181 <div>
182 <h1 class="ka-admin-title"><?php esc_html_e('Age Gate', 'king-addons'); ?></h1>
183 <p class="ka-admin-subtitle"><?php esc_html_e('Age verification overlay for restricted content', 'king-addons'); ?></p>
184 </div>
185 </div>
186 <div class="ka-admin-header-actions">
187 <span class="ka-status <?php echo !empty($options['general']['enabled']) ? 'ka-status-enabled' : 'ka-status-disabled'; ?>">
188 <span class="ka-status-dot"></span>
189 <?php echo !empty($options['general']['enabled']) ? esc_html__('Enabled', 'king-addons') : esc_html__('Disabled', 'king-addons'); ?>
190 </span>
191 <div class="ka-v3-segmented" id="ka-v3-theme-segment" role="radiogroup" aria-label="Theme" data-active="<?php echo esc_attr($theme_mode); ?>">
192 <span class="ka-v3-segmented-indicator" aria-hidden="true"></span>
193 <button type="button" class="ka-v3-segmented-btn" data-theme="light" aria-pressed="<?php echo $theme_mode === 'light' ? 'true' : 'false'; ?>">
194 <span class="ka-v3-segmented-icon" aria-hidden="true">☀︎</span>
195 <?php esc_html_e('Light', 'king-addons'); ?>
196 </button>
197 <button type="button" class="ka-v3-segmented-btn" data-theme="dark" aria-pressed="<?php echo $theme_mode === 'dark' ? 'true' : 'false'; ?>">
198 <span class="ka-v3-segmented-icon" aria-hidden="true">☾</span>
199 <?php esc_html_e('Dark', 'king-addons'); ?>
200 </button>
201 <button type="button" class="ka-v3-segmented-btn" data-theme="auto" aria-pressed="<?php echo $theme_mode === 'auto' ? 'true' : 'false'; ?>">
202 <span class="ka-v3-segmented-icon" aria-hidden="true">◐</span>
203 <?php esc_html_e('Auto', 'king-addons'); ?>
204 </button>
205 </div>
206 </div>
207 </div>
208
209 <?php settings_errors('king_addons_age_gate'); ?>
210
211 <!-- Tabs -->
212 <div class="ka-tabs">
213 <button type="button" class="ka-tab active" data-tab="general"><?php esc_html_e('General', 'king-addons'); ?></button>
214 <button type="button" class="ka-tab" data-tab="display"><?php esc_html_e('Display Rules', 'king-addons'); ?></button>
215 <button type="button" class="ka-tab" data-tab="design"><?php esc_html_e('Design', 'king-addons'); ?></button>
216 <button type="button" class="ka-tab" data-tab="behaviour"><?php esc_html_e('Behaviour', 'king-addons'); ?></button>
217 <button type="button" class="ka-tab" data-tab="pro">
218 <?php esc_html_e('Pro Features', 'king-addons'); ?>
219 <?php if (!$is_premium): ?><span class="ka-pro-badge">PRO</span><?php endif; ?>
220 </button>
221 </div>
222
223 <form method="post" action="options.php">
224 <?php settings_fields('king_addons_age_gate'); ?>
225
226 <!-- General Tab -->
227 <div class="ka-tab-content active" data-tab="general">
228 <div class="ka-card">
229 <div class="ka-card-header">
230 <span class="dashicons dashicons-admin-settings"></span>
231 <h2><?php esc_html_e('General Settings', '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('Enable', 'king-addons'); ?></div>
236 <div class="ka-row-field">
237 <label class="ka-toggle">
238 <input type="checkbox" name="king_addons_age_gate_options[general][enabled]" value="1" <?php checked(!empty($options['general']['enabled'])); ?>>
239 <span class="ka-toggle-slider"></span>
240 <span class="ka-toggle-label"><?php esc_html_e('Turn on age verification', 'king-addons'); ?></span>
241 </label>
242 </div>
243 </div>
244 <div class="ka-row">
245 <div class="ka-row-label"><?php esc_html_e('Audience', 'king-addons'); ?></div>
246 <div class="ka-row-field">
247 <select name="king_addons_age_gate_options[general][audience]">
248 <option value="guests" <?php selected($options['general']['audience'], 'guests'); ?>><?php esc_html_e('Guests only', 'king-addons'); ?></option>
249 <option value="all" <?php selected($options['general']['audience'], 'all'); ?>><?php esc_html_e('Guests and logged-in users', 'king-addons'); ?></option>
250 </select>
251 <p class="ka-row-desc"><?php esc_html_e('Show gate to logged-in users too?', 'king-addons'); ?></p>
252 </div>
253 </div>
254 <div class="ka-row">
255 <div class="ka-row-label"><?php esc_html_e('Verification Mode', 'king-addons'); ?></div>
256 <div class="ka-row-field">
257 <div class="ka-radio-group">
258 <label class="ka-radio-item">
259 <input type="radio" name="king_addons_age_gate_options[general][mode]" value="confirm" <?php checked($options['general']['mode'], 'confirm'); ?>>
260 <?php esc_html_e('Simple confirmation (Yes/No)', 'king-addons'); ?>
261 </label>
262 <label class="ka-radio-item">
263 <input type="radio" name="king_addons_age_gate_options[general][mode]" value="minimum" <?php checked($options['general']['mode'], 'minimum'); ?>>
264 <?php esc_html_e('Minimum age text', 'king-addons'); ?>
265 </label>
266 <label class="ka-radio-item" style="<?php echo $is_premium ? '' : 'opacity: 0.6;'; ?>">
267 <input type="radio" name="king_addons_age_gate_options[general][mode]" value="dob" <?php checked($options['general']['mode'], 'dob'); ?> <?php disabled(!$is_premium); ?>>
268 <?php esc_html_e('Date of birth', 'king-addons'); ?>
269 <?php if (!$is_premium): ?><span class="ka-pro-badge">PRO</span><?php endif; ?>
270 </label>
271 </div>
272 </div>
273 </div>
274 <div class="ka-row">
275 <div class="ka-row-label"><?php esc_html_e('Minimum Age', 'king-addons'); ?></div>
276 <div class="ka-row-field">
277 <input type="number" min="0" name="king_addons_age_gate_options[general][min_age]" value="<?php echo esc_attr($options['general']['min_age']); ?>" style="max-width: 100px;">
278 <span style="color: #86868b; margin-left: 8px;"><?php esc_html_e('years', 'king-addons'); ?></span>
279 </div>
280 </div>
281 <div class="ka-row">
282 <div class="ka-row-label"><?php esc_html_e('Cookie Lifetime', 'king-addons'); ?></div>
283 <div class="ka-row-field">
284 <input type="number" min="0" name="king_addons_age_gate_options[general][cookie_days]" value="<?php echo esc_attr($options['general']['cookie_days']); ?>" style="max-width: 100px;">
285 <span style="color: #86868b; margin-left: 8px;"><?php esc_html_e('days (0 = session)', 'king-addons'); ?></span>
286 </div>
287 </div>
288 </div>
289 </div>
290 </div>
291
292 <!-- Display Tab -->
293 <div class="ka-tab-content" data-tab="display">
294 <div class="ka-card">
295 <div class="ka-card-header">
296 <span class="dashicons dashicons-visibility"></span>
297 <h2><?php esc_html_e('Display Rules', 'king-addons'); ?></h2>
298 </div>
299 <div class="ka-card-body">
300 <div class="ka-row">
301 <div class="ka-row-label"><?php esc_html_e('Scope', 'king-addons'); ?></div>
302 <div class="ka-row-field">
303 <select name="king_addons_age_gate_options[display][scope]">
304 <option value="site" <?php selected($options['display']['scope'], 'site'); ?>><?php esc_html_e('Entire site', 'king-addons'); ?></option>
305 <option value="posts" <?php selected($options['display']['scope'], 'posts'); ?>><?php esc_html_e('All posts', 'king-addons'); ?></option>
306 <option value="pages" <?php selected($options['display']['scope'], 'pages'); ?>><?php esc_html_e('All pages', 'king-addons'); ?></option>
307 </select>
308 </div>
309 </div>
310 <div class="ka-row">
311 <div class="ka-row-label"><?php esc_html_e('Exclude Pages', 'king-addons'); ?></div>
312 <div class="ka-row-field">
313 <select name="king_addons_age_gate_options[display][exclude_ids][]" multiple size="5" style="max-width: 100%; min-height: 120px;">
314 <?php foreach ($page_options as $id => $title): ?>
315 <option value="<?php echo esc_attr($id); ?>" <?php selected(in_array($id, $options['display']['exclude_ids'], true)); ?>>
316 <?php echo esc_html($title); ?>
317 </option>
318 <?php endforeach; ?>
319 </select>
320 <p class="ka-row-desc"><?php esc_html_e('Hold Ctrl/Cmd to select multiple', 'king-addons'); ?></p>
321 </div>
322 </div>
323 <div class="ka-row">
324 <div class="ka-row-label"><?php esc_html_e('Display Mode', 'king-addons'); ?></div>
325 <div class="ka-row-field">
326 <select name="king_addons_age_gate_options[display][mode]" <?php disabled(!$is_premium); ?>>
327 <option value="global" <?php selected($options['display']['mode'], 'global'); ?>><?php esc_html_e('Global (use scope)', 'king-addons'); ?></option>
328 <option value="custom" <?php selected($options['display']['mode'], 'custom'); ?> <?php disabled(!$is_premium); ?>><?php esc_html_e('Custom rules', 'king-addons'); ?></option>
329 </select>
330 <?php if (!$is_premium): ?>
331 <p class="ka-row-desc"><?php esc_html_e('Custom rules available in Pro', 'king-addons'); ?></p>
332 <?php endif; ?>
333 </div>
334 </div>
335 <?php if ($is_premium): ?>
336 <div class="ka-row">
337 <div class="ka-row-label"><?php esc_html_e('Custom Post Types', 'king-addons'); ?></div>
338 <div class="ka-row-field">
339 <select name="king_addons_age_gate_options[display][cpt_scope][]" multiple size="4" style="max-width: 100%; min-height: 100px;">
340 <?php foreach ($post_types as $slug => $pt): ?>
341 <option value="<?php echo esc_attr($slug); ?>" <?php selected(in_array($slug, $options['display']['cpt_scope'], true)); ?>>
342 <?php echo esc_html($pt->labels->name); ?>
343 </option>
344 <?php endforeach; ?>
345 </select>
346 </div>
347 </div>
348 <div class="ka-row">
349 <div class="ka-row-label"><?php esc_html_e('Archives', 'king-addons'); ?></div>
350 <div class="ka-row-field">
351 <label class="ka-toggle">
352 <input type="checkbox" name="king_addons_age_gate_options[display][archives]" value="1" <?php checked(!empty($options['display']['archives'])); ?>>
353 <span class="ka-toggle-slider"></span>
354 <span class="ka-toggle-label"><?php esc_html_e('Show on archives', 'king-addons'); ?></span>
355 </label>
356 </div>
357 </div>
358 <div class="ka-row">
359 <div class="ka-row-label"><?php esc_html_e('WooCommerce', 'king-addons'); ?></div>
360 <div class="ka-row-field">
361 <label class="ka-toggle">
362 <input type="checkbox" name="king_addons_age_gate_options[display][woo][enabled]" value="1" <?php checked(!empty($options['display']['woo']['enabled'])); ?>>
363 <span class="ka-toggle-slider"></span>
364 <span class="ka-toggle-label"><?php esc_html_e('Show on WooCommerce', 'king-addons'); ?></span>
365 </label>
366 <select name="king_addons_age_gate_options[display][woo][apply_to]" style="margin-top: 10px; max-width: 100%;">
367 <option value="product" <?php selected($options['display']['woo']['apply_to'], 'product'); ?>><?php esc_html_e('Single products', 'king-addons'); ?></option>
368 <option value="category" <?php selected($options['display']['woo']['apply_to'], 'category'); ?>><?php esc_html_e('Product categories', 'king-addons'); ?></option>
369 <option value="shop" <?php selected($options['display']['woo']['apply_to'], 'shop'); ?>><?php esc_html_e('Shop page', 'king-addons'); ?></option>
370 </select>
371 <?php if ($product_cats): ?>
372 <select name="king_addons_age_gate_options[display][woo][categories][]" multiple size="4" style="margin-top: 10px; max-width: 100%; min-height: 100px;">
373 <?php foreach ($product_cats as $cat_id => $cat_name): ?>
374 <option value="<?php echo esc_attr((string) $cat_id); ?>" <?php selected(in_array((int) $cat_id, $options['display']['woo']['categories'], true)); ?>>
375 <?php echo esc_html($cat_name); ?>
376 </option>
377 <?php endforeach; ?>
378 </select>
379 <p class="ka-row-desc"><?php esc_html_e('Leave categories empty to match every product or every product category. The shop page ignores this list.', 'king-addons'); ?></p>
380 <?php endif; ?>
381 </div>
382 </div>
383 <?php endif; ?>
384 </div>
385 </div>
386 </div>
387
388 <!-- Design Tab -->
389 <div class="ka-tab-content" data-tab="design">
390 <div class="ka-card">
391 <div class="ka-card-header">
392 <span class="dashicons dashicons-art pink"></span>
393 <h2><?php esc_html_e('Appearance', 'king-addons'); ?></h2>
394 </div>
395 <div class="ka-card-body">
396 <div class="ka-row">
397 <div class="ka-row-label"><?php esc_html_e('Template', 'king-addons'); ?></div>
398 <div class="ka-row-field">
399 <select name="king_addons_age_gate_options[design][template]">
400 <option value="center-card" <?php selected($options['design']['template'], 'center-card'); ?>><?php esc_html_e('Centered card', 'king-addons'); ?></option>
401 <option value="bottom-card" <?php selected($options['design']['template'], 'bottom-card'); ?>><?php esc_html_e('Bottom card', 'king-addons'); ?></option>
402 <option value="top-card" <?php selected($options['design']['template'], 'top-card'); ?>><?php esc_html_e('Top card', 'king-addons'); ?></option>
403 <option value="side-left" <?php selected($options['design']['template'], 'side-left'); ?>><?php esc_html_e('Side panel (left)', 'king-addons'); ?></option>
404 <option value="side-right" <?php selected($options['design']['template'], 'side-right'); ?>><?php esc_html_e('Side panel (right)', 'king-addons'); ?></option>
405 <option value="fullscreen" <?php selected($options['design']['template'], 'fullscreen'); ?>><?php esc_html_e('Fullscreen modal', 'king-addons'); ?></option>
406 </select>
407 </div>
408 </div>
409 <div class="ka-row">
410 <div class="ka-row-label"><?php esc_html_e('Overlay', 'king-addons'); ?></div>
411 <div class="ka-row-field">
412 <div class="ka-grid-2">
413 <div>
414 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Color', 'king-addons'); ?></label>
415 <input type="color" name="king_addons_age_gate_options[design][overlay_color]" value="<?php echo esc_attr($options['design']['overlay_color']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
416 </div>
417 <div>
418 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Opacity', 'king-addons'); ?></label>
419 <input type="number" step="0.05" min="0" max="1" name="king_addons_age_gate_options[design][overlay_opacity]" value="<?php echo esc_attr($options['design']['overlay_opacity']); ?>" style="max-width: 100px;">
420 </div>
421 </div>
422 </div>
423 </div>
424 <div class="ka-row">
425 <div class="ka-row-label"><?php esc_html_e('Card', 'king-addons'); ?></div>
426 <div class="ka-row-field">
427 <div class="ka-grid-2">
428 <div>
429 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Background', 'king-addons'); ?></label>
430 <input type="color" name="king_addons_age_gate_options[design][card_background]" value="<?php echo esc_attr($options['design']['card_background']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
431 </div>
432 <div>
433 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Width (px)', 'king-addons'); ?></label>
434 <input type="number" min="280" name="king_addons_age_gate_options[design][card_width]" value="<?php echo esc_attr($options['design']['card_width']); ?>" style="max-width: 100px;">
435 </div>
436 </div>
437 </div>
438 </div>
439 <div class="ka-row">
440 <div class="ka-row-label"><?php esc_html_e('Text Content', 'king-addons'); ?></div>
441 <div class="ka-row-field">
442 <input type="text" name="king_addons_age_gate_options[design][title]" value="<?php echo esc_attr($options['design']['title']); ?>" placeholder="<?php esc_attr_e('Title', 'king-addons'); ?>" style="margin-bottom: 12px;">
443 <input type="text" name="king_addons_age_gate_options[design][subtitle]" value="<?php echo esc_attr($options['design']['subtitle']); ?>" placeholder="<?php esc_attr_e('Subtitle', 'king-addons'); ?>">
444 </div>
445 </div>
446 <div class="ka-row">
447 <div class="ka-row-label"><?php esc_html_e('Text Color', 'king-addons'); ?></div>
448 <div class="ka-row-field">
449 <input type="color" name="king_addons_age_gate_options[design][text_color]" value="<?php echo esc_attr($options['design']['text_color']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
450 </div>
451 </div>
452 <div class="ka-row">
453 <div class="ka-row-label"><?php esc_html_e('Button Labels', 'king-addons'); ?></div>
454 <div class="ka-row-field">
455 <div class="ka-grid-2">
456 <div>
457 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Yes', 'king-addons'); ?></label>
458 <input type="text" name="king_addons_age_gate_options[design][button_yes]" value="<?php echo esc_attr($options['design']['button_yes']); ?>">
459 </div>
460 <div>
461 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('No', 'king-addons'); ?></label>
462 <input type="text" name="king_addons_age_gate_options[design][button_no]" value="<?php echo esc_attr($options['design']['button_no']); ?>">
463 </div>
464 </div>
465 </div>
466 </div>
467 <div class="ka-row">
468 <div class="ka-row-label"><?php esc_html_e('Typography', 'king-addons'); ?></div>
469 <div class="ka-row-field">
470 <div class="ka-grid-2" style="gap: 16px;">
471 <div>
472 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Title Size', 'king-addons'); ?></label>
473 <input type="number" min="10" name="king_addons_age_gate_options[design][title_size]" value="<?php echo esc_attr($options['design']['title_size']); ?>" style="max-width: 100px;">
474 </div>
475 <div>
476 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Body Size', 'king-addons'); ?></label>
477 <input type="number" min="10" name="king_addons_age_gate_options[design][body_size]" value="<?php echo esc_attr($options['design']['body_size']); ?>" style="max-width: 100px;">
478 </div>
479 <div>
480 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Title Weight', 'king-addons'); ?></label>
481 <input type="number" min="100" step="100" name="king_addons_age_gate_options[design][title_weight]" value="<?php echo esc_attr($options['design']['title_weight']); ?>" style="max-width: 100px;">
482 </div>
483 <div>
484 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Body Weight', 'king-addons'); ?></label>
485 <input type="number" min="100" step="100" name="king_addons_age_gate_options[design][body_weight]" value="<?php echo esc_attr($options['design']['body_weight']); ?>" style="max-width: 100px;">
486 </div>
487 </div>
488 </div>
489 </div>
490 <div class="ka-row">
491 <div class="ka-row-label"><?php esc_html_e('Button Styles', 'king-addons'); ?></div>
492 <div class="ka-row-field">
493 <div class="ka-grid-2" style="gap: 16px;">
494 <div>
495 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Yes Text', 'king-addons'); ?></label>
496 <input type="color" name="king_addons_age_gate_options[design][button_yes_color]" value="<?php echo esc_attr($options['design']['button_yes_color']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
497 </div>
498 <div>
499 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Yes BG', 'king-addons'); ?></label>
500 <input type="color" name="king_addons_age_gate_options[design][button_yes_bg]" value="<?php echo esc_attr($options['design']['button_yes_bg']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
501 </div>
502 <div>
503 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('No Text', 'king-addons'); ?></label>
504 <input type="color" name="king_addons_age_gate_options[design][button_no_color]" value="<?php echo esc_attr($options['design']['button_no_color']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
505 </div>
506 <div>
507 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('No BG', 'king-addons'); ?></label>
508 <input type="color" name="king_addons_age_gate_options[design][button_no_bg]" value="<?php echo esc_attr($options['design']['button_no_bg']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
509 </div>
510 </div>
511 </div>
512 </div>
513 <?php if ($is_premium): ?>
514 <div class="ka-row">
515 <div class="ka-row-label"><?php esc_html_e('Hover Styles', 'king-addons'); ?></div>
516 <div class="ka-row-field">
517 <div class="ka-grid-2" style="gap: 16px;">
518 <div>
519 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Yes Hover BG', 'king-addons'); ?></label>
520 <input type="color" name="king_addons_age_gate_options[design][button_yes_hover_bg]" value="<?php echo esc_attr($options['design']['button_yes_hover_bg']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
521 </div>
522 <div>
523 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('Yes Hover Text', 'king-addons'); ?></label>
524 <input type="color" name="king_addons_age_gate_options[design][button_yes_hover_color]" value="<?php echo esc_attr($options['design']['button_yes_hover_color']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
525 </div>
526 <div>
527 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('No Hover BG', 'king-addons'); ?></label>
528 <input type="color" name="king_addons_age_gate_options[design][button_no_hover_bg]" value="<?php echo esc_attr($options['design']['button_no_hover_bg']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
529 </div>
530 <div>
531 <label style="font-size: 12px; color: #86868b; display: block; margin-bottom: 6px;"><?php esc_html_e('No Hover Text', 'king-addons'); ?></label>
532 <input type="color" name="king_addons_age_gate_options[design][button_no_hover_color]" value="<?php echo esc_attr($options['design']['button_no_hover_color']); ?>" style="width: 60px; height: 40px; padding: 2px; border: 1px solid rgba(0,0,0,0.1); border-radius: 8px;">
533 </div>
534 </div>
535 </div>
536 </div>
537 <div class="ka-row">
538 <div class="ka-row-label"><?php esc_html_e('Animation', 'king-addons'); ?></div>
539 <div class="ka-row-field">
540 <select name="king_addons_age_gate_options[design][animation]">
541 <option value="none" <?php selected($options['design']['animation'], 'none'); ?>><?php esc_html_e('None', 'king-addons'); ?></option>
542 <option value="fade" <?php selected($options['design']['animation'], 'fade'); ?>><?php esc_html_e('Fade', 'king-addons'); ?></option>
543 <option value="slide-up" <?php selected($options['design']['animation'], 'slide-up'); ?>><?php esc_html_e('Slide up', 'king-addons'); ?></option>
544 <option value="zoom" <?php selected($options['design']['animation'], 'zoom'); ?>><?php esc_html_e('Zoom', 'king-addons'); ?></option>
545 </select>
546 </div>
547 </div>
548 <div class="ka-row">
549 <div class="ka-row-label"><?php esc_html_e('Elementor Template', 'king-addons'); ?></div>
550 <div class="ka-row-field">
551 <select name="king_addons_age_gate_options[design][elementor_template]">
552 <option value="0"><?php esc_html_e('— None —', 'king-addons'); ?></option>
553 <?php foreach ($elementor_templates as $tmpl): ?>
554 <option value="<?php echo esc_attr($tmpl->ID); ?>" <?php selected((int)$options['design']['elementor_template'], (int)$tmpl->ID); ?>>
555 <?php echo esc_html($tmpl->post_title); ?>
556 </option>
557 <?php endforeach; ?>
558 </select>
559 </div>
560 </div>
561 <div class="ka-row">
562 <div class="ka-row-label"><?php esc_html_e('Brand Assets', 'king-addons'); ?></div>
563 <div class="ka-row-field">
564 <input type="url" name="king_addons_age_gate_options[design][logo]" value="<?php echo esc_attr($options['design']['logo']); ?>" placeholder="<?php esc_attr_e('Logo URL', 'king-addons'); ?>" style="margin-bottom: 12px;">
565 <input type="url" name="king_addons_age_gate_options[design][background_image]" value="<?php echo esc_attr($options['design']['background_image']); ?>" placeholder="<?php esc_attr_e('Background image URL', 'king-addons'); ?>">
566 </div>
567 </div>
568 <?php endif; ?>
569 </div>
570 </div>
571 </div>
572
573 <!-- Behaviour Tab -->
574 <div class="ka-tab-content" data-tab="behaviour">
575 <div class="ka-card">
576 <div class="ka-card-header">
577 <span class="dashicons dashicons-controls-play"></span>
578 <h2><?php esc_html_e('Behaviour Settings', 'king-addons'); ?></h2>
579 </div>
580 <div class="ka-card-body">
581 <div class="ka-row">
582 <div class="ka-row-label"><?php esc_html_e('On Denial', 'king-addons'); ?></div>
583 <div class="ka-row-field">
584 <select name="king_addons_age_gate_options[behaviour][deny_action]">
585 <option value="redirect_page" <?php selected($options['behaviour']['deny_action'], 'redirect_page'); ?>><?php esc_html_e('Redirect to page', 'king-addons'); ?></option>
586 <option value="redirect_url" <?php selected($options['behaviour']['deny_action'], 'redirect_url'); ?>><?php esc_html_e('Redirect to URL', 'king-addons'); ?></option>
587 <option value="block" <?php selected($options['behaviour']['deny_action'], 'block'); ?>><?php esc_html_e('Show blocked message', 'king-addons'); ?></option>
588 </select>
589 </div>
590 </div>
591 <div class="ka-row" id="ka-age-gate-deny-page-row">
592 <div class="ka-row-label"><?php esc_html_e('Redirect Page', 'king-addons'); ?></div>
593 <div class="ka-row-field">
594 <select name="king_addons_age_gate_options[behaviour][deny_redirect_page]">
595 <option value="0"><?php esc_html_e('— Select page —', 'king-addons'); ?></option>
596 <?php foreach ($page_options as $id => $title): ?>
597 <option value="<?php echo esc_attr($id); ?>" <?php selected((int)$options['behaviour']['deny_redirect_page'], (int)$id); ?>>
598 <?php echo esc_html($title); ?>
599 </option>
600 <?php endforeach; ?>
601 </select>
602 <p class="ka-row-desc"><?php esc_html_e('If a page is selected, it will be used for redirect.', 'king-addons'); ?></p>
603 </div>
604 </div>
605 <div class="ka-row" id="ka-age-gate-deny-url-row">
606 <div class="ka-row-label"><?php esc_html_e('Redirect URL', 'king-addons'); ?></div>
607 <div class="ka-row-field">
608 <input type="url" name="king_addons_age_gate_options[behaviour][deny_redirect_url]" value="<?php echo esc_attr($options['behaviour']['deny_redirect_url']); ?>" placeholder="https://google.com">
609 <p class="ka-row-desc"><?php esc_html_e('Used only when no redirect page is selected.', 'king-addons'); ?></p>
610 </div>
611 </div>
612 <div class="ka-row">
613 <div class="ka-row-label"><?php esc_html_e('Block Message', 'king-addons'); ?></div>
614 <div class="ka-row-field">
615 <input type="text" name="king_addons_age_gate_options[behaviour][block_message]" value="<?php echo esc_attr($options['behaviour']['block_message']); ?>">
616 </div>
617 </div>
618 <div class="ka-row">
619 <div class="ka-row-label"><?php esc_html_e('Reset on Change', 'king-addons'); ?></div>
620 <div class="ka-row-field">
621 <label class="ka-toggle">
622 <input type="checkbox" name="king_addons_age_gate_options[behaviour][reset_on_rule_change]" value="1" <?php checked(!empty($options['behaviour']['reset_on_rule_change'])); ?>>
623 <span class="ka-toggle-slider"></span>
624 <span class="ka-toggle-label"><?php esc_html_e('Invalidate decisions on save', 'king-addons'); ?></span>
625 </label>
626 </div>
627 </div>
628 <?php if ($is_premium): ?>
629 <div class="ka-row">
630 <div class="ka-row-label"><?php esc_html_e('Repeat Prompt', 'king-addons'); ?></div>
631 <div class="ka-row-field">
632 <select name="king_addons_age_gate_options[behaviour][repeat_mode]">
633 <option value="days" <?php selected($options['behaviour']['repeat_mode'], 'days'); ?>><?php esc_html_e('Remember N days', 'king-addons'); ?></option>
634 <option value="session" <?php selected($options['behaviour']['repeat_mode'], 'session'); ?>><?php esc_html_e('Every session', 'king-addons'); ?></option>
635 <option value="once" <?php selected($options['behaviour']['repeat_mode'], 'once'); ?>><?php esc_html_e('Forever', 'king-addons'); ?></option>
636 </select>
637 </div>
638 </div>
639 <div class="ka-row">
640 <div class="ka-row-label"><?php esc_html_e('Consent Checkbox', 'king-addons'); ?></div>
641 <div class="ka-row-field">
642 <label class="ka-toggle">
643 <input type="checkbox" name="king_addons_age_gate_options[behaviour][consent_checkbox]" value="1" <?php checked(!empty($options['behaviour']['consent_checkbox'])); ?>>
644 <span class="ka-toggle-slider"></span>
645 <span class="ka-toggle-label"><?php esc_html_e('Require consent checkbox', 'king-addons'); ?></span>
646 </label>
647 </div>
648 </div>
649 <?php endif; ?>
650 </div>
651 </div>
652 </div>
653
654 <!-- Pro Tab -->
655 <div class="ka-tab-content" data-tab="pro">
656 <?php if (!$is_premium): ?>
657 <div class="ka-pro-notice">
658 <h2><?php esc_html_e('Pro Features', 'king-addons'); ?></h2>
659 <p><?php esc_html_e('Upgrade to Pro for DOB validation, geo rules, and advanced features.', 'king-addons'); ?></p>
660 <a href="https://kingaddons.com/pricing/" target="_blank" class="ka-btn ka-btn-pink"><?php esc_html_e('Upgrade Now', 'king-addons'); ?></a>
661 </div>
662 <?php else: ?>
663 <div class="ka-card">
664 <div class="ka-card-header">
665 <span class="dashicons dashicons-calendar-alt"></span>
666 <h2><?php esc_html_e('Date of Birth Validation', 'king-addons'); ?></h2>
667 </div>
668 <div class="ka-card-body">
669 <div class="ka-row">
670 <div class="ka-row-label"><?php esc_html_e('Date Format', 'king-addons'); ?></div>
671 <div class="ka-row-field">
672 <select name="king_addons_age_gate_options[dob][format]">
673 <option value="dmy" <?php selected($options['dob']['format'], 'dmy'); ?>>DD/MM/YYYY</option>
674 <option value="mdy" <?php selected($options['dob']['format'], 'mdy'); ?>>MM/DD/YYYY</option>
675 <option value="ymd" <?php selected($options['dob']['format'], 'ymd'); ?>>YYYY/MM/DD</option>
676 </select>
677 </div>
678 </div>
679 <div class="ka-row">
680 <div class="ka-row-label"><?php esc_html_e('Max Age', 'king-addons'); ?></div>
681 <div class="ka-row-field">
682 <input type="number" min="10" name="king_addons_age_gate_options[dob][max_age]" value="<?php echo esc_attr($options['dob']['max_age']); ?>" style="max-width: 100px;">
683 </div>
684 </div>
685 <div class="ka-row">
686 <div class="ka-row-label"><?php esc_html_e('Error Messages', 'king-addons'); ?></div>
687 <div class="ka-row-field">
688 <input type="text" name="king_addons_age_gate_options[dob][error_invalid]" value="<?php echo esc_attr($options['dob']['error_invalid']); ?>" placeholder="<?php esc_attr_e('Invalid date message', 'king-addons'); ?>" style="margin-bottom: 12px;">
689 <input type="text" name="king_addons_age_gate_options[dob][error_denied]" value="<?php echo esc_attr($options['dob']['error_denied']); ?>" placeholder="<?php esc_attr_e('Under age message', 'king-addons'); ?>">
690 </div>
691 </div>
692 </div>
693 </div>
694 <div class="ka-card">
695 <div class="ka-card-header">
696 <span class="dashicons dashicons-admin-site"></span>
697 <h2><?php esc_html_e('Geo Rules', 'king-addons'); ?></h2>
698 </div>
699 <div class="ka-card-body">
700 <div class="ka-row">
701 <div class="ka-row-label"><?php esc_html_e('Enable', 'king-addons'); ?></div>
702 <div class="ka-row-field">
703 <label class="ka-toggle">
704 <input type="checkbox" name="king_addons_age_gate_options[geo][enabled]" value="1" <?php checked(!empty($options['geo']['enabled'])); ?>>
705 <span class="ka-toggle-slider"></span>
706 <span class="ka-toggle-label"><?php esc_html_e('Country-based minimum age', 'king-addons'); ?></span>
707 </label>
708 </div>
709 </div>
710 <div class="ka-row">
711 <div class="ka-row-label"><?php esc_html_e('Default Age', 'king-addons'); ?></div>
712 <div class="ka-row-field">
713 <input type="number" min="0" name="king_addons_age_gate_options[geo][default_age]" value="<?php echo esc_attr($options['geo']['default_age']); ?>" style="max-width: 100px;">
714 </div>
715 </div>
716 <div class="ka-row">
717 <div class="ka-row-label"><?php esc_html_e('Country Map', 'king-addons'); ?></div>
718 <div class="ka-row-field">
719 <textarea name="king_addons_age_gate_options[geo][map]" rows="5" placeholder="US=21&#10;UK=18&#10;DE=16" style="max-width: 300px;"><?php
720 foreach ($options['geo']['map'] as $code => $age) {
721 echo esc_html($code . '=' . $age . "\n");
722 }
723 ?></textarea>
724 <p class="ka-row-desc"><?php esc_html_e('One per line: CODE=AGE', 'king-addons'); ?></p>
725 </div>
726 </div>
727 </div>
728 </div>
729 <?php endif; ?>
730 </div>
731
732 <!-- Submit -->
733 <div class="ka-card">
734 <div class="ka-submit">
735 <button type="submit" class="ka-btn ka-btn-primary"><?php esc_html_e('Save Settings', 'king-addons'); ?></button>
736 </div>
737 </div>
738 </form>
739 </div>
740
741 <script>
742 (function($) {
743 'use strict';
744
745 // Tab navigation
746 const tabs = document.querySelectorAll('.ka-tab');
747 const contents = document.querySelectorAll('.ka-tab-content');
748
749 tabs.forEach(tab => {
750 tab.addEventListener('click', function(e) {
751 e.preventDefault();
752 const target = this.dataset.tab;
753 tabs.forEach(t => t.classList.remove('active'));
754 contents.forEach(c => c.classList.remove('active'));
755 this.classList.add('active');
756 document.querySelector(`.ka-tab-content[data-tab="${target}"]`).classList.add('active');
757 });
758 });
759
760 // Behaviour: toggle redirect destination fields.
761 (function() {
762 const select = document.querySelector('select[name="king_addons_age_gate_options[behaviour][deny_action]"]');
763 const pageRow = document.getElementById('ka-age-gate-deny-page-row');
764 const urlRow = document.getElementById('ka-age-gate-deny-url-row');
765
766 function sync() {
767 if (!select) {
768 return;
769 }
770 const value = (select.value || '').toString();
771 if (pageRow) {
772 pageRow.style.display = value === 'redirect_page' ? '' : 'none';
773 }
774 if (urlRow) {
775 urlRow.style.display = value === 'redirect_url' ? '' : 'none';
776 }
777 }
778
779 if (select) {
780 select.addEventListener('change', sync);
781 sync();
782 }
783 })();
784 })(jQuery);
785
786 // Theme segmented control (dashboard-style)
787 (function() {
788 const ajaxUrl = '<?php echo esc_url(admin_url('admin-ajax.php')); ?>';
789 const nonce = '<?php echo esc_js(wp_create_nonce('king_addons_dashboard_ui')); ?>';
790 const segment = document.getElementById('ka-v3-theme-segment');
791 const mql = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
792 let mode = (segment && segment.getAttribute('data-active') ? segment.getAttribute('data-active') : 'dark').toString();
793 let mqlHandler = null;
794
795 function saveUISetting(key, value) {
796 const body = new URLSearchParams();
797 body.set('action', 'king_addons_save_dashboard_ui');
798 body.set('nonce', nonce);
799 body.set('key', key);
800 body.set('value', value);
801 fetch(ajaxUrl, {
802 method: 'POST',
803 headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' },
804 body: body.toString()
805 });
806 }
807
808 function updateSegment(activeMode) {
809 if (!segment) {
810 return;
811 }
812 segment.setAttribute('data-active', activeMode);
813 segment.querySelectorAll('.ka-v3-segmented-btn').forEach((btn) => {
814 const theme = btn.getAttribute('data-theme');
815 btn.setAttribute('aria-pressed', theme === activeMode ? 'true' : 'false');
816 });
817 }
818
819 function applyTheme(isDark) {
820 document.body.classList.toggle('ka-v3-dark', isDark);
821 document.documentElement.classList.toggle('ka-v3-dark', isDark);
822 }
823
824 function setThemeMode(nextMode, save) {
825 mode = nextMode;
826 updateSegment(nextMode);
827
828 if (mqlHandler && mql) {
829 if (mql.removeEventListener) {
830 mql.removeEventListener('change', mqlHandler);
831 } else if (mql.removeListener) {
832 mql.removeListener(mqlHandler);
833 }
834 mqlHandler = null;
835 }
836
837 if (nextMode === 'auto') {
838 applyTheme(!!(mql && mql.matches));
839 mqlHandler = (e) => {
840 if (mode !== 'auto') {
841 return;
842 }
843 applyTheme(!!e.matches);
844 };
845 if (mql) {
846 if (mql.addEventListener) {
847 mql.addEventListener('change', mqlHandler);
848 } else if (mql.addListener) {
849 mql.addListener(mqlHandler);
850 }
851 }
852 } else {
853 applyTheme(nextMode === 'dark');
854 }
855
856 if (save) {
857 saveUISetting('theme_mode', nextMode);
858 }
859 }
860
861 window.kaV3ToggleDark = function() {
862 const isDark = document.body.classList.contains('ka-v3-dark');
863 setThemeMode(isDark ? 'light' : 'dark', true);
864 };
865
866 if (segment) {
867 segment.addEventListener('click', function(e) {
868 const btn = e.target.closest('.ka-v3-segmented-btn');
869 if (!btn) return;
870 e.preventDefault();
871 setThemeMode((btn.getAttribute('data-theme') || 'dark').toString(), true);
872 });
873 }
874
875 if (segment) {
876 setThemeMode(mode, false);
877 }
878 })();
879 </script>
880