Refactor(Admin): Implement Settings API & AJAX save for Settings Manager

- Refactored WPALLSTARS_Settings_Manager to use WordPress Settings API.
- Stores settings in single 'wpallstars_options' array.
- Implemented robust AJAX saving for specific settings (e.g., color scheme, auto-upload) via WPALLSTARS_Admin_Manager::update_option.
- Updated JS and setting render functions for AJAX.
- Corrected admin menu registration and script enqueue hooks.
- Includes file renames from wp-allstars to wpallstars.

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

@@ -65,7 +65,7 @@ class WP_Allstars_Pro_Plugins_Manager {
         });
         
         // Start the tab content container
-        echo '<div class="wp-allstars-settings-content tab-content" id="pro"><div class="wpa-pro-plugins">';
+        echo '<div class="wp-allstars-settings-content tab-content" id="pro"><div class="wpallstars-pro-plugins">';
         
         // Render each plugin card
         foreach ($pro_plugins as $plugin) {
@@ -83,7 +83,7 @@ class WP_Allstars_Pro_Plugins_Manager {
      */
     public static function display_plugin_card($plugin) {
         ?>
-        <div class="wpa-pro-plugin">
+        <div class="wpallstars-pro-plugin">
             <h3><?php echo esc_html($plugin['name']); ?></h3>
             <p><?php echo esc_html($plugin['description']); ?></p>
             <?php if (isset($plugin['button_group'])): ?>
@@ -138,7 +138,7 @@ class WP_Allstars_Pro_Plugins_Manager {
         
         // Add inline CSS for pro plugins
         $custom_css = '
-        .wpa-pro-plugins {
+        .wpallstars-pro-plugins {
             padding: 15px 20px;
             display: flex;
             flex-direction: column;
@@ -146,7 +146,7 @@ class WP_Allstars_Pro_Plugins_Manager {
             max-width: 700px;
             margin: 0 auto;
         }
-        .wpa-pro-plugin {
+        .wpallstars-pro-plugin {
             background: #fff;
             border: 1px solid #ddd;
             padding: 24px;
@@ -159,34 +159,34 @@ class WP_Allstars_Pro_Plugins_Manager {
             margin-bottom: 24px;
             max-width: 100%;
         }
-        .wpa-pro-plugin:last-child {
+        .wpallstars-pro-plugin:last-child {
             margin-bottom: 0;
         }
-        .wpa-pro-plugin:hover {
+        .wpallstars-pro-plugin:hover {
             border-color: #2271b1;
             box-shadow: 0 2px 6px rgba(0,0,0,0.15);
         }
-        .wpa-pro-plugin h3 {
+        .wpallstars-pro-plugin h3 {
             margin: 0 0 12px;
             font-size: 16px;
             font-weight: 600;
             color: #1d2327;
             line-height: 1.4;
         }
-        .wpa-pro-plugin p {
+        .wpallstars-pro-plugin p {
             margin: 0 0 16px;
             color: #50575e;
             font-size: 14px;
             line-height: 1.6;
         }
-        .wpa-pro-plugin .button-group {
+        .wpallstars-pro-plugin .button-group {
             display: flex;
             flex-wrap: wrap;
             gap: 8px;
             margin-top: auto;
             justify-content: flex-start;
         }
-        .wpa-pro-plugin .button {
+        .wpallstars-pro-plugin .button {
             text-decoration: none;
             min-width: 120px;
             text-align: center;
@@ -205,17 +205,17 @@ class WP_Allstars_Pro_Plugins_Manager {
             box-shadow: none;
             cursor: pointer;
         }
-        .wpa-pro-plugin .button:hover {
+        .wpallstars-pro-plugin .button:hover {
             background: #f0f0f1;
             border-color: #0071a1;
             color: #0071a1;
         }
-        .wpa-pro-plugin .button-primary {
+        .wpallstars-pro-plugin .button-primary {
             background: #0071a1;
             border-color: #0071a1;
             color: #fff;
         }
-        .wpa-pro-plugin .button-primary:hover {
+        .wpallstars-pro-plugin .button-primary:hover {
             background: #006291;
             border-color: #006291;
             color: #fff;