feat: replace checkboxes with Switch component for better UI consistency

- Updated DoctorDetailPage, MySecretariesPage, RecordNumberSettingsPage, RepresentationsPage, ResourcePoolsPage, ResourceTypesPage, SecretariesPage, SecretaryDetailPage, SettingsPage, SkillsPage, SmsWalletPage, and TagsSettingsPage to use the new Switch component instead of native checkboxes.
- Enhanced accessibility by ensuring the Switch component uses appropriate roles and labels.
- Added tests for the new Switch component to ensure functionality and accessibility compliance.
- Updated styles to accommodate the new Switch component design.

assets/admin/components/NewAppointmentDrawer.tsx

@@ -11,6 +11,7 @@ import PriceInput from './ui/PriceInput';
 import SearchableSelect from './ui/SearchableSelect';
 import { WalletChargeLink } from './AppointmentActions';
 import { tehranWallClockToUnix, tomanToRial, rialToToman, digitsOnly, sanitizeMobileInput } from '../lib/utils';
+import Switch from './ui/Switch';
 
 interface Option { uuid: string; name?: string; full_name?: string }
 interface PatientRow { uuid: string; user_name?: string; user_mobile?: string; user_national_code?: string }
@@ -342,10 +343,12 @@ export default function NewAppointmentDrawer({ doctorUuid, defaultDate, queryKey
           <>
             <div style={{ fontSize: 13.5, fontWeight: 700, margin: '6px 0 10px' }}>بیعانه:</div>
             <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 10 }}>
-              <label style={{ display: 'inline-flex', alignItems: 'center', gap: 8, fontSize: 13, cursor: 'pointer' }}>
-                <input type="checkbox" checked={depositRequired} onChange={e => setDepositRequired(e.target.checked)} />
-                بیعانه مورد نیاز است.
-              </label>
+              <Switch
+                inline
+                checked={depositRequired}
+                onChange={setDepositRequired}
+                label="بیعانه مورد نیاز است."
+              />
             </div>
             {depositRequired && (
               <div style={{ display: 'flex', alignItems: 'flex-end', gap: 10, marginBottom: 12 }}>