refactor mouse-form to use FormSectionComponent

Author: xcutiboo

src/components/forms/mouse-form/mouse-form.component.ts

@@ -5,20 +5,15 @@ import { KittyMouseConfig } from '../../../models/kitty-types';
 import { NumberInputComponent } from '../../shared/number-input/number-input.component';
 import { ColorInputComponent } from '../../shared/color-input/color-input.component';
 import { VersionBadgeComponent } from '../../shared/version-badge/version-badge.component';
+import { FormSectionComponent } from '../../shared/form-section/form-section.component';
 import { createFormHelper } from '../../../utils/form-helpers';
 import { KittyVersionService } from '../../../services/kitty-version.service';
 
 @Component({
   selector: 'app-mouse-form',
-  imports: [CommonModule, FormsModule, NumberInputComponent, ColorInputComponent, VersionBadgeComponent],
+  imports: [CommonModule, FormsModule, NumberInputComponent, ColorInputComponent, VersionBadgeComponent, FormSectionComponent],
   template: `
-    <div class="space-y-6">
-      <div>
-        <h2 class="text-2xl font-bold text-kitty-primary mb-2">Mouse</h2>
-        <p class="text-kitty-text-dim">Configure mouse interactions, URL detection, and clipboard behavior</p>
-      </div>
-
-      <div class="space-y-6 bg-kitty-surface rounded-lg p-6 border border-kitty-border">
+    <app-form-section title="Mouse" description="Configure mouse interactions, URL detection, and clipboard behavior">
         <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
           <div class="form-group">
             <label class="block text-sm font-medium text-kitty-text mb-2">
@@ -341,7 +336,7 @@ import { KittyVersionService } from '../../../services/kitty-version.service';
               </div>
             </div>
           </div>
-        </div>
+        </app-form-section>
       }
     </div>
   `,