Refactor code structure for improved readability and maintainability

assets/admin/pages/RepresentationDetailPage.tsx

@@ -219,7 +219,7 @@ export default function RepresentationDetailPage() {
         footer={
           <>
             <button onClick={() => setEditOpen(false)}
-              className="cp-btn-secondary">
+              className="btn ghost sm">
               لغو
             </button>
             <button
@@ -230,7 +230,7 @@ export default function RepresentationDetailPage() {
                 commission_percent: parseFloat(formData.commission_percent) || rep.commission_percent,
               } as any)}
               disabled={updateMutation.isPending}
-              className="cp-btn-primary">
+              className="btn primary sm">
               {updateMutation.isPending ? 'در حال ذخیره...' : 'ذخیره'}
             </button>
           </>
@@ -238,12 +238,12 @@ export default function RepresentationDetailPage() {
       >
         <div className="space-y-4">
           <div>
-            <label className="cp-label">نام کامل</label>
+            <label className="">نام کامل</label>
             <input value={formData.full_name} onChange={(e) => setFormData((p) => ({ ...p, full_name: e.target.value }))}
               className="cp-input h-11" />
           </div>
           <div>
-            <label className="cp-label">شهر</label>
+            <label className="">شهر</label>
             <select
               value={formData.city_id}
               onChange={(e) => setFormData((p) => ({ ...p, city_id: e.target.value }))}
@@ -256,12 +256,12 @@ export default function RepresentationDetailPage() {
             </select>
           </div>
           <div>
-            <label className="cp-label">موبایل</label>
+            <label className="">موبایل</label>
             <input value={formData.mobile_number} onChange={(e) => setFormData((p) => ({ ...p, mobile_number: e.target.value }))}
               dir="ltr" className="cp-input h-11" />
           </div>
           <div>
-            <label className="cp-label">درصد کمیسیون</label>
+            <label className="">درصد کمیسیون</label>
             <input value={formData.commission_percent} onChange={(e) => setFormData((p) => ({ ...p, commission_percent: e.target.value }))}
               type="number" min="0" max="100" dir="ltr"
               className="cp-input h-11" />