            <!-- Tab links -->
                <?php 
                

                global $ar_plugin_id;
    	        $redirect_url = admin_url('admin.php?page=ar-modelshop');
                $encoded_redirect_url = urlencode($redirect_url);
                $gallery_active = 'display:none;';
                $gallery_tab= '';
                $files_active = 'display:block;';
                $files_tab= 'active';
                if (get_post_meta( $model_array['id'], '_glb_file', true )!=''){
                    $glb_upload_image = esc_url( plugins_url( "assets/images/ar_model_icon_tick.jpg", dirname(__FILE__) ) ); 
                    $path_parts = pathinfo(sanitize_text_field( get_post_meta( $model_array['id'], '_glb_file', true ) ));
                    $glb_filename = $path_parts['basename'];
                }else{
                    $glb_upload_image = esc_url( plugins_url( "assets/images/ar_model_icon.jpg", dirname(__FILE__) ) ); 
                    $glb_filename = '';
                }
                if (get_post_meta( $model_array['id'], '_usdz_file', true )!=''){
                    $usdz_upload_image = esc_url( plugins_url( "assets/images/ar_model_icon_tick.jpg", dirname(__FILE__) ) );
                    $path_parts = pathinfo(sanitize_text_field( get_post_meta( $model_array['id'], '_usdz_file', true ) ));
                    $usdz_filename = $path_parts['basename'];
                }else{
                    $usdz_upload_image = esc_url( plugins_url( "assets/images/ar_model_icon.jpg", dirname(__FILE__) ) ); 
                    $usdz_filename = '';
                }
                
                if (strpos($glb_filename, '&ratio=') !== false && strpos($glb_filename, '&o=') !== false) {
                    $glb_filename = '3D Gallery Build';
                    $gallery_active = 'display:block;';
                    $files_active = 'display:none;';
                    $gallery_tab= 'active';
                    $files_tab= '';
                }
                ?>
                <div class="ar_tab">
                  <button class="ar_tablinks <?php echo esc_html($files_tab); ?>" onclick="ar_open_tab(event, 'model_files_content', 'model_files_tab')" id="model_files_tab" type="button"><?php echo esc_html(__( 'Model Files', 'ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;"> </span></button>
                  <button class="ar_tablinks <?php echo esc_html($gallery_tab); ?>" onclick="ar_open_tab(event, 'asset_builder_content', 'asset_builder_tab')" id="asset_builder_tab" type="button"><?php echo esc_html(__( '3D Gallery Builder', 'ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;"> </span></button>
                  <button class="ar_tablinks" onclick="ar_open_tab(event, 'ai_generator_content', 'ai_generator_tab')" id="ai_generator_tab" type="button"><?php echo esc_html(__( 'AI Model Generator', 'ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;"> </span></button>
                   <button class="ar_tablinks" onclick="ar_open_tab(event, 'user_upload_content', 'user_upload_tab')" id="user_upload_tab" type="button"><?php echo esc_html(__('User Upload', 'ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;"> </span></button>
                   <button class="ar_tablinks" onclick="ar_open_tab(event, 'instructions_content','instructions_tab')" id="instructions_tab" type="button"><?php echo esc_html(__( 'Shortcodes', 'ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;"> </span></button>
                  <a href="https://armodelshop.com?from_plugin=true&redirect_url=<?php echo esc_url($encoded_redirect_url); ?>" target="_blank"><button class="ar_tablinks" id="support_tab_shop_wp" type="button"> <?php echo esc_html(__( 'AR Model Shop', 'ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;">&#8599;</span></button></a>
                <a href="https://augmentedrealityplugins.com/support/" target="_blank"><button class="ar_tablinks" id="support_tab_support_wp" type="button"> <?php echo esc_html(__( 'Support','ar-for-wordpress'));?><span style=" vertical-align: super;font-size: smaller;">&#8599;</span></button></a>
                </div>
                <div id="ai_generator_content" class="ar_tabcontent" style="padding:1px 20px; display:none;">
                    <div id="ardisplay-ai-panel" style="position:relative;" data-rest-root="<?php echo esc_url_raw( rest_url('ar/v1') ); ?>" data-nonce="<?php echo esc_attr( wp_create_nonce( 'wp_rest' ) ); ?>" data-post-id="<?php echo esc_attr($model_array['id']);?>">
                        <h3><?php echo esc_html__('AI Model Generator', 'ar-for-wordpress'); ?></h3>
                        <p><?php echo esc_html__('The AI Model Generator uses a pre-trained AI model to analyze the image and generate a 3D GLB file that can be used in Augmented Reality.', 'ar-for-wordpress'); ?><br>
                        <?php echo esc_html__('Use a clear, well-lit image showing the object from the front with minimal background clutter.', 'ar-for-wordpress'); ?></p>
                        
                        <?php
                        // Display credit information - check both database (proxy sites) and wp_options (client sites)
                        $has_credits_data = false;
                        $available_credits = 0;
                        $total_purchased = 0;
                        $total_spent = 0;
                        $credit_cost = intval(get_option('ardisplay_ai_proxy_credit_cost_per_model', 10));
                        $current_user_id = get_current_user_id();

                        $has_real_proxy = class_exists('ARDisplay_AI_Proxy_Credits') && method_exists('ARDisplay_AI_Proxy_Credits', 'get_user_credits_summary');

                        if ($has_real_proxy) {
                            $credits_manager = new ARDisplay_AI_Proxy_Credits();
                            $user_credits = $credits_manager->get_or_create_user_credits($current_user_id);

                            if ($user_credits) {
                                $available_credits = $user_credits->total_credits_purchased - $user_credits->total_credits_spent;
                                $total_purchased = $user_credits->total_credits_purchased;
                                $total_spent = $user_credits->total_credits_spent;
                                $has_credits_data = true;
                            }
                        } else {
                            $cached_credits = get_option('ardisplay_ai_proxy_cached_credits', null);
                            if ($cached_credits && is_array($cached_credits)) {
                                $available_raw = $cached_credits['available_credits'] ?? ($cached_credits['available'] ?? 0);
                                $spent_raw = $cached_credits['total_credits_spent'] ?? ($cached_credits['spent'] ?? $cached_credits['total_spent'] ?? null);
                                $purchased_raw = $cached_credits['total_credits_purchased'] ?? ($cached_credits['total'] ?? $cached_credits['total_purchased'] ?? null);
                                if ($purchased_raw === null && $spent_raw !== null) {
                                    $purchased_raw = $available_raw + $spent_raw;
                                }
                                if ($spent_raw === null && $purchased_raw !== null) {
                                    $spent_raw = $purchased_raw - $available_raw;
                                }
                                $available_credits = intval($available_raw);
                                $total_purchased = intval($purchased_raw ?? 0);
                                $total_spent = max(0, intval($spent_raw ?? 0));
                                $has_credits_data = true;
                            }
                        }

                        if ($has_credits_data) {
                            ?>
                            <div style="background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 8px; padding: 20px; margin: 20px 0;">
                                <h4 style="margin: 0 0 15px 0; color: #495057;"><?php esc_html_e('AI Credits Status', 'ar-for-wordpress'); ?></h4>
                                <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px;">
                                    <div style="background: #fff; border: 1px solid #dee2e6; border-radius: 4px; padding: 12px; text-align: center;">
                                        <div style="font-size: 13px; color: #6c757d; margin-bottom: 4px;"><?php esc_html_e('Available', 'ar-for-wordpress'); ?></div>
                                        <div style="font-size: 22px; font-weight: 600; color: <?php echo $available_credits >= $credit_cost ? '#28a745' : '#dc3545'; ?>;"><?php echo esc_html($available_credits); ?></div>
                                    </div>
                                    <div style="background: #fff; border: 1px solid #dee2e6; border-radius: 4px; padding: 12px; text-align: center;">
                                        <div style="font-size: 13px; color: #6c757d; margin-bottom: 4px;"><?php esc_html_e('Purchased', 'ar-for-wordpress'); ?></div>
                                        <div style="font-size: 22px; font-weight: 600; color: #0073aa;"><?php echo esc_html($total_purchased); ?></div>
                                    </div>
                                    <div style="background: #fff; border: 1px solid #dee2e6; border-radius: 4px; padding: 12px; text-align: center;">
                                        <div style="font-size: 13px; color: #6c757d; margin-bottom: 4px;"><?php esc_html_e('Spent', 'ar-for-wordpress'); ?></div>
                                        <div style="font-size: 22px; font-weight: 600; color: #6c757d;"><?php echo esc_html($total_spent); ?></div>
                                    </div>
                                    <div style="background: #fff; border: 1px solid #dee2e6; border-radius: 4px; padding: 12px; text-align: center;">
                                        <div style="font-size: 13px; color: #6c757d; margin-bottom: 4px;"><?php esc_html_e('Cost per Model', 'ar-for-wordpress'); ?></div>
                                        <div style="font-size: 22px; font-weight: 600; color: #6c757d;"><?php echo esc_html($credit_cost); ?></div>
                                    </div>
                                </div>
                            </div>
                            <br clear="all">
                            <?php
                        }

                                                ?>
                        <div style="display:flex;align-items:center;gap:16px;">
                            <div id="ardisplay-ai-thumb-wrap" style="max-width:180px;max-height:220px;position:relative;cursor:pointer;" onclick="document.getElementById('ardisplay-ai-select-images').click();">
                                <img src="<?php echo esc_url( plugins_url( 'assets/images/ar_asset_icon.jpg', dirname(__FILE__) ) ); ?>" id="ardisplay-ai-image-trigger" data-default-src="<?php echo esc_url( plugins_url( 'assets/images/ar_asset_icon.jpg', dirname(__FILE__) ) ); ?>" style="width:100%;height:100%;object-fit:contain;padding:8px;">
                                <img src="<?php echo esc_url( plugins_url( 'assets/images/delete.png', dirname(__FILE__) ) ); ?>" id="ardisplay-ai-clear" style="position:absolute;top:6px;right:6px;width:18px;height:18px;display:none;cursor:pointer;" />
                            </div>
                            <div>
                                <div style="margin-bottom:8px;">
                                    <label style="display:flex;align-items:center;gap:6px">
                                        <span>Texture resolution</span>
                                        <span class="dashicons dashicons-editor-help" data-tooltip="Resolution of generated texture maps. Higher values create sharper textures but can take longer and use more credits. Allowed: 512, 1024, 2048." title="Resolution of generated texture maps. Higher values create sharper textures but can take longer and use more credits. Allowed: 512, 1024, 2048." aria-label="Texture resolution help" style="color:#6b7280;cursor:help"></span>
                                        <select id="ardisplay-ai-texture-resolution">
                                            <option value="512">512</option>
                                            <option value="1024" selected>1024</option>
                                            <option value="2048">2048</option>
                                        </select>
                                    </label>
                                    <label style="display:flex;align-items:center;gap:6px">
                                        <span>Foreground ratio</span>
                                        <span class="dashicons dashicons-editor-help" data-tooltip="Controls how tightly the subject is cropped from the background (0–1). Higher values keep more of the original area around the object; lower values crop tighter. Default 0.7." title="Controls how tightly the subject is cropped from the background (0–1). Higher values keep more of the original area around the object; lower values crop tighter. Default 0.7." aria-label="Foreground ratio help" style="color:#6b7280;cursor:help"></span>
                                        <input id="ardisplay-ai-foreground-ratio" type="number" min="0" max="1" step="0.05" value="0.7" style="width:90px" />
                                    </label>
                                    
                                    <!-- Generate Model Button moved here -->
                                    <div style="margin-top: 16px;">
                                        <button type="button" id="ardisplay-ai-generate" class="button ar_admin_button" disabled>
                                            <span style="margin-right:4px;">✨</span>
                                            <?php esc_html_e('Generate Model', 'ar-for-wordpress'); ?>
                                        </button>
                                        
                                        
                                    </div>
                                </div>
                            </div>
                        </div>
                        
                        <input type="file" id="ardisplay-ai-select-images" accept="image/*" multiple style="display:none;" />
                        <hr style="width:50%; margin-left:0;">
                        
                        <div class="credit-actions" style="margin-top: 20px; text-align: left;">
                        <?php if ($has_credits_data): ?>
                                            <div id="ardisplay-ai-credit-notice" class="credit-notice" style="margin: 8px;">
                                                <?php 
                                                if ($available_credits >= $credit_cost) {
                                                    echo esc_html(sprintf(__('This will cost %d credits. You have %d available.', 'ar-for-wordpress'), $credit_cost, $available_credits));
                                                } else {
                                                    echo esc_html(sprintf(__('You need %d credits. You have %d available.', 'ar-for-wordpress'), $credit_cost, $available_credits));
                                                }
                                                ?>
                                            </div>
                                        <?php endif; ?>
                            <a href="https://ardisplay.ai/product/ai-model-credits/?return_site=<?php echo urlencode(home_url()); ?>&user_id=<?php echo esc_attr($current_user_id); ?>" target="_blank" class="button button-primary">
                                <span class="dashicons dashicons-cart" style="margin-right: 4px;margin-top: 4px;"></span>
                                <?php esc_html_e('Purchase Credits', 'ar-for-wordpress'); ?>
                            </a>
                            <button type="button" class="button button-secondary" onclick="location.reload();">
                                <span class="dashicons dashicons-update" style="margin-right: 4px;margin-top: 4px;"></span>
                                <?php esc_html_e('Refresh Credits', 'ar-for-wordpress'); ?>
                            </button>
                        </div>
                        <div id="ardisplay-ai-status" style="margin-top:10px"></div>
                        <div id="ardisplay-ai-loading" style="position:absolute; top:10px; right:10px; bottom:10px; width:auto; pointer-events:none; display:flex; align-items:flex-start; justify-content:flex-end;"></div>
                        <div id="ardisplay-ai-preview" style="margin-top:10px"></div>
                        
                        <!-- AI Building Image - Bottom Right -->
                        <div id="ardisplay-ai-building-image" style="position:absolute; bottom:20px; right:20px; width:200px; height:350px; pointer-events:none; z-index:1;">
                            <img src="<?php echo esc_url( plugins_url( 'assets/images/ar_ai_building.jpg', dirname(__FILE__) ) ); ?>" 
                                 alt="AI Model Generation" 
                                 style="width:100%; height:100%; object-fit:contain; opacity:0.8;">
                        </div>
                    </div>
                </div>
                
                        
                <div id="model_files_content" class="ar_tabcontent" style="<?php echo esc_html($files_active); ?>">
                
                <div>
                    
                    <div class="ar_model_files_fields">
                        <div style="width:48%; float:left;padding-right:10px; position:relative;">
                            
                            <center>
                            <strong><?php echo esc_html(__(  'GLTF/GLB 3D Model', 'ar-for-wordpress'));?></strong> <br><br>
                            <img src="<?php echo esc_html($glb_upload_image);?>" id="glb_thumb_img" class="ar_file_icons" onclick="document.getElementById('upload_glb_button').click();document.getElementById('glb_thumb_img').src = '<?php echo esc_url( plugins_url( "assets/images/ar_model_icon_tick.jpg", dirname(__FILE__) ) ); ?>';">
                             <a href="#" onclick="document.getElementById('_glb_file').value = '';document.getElementById('glb_filename').innerHTML = '';document.getElementById('glb_thumb_img').src = '<?php echo esc_url( plugins_url( "assets/images/ar_model_icon.jpg", dirname(__FILE__) ) ); ?>';"><img src="<?php echo esc_url( plugins_url( "assets/images/delete.png", dirname(__FILE__) ) );?>" style="width: 15px;vertical-align: middle;"></a>
    
                             
    
                            <br clear="all"><br><span id="glb_filename" class="ar_filenames"><?php echo esc_html($glb_filename);?></span>
                            <div align="center">                            
                                <input type="hidden" pattern="https?://.+" title="<?php echo esc_html(__( 'Secure URLs only', 'ar-for-wordpress')); ?> https://" placeholder="https://" name="_glb_file" id="_glb_file" class="regular-text ar_input_field" value="<?php echo esc_html(get_post_meta( $model_array['id'], '_glb_file', true ));?>"> 
                                <input id="upload_glb_button" class="button nodisplay upload_glb_button" type="button" value="<?php echo esc_html(__(  'Upload', 'ar-for-wordpress'));?>" />
                                <a href="#" id="toggle-model-fields" data-status='hidden'>Show Model Fields</a>
                            </div>
                            <input type="hidden" id="uploader_modelid" value="">
                            
                            
                            </center>
                            
                        </div>
                        <div style="width:48%; float:left;">
                            <center>
                        	<strong><?php echo esc_html(__( 'USDZ/REALITY 3D Model', 'ar-for-wordpress'));?> - <span class="ar_label_tip"><?php echo esc_html(__( 'Optional', 'ar-for-wordpress'));?></span></strong><br><br>
                        	<img src="<?php echo esc_url($usdz_upload_image);?>" id="usdz_thumb_img"  class="ar_file_icons" onclick="document.getElementById('upload_usdz_button').click();document.getElementById('usdz_thumb_img').src = '<?php echo esc_url( plugins_url( "assets/images/ar_model_icon_tick.jpg", dirname(__FILE__) ) ); ?>';">
                            <a href="#" onclick="document.getElementById('_usdz_file').value = '';document.getElementById('usdz_filename').innerHTML = '';document.getElementById('usdz_thumb_img').src = '<?php echo esc_url( plugins_url( "assets/images/ar_model_icon.jpg", dirname(__FILE__) ) ); ?>';"><img src="<?php echo esc_url( plugins_url( "assets/images/delete.png", dirname(__FILE__) ) );?>" style="width: 15px;vertical-align: middle;"></a>
                            <br clear="all"><br><span id="usdz_filename" class="ar_filenames"><?php echo esc_html($usdz_filename);?></span>
                            <div align="center">                            
                                <input type="hidden" pattern="https?://.+" title="<?php echo esc_html(__('Secure URLs only', 'ar-for-wordpress')); ?> https://" placeholder="https://" name="_usdz_file" id="_usdz_file" class="regular-text ar_input_field" value="<?php echo esc_html(get_post_meta( $model_array['id'], '_usdz_file', true ));?>"> 
                                <input id="upload_usdz_button" class="button upload_usdz_button nodisplay" type="button" value="<?php echo esc_html(__( 'Upload', 'ar-for-wordpress'));?>" />
                            </div>
                            </center>
                        </div>
                    </div>
                    <div style="display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:18px;align-items:stretch;margin-top:16px;">
                        <div class="ar_model_files_advert hide_on_devices" style="text-align:center;" onmouseover="this.style.cursor='pointer'" onclick="ar_open_tab(event, 'ai_generator_content', 'ai_generator_tab')">
                            <center>
                            <h4 style="margin:6px auto 10px;font-weight:600;max-width:420px;line-height:1.35;white-space:normal;"><?php echo esc_html(__('Generate a 3D Model from a photo (AI)', 'ar-for-wordpress'));?></h4>    
                            <img src="<?php echo esc_url( plugins_url( 'assets/images/ar_ai_building.jpg', dirname(__FILE__) ) ); ?>" style="height:80px;object-fit:contain;margin-bottom:16px" alt="AI Model" />
                                <br><button type="button" class="button ar_admin_button" onclick="ar_open_tab(event, 'ai_generator_content', 'ai_generator_tab')"><?php echo esc_html(__('AI Model Generator', 'ar-for-wordpress'));?></button>
                            </center>
                        </div>
                        <div class="ar_model_files_advert hide_on_devices" style="text-align:center;" onmouseover="this.style.cursor='pointer'" onclick="ar_open_tab(event, 'asset_builder_content', 'asset_builder_tab')">
                            <center>
                                <h4 style="margin:6px auto 10px;font-weight:600;max-width:420px;line-height:1.35;white-space:normal;"><?php echo esc_html(__('Hang your artwork in AR with just a photo!', 'ar-for-wordpress'));?></h4>
                                <img src="<?php echo esc_url( plugins_url( 'assets/images/ar_asset_ad_icon.jpg', dirname(__FILE__) ) ); ?>" style="height:80px;margin-bottom:16px" alt="3D Gallery" /><br>
                                <br><button 
                                    id="asset_builder_button"
                                    class="button ar_admin_button"
                                    onclick="event.preventDefault(); ar_open_tab(event, 'asset_builder_content', 'asset_builder_tab');">
                                    <?php echo esc_html__('3D Gallery Builder', 'ar-for-wordpress'); ?>
                                </button>
                            </center>
                        </div>
                        <div class="ar_model_files_advert hide_on_devices" style="text-align:center;" onmouseover="this.style.cursor='pointer'" onclick="event.preventDefault(); window.open('https://armodelshop.com?from_plugin=true&redirect_url=<?php echo esc_url($encoded_redirect_url); ?>', '_blank')">
                            <center>
                                <h4 style="margin:6px auto 10px;font-weight:600;max-width:420px;line-height:1.35;white-space:normal;"><?php echo esc_html(__('Purchase an AR Model for your site.', 'ar-for-wordpress'));?></h4>
                                <img src="<?php echo esc_url( plugins_url( 'assets/images/ar-model-shop-icon.png', dirname(__FILE__) ) ); ?>" style="height:80px;margin-bottom:16px" alt="AR Model Shop" />
                                <br><button 
                                    id="open-ar-modelshop"
                                    class="button ar_admin_button"
                                    onclick="event.preventDefault(); window.open('https://armodelshop.com?from_plugin=true&redirect_url=<?php echo esc_url($encoded_redirect_url); ?>', '_blank')">
                                    <?php echo esc_html__('AR Model Shop', 'ar-for-wordpress'); ?> <sup>&#x2197;</sup>
                                </button>
                            </center>
                        </div>
                    </div>
                    
                    <div style="clear:both"></div><?php 
                    if($plan_check!='Premium') { 
                		    $premium_only = '<b> - '.esc_html(__('Premium Plans Only', 'ar-for-wordpress')).'</b>'; 
                		    $disabled = ' disabled';
                		    $readonly = ['readonly' => 'readonly'];
                		    $custom_attributes = $readonly;
                		    echo '<div style="pointer-events: none;">'; //disable mouse clicking 
                		}else{
                		    $disabled = '';
                		    $readonly = '';
                		    $premium_only = '';
                		    //Used for Scale inputs
                		    $custom_attributes = array(
                                'step' => '0.1',
                                'min' => '0.1');
                		}
                		?>
                    </div>
            	</div>
            	<?php /* Asset Builder */ ?>
            	<div id="asset_builder_content" class="ar_tabcontent" style="padding:0px;<?php echo esc_html($gallery_active); ?>">
                     <?php
                     /******** AR Model File Handling************/
                     ar_gallery_builder_form($model_array);
                     ?>
                </div>
                <?php 
                $support_links = '';
                if (!$ar_whitelabel){
        		    $support_links = '<br><a href="admin.php?page=wc-settings&tab=ar_display">'.esc_html(__('AR Display Settings', 'ar-for-wordpress')).'</a> | <a href="https://augmentedrealityplugins.com/support/" target="_blank">'.esc_html(__('Documentation', 'ar-for-wordpress')).'</a> | <a href="https://augmentedrealityplugins.com/support/3d-model-resources/" target="_blank">'.esc_html(__('Sample 3D Models', 'ar-for-wordpress')).'</a> | <a href="https://augmentedrealityplugins.com/support/3d-model-resources/#hdr" target="_blank">'.esc_html(__('Sample HDR Images', 'ar-for-wordpress')).'</a> ';
        		}
        		/* User Upload */ ?>
            	<div id="user_upload_content" class="ar_tabcontent ar_tabcontent" style="padding:1px 20px;">
		            <h3><?php echo esc_html(__( 'Allow user to upload their own image or model file with [ar-user-upload]', 'ar-for-wordpress'));?></h3>
            	
                
<?php echo wp_kses(__( '<p>Use the <strong>[ar-user-upload]</strong> short code to provide a model viewer that users can drag and drop a GLTF or GLB 3D model file into to view in Augmented Reality.</p>
<p>Users can also upload image files in JPG or PNG format and the image will use the 3D Gallery Builder to produce a 3D model of the image ready to hang on the wall in Augmented Reality.</p>
<p>Model options can be set to custom default values or hidden as follows by setting these attributed in the shortcode.</p>
<p>e.g. <strong>ar-user-upload options=”top” ratio=”2:3″ size=”2″ frame=”framed” color=”#f8f8f8″ opacity=”0.5″ hide=”opacity”</strong></p>
<div style="display: grid; grid-template-columns: 1fr 2fr; gap: 10px; max-width: 800px;">
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>options</strong><br>Controls placement of options panel<br>"top" – Options above the model viewer<br>"bottom" – Options below the model viewer<br>"none" – No options panel</div>
                
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>ratio</strong><br>Sets the image ratio<br>"1:1", "A4", "A3", "A2", "A1", "2:3", "4:5", "3:4"</div>
                
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>size</strong><br>Sets the print size<br>1, 1.5, 2, 2.5</div>
                
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>frame</strong><br>Sets the frame type<br>"none", "mounted", "framed"</div>
                
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>color</strong><br>Sets the frame color<br>6-digit hex value (e.g., "#f8f8f8")</div>
                
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>opacity</strong><br>Sets the frame opacity<br>Value between 0 and 1 (e.g., 0.5)</div>
                
                <div style="padding: 8px; border-bottom: 1px solid #ddd;"><strong>hide</strong><br>Hides specific elements<br>"options", "ratio", "size", "frame", "color", "opacity", "all"</div>
                
                <div style="padding: 8px;"><strong>disable</strong><br>Disables specific elements<br>"options", "ratio", "size", "frame", "color", "opacity", "all"</div>
                </div>'), ar_allowed_html()); ?>
<?php echo wp_kses($support_links, ar_allowed_html()); ?>
<br><br>
            	</div>
                <?php /* Instructions */ ?>
            	<div id="instructions_content" class="ar_tabcontent" style="padding:1px 20px;">
                    <h3><?php echo esc_html(__( 'Shortcodes', 'ar-for-wordpress'));?></h3>
                        <p>                		    
        		        <?php echo $shortcode_examples;//wp_kses($shortcode_examples, ar_allowed_html());
        		        //echo '<p>'.ar_output( 'Models can be uploaded as a GLB or GLTF file for viewing in AR and within the broswer display. You can also upload a USDZ or REALITY file for iOS, otherwise a USDZ file is generated on the fly. The following formats can be uploaded and will be automatically converted to GLB format - DAE, DXF, 3DS, OBJ, PDF, PLY, STL, or Zipped versions of these files. Model conversion accuracy cannot be guaranteed, please check your model carefully.', $ar_plugin_id );
                        if (!$ar_whitelabel){
                		    echo '<p><a href="https://augmentedrealityplugins.com/support/" target="_blank">'.esc_html(__('Documentation', 'ar-for-wordpress')).'</a> | <a href="https://augmentedrealityplugins.com/support/3d-model-resources/" target="_blank">'.esc_html(__('Sample 3D Models', 'ar-for-wordpress')).'</a> | <a href="https://augmentedrealityplugins.com/support/3d-model-resources/#hdr" target="_blank">'.esc_html(__('Sample HDR Images', 'ar-for-wordpress')).'</a> ';
                		}
                		?>
                		</p>
                </div>
                <?php
                //if ($public == 'y'){
                    echo '</div>';
                //} 
                
                $ar_open_tabs=get_option('ar_open_tabs'); 
                $ar_open_tabs_array = explode(',',$ar_open_tabs);
                $jsArray = wp_json_encode($ar_open_tabs_array);
                //print_r($jsArray);
                //die();
                ?>