← All changes | includes/Editors/Elementor/Widget/Basic/FAQ.php +1014 -410 3.5.0 → 4.9.2 View file →

		@@ -1,487 +1,1091 @@
1	1	<?php
2	2
3	3	namespace WPDeveloper\BetterDocs\Editors\Elementor\Widget\Basic;
	4	+
4	5	use Elementor\Widget_Base;
5	6
6	7	// If this file is called directly, abort.
7	8	if ( ! defined( 'ABSPATH' ) ) {
8		- exit;
	9	+ exit;
9	10	}
10	11
11	12	use Elementor\Group_Control_Background;
12	13	use Elementor\Plugin as ElementorPlugin;
13		-use Elementor\Controls_Manager as Controls_Manager;
	14	+use Elementor\Controls_Manager;
14	15	use WPDeveloper\BetterDocs\Editors\Elementor\Helper;
15		-use Elementor\Group_Control_Border as Group_Control_Border;
16		-use Elementor\Group_Control_Typography as Group_Control_Typography;
	16	+use Elementor\Group_Control_Border;
	17	+use Elementor\Group_Control_Typography;
	18	+use WPDeveloper\BetterDocs\Editors\Elementor\BaseWidget;
	19	+use WPDeveloper\BetterDocs\FrontEnd\WooProductFAQ as WooFAQRenderer;
17	20
18		-class FAQ extends Widget_Base {
	21	+class FAQ extends BaseWidget {
19	22
20		- public function get_name() {
21		- return 'betterdocs-faq';
22		- }
	23	+ public function get_name() {
	24	+ return 'betterdocs-faq';
	25	+ }
23	26
24		- public function get_title() {
25		- return __( 'BetterDocs FAQ', 'betterdocs' );
26		- }
	27	+ public function get_title() {
	28	+ return __( 'BetterDocs FAQ', 'betterdocs' );
	29	+ }
27	30
28		- public function get_custom_help_url() {
29		- return 'http://betterdocs.co/docs/betterdocs-faq-builder-in-elementor/';
30		- }
	31	+ public function get_custom_help_url() {
	32	+ return 'http://betterdocs.co/docs/betterdocs-faq-builder-in-elementor/';
	33	+ }
31	34
32		- public function get_icon() {
33		- return 'betterdocs-icon-faq';
34		- }
	35	+ public function get_icon() {
	36	+ return 'betterdocs-icon-faq';
	37	+ }
35	38
36		- public function get_categories() {
37		- return ['betterdocs-elements'];
38		- }
	39	+ public function get_categories() {
	40	+ return [ 'betterdocs-elements' ];
	41	+ }
39	42
40		- public function get_keywords() {
41		- return ['betterdocs-elements', 'betterdocs', 'docs', 'faq', 'FAQ', 'betterdocs-faq'];
42		- }
	43	+ public function get_keywords() {
	44	+ return [ 'betterdocs-elements', 'betterdocs', 'docs', 'faq', 'FAQ', 'betterdocs-faq' ];
	45	+ }
43	46
44		- public function get_style_depends() {
45		- return ['betterdocs-faq'];
46		- }
	47	+ public function get_style_depends() {
	48	+ return [ 'betterdocs-faq' ];
	49	+ }
47	50
48		- protected function register_controls() {
49		- $this->start_controls_section(
50		- 'faq_section_controls',
51		- [
52		- 'label' => __( 'Layout Options', 'betterdocs' )
53		- ]
54		- );
	51	+ protected function register_controls() {
	52	+ $this->start_controls_section(
	53	+ 'faq_section_controls',
	54	+ [
	55	+ 'label' => __( 'Layout Options', 'betterdocs' )
	56	+ ]
	57	+ );
55	58
56		- $this->add_control(
57		- 'faq_layout_selection',
58		- [
59		- 'label' => __( 'Select Layout', 'betterdocs' ),
60		- 'type' => Controls_Manager::SELECT2,
61		- 'options' => [
62		- 'layout-1' => __( 'Modern Layout', 'betterdocs' ),
63		- 'layout-2' => __( 'Classic Layout', 'betterdocs' )
64		- ],
65		- 'default' => 'layout-1',
66		- 'label_block' => true
67		- ]
68		- );
	59	+ $this->add_control(
	60	+ 'faq_layout_selection',
	61	+ [
	62	+ 'label' => __( 'Select Layout', 'betterdocs' ),
	63	+ 'type' => Controls_Manager::SELECT2,
	64	+ 'options' => [
	65	+ 'layout-3' => __( 'Abstract Layout', 'betterdocs' ),
	66	+ 'layout-1' => __( 'Modern Layout', 'betterdocs' ),
	67	+ 'layout-2' => __( 'Classic Layout', 'betterdocs' ),
	68	+ 'layout-4' => __( 'Tab Layout', 'betterdocs' )
	69	+ ],
	70	+ 'default' => 'layout-1',
	71	+ 'label_block' => true
	72	+ ]
	73	+ );
69	74
70		- $this->add_control(
71		- 'faq_layout_section',
72		- [
73		- 'label' => __( 'FAQ Section', 'betterdocs' ),
74		- 'type' => Controls_Manager::TEXT,
75		- 'dynamic' => [
76		- 'active' => true
77		- ],
78		- 'default' => __( 'Frequently Asked Questions', 'betterdocs' )
79		- ]
80		- );
	75	+ if ( class_exists( 'WooCommerce' ) ) {
	76	+ $this->add_control(
	77	+ 'faq_taxonomy',
	78	+ [
	79	+ 'label' => __( 'FAQ Type', 'betterdocs' ),
	80	+ 'type' => Controls_Manager::SELECT,
	81	+ 'options' => [
	82	+ 'betterdocs_faq_category' => __( 'General FAQ', 'betterdocs' ),
	83	+ 'betterdocs_product_faq_category' => __( 'Product FAQ', 'betterdocs' ),
	84	+ 'product_assignments' => __( 'Product Assignments', 'betterdocs' ),
	85	+ ],
	86	+ 'default' => 'betterdocs_faq_category',
	87	+ ]
	88	+ );
81	89
82		- $terms = betterdocs()->container->get( Helper::class )->get_faq_terms();
	90	+ $this->add_control(
	91	+ 'faq_product_assignments_note',
	92	+ [
	93	+ 'type' => Controls_Manager::RAW_HTML,
	94	+ 'raw' => __( 'Groups are resolved automatically per product: a per-product assignment is shown if set, otherwise the groups assigned to the product’s categories. Manage assignments on each group in FAQ Builder → WooCommerce → Product FAQ Groups.', 'betterdocs' ),
	95	+ 'content_classes' => 'elementor-control-field-description',
	96	+ 'condition' => [ 'faq_taxonomy' => 'product_assignments' ],
	97	+ ]
	98	+ );
	99	+ }
83	100
84		- $this->add_control(
85		- 'select_specific_faq',
86		- [
87		- 'label' => __( 'Include FAQ Groups', 'betterdocs' ),
88		- 'label_block' => true,
89		- 'type' => Controls_Manager::SELECT2,
90		- 'options' => $terms,
91		- 'multiple' => true,
92		- 'default' => '',
93		- 'select2options' => [
94		- 'placeholder' => __( 'Include FAQ Groups', 'betterdocs' ),
95		- 'allowClear' => true
96		- ]
97		- ]
98		- );
	101	+ $this->add_control(
	102	+ 'faq_layout_section',
	103	+ [
	104	+ 'label' => __( 'FAQ Section', 'betterdocs' ),
	105	+ 'type' => Controls_Manager::TEXT,
	106	+ 'dynamic' => [
	107	+ 'active' => true
	108	+ ],
	109	+ 'default' => __( 'Frequently Asked Questions', 'betterdocs' )
	110	+ ]
	111	+ );
99	112
100		- $this->add_control(
101		- 'exclude_specific_faq',
102		- [
103		- 'label' => __( 'Exclude FAQ Groups', 'betterdocs' ),
104		- 'label_block' => true,
105		- 'type' => Controls_Manager::SELECT2,
106		- 'options' => $terms,
107		- 'multiple' => true,
108		- 'default' => '',
109		- 'select2options' => [
110		- 'placeholder' => __( 'Exclude FAQ Groups', 'betterdocs' ),
111		- 'allowClear' => true
112		- ]
113		- ]
114		- );
	113	+ $this->add_control(
	114	+ 'faq_section_title_tag',
	115	+ [
	116	+ 'label' => __( 'Section Title Tag', 'betterdocs' ),
	117	+ 'type' => Controls_Manager::SELECT,
	118	+ 'default' => 'h2',
	119	+ 'options' => [
	120	+ 'h1' => __( 'H1', 'betterdocs' ),
	121	+ 'h2' => __( 'H2', 'betterdocs' ),
	122	+ 'h3' => __( 'H3', 'betterdocs' ),
	123	+ 'h4' => __( 'H4', 'betterdocs' ),
	124	+ 'h5' => __( 'H5', 'betterdocs' ),
	125	+ 'h6' => __( 'H6', 'betterdocs' )
	126	+ ]
	127	+ ]
	128	+ );
115	129
116		- $this->end_controls_section();
	130	+ $this->add_control(
	131	+ 'faq_group_title_tag',
	132	+ [
	133	+ 'label' => __( 'Group Title Tag', 'betterdocs' ),
	134	+ 'type' => Controls_Manager::SELECT,
	135	+ 'default' => 'h3',
	136	+ 'options' => [
	137	+ 'h1' => __( 'H1', 'betterdocs' ),
	138	+ 'h2' => __( 'H2', 'betterdocs' ),
	139	+ 'h3' => __( 'H3', 'betterdocs' ),
	140	+ 'h4' => __( 'H4', 'betterdocs' ),
	141	+ 'h5' => __( 'H5', 'betterdocs' ),
	142	+ 'h6' => __( 'H6', 'betterdocs' )
	143	+ ],
	144	+ 'condition' => [
	145	+ 'faq_layout_selection' => [ 'layout-1', 'layout-2', 'layout-3' ]
	146	+ ]
	147	+ ]
	148	+ );
117	149
118		- /******* Common Section Style For Both Layouts *******/
	150	+ $terms = betterdocs()->container->get( Helper::class )->get_faq_terms();
119	151
120		- $this->start_controls_section(
121		- 'faq_section_style',
122		- [
123		- 'label' => __( 'FAQ Section Title', 'betterdocs' ),
124		- 'tab' => Controls_Manager::TAB_STYLE
125		- ]
126		- );
	152	+ // General FAQ include/exclude — shown always when WooCommerce is off,
	153	+ // or conditioned on FAQ Type = General FAQ when WooCommerce is on.
	154	+ $general_include_args = [
	155	+ 'label' => __( 'Include FAQ Groups', 'betterdocs' ),
	156	+ 'label_block' => true,
	157	+ 'type' => Controls_Manager::SELECT2,
	158	+ 'options' => $terms,
	159	+ 'multiple' => true,
	160	+ 'default' => '',
	161	+ 'select2options' => [
	162	+ 'placeholder' => __( 'Include FAQ Groups', 'betterdocs' ),
	163	+ 'allowClear' => true
	164	+ ]
	165	+ ];
	166	+ $general_exclude_args = [
	167	+ 'label' => __( 'Exclude FAQ Groups', 'betterdocs' ),
	168	+ 'label_block' => true,
	169	+ 'type' => Controls_Manager::SELECT2,
	170	+ 'options' => $terms,
	171	+ 'multiple' => true,
	172	+ 'default' => '',
	173	+ 'select2options' => [
	174	+ 'placeholder' => __( 'Exclude FAQ Groups', 'betterdocs' ),
	175	+ 'allowClear' => true
	176	+ ]
	177	+ ];
127	178
128		- $this->add_control(
129		- 'faq_layout_section_title_color',
130		- [
131		- 'label' => esc_html__( 'Text Color', 'betterdocs' ),
132		- 'type' => Controls_Manager::COLOR,
133		- 'selectors' => [
134		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-section-title' => 'color:{{VALUE}};'
135		- ]
136		- ]
137		- );
	179	+ if ( class_exists( 'WooCommerce' ) ) {
	180	+ $general_include_args['condition'] = [ 'faq_taxonomy' => 'betterdocs_faq_category' ];
	181	+ $general_exclude_args['condition'] = [ 'faq_taxonomy' => 'betterdocs_faq_category' ];
	182	+ }
138	183
139		- $this->add_group_control(
140		- Group_Control_Typography::get_type(),
141		- [
142		- 'name' => 'faq_layout_section_title_typography',
143		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-section-title'
144		- ]
145		- );
	184	+ $this->add_control( 'select_specific_faq', $general_include_args );
	185	+ $this->add_control( 'exclude_specific_faq', $general_exclude_args );
146	186
147		- $this->end_controls_section();
	187	+ if ( class_exists( 'WooCommerce' ) ) {
	188	+ $product_terms = betterdocs()->query->get_faq_terms( [], 'betterdocs_product_faq_category' );
148	189
149		- $this->start_controls_section(
150		- 'faq_box_title_section',
151		- [
152		- 'label' => __( 'FAQ Group Title', 'betterdocs' ),
153		- 'tab' => Controls_Manager::TAB_STYLE
154		- ]
155		- );
	190	+ $this->add_control(
	191	+ 'select_specific_product_faq',
	192	+ [
	193	+ 'label' => __( 'Include Product FAQ Groups', 'betterdocs' ),
	194	+ 'label_block' => true,
	195	+ 'type' => Controls_Manager::SELECT2,
	196	+ 'options' => $product_terms,
	197	+ 'multiple' => true,
	198	+ 'default' => '',
	199	+ 'condition' => [ 'faq_taxonomy' => 'betterdocs_product_faq_category' ],
	200	+ 'select2options' => [
	201	+ 'placeholder' => __( 'Include Product FAQ Groups', 'betterdocs' ),
	202	+ 'allowClear' => true
	203	+ ]
	204	+ ]
	205	+ );
156	206
157		- $this->add_control(
158		- 'faq_box_title_color',
159		- [
160		- 'label' => esc_html__( 'Title Color', 'betterdocs' ),
161		- 'type' => Controls_Manager::COLOR,
162		- 'selectors' => [
163		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title h2' => 'color:{{VALUE}};'
164		- ]
165		- ]
166		- );
	207	+ $this->add_control(
	208	+ 'exclude_specific_product_faq',
	209	+ [
	210	+ 'label' => __( 'Exclude Product FAQ Groups', 'betterdocs' ),
	211	+ 'label_block' => true,
	212	+ 'type' => Controls_Manager::SELECT2,
	213	+ 'options' => $product_terms,
	214	+ 'multiple' => true,
	215	+ 'default' => '',
	216	+ 'condition' => [ 'faq_taxonomy' => 'betterdocs_product_faq_category' ],
	217	+ 'select2options' => [
	218	+ 'placeholder' => __( 'Exclude Product FAQ Groups', 'betterdocs' ),
	219	+ 'allowClear' => true
	220	+ ]
	221	+ ]
	222	+ );
	223	+ }
167	224
168		- $this->add_control(
169		- 'faq_box_title_color_hover',
170		- [
171		- 'label' => esc_html__( 'Title Hover Color', 'betterdocs' ),
172		- 'type' => Controls_Manager::COLOR,
173		- 'selectors' => [
174		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title h2:hover' => 'color:{{VALUE}};'
175		- ]
176		- ]
177		- );
	225	+ $this->end_controls_section();
178	226
179		- $this->add_group_control(
180		- Group_Control_Typography::get_type(),
181		- [
182		- 'name' => 'faq_box_title_typography',
183		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title h2'
184		- ]
185		- );
	227	+ /**
	228	+ * ----------------------------------------------------------
	229	+ * Section: Container Section Settings
	230	+ * ----------------------------------------------------------
	231	+ */
	232	+ $this->start_controls_section(
	233	+ 'section_faq_container_section',
	234	+ [
	235	+ 'label' => __( 'Container Section', 'betterdocs' ),
	236	+ 'tab' => Controls_Manager::TAB_STYLE,
	237	+ ]
	238	+ );
186	239
187		- $this->end_controls_section();
	240	+ $this->add_responsive_control(
	241	+ 'section_faq_container_section_padding',
	242	+ [
	243	+ 'label' => __( 'Padding', 'betterdocs' ),
	244	+ 'type' => Controls_Manager::DIMENSIONS,
	245	+ 'size_units' => [ 'px', 'em', '%' ],
	246	+ 'selectors' => [
	247	+ '{{WRAPPER}} .betterdocs-faq-wrapper' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	248	+ ]
	249	+ ]
	250	+ );
188	251
189		- $this->start_controls_section(
190		- 'faq_box_style_section',
191		- [
192		- 'label' => __( 'FAQ List', 'betterdocs' ),
193		- 'tab' => Controls_Manager::TAB_STYLE
194		- ]
195		- );
	252	+ $this->add_responsive_control(
	253	+ 'section_faq_container_section_margin', // Legacy control id but new control
	254	+ [
	255	+ 'label' => __( 'Margin', 'betterdocs' ),
	256	+ 'type' => Controls_Manager::DIMENSIONS,
	257	+ 'size_units' => [ 'px', '%', 'em' ],
	258	+ 'selectors' => [
	259	+ '{{WRAPPER}} .betterdocs-faq-wrapper' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	260	+ ]
	261	+ ]
	262	+ );
196	263
197		- $this->add_responsive_control(
198		- 'faq_box_padding',
199		- [
200		- 'label' => __( 'Padding', 'betterdocs' ),
201		- 'type' => Controls_Manager::DIMENSIONS,
202		- 'size_units' => ['px', '%', 'em'],
203		- 'selectors' => [
204		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
205		- ]
206		- ]
207		- );
	264	+ $this->add_group_control(
	265	+ Group_Control_Background::get_type(),
	266	+ [
	267	+ 'name' => 'section_faq_container_section_background',
	268	+ 'types' => [ 'classic', 'gradient' ],
	269	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper'
	270	+ ]
	271	+ );
208	272
209		- $this->add_responsive_control(
210		- 'faq_box_margin',
211		- [
212		- 'label' => __( 'Margin', 'betterdocs' ),
213		- 'type' => Controls_Manager::DIMENSIONS,
214		- 'size_units' => ['px', '%', 'em'],
215		- 'selectors' => [
216		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
217		- ]
218		- ]
219		- );
	273	+ $this->end_controls_section();
220	274
221		- $this->add_group_control(
222		- Group_Control_Typography::get_type(),
223		- [
224		- 'name' => 'faq_box_typography',
225		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name'
226		- ]
227		- );
	275	+ /******* Common Section Style For Both Layouts *******/
228	276
229		- $this->add_control(
230		- 'faq_box_term_title_color',
231		- [
232		- 'label' => esc_html__( 'Color', 'betterdocs' ),
233		- 'type' => Controls_Manager::COLOR,
234		- 'selectors' => [
235		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name' => 'color:{{VALUE}};'
236		- ]
237		- ]
238		- );
	277	+ $this->start_controls_section(
	278	+ 'faq_section_style',
	279	+ [
	280	+ 'label' => __( 'FAQ Section Title', 'betterdocs' ),
	281	+ 'tab' => Controls_Manager::TAB_STYLE
	282	+ ]
	283	+ );
239	284
240		- $this->start_controls_tabs( 'faq_tabs' );
	285	+ $this->add_control(
	286	+ 'faq_layout_section_title_color',
	287	+ [
	288	+ 'label' => esc_html__( 'Text Color', 'betterdocs' ),
	289	+ 'type' => Controls_Manager::COLOR,
	290	+ 'selectors' => [
	291	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-section-title' => 'color:{{VALUE}};'
	292	+ ]
	293	+ ]
	294	+ );
241	295
242		- // Normal State Tab
243		- $this->start_controls_tab(
244		- 'faq_box_normal',
245		- ['label' => esc_html__( 'Normal', 'betterdocs' )]
246		- );
	296	+ $this->add_group_control(
	297	+ Group_Control_Typography::get_type(),
	298	+ [
	299	+ 'name' => 'faq_layout_section_title_typography',
	300	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-section-title'
	301	+ ]
	302	+ );
247	303
248		- $this->add_group_control(
249		- Group_Control_Border::get_type(),
250		- [
251		- 'name' => 'faq_box_border_normal',
252		- 'label' => esc_html__( 'Border', 'betterdocs' ),
253		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
254		- ]
255		- );
	304	+ $this->end_controls_section();
256	305
257		- $this->add_group_control(
258		- Group_Control_Background::get_type(),
259		- [
260		- 'name' => 'faq_box_background_normal',
261		- 'label' => esc_html__( 'Background', 'betterdocs' ),
262		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
263		- ]
264		- );
	306	+ $this->start_controls_section(
	307	+ 'faq_box_title_section',
	308	+ [
	309	+ 'label' => __( 'FAQ Group Title', 'betterdocs' ),
	310	+ 'tab' => Controls_Manager::TAB_STYLE,
	311	+ 'condition' => [
	312	+ 'faq_layout_selection' => ['layout-1', 'layout-2', 'layout-3']
	313	+ ]
	314	+ ]
	315	+ );
265	316
266		- $this->end_controls_tab();
	317	+ $this->add_control(
	318	+ 'faq_box_title_color',
	319	+ [
	320	+ 'label' => esc_html__( 'Title Color', 'betterdocs' ),
	321	+ 'type' => Controls_Manager::COLOR,
	322	+ 'selectors' => [
	323	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title .betterdocs-faq-title-tag' => 'color:{{VALUE}};'
	324	+ ]
	325	+ ]
	326	+ );
267	327
268		- // Hover State Tab
269		- $this->start_controls_tab(
270		- 'faq_box_hover',
271		- ['label' => esc_html__( 'Hover', 'betterdocs' )]
272		- );
	328	+ $this->add_control(
	329	+ 'faq_box_title_color_hover',
	330	+ [
	331	+ 'label' => esc_html__( 'Title Hover Color', 'betterdocs' ),
	332	+ 'type' => Controls_Manager::COLOR,
	333	+ 'selectors' => [
	334	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title .betterdocs-faq-title-tag:hover' => 'color:{{VALUE}};'
	335	+ ]
	336	+ ]
	337	+ );
273	338
274		- $this->add_group_control(
275		- Group_Control_Border::get_type(),
276		- [
277		- 'name' => 'faq_box_border_hover',
278		- 'label' => esc_html__( 'Border', 'betterdocs' ),
279		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
280		- ]
281		- );
	339	+ $this->add_control(
	340	+ 'faq_box_title_background_color',
	341	+ [
	342	+ 'label' => esc_html__( 'Background Color', 'betterdocs' ),
	343	+ 'type' => Controls_Manager::COLOR,
	344	+ 'selectors' => [
	345	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title' => 'background-color:{{VALUE}};'
	346	+ ]
	347	+ ]
	348	+ );
282	349
283		- $this->add_group_control(
284		- Group_Control_Background::get_type(),
285		- [
286		- 'name' => 'faq_box_background_hover',
287		- 'label' => esc_html__( 'Background', 'betterdocs' ),
288		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
289		- ]
290		- );
	350	+ $this->add_control(
	351	+ 'faq_box_title_background_color_hover',
	352	+ [
	353	+ 'label' => esc_html__( 'Background Hover Color', 'betterdocs' ),
	354	+ 'type' => Controls_Manager::COLOR,
	355	+ 'selectors' => [
	356	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title:hover' => 'background-color:{{VALUE}};'
	357	+ ]
	358	+ ]
	359	+ );
291	360
292		- $this->end_controls_tab();
	361	+ $this->add_group_control(
	362	+ Group_Control_Typography::get_type(),
	363	+ [
	364	+ 'name' => 'faq_box_title_typography',
	365	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-title .betterdocs-faq-title-tag'
	366	+ ]
	367	+ );
293	368
294		- $this->end_controls_tabs();
	369	+ $this->end_controls_section();
295	370
296		- $this->end_controls_section();
	371	+ $this->start_controls_section(
	372	+ 'faq_box_title_section_layout_4',
	373	+ [
	374	+ 'label' => __( 'FAQ Group Title', 'betterdocs' ),
	375	+ 'tab' => Controls_Manager::TAB_STYLE,
	376	+ 'condition' => [
	377	+ 'faq_layout_selection' => ['layout-4']
	378	+ ]
	379	+ ]
	380	+ );
297	381
298		- $this->start_controls_section(
299		- 'faq_box_content_section',
300		- [
301		- 'label' => __( 'FAQ Content', 'betterdocs' ),
302		- 'tab' => Controls_Manager::TAB_STYLE
303		- ]
304		- );
	382	+ $this->add_control(
	383	+ 'faq_box_title_color_layout_4',
	384	+ [
	385	+ 'label' => esc_html__( 'Title Color', 'betterdocs' ),
	386	+ 'type' => Controls_Manager::COLOR,
	387	+ 'selectors' => [
	388	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab .faq-tab-title, .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-tab .faq-tab-title' => 'color:{{VALUE}};'
	389	+ ]
	390	+ ]
	391	+ );
305	392
306		- $this->add_responsive_control(
307		- 'faq_box_content_section_padding',
308		- [
309		- 'label' => __( 'Padding', 'betterdocs' ),
310		- 'type' => Controls_Manager::DIMENSIONS,
311		- 'size_units' => ['px', '%', 'em'],
312		- 'selectors' => [
313		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
314		- ]
315		- ]
316		- );
	393	+ $this->add_control(
	394	+ 'faq_box_title_color_hover_layout_4',
	395	+ [
	396	+ 'label' => esc_html__( 'Title Hover Color', 'betterdocs' ),
	397	+ 'type' => Controls_Manager::COLOR,
	398	+ 'selectors' => [
	399	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab .faq-tab-title:hover' => 'color:{{VALUE}};',
	400	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-tab .faq-tab-title:hover' => 'color:{{VALUE}};'
	401	+ ]
	402	+ ]
	403	+ );
317	404
318		- $this->add_responsive_control(
319		- 'faq_box_content_section_margin',
320		- [
321		- 'label' => __( 'Margin', 'betterdocs' ),
322		- 'type' => Controls_Manager::DIMENSIONS,
323		- 'size_units' => ['px', '%', 'em'],
324		- 'selectors' => [
325		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
326		- ]
327		- ]
328		- );
	405	+ $this->add_control(
	406	+ 'faq_box_title_background_color_layout_4',
	407	+ [
	408	+ 'label' => esc_html__( 'Background Color', 'betterdocs' ),
	409	+ 'type' => Controls_Manager::COLOR,
	410	+ 'selectors' => [
	411	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab' => 'background-color:{{VALUE}};',
	412	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-tab' => 'background-color:{{VALUE}};'
	413	+ ]
	414	+ ]
	415	+ );
329	416
330		- $this->add_group_control(
331		- Group_Control_Background::get_type(),
332		- [
333		- 'name' => 'faq_box_content_section_background',
334		- 'label' => esc_html__( 'Background', 'betterdocs' ),
335		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content'
336		- ]
337		- );
	417	+ $this->add_control(
	418	+ 'faq_box_title_background_color_hover_layout_4',
	419	+ [
	420	+ 'label' => esc_html__( 'Background Hover Color', 'betterdocs' ),
	421	+ 'type' => Controls_Manager::COLOR,
	422	+ 'selectors' => [
	423	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab:hover' => 'background-color:{{VALUE}};',
	424	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-tab:hover' => 'background-color:{{VALUE}};'
	425	+ ]
	426	+ ]
	427	+ );
338	428
339		- $this->add_group_control(
340		- Group_Control_Typography::get_type(),
341		- [
342		- 'name' => 'faq_box_content_section_typography',
343		- 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content'
344		- ]
345		- );
	429	+ $this->add_control(
	430	+ 'faq_box_title_background_color_active_layout_4',
	431	+ [
	432	+ 'label' => esc_html__( 'Active Background Color', 'betterdocs' ),
	433	+ 'type' => Controls_Manager::COLOR,
	434	+ 'selectors' => [
	435	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab.active' => 'background-color:{{VALUE}};',
	436	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-tab.active' => 'background-color:{{VALUE}};'
	437	+ ]
	438	+ ]
	439	+ );
346	440
347		- $this->add_control(
348		- 'faq_box_content_section_color',
349		- [
350		- 'label' => esc_html__( 'Color', 'betterdocs' ),
351		- 'type' => Controls_Manager::COLOR,
352		- 'selectors' => [
353		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'color:{{VALUE}};'
354		- ]
355		- ]
356		- );
	441	+ $this->add_group_control(
	442	+ Group_Control_Typography::get_type(),
	443	+ [
	444	+ 'name' => 'faq_box_title_typography_layout_4',
	445	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab .faq-tab-title, .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-tab .faq-tab-title'
	446	+ ]
	447	+ );
357	448
358		- $this->end_controls_section();
	449	+ $this->end_controls_section();
359	450
360		- $this->start_controls_section(
361		- 'faq_box_content_icon',
362		- [
363		- 'label' => __( 'FAQ List Icon', 'betterdocs' ),
364		- 'tab' => Controls_Manager::TAB_STYLE
365		- ]
366		- );
	451	+ $this->start_controls_section(
	452	+ 'faq_box_style_section',
	453	+ [
	454	+ 'label' => __( 'FAQ List', 'betterdocs' ),
	455	+ 'tab' => Controls_Manager::TAB_STYLE,
	456	+ 'condition' => [
	457	+ 'faq_layout_selection' => ['layout-1', 'layout-2', 'layout-3']
	458	+ ]
	459	+ ]
	460	+ );
367	461
368		- $this->add_responsive_control(
369		- 'faq_box_content_icon_height',
370		- [
371		- 'label' => esc_html__( 'Icon Height', 'betterdocs' ),
372		- 'type' => Controls_Manager::SLIDER,
373		- 'size_units' => ['px', '%', 'em'],
374		- 'range' => [
375		- 'px' => [
376		- 'max' => 500
377		- ]
378		- ],
379		- 'selectors' => [
380		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
381		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};'
382		- ]
383		- ]
384		- );
	462	+ $this->add_responsive_control(
	463	+ 'faq_box_padding',
	464	+ [
	465	+ 'label' => __( 'Padding', 'betterdocs' ),
	466	+ 'type' => Controls_Manager::DIMENSIONS,
	467	+ 'size_units' => [ 'px', '%', 'em' ],
	468	+ 'selectors' => [
	469	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	470	+ ]
	471	+ ]
	472	+ );
385	473
386		- $this->add_responsive_control(
387		- 'faq_box_content_icon_width',
388		- [
389		- 'label' => esc_html__( 'Icon Width', 'betterdocs' ),
390		- 'type' => Controls_Manager::SLIDER,
391		- 'size_units' => ['px', '%', 'em'],
392		- 'range' => [
393		- 'px' => [
394		- 'max' => 500
395		- ]
396		- ],
397		- 'selectors' => [
398		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};',
399		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};'
400		- ]
401		- ]
402		- );
	474	+ $this->add_responsive_control(
	475	+ 'faq_box_margin',
	476	+ [
	477	+ 'label' => __( 'Margin', 'betterdocs' ),
	478	+ 'type' => Controls_Manager::DIMENSIONS,
	479	+ 'size_units' => [ 'px', '%', 'em' ],
	480	+ 'selectors' => [
	481	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	482	+ ]
	483	+ ]
	484	+ );
403	485
404		- $this->add_control(
405		- 'faq_box_content_icon_color',
406		- [
407		- 'label' => esc_html__( 'Icon Color', 'betterdocs' ),
408		- 'type' => Controls_Manager::COLOR,
409		- 'selectors' => [
410		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus path' => 'fill:{{VALUE}} ! important;',
411		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus path' => 'fill:{{VALUE}} ! important;',
412		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus g' => 'stroke:{{VALUE}} ! important;',
413		- '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus g' => 'stroke:{{VALUE}} ! important;'
414		- ]
415		- ]
416		- );
	486	+ $this->add_group_control(
	487	+ Group_Control_Typography::get_type(),
	488	+ [
	489	+ 'name' => 'faq_box_typography',
	490	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name'
	491	+ ]
	492	+ );
417	493
418		- $this->end_controls_section();
419		- }
	494	+ $this->add_control(
	495	+ 'faq_box_term_title_color',
	496	+ [
	497	+ 'label' => esc_html__( 'Color', 'betterdocs' ),
	498	+ 'type' => Controls_Manager::COLOR,
	499	+ 'selectors' => [
	500	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name' => 'color:{{VALUE}};'
	501	+ ]
	502	+ ]
	503	+ );
420	504
421		- protected function render() {
422		- $control_values = $this->get_settings_for_display();
	505	+ $this->start_controls_tabs( 'faq_tabs' );
423	506
424		- $specific_faqs = ! empty( $control_values['select_specific_faq'] ) ? implode( ',', $control_values['select_specific_faq'] ) : '';
	507	+ // Normal State Tab
	508	+ $this->start_controls_tab(
	509	+ 'faq_box_normal',
	510	+ [ 'label' => esc_html__( 'Normal', 'betterdocs' ) ]
	511	+ );
425	512
426		- $faqs_exclude = ! empty( $control_values['exclude_specific_faq'] ) ? implode( ',', $control_values['exclude_specific_faq'] ) : '';
	513	+ $this->add_group_control(
	514	+ Group_Control_Border::get_type(),
	515	+ [
	516	+ 'name' => 'faq_box_border_normal',
	517	+ 'label' => esc_html__( 'Border', 'betterdocs' ),
	518	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
	519	+ ]
	520	+ );
427	521
428		- betterdocs()->views->get( 'layouts/faq', [
429		- 'enable' => true,
430		- 'have_posts' => true,
431		- 'layout' => $control_values['faq_layout_selection'],
432		- 'shortcode_attr' => [
433		- 'group_exclude' => $faqs_exclude,
434		- 'class' => 'betterdocs-faq-' . $control_values['faq_layout_selection'],
435		- 'groups' => $specific_faqs,
436		- 'faq_heading' => $control_values['faq_layout_section']
437		- ]
438		- ] );
	522	+ $this->add_group_control(
	523	+ Group_Control_Background::get_type(),
	524	+ [
	525	+ 'name' => 'faq_box_background_normal',
	526	+ 'label' => esc_html__( 'Background', 'betterdocs' ),
	527	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post'
	528	+ ]
	529	+ );
439	530
440		- if ( ElementorPlugin::instance()->editor->is_edit_mode() ) {
441		- $this->render_editor_script();
442		- }
443		- }
	531	+ $this->end_controls_tab();
444	532
445		- protected function render_editor_script()
446		- {
447		- ?>
448		- <script>
449		- jQuery(document).ready(function($) {
450		- $('.betterdocs-faq-post').on('click', function(e) {
451		- var current_node = $(this);
452		- var active_list = $('.betterdocs-faq-group.active');
	533	+ // Hover State Tab
	534	+ $this->start_controls_tab(
	535	+ 'faq_box_hover',
	536	+ [ 'label' => esc_html__( 'Hover', 'betterdocs' ) ]
	537	+ );
453	538
454		- if( ! current_node.parent().hasClass('active') ) {
455		- current_node.parent().addClass('active');
456		- current_node.children('svg').toggle();
457		- current_node.next().slideDown();
458		- }
	539	+ $this->add_group_control(
	540	+ Group_Control_Border::get_type(),
	541	+ [
	542	+ 'name' => 'faq_box_border_hover',
	543	+ 'label' => esc_html__( 'Border', 'betterdocs' ),
	544	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
	545	+ ]
	546	+ );
459	547
460		- for( let node of active_list ) {
461		- if( $(node).hasClass('active') ) {
462		- $(node).removeClass('active');
463		- $(node).children('.betterdocs-faq-post').children('svg').toggle();
464		- $(node).children('.betterdocs-faq-main-content').slideUp();
465		- }
466		- }
467		- });
	548	+ $this->add_group_control(
	549	+ Group_Control_Background::get_type(),
	550	+ [
	551	+ 'name' => 'faq_box_background_hover',
	552	+ 'label' => esc_html__( 'Background', 'betterdocs' ),
	553	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post:hover'
	554	+ ]
	555	+ );
468	556
469		- $('.betterdocs-faq-post-layout-2').on('click', function(e) {
470		- var current_node = $(this);
	557	+ $this->end_controls_tab();
471	558
472		- if( ! current_node.parent().hasClass('active') ) {
473		- current_node.parent().addClass('active');
474		- current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
475		- current_node.next().slideDown();
476		- } else {
477		- current_node.parent().removeClass('active');
478		- current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
479		- current_node.next().slideUp();
480		- }
	559	+ $this->end_controls_tabs();
481	560
482		- });
483		- });
484		- </script>
485		- <?php
486		- }
	561	+ $this->end_controls_section();
	562	+
	563	+ $this->start_controls_section(
	564	+ 'faq_box_style_section_layout_4',
	565	+ [
	566	+ 'label' => __( 'FAQ List', 'betterdocs' ),
	567	+ 'tab' => Controls_Manager::TAB_STYLE,
	568	+ 'condition' => [
	569	+ 'faq_layout_selection' => ['layout-4']
	570	+ ]
	571	+ ]
	572	+ );
	573	+
	574	+ $this->add_responsive_control(
	575	+ 'faq_box_padding_layout_4',
	576	+ [
	577	+ 'label' => __( 'Padding', 'betterdocs' ),
	578	+ 'type' => Controls_Manager::DIMENSIONS,
	579	+ 'size_units' => [ 'px', '%', 'em' ],
	580	+ 'selectors' => [
	581	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	582	+ ]
	583	+ ]
	584	+ );
	585	+
	586	+ $this->add_responsive_control(
	587	+ 'faq_box_margin_layout_4',
	588	+ [
	589	+ 'label' => __( 'Margin', 'betterdocs' ),
	590	+ 'type' => Controls_Manager::DIMENSIONS,
	591	+ 'size_units' => [ 'px', '%', 'em' ],
	592	+ 'selectors' => [
	593	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	594	+ ]
	595	+ ]
	596	+ );
	597	+
	598	+ $this->add_group_control(
	599	+ Group_Control_Typography::get_type(),
	600	+ [
	601	+ 'name' => 'faq_box_typography_layout_4',
	602	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name'
	603	+ ]
	604	+ );
	605	+
	606	+ $this->add_control(
	607	+ 'faq_box_term_title_color_layout_4',
	608	+ [
	609	+ 'label' => esc_html__( 'Color', 'betterdocs' ),
	610	+ 'type' => Controls_Manager::COLOR,
	611	+ 'selectors' => [
	612	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-post-name' => 'color:{{VALUE}};'
	613	+ ]
	614	+ ]
	615	+ );
	616	+
	617	+ $this->start_controls_tabs( 'faq_tabs_layout_4' );
	618	+
	619	+ // Normal State Tab
	620	+ $this->start_controls_tab(
	621	+ 'faq_box_normal_layout_4',
	622	+ [ 'label' => esc_html__( 'Normal', 'betterdocs' ) ]
	623	+ );
	624	+
	625	+ $this->add_group_control(
	626	+ Group_Control_Border::get_type(),
	627	+ [
	628	+ 'name' => 'faq_box_border_normal_layout_4',
	629	+ 'label' => esc_html__( 'Border', 'betterdocs' ),
	630	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group'
	631	+ ]
	632	+ );
	633	+
	634	+ $this->add_group_control(
	635	+ Group_Control_Background::get_type(),
	636	+ [
	637	+ 'name' => 'faq_box_background_normal_layout_4',
	638	+ 'label' => esc_html__( 'Background', 'betterdocs' ),
	639	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group'
	640	+ ]
	641	+ );
	642	+
	643	+ $this->end_controls_tab();
	644	+
	645	+ // Hover State Tab
	646	+ $this->start_controls_tab(
	647	+ 'faq_box_hover_layout_4',
	648	+ [ 'label' => esc_html__( 'Hover', 'betterdocs' ) ]
	649	+ );
	650	+
	651	+ $this->add_group_control(
	652	+ Group_Control_Border::get_type(),
	653	+ [
	654	+ 'name' => 'faq_box_border_hover_layout_4',
	655	+ 'label' => esc_html__( 'Border', 'betterdocs' ),
	656	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group:hover'
	657	+ ]
	658	+ );
	659	+
	660	+ $this->add_group_control(
	661	+ Group_Control_Background::get_type(),
	662	+ [
	663	+ 'name' => 'faq_box_background_hover_layout_4',
	664	+ 'label' => esc_html__( 'Background', 'betterdocs' ),
	665	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group:hover'
	666	+ ]
	667	+ );
	668	+
	669	+ $this->end_controls_tab();
	670	+
	671	+ $this->end_controls_tabs();
	672	+
	673	+ $this->end_controls_section();
	674	+
	675	+ $this->start_controls_section(
	676	+ 'faq_box_content_section',
	677	+ [
	678	+ 'label' => __( 'FAQ Content', 'betterdocs' ),
	679	+ 'tab' => Controls_Manager::TAB_STYLE,
	680	+ 'condition' => [
	681	+ 'faq_layout_selection' => ['layout-1', 'layout-2', 'layout-3']
	682	+ ]
	683	+ ]
	684	+ );
	685	+
	686	+ $this->add_responsive_control(
	687	+ 'faq_box_content_section_padding',
	688	+ [
	689	+ 'label' => __( 'Padding', 'betterdocs' ),
	690	+ 'type' => Controls_Manager::DIMENSIONS,
	691	+ 'size_units' => [ 'px', '%', 'em' ],
	692	+ 'selectors' => [
	693	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	694	+ ]
	695	+ ]
	696	+ );
	697	+
	698	+ $this->add_responsive_control(
	699	+ 'faq_box_content_section_margin',
	700	+ [
	701	+ 'label' => __( 'Margin', 'betterdocs' ),
	702	+ 'type' => Controls_Manager::DIMENSIONS,
	703	+ 'size_units' => [ 'px', '%', 'em' ],
	704	+ 'selectors' => [
	705	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	706	+ ]
	707	+ ]
	708	+ );
	709	+
	710	+ $this->add_group_control(
	711	+ Group_Control_Background::get_type(),
	712	+ [
	713	+ 'name' => 'faq_box_content_section_background',
	714	+ 'label' => esc_html__( 'Background', 'betterdocs' ),
	715	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content'
	716	+ ]
	717	+ );
	718	+
	719	+ $this->add_group_control(
	720	+ Group_Control_Typography::get_type(),
	721	+ [
	722	+ 'name' => 'faq_box_content_section_typography',
	723	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content'
	724	+ ]
	725	+ );
	726	+
	727	+ $this->add_control(
	728	+ 'faq_box_content_section_color',
	729	+ [
	730	+ 'label' => esc_html__( 'Color', 'betterdocs' ),
	731	+ 'type' => Controls_Manager::COLOR,
	732	+ 'selectors' => [
	733	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-main-content' => 'color:{{VALUE}};'
	734	+ ]
	735	+ ]
	736	+ );
	737	+
	738	+ $this->end_controls_section();
	739	+
	740	+ $this->start_controls_section(
	741	+ 'faq_box_content_section_layout_4',
	742	+ [
	743	+ 'label' => __( 'FAQ Content', 'betterdocs' ),
	744	+ 'tab' => Controls_Manager::TAB_STYLE,
	745	+ 'condition' => [
	746	+ 'faq_layout_selection' => ['layout-4']
	747	+ ]
	748	+ ]
	749	+ );
	750	+
	751	+ $this->add_responsive_control(
	752	+ 'faq_box_content_section_padding_layout_4',
	753	+ [
	754	+ 'label' => __( 'Padding', 'betterdocs' ),
	755	+ 'type' => Controls_Manager::DIMENSIONS,
	756	+ 'size_units' => [ 'px', '%', 'em' ],
	757	+ 'selectors' => [
	758	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group .betterdocs-faq-main-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	759	+ ]
	760	+ ]
	761	+ );
	762	+
	763	+ $this->add_responsive_control(
	764	+ 'faq_box_content_section_margin_layout_4',
	765	+ [
	766	+ 'label' => __( 'Margin', 'betterdocs' ),
	767	+ 'type' => Controls_Manager::DIMENSIONS,
	768	+ 'size_units' => [ 'px', '%', 'em' ],
	769	+ 'selectors' => [
	770	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group .betterdocs-faq-main-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};'
	771	+ ]
	772	+ ]
	773	+ );
	774	+
	775	+ $this->add_group_control(
	776	+ Group_Control_Background::get_type(),
	777	+ [
	778	+ 'name' => 'faq_box_content_section_background_layout_4',
	779	+ 'label' => esc_html__( 'Background', 'betterdocs' ),
	780	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group.active'
	781	+ ]
	782	+ );
	783	+
	784	+ $this->add_group_control(
	785	+ Group_Control_Typography::get_type(),
	786	+ [
	787	+ 'name' => 'faq_box_content_section_typography_layout_4',
	788	+ 'selector' => '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group .betterdocs-faq-main-content'
	789	+ ]
	790	+ );
	791	+
	792	+ $this->add_control(
	793	+ 'faq_box_content_section_color_layout_4',
	794	+ [
	795	+ 'label' => esc_html__( 'Color', 'betterdocs' ),
	796	+ 'type' => Controls_Manager::COLOR,
	797	+ 'selectors' => [
	798	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-list-wrapper .betterdocs-faq-list-content .betterdocs-faq-list li .betterdocs-faq-group .betterdocs-faq-main-content' => 'color:{{VALUE}};'
	799	+ ]
	800	+ ]
	801	+ );
	802	+
	803	+ $this->end_controls_section();
	804	+
	805	+ $this->start_controls_section(
	806	+ 'faq_box_content_icon',
	807	+ [
	808	+ 'label' => __( 'FAQ List Icon', 'betterdocs' ),
	809	+ 'tab' => Controls_Manager::TAB_STYLE,
	810	+ 'condition' => [
	811	+ 'faq_layout_selection' => ['layout-1', 'layout-2', 'layout-3']
	812	+ ]
	813	+ ]
	814	+ );
	815	+
	816	+ $this->add_responsive_control(
	817	+ 'faq_box_content_icon_height',
	818	+ [
	819	+ 'label' => esc_html__( 'Icon Height', 'betterdocs' ),
	820	+ 'type' => Controls_Manager::SLIDER,
	821	+ 'size_units' => [ 'px', '%', 'em' ],
	822	+ 'range' => [
	823	+ 'px' => [
	824	+ 'max' => 500
	825	+ ]
	826	+ ],
	827	+ 'selectors' => [
	828	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
	829	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};'
	830	+ ]
	831	+ ]
	832	+ );
	833	+
	834	+ $this->add_responsive_control(
	835	+ 'faq_box_content_icon_width',
	836	+ [
	837	+ 'label' => esc_html__( 'Icon Width', 'betterdocs' ),
	838	+ 'type' => Controls_Manager::SLIDER,
	839	+ 'size_units' => [ 'px', '%', 'em' ],
	840	+ 'range' => [
	841	+ 'px' => [
	842	+ 'max' => 500
	843	+ ]
	844	+ ],
	845	+ 'selectors' => [
	846	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};',
	847	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};'
	848	+ ]
	849	+ ]
	850	+ );
	851	+
	852	+ $this->add_control(
	853	+ 'faq_box_content_icon_color',
	854	+ [
	855	+ 'label' => esc_html__( 'Icon Color', 'betterdocs' ),
	856	+ 'type' => Controls_Manager::COLOR,
	857	+ 'selectors' => [
	858	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus path' => 'fill:{{VALUE}} ! important;',
	859	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus path' => 'fill:{{VALUE}} ! important;',
	860	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconplus g' => 'stroke:{{VALUE}} ! important;',
	861	+ '{{WRAPPER}} .betterdocs-faq-wrapper .betterdocs-faq-inner-wrapper .betterdocs-faq-list > li .betterdocs-faq-group .betterdocs-faq-post .betterdocs-faq-iconminus g' => 'stroke:{{VALUE}} ! important;'
	862	+ ]
	863	+ ]
	864	+ );
	865	+
	866	+ $this->end_controls_section();
	867	+
	868	+ $this->start_controls_section(
	869	+ 'faq_group_icon_layout_4',
	870	+ [
	871	+ 'label' => __( 'FAQ Group Icon', 'betterdocs' ),
	872	+ 'tab' => Controls_Manager::TAB_STYLE,
	873	+ 'condition' => [
	874	+ 'faq_layout_selection' => ['layout-4']
	875	+ ]
	876	+ ]
	877	+ );
	878	+
	879	+ $this->add_responsive_control(
	880	+ 'faq_box_content_icon_height_layout_4',
	881	+ [
	882	+ 'label' => esc_html__( 'Icon Height', 'betterdocs' ),
	883	+ 'type' => Controls_Manager::SLIDER,
	884	+ 'size_units' => [ 'px', '%', 'em' ],
	885	+ 'range' => [
	886	+ 'px' => [
	887	+ 'max' => 500
	888	+ ]
	889	+ ],
	890	+ 'selectors' => [
	891	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab .faq-tab-icon svg' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
	892	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab img' => 'height:{{SIZE}}{{UNIT}}; max-height: {{SIZE}}{{UNIT}};',
	893	+ ]
	894	+ ]
	895	+ );
	896	+
	897	+ $this->add_responsive_control(
	898	+ 'faq_box_content_icon_width_layout_4',
	899	+ [
	900	+ 'label' => esc_html__( 'Icon Width', 'betterdocs' ),
	901	+ 'type' => Controls_Manager::SLIDER,
	902	+ 'size_units' => [ 'px', '%', 'em' ],
	903	+ 'range' => [
	904	+ 'px' => [
	905	+ 'max' => 500
	906	+ ]
	907	+ ],
	908	+ 'selectors' => [
	909	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab .faq-tab-icon svg' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};',
	910	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab img' => 'width:{{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}};'
	911	+ ]
	912	+ ]
	913	+ );
	914	+
	915	+ $this->add_control(
	916	+ 'faq_box_content_icon_color_layout_4',
	917	+ [
	918	+ 'label' => esc_html__( 'Icon Color', 'betterdocs' ),
	919	+ 'type' => Controls_Manager::COLOR,
	920	+ 'selectors' => [
	921	+ '{{WRAPPER}} .betterdocs-faq-wrapper.betterdocs-faq-layout-4 .betterdocs-faq-inner-wrapper .betterdocs-faq-tab-wrapper .betterdocs-faq-tab .faq-tab-icon svg g path' => 'fill:{{VALUE}} ! important;'
	922	+ ]
	923	+ ]
	924	+ );
	925	+
	926	+ $this->end_controls_section();
	927	+ }
	928	+
	929	+ protected function render_callback() {
	930	+ $control_values = $this->get_settings_for_display();
	931	+
	932	+ $taxonomy = sanitize_key( $control_values['faq_taxonomy'] ?? 'betterdocs_faq_category' );
	933	+
	934	+ if ( $taxonomy === 'product_assignments' ) {
	935	+ if ( ElementorPlugin::instance()->editor->is_edit_mode() ) {
	936	+ // Editor preview: show all product FAQ terms so the layout can be styled.
	937	+ betterdocs()->views->get(
	938	+ 'layouts/faq',
	939	+ [
	940	+ 'enable' => true,
	941	+ 'have_posts' => true,
	942	+ 'layout' => $control_values['faq_layout_selection'],
	943	+ 'shortcode_attr' => [
	944	+ 'group_exclude' => '',
	945	+ 'groups' => '',
	946	+ 'class' => 'betterdocs-faq-' . $control_values['faq_layout_selection'],
	947	+ 'faq_heading' => $control_values['faq_layout_section'],
	948	+ 'faq_section_title_tag' => $control_values['faq_section_title_tag'],
	949	+ 'faq_group_title_tag' => $control_values['faq_group_title_tag'],
	950	+ 'faq_taxonomy' => 'betterdocs_product_faq_category',
	951	+ ]
	952	+ ]
	953	+ );
	954	+ $this->render_editor_script();
	955	+ } else {
	956	+ $this->render_product_assignments( $control_values['faq_layout_selection'] );
	957	+ }
	958	+
	959	+ return;
	960	+ }
	961	+
	962	+ if ( $taxonomy === 'betterdocs_product_faq_category' ) {
	963	+ $specific_faqs = ! empty( $control_values['select_specific_product_faq'] ) ? implode( ',', $control_values['select_specific_product_faq'] ) : '';
	964	+ $faqs_exclude = ! empty( $control_values['exclude_specific_product_faq'] ) ? implode( ',', $control_values['exclude_specific_product_faq'] ) : '';
	965	+ } else {
	966	+ $specific_faqs = ! empty( $control_values['select_specific_faq'] ) ? implode( ',', $control_values['select_specific_faq'] ) : '';
	967	+ $faqs_exclude = ! empty( $control_values['exclude_specific_faq'] ) ? implode( ',', $control_values['exclude_specific_faq'] ) : '';
	968	+ }
	969	+
	970	+ betterdocs()->views->get(
	971	+ 'layouts/faq',
	972	+ [
	973	+ 'enable' => true,
	974	+ 'have_posts' => true,
	975	+ 'layout' => $control_values['faq_layout_selection'],
	976	+ 'shortcode_attr' => [
	977	+ 'group_exclude' => $faqs_exclude,
	978	+ 'class' => 'betterdocs-faq-' . $control_values['faq_layout_selection'],
	979	+ 'groups' => $specific_faqs,
	980	+ 'faq_heading' => $control_values['faq_layout_section'],
	981	+ 'faq_section_title_tag' => $control_values['faq_section_title_tag'],
	982	+ 'faq_group_title_tag' => $control_values['faq_group_title_tag'],
	983	+ 'faq_taxonomy' => $taxonomy
	984	+ ]
	985	+ ]
	986	+ );
	987	+
	988	+ if ( ElementorPlugin::instance()->editor->is_edit_mode() ) {
	989	+ $this->render_editor_script();
	990	+ }
	991	+ }
	992	+
	993	+ private function render_product_assignments( $layout ) {
	994	+ if ( ! class_exists( 'WooCommerce' ) || ! is_product() ) {
	995	+ return;
	996	+ }
	997	+
	998	+ // In theme-builder templates, the widget can render outside the loop,
	999	+ // so get_the_ID() can be 0 — fall back to the queried product.
	1000	+ $product_id = get_the_ID();
	1001	+ if ( ! $product_id ) {
	1002	+ $product_id = get_queried_object_id();
	1003	+ }
	1004	+ if ( ! $product_id ) {
	1005	+ return;
	1006	+ }
	1007	+
	1008	+ /** @var WooFAQRenderer $renderer */
	1009	+ $renderer = betterdocs()->container->get( WooFAQRenderer::class );
	1010	+
	1011	+ // This widget is the explicit placement; don't also inject into the tab/summary.
	1012	+ $renderer->suppress_auto_placement();
	1013	+ $renderer->render_for_product( $product_id, $layout );
	1014	+ }
	1015	+
	1016	+ protected function render_editor_script() {
	1017	+ ?>
	1018	+ <script>
	1019	+ jQuery(document).ready(function($) {
	1020	+ const $tabs = $(".betterdocs-faq-tab");
	1021	+ const $mobileTabs = $(".betterdocs-faq-list-wrapper .betterdocs-faq-tab");
	1022	+ const $contents = $(".betterdocs-faq-list-content");
	1023	+
	1024	+ $tabs.on("click", function () {
	1025	+ const termId = $(this).data("term-id");
	1026	+
	1027	+ // Remove active class from all tabs and hide all contents
	1028	+ $tabs.removeClass("active");
	1029	+ $contents.hide().removeClass("active");
	1030	+
	1031	+ // Reset all icons to default state
	1032	+ $(".betterdocs-faq-iconplus").show();
	1033	+ $(".betterdocs-faq-iconminus").hide();
	1034	+
	1035	+ // Add active class to the clicked tab and show the corresponding content
	1036	+ $(this).addClass("active");
	1037	+ $contents.filter(`[data-term-id="${termId}"]`).show().addClass("active");
	1038	+
	1039	+ // Toggle icons for the active tab
	1040	+ $(this).find(".betterdocs-faq-iconplus").hide();
	1041	+ $(this).find(".betterdocs-faq-iconminus").show();
	1042	+ });
	1043	+
	1044	+ // Trigger click on the first tab to show the first content by default
	1045	+ if ($tabs.length > 0) {
	1046	+ $tabs.first().trigger("click").addClass("active");
	1047	+
	1048	+ const $mobileFirstTab = $mobileTabs.first();
	1049	+ $mobileFirstTab.addClass("active");
	1050	+ $mobileFirstTab.find(".betterdocs-faq-iconplus").hide();
	1051	+ $mobileFirstTab.find(".betterdocs-faq-iconminus").show();
	1052	+ }
	1053	+
	1054	+ $('.betterdocs-faq-post').on('click', function(e) {
	1055	+ var current_node = $(this);
	1056	+ var active_list = $('.betterdocs-faq-group.active');
	1057	+
	1058	+ if( ! current_node.parent().hasClass('active') ) {
	1059	+ current_node.parent().addClass('active');
	1060	+ current_node.children('svg').toggle();
	1061	+ current_node.next().slideDown();
	1062	+ }
	1063	+
	1064	+ for( let node of active_list ) {
	1065	+ if( $(node).hasClass('active') ) {
	1066	+ $(node).removeClass('active');
	1067	+ $(node).children('.betterdocs-faq-post').children('svg').toggle();
	1068	+ $(node).children('.betterdocs-faq-main-content').slideUp();
	1069	+ }
	1070	+ }
	1071	+ });
	1072	+
	1073	+ $('.betterdocs-faq-post-layout-2').on('click', function(e) {
	1074	+ var current_node = $(this);
	1075	+
	1076	+ if( ! current_node.parent().hasClass('active') ) {
	1077	+ current_node.parent().addClass('active');
	1078	+ current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
	1079	+ current_node.next().slideDown();
	1080	+ } else {
	1081	+ current_node.parent().removeClass('active');
	1082	+ current_node.children('.betterdocs-faq-post-layout-2-icon-group').children('svg').toggle();
	1083	+ current_node.next().slideUp();
	1084	+ }
	1085	+
	1086	+ });
	1087	+ });
	1088	+ </script>
	1089	+ <?php
	1090	+ }
487	1091	}