Fix: Ensure consistent padding and wrapper structure across all tabs

admin/includes/class-hosting-manager.php

@@ -23,6 +23,7 @@ class WP_Allstars_Hosting_Manager {
      */
     public static function display_tab_content() {
         ?>
+        <div class="wp-allstars-settings-content tab-content" id="hosting">
             <div class="wpa-pro-plugins">
             <?php
             $hosting_providers = self::get_hosting_providers();
@@ -49,6 +50,7 @@ class WP_Allstars_Hosting_Manager {
             }
             ?>
             </div>
+        </div>
         <?php
     }
     

admin/includes/class-pro-plugins-manager.php

@@ -42,13 +42,13 @@ class WP_Allstars_Pro_Plugins_Manager {
         });
         
         // Output the HTML for the pro plugins tab
-        echo '<div class="wpa-pro-plugins">';
+        echo '<div class="wp-allstars-settings-content tab-content" id="pro"><div class="wpa-pro-plugins">';
         
         foreach ($pro_plugins as $plugin) {
             self::display_plugin_card($plugin);
         }
         
-        echo '</div>';
+        echo '</div></div>';
     }
     
     /**

admin/includes/class-recommended-plugins-manager.php

@@ -25,6 +25,7 @@ class WP_Allstars_Recommended_Plugins_Manager {
         // Get the active category from query params or default to 'minimal'
         $active_category = isset($_GET['category']) ? sanitize_text_field($_GET['category']) : 'minimal';
         ?>
+        <div class="wp-allstars-settings-content tab-content" id="recommended">
         <div id="wpa-plugin-filters" class="wp-filter">
             <ul class="filter-links">
                 <li><a href="#" data-category="minimal" class="<?php echo $active_category == 'minimal' ? 'current' : ''; ?>">
@@ -81,6 +82,7 @@ class WP_Allstars_Recommended_Plugins_Manager {
         <div class="wp-allstars-plugin-browser">
             <div id="wpa-plugin-list"></div>
         </div>
+        </div>
         <?php
     }
     

admin/includes/class-tools-manager.php

@@ -42,6 +42,7 @@ class WP_Allstars_Tools_Manager {
         
         // Output the CSS and HTML for the tools tab
         ?>
+        <div class="wp-allstars-settings-content tab-content" id="tools">
         <style>
         .wpa-pro-plugins {
             padding: 20px;
@@ -149,6 +150,7 @@ class WP_Allstars_Tools_Manager {
             }
             ?>
         </div>
+        </div>
         <?php
     }