<?php
    /**
     * Customizer Header builder section
     * 
     * @package Blog Bee
     * @since 1.0.0
     */
    namespace BBE\Customizer\Section;

    use BBE\Helpers as Helpers;
    use BBE\Customizer\Section\Section as Section;
    use BBE\Customizer\Section\Search_Icon as Search_Icon;
    use BBE\Customizer\Theme_Defaults as Theme_Defaults;
    use BBE\Customizer\Section\Sticky_Header_Builder as Sticky_Header_Builder;

    use function esc_html__;
    use function esc_attr;
    use function get_template_directory_uri;

    if( ! class_exists( __NAMESPACE__ . '\\Header_Builder' ) ) {
        /**
         * Header builder
         */
        class Header_Builder extends Section {
            /**
             * Id of section
             * 
             * @since 1.0.0
             * @var string
             */
            public static $id = 'bbe-header';

            /**
             * Widgets to hide in tablet
             * 
             * @since 1.0.0
             */
            private static $responsive_hide = null;

            /**
             * Widgets to hide in tablet
             * 
             * @since 1.0.0
             */
            private static function get_responsive_hidden_widgets() {
                if( self::$responsive_hide === null ) {
                    $hidden = Theme_Defaults::get_theme_option( 'responsive_header_mobile_widgets_hide' );
                    if( $hidden ) {
                        self::$responsive_hide = explode( ' ', $hidden );
                    }
                }
                return is_null( self::$responsive_hide ) ? [] : self::$responsive_hide;
            }

            /**
             * Register controls
             * Render
             * 
             * @since 1.0.0
             * @override
             */
            protected function register_controls() {
                $this->tab = 'general';
                $this->add_section( 'header_builder_section' );
                $this->add_control( 'header_builder_section_tab' );
                $this->add_control( 'header_builder' );
                $this->add_control( 'header_responsive_builder' );
                $this->add_control( 'header_builder_layouts' );
                $this->add_control( 'responsive_header_builder_layouts' );
                $this->add_control( 'responsive_header_mobile_widgets_hide' );
                $this->add_control( 'header_builder_enable_sticky' );
                $this->add_control( 'header_builder_sticky_redirect' );
                $this->tab = 'design';
                $this->add_control( 'header_builder_box_shadow' );
                $this->add_control( 'header_builder_margin' );
            }

            /**
             * Get settings
             * 
             * @since 1.0.0
             * @override
             */
            protected function get_settings( $id = '' ) {
                $settings = [
                    'header_builder_section_tab' =>  [
                        'transport'   =>  'postMessage',
                        'default'   =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'header_builder' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_builder' ],
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'header_responsive_builder' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_builder' ],
                        'default' =>  Theme_Defaults::get_defaults( $id )     
                    ],
                    'header_builder_layouts' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_radio_image' ],
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'responsive_header_builder_layouts' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_radio_image' ],
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'responsive_header_mobile_widgets_hide' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_multiselect' ],
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'header_builder_box_shadow' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_box_shadow' ],
                        'transport' =>  'postMessage',
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'header_builder_margin' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_dimension' ],
                        'transport' =>  'postMessage',
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'header_builder_enable_sticky' =>  [
                        'sanitize_callback' =>  [ $this, 'sanitize_toggle' ],
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                    'header_builder_sticky_redirect' =>  [
                        'transport' =>  'postMessage',
                        'default' =>  Theme_Defaults::get_defaults( $id )
                    ],
                ];
                return ( $id ) ? $settings[ $id ] : $settings;
            }

            /**
             * Get controls
             * Helpers
             * 
             * @since 1.0.0
             * @override
             */
            public function get_controls( $id = '' ) {
                $controls = [
                    'header_builder_section' =>  [
                        'title' =>  esc_html__( 'Header', 'blog-bee' ),
                        'priority' =>  40,
                    ],
                    'header_builder_section_tab' =>  [
                        'type'  =>  'section-tab',
                        'fields'    =>  Helpers::get_customizer_section_tabs()
                    ],
                    'header_builder_layouts' =>  [
                        'label' =>  esc_html__( 'Layouts', 'blog-bee' ),
                        'type'  =>  'builder-layout',
                        'builder_id'    =>  'header_builder',
                        'fields'    =>  [
                            [
                                'label' =>  esc_html__( 'Custom', 'blog-bee' ),
                                'url' =>  get_template_directory_uri() . '/inc/customizer/assets/images/header-builder-custom.webp',
                                'value' =>  'custom'
                            ],
                            [
                                'label' =>  esc_html__( 'Layout 1', 'blog-bee' ),
                                'url' =>  get_template_directory_uri() . '/inc/customizer/assets/images/header-builder-one.webp',
                                'value' =>  'one'
                            ],
                            [
                                'label' =>  esc_html__( 'Layout 2', 'blog-bee' ),
                                'url' =>  get_template_directory_uri() . '/inc/customizer/assets/images/header-builder-two.webp',
                                'value' =>  'two'
                            ]
                        ],
                        'field_values'  =>  [
                            'one'   =>  [
                                'top'   =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                                'middle'    =>  [
                                    'first' =>  [ 'site-logo' ],
                                    'second' =>  [],
                                    'third' =>  [ 'primary-menu', 'custom-button' ]
                                ],
                                'bottom'    =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                            ],
                            'two'   =>  [
                                'top'   =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                                'middle'    =>  [
                                    'first' =>  [],
                                    'second' =>  [ 'site-logo' ],
                                    'third' =>  []
                                ],
                                'bottom'    =>  [
                                    'first' =>  [ 'off-canvas' ],
                                    'second' =>  [ 'primary-menu' ],
                                    'third' =>  [ 'search-icon' ]
                                ],
                            ],
                        ]
                    ],
                    'responsive_header_builder_layouts' =>  [
                        'label' =>  esc_html__( 'Responsive Header Layouts', 'blog-bee' ),
                        'type'  =>  'builder-layout',
                        'builder_id'    =>  'header_responsive_builder',
                        'fields'    =>  [
                            [
                                'label' =>  esc_html__( 'Custom', 'blog-bee' ),
                                'url' =>  get_template_directory_uri() . '/inc/customizer/assets/images/header-builder-custom.webp',
                                'value' =>  'custom'
                            ],
                            [
                                'label' =>  esc_html__( 'Layout 1', 'blog-bee' ),
                                'url' =>  get_template_directory_uri() . '/inc/customizer/assets/images/header-builder-one.webp',
                                'value' =>  'one'
                            ],
                            [
                                'label' =>  esc_html__( 'Layout 2', 'blog-bee' ),
                                'url' =>  get_template_directory_uri() . '/inc/customizer/assets/images/header-builder-two.webp',
                                'value' =>  'two'
                            ]
                        ],
                        'field_values'  =>  [
                            'one'   =>  [
                                'top'   =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                                'middle'    =>  [
                                    'first' =>  [ 'site-logo' ],
                                    'second' =>  [],
                                    'third' =>  [ 'mobile-canvas', 'custom-button' ]
                                ],
                                'bottom'    =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                                'responsive'    =>  [
                                    'first' =>  [ 'primary-menu' ]
                                ]
                            ],
                            'two'   =>  [
                                'top'   =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                                'middle'    =>  [
                                    'first' =>  [ 'site-logo' ],
                                    'second' =>  [],
                                    'third' =>  [ 'mobile-canvas', 'search-icon' ]
                                ],
                                'bottom'    =>  [
                                    'first' =>  [],
                                    'second' =>  [],
                                    'third' =>  []
                                ],
                                'responsive'    =>  [
                                    'first' =>  [ 'primary-menu' ]
                                ]
                            ]
                        ]
                    ],
                    'responsive_header_mobile_widgets_hide' =>  [
                        'label' =>  esc_html__( 'Widgets to Hide in Mobile', 'blog-bee' ),
                        'type'  =>  'multiselect',
                        'fields'    =>  $this->get_visibility_widgets()
                    ],
                    'header_builder' =>  [
                        'type'  =>  'bbe-builder',
                        'responsive_control_id' =>  'header_responsive_builder',
                        'layout' =>  'header_builder_layouts',
                        'row_section_ids'   =>  [
                            'top' =>  'header_top_row_section',
                            'middle' =>  'header_middle_row_section',
                            'bottom' =>  'header_bottom_row_section',
                        ],
                        'widgets'   =>  [
                            'custom-button'  =>  [
                                'label' =>  esc_html__( 'Button', 'blog-bee' ),
                                'section_id' =>  'custom_button_section',
                                'icon'  =>  'button'
                            ],
                            'dark-mode'  =>  [
                                'label' =>  esc_html__( 'Dark Mode', 'blog-bee' ),
                                'section_id' =>  'dark_mode_section',
                                'icon'  =>  'lightbulb'
                            ],
                            'date-time'  =>  [
                                'label' =>  esc_html__( 'Date Time', 'blog-bee' ),
                                'section_id' =>  'date_time_section',
                                'icon'  =>  'calendar'
                            ],
                            'header-divider-1'  =>  [
                                'label' =>  esc_html__( 'Divider 1', 'blog-bee' ),
                                'section_id' =>  'header_divider_one_section',
                                'icon'  =>  'minus'
                            ],
                            'header-divider-2'  =>  [
                                'label' =>  esc_html__( 'Divider 2', 'blog-bee' ),
                                'section_id' =>  'header_divider_two_section',
                                'icon'  =>  'minus',
                                'disable'   =>  true
                            ],
                            'header-divider-3'  =>  [
                                'label' =>  esc_html__( 'Divider 3', 'blog-bee' ),
                                'section_id' =>  'header_divider_three_section',
                                'icon'  =>  'minus',
                                'disable'   =>  true
                            ],
                            'header-html-1'  =>  [
                                'label' =>  esc_html__( 'HTML 1', 'blog-bee' ),
                                'section_id' =>  'header_html_one_section',
                                'icon'  =>  'editor-code'
                            ],
                            'header-html-2'  =>  [
                                'label' =>  esc_html__( 'HTML 2', 'blog-bee' ),
                                'section_id' =>  'header_html_two_section',
                                'icon'  =>  'editor-code',
                                'disable'   =>  true
                            ],
                            'header-image'  =>  [
                                'label' =>  esc_html__( 'Image', 'blog-bee' ),
                                'section_id' =>  'header_image_section',
                                'icon'  =>  'format-image',
                                'disable'   =>  true
                            ],
                            'off-canvas'  =>  [
                                'label' =>  esc_html__( 'Off Canvas', 'blog-bee' ),
                                'section_id' =>  'off_canvas_section',
                                'icon'  =>  'text-page'
                            ],
                            'primary-menu'  =>  [
                                'label' =>  esc_html__( 'Menu 1', 'blog-bee' ),
                                'section_id' =>  'primary_menu_section',
                                'icon'  =>  'menu'
                            ],
                            'secondary-menu'  =>  [
                                'label' =>  esc_html__( 'Menu 2', 'blog-bee' ),
                                'section_id' =>  'secondary_menu_section',
                                'icon'  =>  'menu'
                            ],
                            'random-blog'  =>  [
                                'label' =>  esc_html__( 'Random Blog', 'blog-bee' ),
                                'section_id' =>  'random_blog_section',
                                'icon'  =>  'randomize',
                                'disable'   =>  true
                            ],
                            'search-field'  =>  [
                                'label' =>  esc_html__( 'Search Field', 'blog-bee' ),
                                'section_id' =>  'search_field_section',
                                'icon'  =>  'search',
                                'disable'   =>  true
                            ],
                            'search-icon'  =>  [
                                'label' =>  esc_html__( 'Search Icon', 'blog-bee' ),
                                'section_id' =>  'search_icon_section',
                                'icon'  =>  'search'
                            ],
                            'site-logo'  =>  [
                                'label' =>  esc_html__( 'Site Identity', 'blog-bee' ),
                                'section_id' =>  'title_tagline',
                                'icon'  =>  'admin-site'
                            ],
                            'social-icons'  =>  [
                                'label' =>  esc_html__( 'Social Icons', 'blog-bee' ),
                                'section_id' =>  'social_icons_section',
                                'icon'  =>  'share'
                            ],
                            'header-shortcode-1'  =>  [
                                'label' =>  esc_html__( 'Shortcode 1', 'blog-bee' ),
                                'section_id' =>  'header_shortcode_one_section',
                                'icon'  =>  'shortcode'
                            ],
                            'header-shortcode-2'  =>  [
                                'label' =>  esc_html__( 'Shortcode 2', 'blog-bee' ),
                                'section_id' =>  'header_shortcode_two_section',
                                'icon'  =>  'shortcode',
                                'disable'   =>  true
                            ],
                            'ticker-news'  =>  [
                                'label' =>  esc_html__( 'Ticker News', 'blog-bee' ),
                                'section_id' =>  'ticker_news_section',
                                'icon'  =>  'slides'
                            ],
                            'time'  =>  [
                                'label' =>  esc_html__( 'Time', 'blog-bee' ),
                                'section_id' =>  'time_section',
                                'icon'  =>  'clock'
                            ],
                            'header-widget-area-one'  =>  [
                                'label' =>  esc_html__( 'Widget 1', 'blog-bee' ),
                                'section_id' =>  'header_widget_area_one_section',
                                'icon'  =>  'screenoptions'
                            ],
                            'header-widget-area-two'  =>  [
                                'label' =>  esc_html__( 'Widget 2', 'blog-bee' ),
                                'section_id' =>  'header_widget_area_two_section',
                                'icon'  =>  'screenoptions',
                                'disable'   =>  true
                            ],
                        ]
                    ],
                    'header_responsive_builder' =>  [
                        'type'  =>  'bbe-responsive-builder',
                        'layout' =>  'responsive_header_builder_layouts',
                        'row_section_ids'   =>  [
                            'top' =>  'header_top_row_section',
                            'middle' =>  'header_middle_row_section',
                            'bottom' =>  'header_bottom_row_section',
                            'responsive'    =>  'mobile_canvas_section'
                        ],
                        'widgets'   =>  [
                            'custom-button'  =>  [
                                'label' =>  esc_html__( 'Button', 'blog-bee' ),
                                'section_id' =>  'custom_button_section',
                                'icon'  =>  'button'
                            ],
                            'dark-mode'  =>  [
                                'label' =>  esc_html__( 'Dark Mode', 'blog-bee' ),
                                'section_id' =>  'dark_mode_section',
                                'icon'  =>  'lightbulb'
                            ],
                            'date-time'  =>  [
                                'label' =>  esc_html__( 'Date Time', 'blog-bee' ),
                                'section_id' =>  'date_time_section',
                                'icon'  =>  'calendar'
                            ],
                            'header-divider-1'  =>  [
                                'label' =>  esc_html__( 'Divider 1', 'blog-bee' ),
                                'section_id' =>  'header_divider_one_section',
                                'icon'  =>  'minus'
                            ],
                            'header-divider-2'  =>  [
                                'label' =>  esc_html__( 'Divider 2', 'blog-bee' ),
                                'section_id' =>  'header_divider_two_section',
                                'icon'  =>  'minus',
                                'disable'  =>  true
                            ],
                            'header-divider-3'  =>  [
                                'label' =>  esc_html__( 'Divider 3', 'blog-bee' ),
                                'section_id' =>  'header_divider_three_section',
                                'icon'  =>  'minus',
                                'disable'  =>  true
                            ],
                            'header-html-1'  =>  [
                                'label' =>  esc_html__( 'HTML 1', 'blog-bee' ),
                                'section_id' =>  'header_html_one_section',
                                'icon'  =>  'editor-code'
                            ],
                            'header-html-2'  =>  [
                                'label' =>  esc_html__( 'HTML 2', 'blog-bee' ),
                                'section_id' =>  'header_html_two_section',
                                'icon'  =>  'editor-code',
                                'disable'   =>  true
                            ],
                            'header-image'  =>  [
                                'label' =>  esc_html__( 'Image', 'blog-bee' ),
                                'section_id' =>  'header_image_section',
                                'icon'  =>  'format-image',
                                'disable'   =>  true
                            ],
                            'off-canvas'  =>  [
                                'label' =>  esc_html__( 'Off Canvas', 'blog-bee' ),
                                'section_id' =>  'off_canvas_section',
                                'icon'  =>  'text-page'
                            ],
                            'primary-menu'  =>  [
                                'label' =>  esc_html__( 'Menu 1', 'blog-bee' ),
                                'section_id' =>  'primary_menu_section',
                                'icon'  =>  'menu'
                            ],
                            'secondary-menu'  =>  [
                                'label' =>  esc_html__( 'Menu 2', 'blog-bee' ),
                                'section_id' =>  'secondary_menu_section',
                                'icon'  =>  'menu'
                            ],
                            'random-blog'  =>  [
                                'label' =>  esc_html__( 'Random Blog', 'blog-bee' ),
                                'section_id' =>  'random_blog_section',
                                'icon'  =>  'randomize',
                                'disable'   =>  true
                            ],
                            'search-field'  =>  [
                                'label' =>  esc_html__( 'Search Field', 'blog-bee' ),
                                'section_id' =>  'search_field_section',
                                'icon'  =>  'search',
                                'disable'   =>  true
                            ],
                            'search-icon'  =>  [
                                'label' =>  esc_html__( 'Search Icon', 'blog-bee' ),
                                'section_id' =>  'search_icon_section',
                                'icon'  =>  'search'
                            ],
                            'site-logo'  =>  [
                                'label' =>  esc_html__( 'Site Identity', 'blog-bee' ),
                                'section_id' =>  'title_tagline',
                                'icon'  =>  'admin-site'
                            ],
                            'social-icons'  =>  [
                                'label' =>  esc_html__( 'Social Icons', 'blog-bee' ),
                                'section_id' =>  'social_icons_section',
                                'icon'  =>  'share'
                            ],
                            'header-shortcode-1'  =>  [
                                'label' =>  esc_html__( 'Shortcode 1', 'blog-bee' ),
                                'section_id' =>  'header_shortcode_one_section',
                                'icon'  =>  'shortcode'
                            ],
                            'header-shortcode-2'  =>  [
                                'label' =>  esc_html__( 'Shortcode 2', 'blog-bee' ),
                                'section_id' =>  'header_shortcode_two_section',
                                'icon'  =>  'shortcode',
                                'disable'   =>  true
                            ],
                            'mobile-canvas'  =>  [
                                'label' =>  esc_html__( 'Toggle Button', 'blog-bee' ),
                                'section_id' =>  'mobile_canvas_section',
                                'icon'  =>  'button'
                            ],
                            'ticker-news'  =>  [
                                'label' =>  esc_html__( 'Ticker News', 'blog-bee' ),
                                'section_id' =>  'ticker_news_section',
                                'icon'  =>  'slides'
                            ],
                            'time'  =>  [
                                'label' =>  esc_html__( 'Time', 'blog-bee' ),
                                'section_id' =>  'time_section',
                                'icon'  =>  'clock'
                            ],
                            'header-widget-area-one'  =>  [
                                'label' =>  esc_html__( 'Widget 1', 'blog-bee' ),
                                'section_id' =>  'header_widget_area_one_section',
                                'icon'  =>  'screenoptions'
                            ],
                            'header-widget-area-two'  =>  [
                                'label' =>  esc_html__( 'Widget 2', 'blog-bee' ),
                                'section_id' =>  'header_widget_area_two_section',
                                'icon'  =>  'screenoptions',
                                'disable'   =>  true
                            ],
                        ]
                    ],
                    'header_builder_enable_sticky' =>  [
                        'label' =>  esc_html__( 'Enable Sticky', 'blog-bee' ),
                        'type'  =>  'toggle-button',
                    ],
                    'header_builder_sticky_redirect' =>  [
                        'label' =>  esc_html__( 'Edit Sticky Header', 'blog-bee' ),
                        'type'  =>  'redirect',
                        'section_to_expand' =>  'sticky_header_section',
                        'conditions'    =>  [
                            'relation'  =>  'AND',
                            'rules' =>  [
                                [
                                    'setting'   =>  'header_builder_enable_sticky',
                                    'operator'  =>  '==',
                                    'value' =>  true
                                ]
                            ]
                        ]
                    ],
                    'header_builder_box_shadow' =>  [
                        'label' =>  esc_html__( 'Box Shadow', 'blog-bee' ),
                        'type'  =>  'box-shadow'
                    ],
                    'header_builder_margin' =>  [
                        'label' =>  esc_html__( 'Margin', 'blog-bee' ),
                        'type'  =>  'dimension'
                    ],
                ];
                return ( $id ) ? $controls[ $id ] : $controls;
            }

            /**
             * Set defaults
             * Theme Starter
             * 
             * @since 1.0.0
             * @var array
             */
            public function set_defaults() {
                Theme_Defaults::update_theme_defaults( [
                    'header_builder_section_tab' =>  'general',
                    'header_builder_layouts' =>  'one',
                    'responsive_header_builder_layouts' =>  'one',
                    'header_builder' =>  [
                        'top'   =>  [
                            'first' =>  [],
                            'second' =>  [],
                            'third' =>  []
                        ],
                        'middle'    =>  [
                            'first' =>  [ 'site-logo' ],
                            'second' =>  [],
                            'third' =>  [ 'primary-menu' ]
                        ],
                        'bottom'    =>  [
                            'first' =>  [],
                            'second' =>  [],
                            'third' =>  []
                        ],
                    ],
                    'header_responsive_builder' =>  [
                        'top'   =>  [
                            'first' =>  [],
                            'second' =>  [],
                            'third' =>  []
                        ],
                        'middle'    =>  [
                            'first' =>  [ 'site-logo' ],
                            'second' =>  [],
                            'third' =>  [ 'mobile-canvas' ]
                        ],
                        'bottom'    =>  [
                            'first' =>  [],
                            'second' =>  [],
                            'third' =>  []
                        ],
                        'responsive'    =>  [
                            'first' =>  [ 'primary-menu' ]
                        ]
                    ],
                    'responsive_header_mobile_widgets_hide'  =>  '',
                    'header_builder_enable_sticky' =>  false,
                    'header_builder_sticky_redirect' =>  '',
                    'header_builder_background' =>  $this->get_color( [ 'value' => '' ] ),
                    'header_builder_border' =>  $this->get_border(),
                    'header_builder_box_shadow' =>  $this->get_box_shadow(),
                    'header_builder_margin' =>  $this->get_dimension(),
                ] );
            }

            /**
             * Add partials
             * 
             * @override
             * @since 1.0.0
             */
            protected function register_partials() {
                $this->manager->selective_refresh->add_partial( 'header_builder_partials', [
                    'selector'        => 'header.site-header',
                    'settings'  =>  [ 'header_builder_section_tab' ]
                ]);
            }

            /**
             * Dynamic css args
             * 
             * @since 1.0.0
             */
            public function get_dynamic_css_args(): array {
                $dynamic_css_args = [
                    'header_builder_box_shadow' =>  [
                        'value' =>  Theme_Defaults::get_theme_option( 'header_builder_box_shadow' ),
                        'default'   =>  Theme_Defaults::get_defaults( 'header_builder_box_shadow' ),
                        'selector'  =>  'body.bbe-light .bbe-header'
                    ],
                    'header_builder_margin' =>  [
                        'value' =>  Theme_Defaults::get_theme_option( 'header_builder_margin' ),
                        'default'   =>  Theme_Defaults::get_defaults( 'header_builder_margin' ),
                        'selector'  =>  'body .site-header.bbe-header',
                        'property'  =>  'margin'
                    ],
                ];
                return $dynamic_css_args;
            }

            /**
             * Render html
             * 
             * @return html
             * @since 1.0.0
             */
            public function render_html() {
                $block_class[] = self::$id;
                $block_class[] = 'site-header';
                $block_class[] = 'layout--' . Theme_Defaults::get_theme_option( 'header_builder_layouts' );
                $block_class[] = 'bbe-builder';
                $search_icon_instance = Search_Icon::get_instance();
                ?>
                    <header id="masthead" class="<?php echo esc_attr( implode( ' ', $block_class ) ); ?>">

                        <div class="bbe--normal">
                            <?php
                                self::get_instance()->render_row_html( 'bbe-header-top-row', 'top', 'header_builder' );

                                self::get_instance()->render_row_html( 'bbe-header-middle-row', 'middle', 'header_builder' );

                                self::get_instance()->render_row_html( 'bbe-header-bottom-row', 'bottom', 'header_builder' );

                                if( Helpers::is_widget_in_builder( 'header_builder', 'search-icon' ) && $search_icon_instance->get_layout() !== 'one' ) $search_icon_instance->get_form_wrapper( [ 'class' => 'normal' ] );
                            ?>    
                        </div>
                        <div class="bbe--responsive">
                            <?php
                                self::get_instance()->render_row_html( 'bbe-header-top-row', 'top', 'header_responsive_builder' );

                                self::get_instance()->render_row_html( 'bbe-header-middle-row', 'middle', 'header_responsive_builder' );

                                self::get_instance()->render_row_html( 'bbe-header-bottom-row', 'bottom', 'header_responsive_builder' );

                                self::get_instance()->render_row_html( 'bbe-mobile-canvas', 'responsive', 'header_responsive_builder' );

                                if( Helpers::is_widget_in_builder( 'header_responsive_builder', 'search-icon' ) && $search_icon_instance->get_layout() !== 'one' ) $search_icon_instance->get_form_wrapper( [ 'class' => 'responsive' ] );
                            ?>    
                        </div>
                        
                        <?php 
                            if( Theme_Defaults::get_theme_option( 'header_builder_enable_sticky' ) ) Sticky_Header_Builder::get_instance()->render_html();
                        ?>

                    </header><!-- #masthead -->
                <?php
            }

            /**
             * Render row html
             * 
             * @return html
             * @since 1.0.0
             * @param   string  $row_id The row id
             * @param   string  $row    The row
             */
            public static function render_row_html( $row_id, $row, $builder_id ) {
                $block_class[] = $row_id;
                $popup = '';
                $is_responsive = ( $row === 'responsive' );
                if( ! $is_responsive ) {
                    $block_class[] = 'bbe-header-row';
                    $block_class[] = 'bbe-row';
                } else {
                    $popup = Theme_Defaults::get_theme_option( 'mobile_canvas_popup' );
                    $block_class[] = 'align--' . Theme_Defaults::get_theme_option( 'mobile_canvas_horizontal_alignment' );
                    $block_class[] = 'valign--' . Theme_Defaults::get_theme_option( 'mobile_canvas_vertical_alignment' );
                    $block_class[] = 'popup--' . Theme_Defaults::get_theme_option( 'mobile_canvas_popup' );
                    $block_class[] = 'dropdown';
                }
                $full_width = Theme_Defaults::get_theme_option( 'header_'. $row .'_row_full_width' );
                $block_class[] = 'full-width--' . $full_width;
                
                $header_builder = Theme_Defaults::get_theme_option( $builder_id );
                $row = $header_builder[ $row ];
                if( ! array_filter( $row ) ) return;

                if( empty( $row ) || ! is_array( $row ) ) {
                    // return $row is empty or not an array, no need to render row
                    return;
                } else {
                    // add class if row has widgets
                    $widgets = $row && isset( $row[ 'second' ] ) ? $row[ 'second' ] : [];
                    if( count( $widgets ) > 0 ) {
                        $block_class[] = 'has-middle-column';
                    }
                }

                $is_responsive_builder = ( $builder_id === 'header_responsive_builder' );

                $all_registered_sections = self::get_all_registered_sections();
                ?>  
                    <div class="<?php echo esc_attr( implode( ' ', $block_class ) ); ?>">
                        <div class="bbe-container">
                            <div class="row">
                                <?php
                                    foreach( $row as $column => $widgets ) :

                                        $column_class = 'column ' . $column;
                                        if( in_array( 'primary-menu', $widgets ) ) $column_class .= ' has-primary-menu';
                                        if( in_array( 'secondary-menu', $widgets ) ) $column_class .= ' has-secondary-menu';
                                        if( ( $column === 'second' ) && empty( $widgets ) ) continue;  // skip if no widgets in column, apply this logic for second columns only
                                        echo '<div class="'. esc_attr( $column_class ) .'">';

                                            foreach( $widgets as $widget ) :

                                                if( $is_responsive || $is_responsive_builder ) :

                                                    $data_attrs = [
                                                        'data-mobile=' . esc_attr( ( in_array( $widget, self::get_responsive_hidden_widgets() ) ? 'hide' : 'show' ) ) . '',
                                                    ];
                                                    echo '<div class="' . esc_attr( $widget ) . '" ' . esc_attr( implode( ' ', $data_attrs ) ) . '>';

                                                endif;

                                                    $all_registered_sections[ 'bbe-' . $widget ]::get_instance()->render_html();

                                                if( $is_responsive || $is_responsive_builder ) echo '</div>';

                                            endforeach;

                                        echo '</div>';

                                    endforeach;

                                ?>
                            </div>
                        </div>
                        <?php
                            if( $is_responsive ) {
                                $close_icon = [
                                    'type'  =>  'icon',
                                    'value'  =>  'fa-solid fa-xmark',
                                    'class'  =>  'canvas-close-icon',
                                    'aria_label'    =>  esc_html__( 'Close Popup', 'blog-bee' )
                                ];
                                echo Helpers::get_icon_html( $close_icon );
                            }
                        ?>
                    </div>
                <?php
            }
             /**
             * Get widgets
             * 
             * @since 1.0.0
             */
            private function get_visibility_widgets() {
                return [
                    [
                        'label' =>  esc_html__( 'Button', 'blog-bee'),
                        'value' =>  'custom-button'
                    ],
                    [
                        'label' =>  esc_html__( 'Dark Mode', 'blog-bee'),
                        'value' =>  'dark-mode'
                    ],
                    [
                        'label' =>  esc_html__( 'Date Time', 'blog-bee'),
                        'value' =>  'date-time'
                    ],
                    [
                        'label' =>  esc_html__( 'Divider 1', 'blog-bee'),
                        'value' =>  'header-divider-1'
                    ],
                    [
                        'label' =>  esc_html__( 'Divider 2', 'blog-bee'),
                        'value' =>  'header-divider-2'
                    ],
                    [
                        'label' =>  esc_html__( 'Divider 3', 'blog-bee'),
                        'value' =>  'header-divider-3'
                    ],
                    [
                        'label' =>  esc_html__( 'HTML 1', 'blog-bee'),
                        'value' =>  'header-html-1'
                    ],
                    [
                        'label' =>  esc_html__( 'HTML 2', 'blog-bee'),
                        'value' =>  'header-html-2'
                    ],
                    [
                        'label' =>  esc_html__( 'Image', 'blog-bee'),
                        'value' =>  'header-image'
                    ],
                    [
                        'label' =>  esc_html__( 'Off Canvas', 'blog-bee'),
                        'value' =>  'off-canvas'
                    ],
                    [
                        'label' =>  esc_html__( 'Primary Menu', 'blog-bee'),
                        'value' =>  'primary-menu'
                    ],
                    [
                        'label' =>  esc_html__( 'Secondary Menu', 'blog-bee'),
                        'value' =>  'secondary-menu'
                    ],
                    [
                        'label' =>  esc_html__( 'Random Blog', 'blog-bee'),
                        'value' =>  'random-blog'
                    ],
                    [
                        'label' =>  esc_html__( 'Search Field', 'blog-bee'),
                        'value' =>  'search-field'
                    ],
                    [
                        'label' =>  esc_html__( 'Search Icon', 'blog-bee'),
                        'value' =>  'search-icon'
                    ],
                    [
                        'label' =>  esc_html__( 'Site Logo', 'blog-bee'),
                        'value' =>  'site-logo'
                    ],
                    [
                        'label' =>  esc_html__( 'Social Icons', 'blog-bee'),
                        'value' =>  'social-icons'
                    ],
                    [
                        'label' =>  esc_html__( 'Shortcode 1', 'blog-bee'),
                        'value' =>  'header-shortcode-1'
                    ],
                    [
                        'label' =>  esc_html__( 'Shortcode 2', 'blog-bee'),
                        'value' =>  'header-shortcode-2'
                    ],
                    [
                        'label' =>  esc_html__( 'Ticker News', 'blog-bee'),
                        'value' =>  'ticker-news'
                    ],
                    [
                        'label' =>  esc_html__( 'Time', 'blog-bee'),
                        'value' =>  'time'
                    ],
                    [
                        'label' =>  esc_html__( 'Widget 1', 'blog-bee'),
                        'value' =>  'header-widget-area-one'
                    ],
                    [
                        'label' =>  esc_html__( 'Widget 2', 'blog-bee'),
                        'value' =>  'header-widget-area-two'
                    ],
                ];
            }
        }
        Header_Builder::get_instance();
    }