style: update section header title and enhance mobile layout for settings section

Author: Admin9705

frontend/templates/components/settings_section.html

@@ -1,6 +1,6 @@
 <section id="settingsSection" class="content-section">
     <div class="section-header">
-        <h2>General Settings</h2>
+        <h2>Settings</h2>
 
         <div class="settings-actions">
             <button id="saveSettingsButton" class="save-button" disabled>
@@ -15,6 +15,30 @@ <h2>General Settings</h2>
 </section>
 
 <style>
+    /* Mobile-specific settings adjustments */
+    @media (max-width: 768px) {
+        #settingsSection .section-header {
+            flex-direction: row !important;
+            align-items: center !important;
+            justify-content: space-between !important;
+        }
+        
+        #settingsSection .section-header h2 {
+            margin-bottom: 0 !important;
+        }
+        
+        #settingsSection .settings-actions {
+            margin-top: 0 !important;
+            width: auto !important;
+        }
+        
+        #saveSettingsButton {
+            width: auto !important;
+            text-align: center;
+            justify-content: center;
+        }
+    }
+    
     /* Fixed banner footer styling */
     .fixed-banner-footer {
         position: fixed;