master-addons / addons / basic / ma-infobox / ma-infobox.php

ma-infobox.php in Master Addons for Elementor – Elementor Addons, Widgets, Mega Menu Builder, Popup Builder, Widget Builder & Template Kits 3.0.9, at addons/basic/ma-infobox/ma-infobox.php

1,195 lines 46.4 KB

Raw Download Zip

1	<?php
2
3	namespace MasterAddons\Addons;
4
5	/**
6	* Author Name: Liton Arefin
7	* Author URL: https://jeweltheme.com
8	* Date: 6/26/19
9	*/
10
11	use MasterAddons\Inc\Classes\Base\Master_Widget;
12	use \Elementor\Controls_Stack;
13	use \Elementor\Utils;
14	use \Elementor\Controls_Manager;
15	use \Elementor\Group_Control_Border;
16	use \Elementor\Group_Control_Typography;
17	use \Elementor\Group_Control_Image_Size;
18	use \Elementor\Group_Control_Background;
19
20	use MasterAddons\Inc\Classes\Helper;
21	use MasterAddons\Inc\Admin\Config;
22
23	if (!defined('ABSPATH')) exit; // If this file is called directly, abort.
24
25	class Infobox extends Master_Widget
26	{
27	use \MasterAddons\Inc\Traits\Widget_Notice;
28	use \MasterAddons\Inc\Traits\Widget_Assets_Trait;
29
30	public function get_name()
31	{
32	return 'jltma-infobox';
33	}
34	public function get_title()
35	{
36	return esc_html__('Info Box', 'master-addons');
37	}
38	public function get_icon()
39	{
40	return 'jltma-icon ' . Config::get_addon_icon($this->get_name());
41	}
42
43	protected function register_controls()
44	{
45
46	/*
47	* Master Addons: Infobox Image
48	*/
49	$this->start_controls_section(
50	'ma_el_section_infobox_content',
51	[
52	'label' => esc_html__('Content', 'master-addons')
53	]
54	);
55
56	// Define default free options - Pro version overrides via filter
57	$preset_options = apply_filters('master_addons/addons/infobox/preset', [
58	'one' => esc_html__('Variation One', 'master-addons'),
59	'two' => esc_html__('Variation Two', 'master-addons'),
60	'three' => esc_html__('Variation Three', 'master-addons'),
61	'four' => esc_html__('Variation Four', 'master-addons'),
62	'five' => esc_html__('Variation Five', 'master-addons'),
63	'info-pro-1' => esc_html__('Variation Six (Pro)', 'master-addons'),
64	'info-pro-2' => esc_html__('Variation Seven (Pro)', 'master-addons'),
65	'info-pro-3' => esc_html__('Variation Eight (Pro)', 'master-addons'),
66	'info-pro-4' => esc_html__('Variation Nine (Pro)', 'master-addons'),
67	'info-pro-5' => esc_html__('Variation Ten (Pro)', 'master-addons'),
68	]);
69
70	$this->add_control(
71	'ma_el_infobox_preset',
72	[
73	'label' => esc_html__('Style Preset', 'master-addons'),
74	'type' => Controls_Manager::SELECT,
75	'default' => 'one',
76	'options' => $preset_options,
77	'description' => Helper::upgrade_to_pro('5+ more Variations on'),
78	]
79	);
80
81	// Gradient controls - Pro version overrides via filter
82	$gradient_controls = apply_filters('master_addons/addons/infobox/gradient', [
83	[
84	'type' => 'control',
85	'control_id' => 'ma_el_infobox_gradient_pro',
86	'args' => [
87	'type' => Controls_Manager::RAW_HTML,
88	'raw' => Helper::upgrade_to_pro('Gradient Icon Color available on'),
89	'content_classes' => 'jltma-editor-doc-links',
90	'condition' => [
91	'ma_el_infobox_preset' => 'six'
92	],
93	],
94	],
95	]);
96
97	// Add all controls from the filter
98	foreach ($gradient_controls as $control) {
99	if ($control['type'] === 'control') {
100	$this->add_control($control['control_id'], $control['args']);
101	} elseif ($control['type'] === 'group_control') {
102	$this->add_group_control($control['group_type'], $control['args']);
103	}
104	}
105
106	$this->add_control(
107	'ma_el_infobox_img_or_icon',
108	[
109	'label' => esc_html__('Image or Icon', 'master-addons'),
110	'type' => Controls_Manager::CHOOSE,
111	'label_block' => true,
112	'options' => [
113	'none' => [
114	'title' => esc_html__('None', 'master-addons'),
115	'icon' => 'eicon-ban',
116	],
117	'icon' => [
118	'title' => esc_html__('Icon', 'master-addons'),
119	'icon' => 'eicon-icon-box',
120	],
121	'img' => [
122	'title' => esc_html__('Image', 'master-addons'),
123	'icon' => 'eicon-image',
124	]
125	],
126	'default' => 'icon',
127	]
128	);
129
130	$this->add_control(
131	'ma_el_infobox_icon',
132	[
133	'label' => esc_html__('Icon', 'master-addons'),
134	'description' => esc_html__('Please choose an icon from the list.', 'master-addons'),
135	'type' => Controls_Manager::ICONS,
136	// 'fa4compatibility' => 'icon',
137	'default' => [
138	'value' => 'eicon-tags',
139	'library' => 'eicon',
140	],
141	'render_type' => 'template',
142	'condition' => [
143	'ma_el_infobox_img_or_icon' => 'icon'
144	]
145	]
146	);
147
148	$this->add_control(
149	'ma_el_infobox_image',
150	[
151	'label' => esc_html__('Image', 'master-addons'),
152	'type' => Controls_Manager::MEDIA,
153	'default' => [
154	'url' => Utils::get_placeholder_image_src(),
155	],
156	'condition' => [
157	'ma_el_infobox_img_or_icon' => 'img'
158	]
159	]
160	);
161	$this->add_group_control(
162	Group_Control_Image_Size::get_type(),
163	[
164	'name' => 'thumbnail',
165	'default' => 'full',
166	'condition' => [
167	'ma_el_infobox_img_or_icon' => 'img'
168	]
169	]
170	);
171
172	$this->add_control(
173	'ma_el_infobox_title',
174	[
175	'label' => esc_html__('Title', 'master-addons'),
176	'type' => Controls_Manager::TEXT,
177	'label_block' => true,
178	'default' => esc_html__('Infobox Title', 'master-addons'),
179	]
180	);
181
182	$this->add_control(
183	'ma_el_infobox_title_link',
184	[
185	'label' => __('Title URL', 'master-addons'),
186	'type' => Controls_Manager::URL,
187	'placeholder' => __('https://your-link.com', 'master-addons'),
188	'label_block' => true,
189	'default' => [
190	'url' => '',
191	'is_external' => true,
192	],
193	]
194	);
195
196	$this->add_control(
197	'ma_el_infobox_description',
198	[
199	'label' => esc_html__('Description', 'master-addons'),
200	'type' => Controls_Manager::TEXTAREA,
201	'default' => esc_html__('Basic description about the Infobox', 'master-addons'),
202	]
203	);
204
205	$this->add_control(
206	'ma_el_infobox_readmore_text',
207	[
208	'label' => esc_html__('Read More Text', 'master-addons'),
209	'type' => Controls_Manager::TEXT,
210	'label_block' => true,
211	'default' => esc_html__('Learn More', 'master-addons'),
212	'condition' => [
213	'ma_el_infobox_preset' => 'six'
214	]
215	]
216	);
217
218	$this->add_control(
219	'ma_el_infobox_readmore_link',
220	[
221	'label' => __('Read More Link', 'master-addons'),
222	'type' => Controls_Manager::URL,
223	'placeholder' => __('https://master-addons.com/demo', 'master-addons'),
224	'label_block' => true,
225	'default' => [
226	'url' => '#',
227	'is_external' => true,
228	],
229	'condition' => [
230	'ma_el_infobox_preset' => 'six'
231	]
232	]
233	);
234
235	$this->end_controls_section();
236
237	/*
238	* Infobox Styling Section
239	*/
240	$this->start_controls_section(
241	'ma_el_section_infobox_styles_preset',
242	[
243	'label' => esc_html__('General Styles', 'master-addons'),
244	'tab' => Controls_Manager::TAB_STYLE
245	]
246	);
247
248	$this->add_group_control(
249	Group_Control_Border::get_type(),
250	[
251	'name' => 'info_box_icon_border',
252	'label' => __('Box Border', 'master-addons'),
253	'selector' => '{{WRAPPER}} .jltma-infobox .jltma-infobox-item',
254	'fields_options' => [
255	'border' => [
256	'default' => 'solid',
257	],
258	'width' => [
259	'default' => [
260	'top' => '1',
261	'right' => '1',
262	'bottom' => '1',
263	'left' => '1',
264	'isLinked' => true,
265	],
266	],
267	'color' => [
268	'default' => '#132c47',
269	],
270	],
271	]
272	);
273
274	$this->add_control(
275	'info_box_border_radius',
276	[
277	'label' => esc_html__('Border Radius', 'master-addons'),
278	'type' => Controls_Manager::DIMENSIONS,
279	'size_units' => ['px', '%'],
280	'selectors' => [
281	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
282	],
283	]
284	);
285
286	$this->add_control(
287	'info_box_padding',
288	[
289	'label' => esc_html__('Padding', 'master-addons'),
290	'type' => Controls_Manager::DIMENSIONS,
291	'size_units' => ['px', 'em', '%'],
292	'selectors' => [
293	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
294	],
295	]
296	);
297
298	$this->add_control(
299	'info_box_margin',
300	[
301	'label' => esc_html__('Margin', 'master-addons'),
302	'type' => Controls_Manager::DIMENSIONS,
303	'size_units' => ['px', 'em', '%'],
304	'selectors' => [
305	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
306	],
307	]
308	);
309
310	// Variation Nine - 3D Flip Box Height Control
311	$this->add_responsive_control(
312	'info_box_nine_height',
313	[
314	'label' => esc_html__('Flip Box Height', 'master-addons'),
315	'type' => Controls_Manager::SLIDER,
316	'size_units' => ['px', 'vh'],
317	'range' => [
318	'px' => [
319	'min' => 100,
320	'max' => 600,
321	],
322	'vh' => [
323	'min' => 10,
324	'max' => 100,
325	],
326	],
327	'default' => [
328	'unit' => 'px',
329	'size' => 220,
330	],
331	'selectors' => [
332	// Set critical 3D flip layout styles for the container - width 100% needed because children are absolute
333	'{{WRAPPER}} .jltma-infobox.nine' => 'width: 100%;',
334	'{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item' => 'position: relative; width: 100%; height: {{SIZE}}{{UNIT}}; perspective: 800px; overflow: visible;',
335	// Icon (front face) - visible by default, absolutely positioned using left/right instead of width
336	'{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item .jltma-infobox-icon' => 'position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: {{SIZE}}{{UNIT}} !important; display: flex !important; align-items: center; justify-content: center; padding: 20px; overflow: hidden; transition: all 0.5s; backface-visibility: hidden; z-index: 2; opacity: 1 !important; transform: translateY(0) rotateX(0);',
337	// Content (back face) - hidden by default, absolutely positioned using left/right instead of width
338	'{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item .jltma-infobox-content' => 'position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; height: {{SIZE}}{{UNIT}} !important; display: flex !important; align-items: center; justify-content: center; padding: 20px; overflow: hidden; transition: all 0.5s; backface-visibility: hidden; z-index: 1; opacity: 0 !important; transform: translateY(110px) rotateX(-90deg) !important;',
339	// Inner content positioning - centered with text-align
340	'{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item .jltma-inner-content' => 'display: block; position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; transform: translateY(-50%); text-align: center;',
341	// Hover states - flip animation
342	'{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item:hover .jltma-infobox-icon' => 'opacity: 0 !important; transform: translateY(-110px) rotateX(90deg) !important;',
343	'{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item:hover .jltma-infobox-content' => 'opacity: 1 !important; transform: rotateX(0) !important;',
344	],
345	'condition' => [
346	'ma_el_infobox_preset' => 'nine',
347	],
348	]
349	);
350
351	$this->add_control(
352	'ma_el_infobox_bg_heading',
353	[
354	'label' => __('Background', 'master-addons'),
355	'type' => Controls_Manager::HEADING,
356	]
357	);
358
359	$this->start_controls_tabs('ma_el_infobox_style');
360
361	$this->start_controls_tab(
362	'ma_el_infobox_normal',
363	[
364	'label' => __('Normal', 'master-addons'),
365	]
366	);
367
368	// $this->add_control(
369	// 'ma_el_infobox_bg',
370	// [
371	// 'label' => esc_html__('Background Color', 'master-addons' ),
372	// 'type' => Controls_Manager::COLOR,
373	// 'default' => '#fff',
374	// 'selectors' => [
375	// '{{WRAPPER}} .jltma-infobox-item' => 'border-color: {{VALUE}}'
376	// ],
377	// ]
378	// );
379
380	$this->add_group_control(
381	Group_Control_Background::get_type(),
382	[
383	'name' => 'ma_el_infobox_gradient_bg',
384	'label' => __('Background', 'master-addons'),
385	'types' => ['classic', 'gradient'],
386	'selector' => '{{WRAPPER}} .jltma-infobox .jltma-infobox-item',
387
388	]
389	);
390
391	$this->end_controls_tab();
392
393	$this->start_controls_tab(
394	'ma_el_infobox_hover',
395	[
396	'label' => __('Hover', 'master-addons'),
397	]
398	);
399
400	$this->add_group_control(
401	Group_Control_Background::get_type(),
402	[
403	'name' => 'ma_el_infobox_hover_gradient_bg',
404	'label' => __('Background', 'master-addons'),
405	'types' => ['classic', 'gradient'],
406	'selector' => '{{WRAPPER}} .jltma-infobox .jltma-infobox-item:hover',
407	'fields_options' => [
408	'background' => [
409	'default' => 'classic',
410	],
411	'color' => [
412	'default' => '#ECECEC',
413	],
414	],
415	]
416	);
417
418	$this->end_controls_tab();
419
420	$this->end_controls_tabs();
421
422	$this->add_control(
423	'ma_el_infobox_hover_animation',
424	[
425	'label' => __('Hover Animation', 'master-addons'),
426	'type' => Controls_Manager::HOVER_ANIMATION,
427	'separator' => 'before',
428	'prefix_class' => 'elementor-animation-',
429
430	]
431	);
432
433	$this->end_controls_section();
434
435	// Icon Style
436	$this->start_controls_section(
437	'section_infobox_icon',
438	[
439	'label' => __('Icon Style', 'master-addons'),
440	'tab' => Controls_Manager::TAB_STYLE,
441	'condition' => [
442	'ma_el_infobox_img_or_icon' => 'icon'
443	]
444	]
445	);
446
447	$this->add_control(
448	'ma_el_infobox_icon_size',
449	[
450	'label' => __('Icon Size', 'master-addons'),
451	'type' => Controls_Manager::SLIDER,
452	'range' => [
453	'px' => [
454	'min' => 10,
455	'max' => 300,
456	],
457	],
458	'selectors' => [
459	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item .jltma-infobox-icon i,
460	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content i,
461	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon i,
462	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content i' => 'font-size: {{SIZE}}{{UNIT}};',
463	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item .jltma-infobox-icon svg,
464	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content svg,
465	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon svg,
466	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content svg' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};',
467	// One, Two, Seven - icon container scales with padding (icon size + 30px padding gives container size)
468	'{{WRAPPER}} .jltma-infobox.one .jltma-infobox-item .jltma-infobox-icon,
469	{{WRAPPER}} .jltma-infobox.two .jltma-infobox-item .jltma-infobox-icon,
470	{{WRAPPER}} .jltma-infobox.seven .jltma-infobox-item .jltma-infobox-icon' => 'display: inline-flex; align-items: center; justify-content: center; height: calc({{SIZE}}{{UNIT}} + 30px); width: calc({{SIZE}}{{UNIT}} + 30px); line-height: calc({{SIZE}}{{UNIT}} + 30px);',
471	// Four - icon container scales proportionally (original: font-size 32px → height/width/line-height 90px, ratio 90/32)
472	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item .jltma-infobox-icon' => 'font-size: {{SIZE}}{{UNIT}}; height: calc({{SIZE}}{{UNIT}} * 90 / 32); width: calc({{SIZE}}{{UNIT}} * 90 / 32); line-height: calc({{SIZE}}{{UNIT}} * 90 / 32);',
473	// Five - hexagon container scales proportionally (original: icon 64px → container 180x165)
474	'{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content' => 'width: calc({{SIZE}}{{UNIT}} * 180 / 64); height: calc({{SIZE}}{{UNIT}} * 165 / 64);',
475	// Five - icon centered using translate to stay centered regardless of icon size, override fixed 80px dimensions from SCSS
476	'{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content i,
477	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content svg' => 'left: 50%; top: 50%; transform: translate(-50%, -50%) skewX(-30deg) rotate(30deg); height: auto; width: auto; line-height: normal;',
478	// Six - icon container scales proportionally (original: icon 32px → container 90x90, ratio 90/32) with flexbox centering
479	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon' => 'height: calc({{SIZE}}{{UNIT}} * 90 / 32); width: calc({{SIZE}}{{UNIT}} * 90 / 32); display: flex; align-items: center; justify-content: center;',
480	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content' => 'display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;',
481	// Ten - icon container scales proportionally based on icon size
482	'{{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item .jltma-infobox-icon' => 'height: {{SIZE}}{{UNIT}}; width: calc({{SIZE}}{{UNIT}} * 58 / 90); line-height: {{SIZE}}{{UNIT}};',
483	// Ten - center icon using translate instead of fixed left/top values
484	'{{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item .jltma-infobox-icon i,
485	{{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item .jltma-infobox-icon svg,
486	{{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item .jltma-infobox-icon img' => 'font-size: {{SIZE}}{{UNIT}}; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) rotate(-30deg) !important; height: auto; width: auto; line-height: normal;',
487	],
488	]
489	);
490
491	// $this->add_responsive_control(
492	// 'ma_el_infobox_icon_padding',
493	// [
494	// 'label' => __('Padding', 'master-addons'),
495	// 'type' => Controls_Manager::DIMENSIONS,
496	// 'size_units' => ['px', 'em', '%'],
497	// 'selectors' => [
498	// // Generic variations (one, two, three, four, seven) - apply padding to icon container
499	// '{{WRAPPER}} .jltma-infobox:not(.five):not(.six):not(.eight):not(.nine):not(.ten) .jltma-infobox-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
500	// // Five - padding on hexagon container (icon is centered with translate)
501	// '{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
502	// // Six - padding on icon container (uses flexbox centering)
503	// '{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
504	// // Eight - padding on hexagon container (icon is centered with translate)
505	// '{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
506	// // Ten - padding on hexagon container only (icon is absolutely positioned and centered)
507	// '{{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item .jltma-infobox-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
508	// ],
509	// ]
510	// );
511
512	// Icon Style Tabs
513	$this->start_controls_tabs('ma_el_infobox_icon_color_style');
514
515	$this->start_controls_tab(
516	'ma_el_infobox_icon_color_normal',
517	[
518	'label' => __('Normal', 'master-addons'),
519	]
520	);
521
522	$this->add_control(
523	'ma_el_infobox_bg_fade_icon_size',
524	[
525	'label' => __('BG Icon Size', 'master-addons'),
526	'type' => Controls_Manager::SLIDER,
527	'range' => [
528	'px' => [
529	'min' => 10,
530	'max' => 300,
531	],
532	],
533	'selectors' => [
534	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item .bg-fade-icon i' => 'font-size: {{SIZE}}{{UNIT}};',
535	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item .bg-fade-icon svg' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};',
536	],
537	'condition' => [
538	'ma_el_infobox_preset' => ['two', 'three'],
539	],
540	]
541	);
542
543	$this->add_control(
544	'ma_el_infobox_icon_color_scheme',
545	[
546	'label' => __('Icon Color', 'master-addons'),
547	'type' => Controls_Manager::COLOR,
548	'selectors' => [
549	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item .jltma-infobox-icon i,
550	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content i,
551	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon i,
552	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content i' => 'color: {{VALUE}};',
553	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item .jltma-infobox-icon svg,
554	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content svg,
555	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon svg,
556	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content svg' => 'fill: {{VALUE}};',
557	],
558	]
559	);
560
561	$this->add_control(
562	'ma_el_infobox_icon_bg_fade_color_scheme',
563	[
564	'label' => __('BG Icon Color', 'master-addons'),
565	'type' => Controls_Manager::COLOR,
566	'selectors' => [
567	'{{WRAPPER}} .bg-fade-icon' => 'color: {{VALUE}};',
568	'{{WRAPPER}} .bg-fade-icon svg' => 'fill: {{VALUE}};',
569	],
570	'condition' => [
571	'ma_el_infobox_preset' => ['two', 'three'],
572	],
573	]
574	);
575
576	$this->add_group_control(
577	Group_Control_Background::get_type(),
578	[
579	'name' => 'ma_el_infobox_icon_bg',
580	'label' => __('Background', 'master-addons'),
581	'types' => ['classic', 'gradient'],
582	'exclude' => ['image'],
583	'selector' => '{{WRAPPER}} .jltma-infobox:not(.five):not(.six):not(.eight):not(.nine) .jltma-infobox-icon,
584	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
585	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
586	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon,
587	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
588	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
589	{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item .jltma-infobox-icon',
590	'fields_options' => [
591	'color' => [
592	'selectors' => [
593	'{{WRAPPER}} .jltma-infobox:not(.five):not(.six):not(.eight):not(.nine) .jltma-infobox-icon,
594	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
595	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
596	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
597	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
598	{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item .jltma-infobox-icon' => 'background-color: {{VALUE}} !important;',
599	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon' => 'background-image: none; background-color: {{VALUE}} !important;',
600	],
601	],
602	],
603	]
604	);
605
606	$this->add_responsive_control(
607	'ma_el_infobox_icon_alignment',
608	[
609	'label' => esc_html__('Alignment', 'master-addons'),
610	'type' => Controls_Manager::CHOOSE,
611	'label_block' => false,
612	'options' => Helper::jltma_content_alignment(),
613	'default' => 'center',
614	'selectors' => [
615	// Default for most variations (exclude nine - uses absolute positioning for 3D flip)
616	'{{WRAPPER}} .jltma-infobox:not(.nine) .jltma-infobox-item .jltma-infobox-icon,
617	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item' => 'text-align: {{VALUE}};',
618	// Three - override absolute positioning, use inline-block with text-align
619	'{{WRAPPER}} .jltma-infobox.three .jltma-infobox-item' => 'text-align: {{VALUE}} !important;',
620	'{{WRAPPER}} .jltma-infobox.three .jltma-infobox-item .jltma-infobox-icon' => 'position: relative !important; left: auto !important; top: auto !important; display: inline-block !important;',
621	'{{WRAPPER}} .jltma-infobox.three .jltma-infobox-item .jltma-infobox-content' => 'text-align: center;',
622	// Four - override margin: 0 auto, use inline-block with text-align
623	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item' => 'text-align: {{VALUE}} !important;',
624	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item .jltma-infobox-icon' => 'display: inline-block !important; margin: 0 !important;',
625	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item .jltma-infobox-content,
626	{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item .jltma-inner-content' => 'text-align: center;',
627	// Five uses flexbox - need justify-content
628	'{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item' => 'justify-content: {{VALUE}};',
629	// Six - set text-align on parent, make icon inline-block
630	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item' => 'text-align: {{VALUE}};',
631	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-icon' => 'display: inline-block; margin: 0;',
632	// Reset content area to center (preserve default)
633	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-content,
634	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item .jltma-infobox-content .jltma-inner-content' => 'text-align: center;',
635	],
636	]
637	);
638
639	$this->add_responsive_control(
640	'ma_el_infobox_bg_fade_icon_margin',
641	[
642	'label' => __('Margin', 'master-addons'),
643	'type' => Controls_Manager::DIMENSIONS,
644	'size_units' => ['px', 'em', '%'],
645	'selectors' => [
646	'{{WRAPPER}} .bg-fade-icon' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
647	],
648	'condition' => [
649	'ma_el_infobox_preset' => ['two', 'three'],
650	],
651	]
652	);
653
654	$this->end_controls_tab();
655
656	$this->start_controls_tab(
657	'ma_el_infobox_icon_hover',
658	[
659	'label' => __('Hover', 'master-addons'),
660	]
661	);
662
663	$this->add_control(
664	'ma_el_infobox_icon_hover_color_scheme',
665	[
666	'label' => __('Icon Hover Color', 'master-addons'),
667	'type' => Controls_Manager::COLOR,
668	'selectors' => [
669	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item:hover .jltma-infobox-icon i,
670	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content i,
671	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-icon i,
672	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content i' => 'color: {{VALUE}}',
673	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item:hover .jltma-infobox-icon svg,
674	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content svg,
675	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-icon svg,
676	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content svg' => 'fill: {{VALUE}}',
677	],
678	]
679	);
680
681	$this->add_control(
682	'ma_el_infobox_icon_hover_fade_color_scheme',
683	[
684	'label' => __('BG Icon Hover Color', 'master-addons'),
685	'type' => Controls_Manager::COLOR,
686	'selectors' => [
687	'{{WRAPPER}} .jltma-infobox-item:hover .bg-fade-icon' => 'color: {{VALUE}}',
688	'{{WRAPPER}} .jltma-infobox-item:hover .bg-fade-icon svg' => 'fill: {{VALUE}}',
689	],
690	'condition' => [
691	'ma_el_infobox_preset' => ['two', 'three'],
692	],
693	]
694	);
695
696	$this->add_group_control(
697	Group_Control_Background::get_type(),
698	[
699	'name' => 'ma_el_infobox_icon_hover_bg',
700	'label' => __('Background', 'master-addons'),
701	'types' => ['classic', 'gradient'],
702	'exclude' => ['image'],
703	'selector' => '{{WRAPPER}} .jltma-infobox:not(.five):not(.six):not(.eight):not(.nine) .jltma-infobox-item:hover .jltma-infobox-icon,
704	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
705	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
706	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-icon,
707	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
708	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
709	{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item:hover .jltma-infobox-icon',
710	'fields_options' => [
711	'color' => [
712	'selectors' => [
713	'{{WRAPPER}} .jltma-infobox:not(.five):not(.six):not(.eight):not(.nine) .jltma-infobox-item:hover .jltma-infobox-icon,
714	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
715	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
716	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-hexagon-shape:before,
717	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content .jltma-shape-inner,
718	{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item:hover .jltma-infobox-icon' => 'background-color: {{VALUE}} !important;',
719	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-icon' => 'background-image: none !important; background-color: {{VALUE}} !important;',
720	],
721	],
722	],
723	]
724	);
725
726	$this->add_control(
727	'ma_el_infobox_icon_bg_fade_hover_color_scheme',
728	[
729	'label' => __('BG Icon Hover Color', 'master-addons'),
730	'type' => Controls_Manager::COLOR,
731	'selectors' => [
732	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item:hover .bg-fade-icon' => 'color: {{VALUE}};',
733	'{{WRAPPER}} .jltma-infobox .jltma-infobox-item:hover .bg-fade-icon svg' => 'fill: {{VALUE}};',
734	],
735	'condition' => [
736	'ma_el_infobox_preset' => ['two', 'three'],
737	],
738	]
739	);
740
741	$this->add_responsive_control(
742	'ma_el_infobox_icon_hover_alignment',
743	[
744	'label' => esc_html__('Alignment', 'master-addons'),
745	'type' => Controls_Manager::CHOOSE,
746	'label_block' => false,
747	'options' => Helper::jltma_content_alignment(),
748	'default' => 'center',
749	'selectors' => [
750	// Default for most variations (exclude nine - uses absolute positioning for 3D flip)
751	'{{WRAPPER}} .jltma-infobox:not(.nine) .jltma-infobox-item:hover .jltma-infobox-icon,
752	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover' => 'text-align: {{VALUE}};',
753	// Three - override absolute positioning, use inline-block with text-align
754	'{{WRAPPER}} .jltma-infobox.three .jltma-infobox-item:hover' => 'text-align: {{VALUE}} !important;',
755	'{{WRAPPER}} .jltma-infobox.three .jltma-infobox-item:hover .jltma-infobox-icon' => 'position: relative !important; left: auto !important; top: auto !important; display: inline-block !important;',
756	'{{WRAPPER}} .jltma-infobox.three .jltma-infobox-item:hover .jltma-infobox-content' => 'text-align: center;',
757	// Four - override margin: 0 auto, use inline-block with text-align
758	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item:hover' => 'text-align: {{VALUE}} !important;',
759	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item:hover .jltma-infobox-icon' => 'display: inline-block !important; margin: 0 !important;',
760	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item:hover .jltma-infobox-content,
761	{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item:hover .jltma-inner-content' => 'text-align: center;',
762	// Five uses flexbox
763	'{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover' => 'justify-content: {{VALUE}};',
764	// Six - set text-align on parent, make icon inline-block
765	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover' => 'text-align: {{VALUE}};',
766	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-icon' => 'display: inline-block; margin: 0;',
767	// Reset content area to center
768	'{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-content,
769	{{WRAPPER}} .jltma-infobox.six .jltma-infobox-item:hover .jltma-infobox-content .jltma-inner-content' => 'text-align: center;',
770	],
771	]
772	);
773
774	// $this->add_responsive_control(
775	// 'ma_el_infobox_icon_hover_padding',
776	// [
777	// 'label' => __('Padding', 'master-addons'),
778	// 'type' => Controls_Manager::DIMENSIONS,
779	// 'size_units' => ['px', 'em', '%'],
780	// 'selectors' => [
781	// // All variations - icons are inside .jltma-inner-content (exclude nine - uses absolute positioning for 3D flip)
782	// '{{WRAPPER}} .jltma-infobox:not(.nine) .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content i,
783	// {{WRAPPER}} .jltma-infobox:not(.nine) .jltma-infobox-item:hover .jltma-infobox-icon .jltma-inner-content svg' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
784	// // Also apply to the icon container (exclude nine)
785	// '{{WRAPPER}} .jltma-infobox:not(.nine) .jltma-infobox-item:hover .jltma-infobox-icon' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
786	// // Eight - icons are absolutely positioned, need padding on the icon itself
787	// '{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon i,
788	// {{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon svg,
789	// {{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-icon img' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;',
790	// // Ten - apply padding to icon container and icon elements
791	// '{{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item:hover .jltma-infobox-icon,
792	// {{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item:hover .jltma-infobox-icon i,
793	// {{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item:hover .jltma-infobox-icon svg,
794	// {{WRAPPER}} .jltma-infobox.ten .jltma-infobox-item:hover .jltma-infobox-icon img' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}} !important;',
795	// ],
796	// ]
797	// );
798
799	$this->end_controls_tab();
800
801	$this->end_controls_tabs();
802
803	$this->end_controls_section();
804
805	// Title , Description Font Color and Typography
806	$this->start_controls_section(
807	'section_infobox_title',
808	[
809	'label' => __('Title', 'master-addons'),
810	'tab' => Controls_Manager::TAB_STYLE,
811	]
812	);
813
814	$this->add_group_control(
815	Group_Control_Typography::get_type(),
816	[
817	'name' => 'ma_el_title_typography',
818	'selector' => '{{WRAPPER}} .jltma-infobox-content-title',
819	]
820	);
821
822	$this->start_controls_tabs('ma_el_infobox_title_color_style');
823
824	$this->start_controls_tab(
825	'ma_el_infobox_title_color_normal',
826	[
827	'label' => __('Normal', 'master-addons'),
828	]
829	);
830
831	$this->add_control(
832	'ma_el_title_color',
833	[
834	'label' => __('Color', 'master-addons'),
835	'type' => Controls_Manager::COLOR,
836	'default' => '#132c47',
837	'selectors' => [
838	'{{WRAPPER}} .jltma-infobox-content-title' => 'color: {{VALUE}};',
839
840	],
841	]
842	);
843
844	$this->add_responsive_control(
845	'ma_el_infobox_title_alignment',
846	[
847	'label' => esc_html__('Alignment', 'master-addons'),
848	'type' => Controls_Manager::CHOOSE,
849	'label_block' => false,
850	'options' => Helper::jltma_content_alignment(),
851	'default' => 'center',
852	'selectors' => [
853	'{{WRAPPER}} .jltma-infobox-content-title' => 'text-align: {{VALUE}};',
854	],
855	]
856	);
857
858	$this->add_responsive_control(
859	'ma_el_infobox_title_padding',
860	[
861	'label' => __('Padding', 'master-addons'),
862	'type' => Controls_Manager::DIMENSIONS,
863	'size_units' => ['px', 'em', '%'],
864	'selectors' => [
865	'{{WRAPPER}} .jltma-infobox-content-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
866	],
867	]
868	);
869
870	$this->end_controls_tab();
871
872	$this->start_controls_tab(
873	'ma_el_infobox_title_hover',
874	[
875	'label' => __('Hover', 'master-addons'),
876	]
877	);
878
879	$this->add_control(
880	'ma_el_infobox_title_color_hover',
881	[
882	'label' => __('Color', 'master-addons'),
883	'type' => Controls_Manager::COLOR,
884	'selectors' => [
885	'{{WRAPPER}} .jltma-infobox-item:hover .jltma-infobox-content-title' => 'color: {{VALUE}};',
886
887	],
888	]
889	);
890
891	$this->add_responsive_control(
892	'ma_el_infobox_title_hover_alignment',
893	[
894	'label' => esc_html__('Alignment', 'master-addons'),
895	'type' => Controls_Manager::CHOOSE,
896	'label_block' => false,
897	'options' => Helper::jltma_content_alignment(),
898	'default' => 'center',
899	'selectors' => [
900	'{{WRAPPER}} .jltma-infobox-item:hover .jltma-infobox-content-title' => 'text-align: {{VALUE}};',
901	],
902	]
903	);
904
905	$this->add_responsive_control(
906	'ma_el_infobox_title_hover_padding',
907	[
908	'label' => __('Padding', 'master-addons'),
909	'type' => Controls_Manager::DIMENSIONS,
910	'size_units' => ['px', 'em', '%'],
911	'selectors' => [
912	'{{WRAPPER}} .jltma-infobox-item:hover .jltma-infobox-content-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
913	],
914	]
915	);
916
917	$this->end_controls_tab();
918
919	$this->end_controls_tabs();
920
921	$this->end_controls_section();
922
923	// Description Style
924	$this->start_controls_section(
925	'section_infobox_description',
926	[
927	'label' => __('Description', 'master-addons'),
928	'tab' => Controls_Manager::TAB_STYLE,
929	]
930	);
931
932	$this->add_group_control(
933	Group_Control_Typography::get_type(),
934	[
935	'name' => 'ma_el_description_typography',
936	'selector' => '{{WRAPPER}} .jltma-infobox-content-description',
937	]
938	);
939
940	$this->start_controls_tabs('ma_el_infobox_desc_color_style');
941
942	$this->start_controls_tab(
943	'ma_el_infobox_desc_color_normal',
944	[
945	'label' => __('Normal', 'master-addons'),
946	]
947	);
948
949	$this->add_control(
950	'ma_el_description_color',
951	[
952	'label' => __('Color', 'master-addons'),
953	'type' => Controls_Manager::COLOR,
954	'default' => '#797c80',
955	'selectors' => [
956	'{{WRAPPER}} .jltma-infobox .jltma-infobox-content-description' => 'color: {{VALUE}};',
957	],
958	]
959	);
960
961	$this->add_responsive_control(
962	'ma_el_infobox_desc_alignment',
963	[
964	'label' => esc_html__('Alignment', 'master-addons'),
965	'type' => Controls_Manager::CHOOSE,
966	'label_block' => false,
967	'options' => Helper::jltma_content_alignment(),
968	'default' => 'center',
969	'selectors' => [
970	'{{WRAPPER}} .jltma-infobox .jltma-infobox-content-description' => 'text-align: {{VALUE}};',
971	],
972	]
973	);
974
975	$this->add_responsive_control(
976	'ma_el_infobox_desc_padding',
977	[
978	'label' => __('Padding', 'master-addons'),
979	'type' => Controls_Manager::DIMENSIONS,
980	'size_units' => ['px', 'em', '%'],
981	'selectors' => [
982	'{{WRAPPER}} .jltma-infobox .jltma-infobox-content-description' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
983	],
984	]
985	);
986	$this->end_controls_tab();
987
988	$this->start_controls_tab(
989	'ma_el_infobox_desc_hover',
990	[
991	'label' => __('Hover', 'master-addons'),
992	]
993	);
994
995	$this->add_control(
996	'ma_el_infobox_desc_color_hover',
997	[
998	'label' => __('Color', 'master-addons'),
999	'type' => Controls_Manager::COLOR,
1000	'default' => '',
1001	'selectors' => [
1002	'{{WRAPPER}} .jltma-infobox-item:hover .jltma-infobox-content-description' => 'color: {{VALUE}};',
1003	'{{WRAPPER}} .jltma-infobox.four .jltma-infobox-item:hover .jltma-infobox-content-description,
1004	{{WRAPPER}} .jltma-infobox.five .jltma-infobox-item:hover .jltma-infobox-content-description,
1005	{{WRAPPER}} .jltma-infobox.seven .jltma-infobox-item:hover .jltma-infobox-content-description,
1006	{{WRAPPER}} .jltma-infobox.eight .jltma-infobox-item:hover .jltma-infobox-content-description,
1007	{{WRAPPER}} .jltma-infobox.nine .jltma-infobox-item:hover .jltma-infobox-content-description' =>
1008	'color: {{VALUE}};',
1009	],
1010	]
1011	);
1012
1013	$this->add_responsive_control(
1014	'ma_el_infobox_desc_hover_alignment',
1015	[
1016	'label' => esc_html__('Alignment', 'master-addons'),
1017	'type' => Controls_Manager::CHOOSE,
1018	'label_block' => false,
1019	'options' => Helper::jltma_content_alignment(),
1020	'default' => 'center',
1021	'selectors' => [
1022	'{{WRAPPER}} .jltma-infobox-item:hover .jltma-infobox-content-description' => 'text-align: {{VALUE}};',
1023	],
1024	]
1025	);
1026
1027	$this->add_responsive_control(
1028	'ma_el_infobox_desc_hover_padding',
1029	[
1030	'label' => __('Padding', 'master-addons'),
1031	'type' => Controls_Manager::DIMENSIONS,
1032	'size_units' => ['px', 'em', '%'],
1033	'selectors' => [
1034	'{{WRAPPER}} .jltma-infobox-item:hover .jltma-infobox-content-description' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
1035	],
1036	]
1037	);
1038
1039	$this->end_controls_tab();
1040
1041	$this->end_controls_tabs();
1042
1043	$this->end_controls_section();
1044
1045	// Help Docs section (links from config.php)
1046	$this->jltma_help_docs();
1047
1048	$this->upgrade_to_pro_message();
1049	}
1050	protected function render()
1051	{
1052	$settings = $this->get_settings_for_display();
1053
1054	// Read more Link
1055	// if( $settings['ma_el_infobox_readmore_link']['is_external'] ) {
1056	// $this->add_render_attribute( 'ma_el_infobox_readmore', 'target', '_blank' );
1057	// }
1058
1059	// if( $settings['ma_el_infobox_readmore_link']['nofollow'] ) {
1060	// $this->add_render_attribute( 'ma_el_infobox_readmore', 'rel', 'nofollow' );
1061	// }
1062
1063	if (!empty($settings['ma_el_infobox_readmore_link']['url'])) {
1064	$this->add_render_attribute('ma_el_infobox_readmore_link', 'href', $settings['ma_el_infobox_readmore_link']['url']);
1065
1066	if (!empty($settings['ma_el_infobox_readmore_link']['is_external'])) {
1067	$this->add_render_attribute('ma_el_infobox_readmore_link', 'target', '_blank');
1068	}
1069
1070	if ($settings['ma_el_infobox_readmore_link']['nofollow']) {
1071	$this->add_render_attribute('ma_el_infobox_readmore_link', 'rel', 'nofollow');
1072	}
1073	}
1074
1075	// Infobox Link
1076	if ($settings['ma_el_infobox_title_link']['is_external']) {
1077	$this->add_render_attribute('ma_el_infobox_title_link_attr', 'target', '_blank');
1078	}
1079
1080	if ($settings['ma_el_infobox_title_link']['nofollow']) {
1081	$this->add_render_attribute('ma_el_infobox_title_link_attr', 'rel', 'nofollow');
1082	}
1083
1084	$infobox_image = $this->get_settings_for_display('ma_el_infobox_image');
1085	if (!empty($infobox_image['url'])) {
1086	$infobox_image_url = Group_Control_Image_Size::get_attachment_image_src($infobox_image['id'], 'thumbnail', $settings);
1087
1088	if (empty($infobox_image_url)) {
1089	$infobox_image_url = $infobox_image['url'];
1090	} else {
1091	$infobox_image_url = $infobox_image_url;
1092	}
1093	}
1094
1095	?>
1096
1097	<div id="jltma-infobox-<?php echo esc_attr($this->get_id()); ?>" class="jltma-infobox <?php echo esc_attr($settings['ma_el_infobox_preset']); ?>">
1098	<div class="jltma-infobox-item">
1099
1100	<?php if ($settings['ma_el_infobox_img_or_icon'] != 'none') : ?>
1101
1102	<?php if (($settings['ma_el_infobox_preset'] === "two") \|\| ($settings['ma_el_infobox_preset'] === "three")) { ?>
1103	<div class="bg-fade-icon">
1104	<?php if ('img' == $settings['ma_el_infobox_img_or_icon']) { ?>
1105	<img src="<?php echo esc_url($infobox_image_url); ?>" alt="<?php echo esc_attr(get_post_meta($infobox_image['id'], '_wp_attachment_image_alt', true)); ?>">
1106	<?php } else {
1107	$migrated = isset($settings['__fa4_migrated']['ma_el_infobox_icon']);
1108	$is_new = empty($settings['icon']) && \Elementor\Icons_Manager::is_migration_allowed();
1109
1110	if ($is_new \|\| $migrated) {
1111	\Elementor\Icons_Manager::render_icon($settings['ma_el_infobox_icon'], ['aria-hidden' => 'true']);
1112	} else { ?>
1113	<i class="<?php echo esc_attr($settings['icon']); ?>" aria-hidden="true"></i>
1114	<?php }
1115	} ?>
1116	</div>
1117	<?php } ?>
1118
1119	<div class="jltma-infobox-icon <? echo esc_attr(('img' == $settings['ma_el_infobox_img_or_icon']) ? 'image' : ''); ?>">
1120
1121	<div class="jltma-inner-content">
1122
1123	<?php if ('icon' == $settings['ma_el_infobox_img_or_icon']) {
1124	$migrated = isset($settings['__fa4_migrated']['ma_el_infobox_icon']);
1125	$is_new = empty($settings['icon']) && \Elementor\Icons_Manager::is_migration_allowed();
1126
1127	if ($is_new \|\| $migrated) {
1128	\Elementor\Icons_Manager::render_icon($settings['ma_el_infobox_icon'], ['aria-hidden' => 'true']);
1129	} else { ?>
1130	<i class="<?php echo esc_attr($settings['icon']); ?>" aria-hidden="true"></i>
1131	<?php }
1132	}
1133
1134	if ('img' == $settings['ma_el_infobox_img_or_icon']) { ?>
1135	<img src="<?php echo esc_url($infobox_image_url); ?>" alt="<?php echo esc_attr(get_post_meta($infobox_image['id'], '_wp_attachment_image_alt', true)); ?>">
1136	<?php }
1137
1138	if ($settings['ma_el_infobox_preset'] == "nine") { ?>
1139
1140	<?php if ($settings['ma_el_infobox_title_link']['url']) { ?>
1141	<a href="<?php echo esc_url_raw($settings['ma_el_infobox_title_link']['url']); ?>" <?php echo $this->get_render_attribute_string('ma_el_infobox_title_link_attr'); ?>>
1142	<h3 class="jltma-infobox-content-title">
1143	<?php echo esc_html($this->parse_text_editor($settings['ma_el_infobox_title'])); ?>
1144	</h3>
1145	</a>
1146	<?php } else { ?>
1147	<h3 class="jltma-infobox-content-title">
1148	<?php echo esc_html($this->parse_text_editor($settings['ma_el_infobox_title'])); ?>
1149	</h3>
1150	<?php } ?>
1151
1152	<?php } ?>
1153
1154	<?php if ($settings['ma_el_infobox_preset'] == "five" \|\| $settings['ma_el_infobox_preset'] == "eight") { ?>
1155	<div class="jltma-hexagon-shape">
1156	<div class="jltma-shape-inner"></div>
1157	</div>
1158	<?php } ?>
1159	</div><!-- /.jltma-inner-content -->
1160	</div>
1161	<?php endif; ?>
1162
1163	<div class="jltma-infobox-content">
1164	<div class="jltma-inner-content">
1165	<?php if ($settings['ma_el_infobox_title_link']['url']) { ?>
1166	<a href="<?php echo esc_url_raw($settings['ma_el_infobox_title_link']['url']); ?>" <?php echo $this->get_render_attribute_string('ma_el_infobox_title_link_attr'); ?>>
1167	<h3 class="jltma-infobox-content-title">
1168	<?php echo esc_html($this->parse_text_editor($settings['ma_el_infobox_title'])); ?>
1169	</h3>
1170	</a>
1171	<?php } else { ?>
1172	<h3 class="jltma-infobox-content-title">
1173	<?php echo esc_html($this->parse_text_editor($settings['ma_el_infobox_title'])); ?>
1174	</h3>
1175	<?php } ?>
1176
1177	<p class="jltma-infobox-content-description">
1178	<?php echo $this->parse_text_editor($settings['ma_el_infobox_description']); ?>
1179	</p>
1180
1181	<?php if ($settings['ma_el_infobox_preset'] == "six") { ?>
1182	<a <?php echo $this->get_render_attribute_string('ma_el_infobox_readmore_link'); ?> class="jltma-btn-learn" <?php echo $this->get_render_attribute_string('ma_el_infobox_readmore'); ?>>
1183	<?php echo esc_html($settings['ma_el_infobox_readmore_text']); ?>
1184	<i class="ti-arrow-right"></i>
1185	</a>
1186	<?php } ?>
1187	</div><!-- /.jltma-inner-content -->
1188	</div>
1189	</div>
1190	</div>
1191
1192	<?php
1193	}
1194	}
1195