fix(03): responsive employee form personal info

src/components/02_personnel-management/FormAddress.vue

@@ -79,10 +79,12 @@ watch(districtId, fetchSubDistrict);
 <template>
   <div class="col-12">
     <div class="col-12 app-text-muted row items-center q-mb-md">
-      • {{ title || $t('formDialogTitlePersonnelAddress') }}
+      <span class="q-mr-lg">
+        • {{ title || $t('formDialogTitlePersonnelAddress') }}
+      </span>
       <div
         v-if="employee"
-        class="q-ml-lg surface-3 q-px-sm q-py-xs row"
+        class="surface-3 q-px-sm q-py-xs row"
         style="border-radius: var(--radius-3)"
       >
         <span

src/components/02_personnel-management/FormPerson.vue

@@ -209,7 +209,7 @@ defineProps<{
       emit-value
       map-options
       :label="$t('formDialogInputGender')"
-      class="col-3"
+      class="col-md-3 col-6"
       option-label="label"
       option-value="value"
       v-model="gender"
@@ -231,7 +231,7 @@ defineProps<{
       map-options
       options-dense
       :label="$t('formDialogInputNationality')"
-      class="col-3"
+      class="col-md-3 col-6"
       option-label="label"
       option-value="label"
       v-model="nationality"