diff --git a/frontend/index.html b/frontend/index.html
index dbd279f..cc0ef52 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -357,7 +357,7 @@
   function openDetail(job){
     currentJob = job;
     detailTable.innerHTML = '';
-    const fields = ["Job_Full_Name","Job_Number","Company_Client","Manager","Contact_Person","Phone_Number","Job_Address","Start_Date","Tax_Exempt","Job_Status"];
+    const fields = ["Job_Full_Name","Job_Number","Company_Client","Manager","Contact_Person","Phone_Number","Job_Address","Start_Date","Tax_Exempt","Job_Status","Job_Type","Job_Division"];
     let i = 0;
     while(i < fields.length){
       const f = fields[i];
@@ -368,13 +368,13 @@
         
         // Job Number
         const col1 = document.createElement('div'); col1.className='flex-1';
-        const label1 = document.createElement('div'); label1.className='text-xs font-bold text-gray-500 uppercase tracking-wide mb-1'; label1.textContent='Job Number';
+        const label1 = document.createElement('div'); label1.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label1.textContent='Job Number';
         const val1 = document.createElement('div'); val1.className='text-sm text-gray-900'; val1.textContent = job['Job_Number'] || '—';
         col1.appendChild(label1); col1.appendChild(val1);
         
         // Company Client
         const col2 = document.createElement('div'); col2.className='flex-1';
-        const label2 = document.createElement('div'); label2.className='text-xs font-bold text-gray-500 uppercase tracking-wide mb-1'; label2.textContent='Company Client';
+        const label2 = document.createElement('div'); label2.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label2.textContent='Company Client';
         const val2 = document.createElement('div'); val2.className='text-sm text-gray-900'; val2.textContent = job['Company_Client'] || '—';
         col2.appendChild(label2); col2.appendChild(val2);
         
@@ -388,13 +388,13 @@
         
         // Contact Person
         const col1 = document.createElement('div'); col1.className='flex-1';
-        const label1 = document.createElement('div'); label1.className='text-xs font-bold text-gray-500 uppercase tracking-wide mb-1'; label1.textContent='Contact Person';
+        const label1 = document.createElement('div'); label1.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label1.textContent='Contact Person';
         const val1 = document.createElement('div'); val1.className='text-sm text-gray-900'; val1.textContent = job['Contact_Person'] || '—';
         col1.appendChild(label1); col1.appendChild(val1);
         
         // Phone Number
         const col2 = document.createElement('div'); col2.className='flex-1';
-        const label2 = document.createElement('div'); label2.className='text-xs font-bold text-gray-500 uppercase tracking-wide mb-1'; label2.textContent='Phone Number';
+        const label2 = document.createElement('div'); label2.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label2.textContent='Phone Number';
         const val2 = document.createElement('div'); val2.className='text-sm';
         if(job['Phone_Number'] && job['Phone_Number'].trim() !== ''){
           const phoneLink = document.createElement('a');
@@ -413,6 +413,26 @@
         i += 2; // Skip Phone_Number in next iteration
         continue;
       }
+
+      if(f === 'Job_Status'){
+        const row = document.createElement('div'); row.className='pb-2 border-b border-gray-100 flex gap-4';
+
+        // Job Status
+        const col1 = document.createElement('div'); col1.className='flex-1';
+        const label1 = document.createElement('div'); label1.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label1.textContent='Job Status';
+        const val1 = document.createElement('div'); val1.className='text-sm text-gray-900'; val1.textContent = job['Job_Status'] || '—';
+        col1.appendChild(label1); col1.appendChild(val1);
+
+        // Job Type
+        const col2 = document.createElement('div'); col2.className='flex-1';
+        const label2 = document.createElement('div'); label2.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label2.textContent='Job Type';
+        const val2 = document.createElement('div'); val2.className='text-sm text-gray-900'; val2.textContent = job['Job_Type'] || '—';
+        col2.appendChild(label2); col2.appendChild(val2);
+
+        row.appendChild(col1); row.appendChild(col2); detailTable.appendChild(row);
+        i += 2; // Skip Job_Type in next iteration
+        continue;
+      }
       
       // Regular single field
       const value = job[f] || '';
@@ -422,8 +442,8 @@
       }
       
       const row = document.createElement('div'); row.className='pb-2 border-b border-gray-100 last:border-0';
-      const label = document.createElement('div'); label.className='text-xs font-bold text-gray-500 uppercase tracking-wide mb-1'; label.textContent=f.replace(/_/g,' ');
-      const val = document.createElement('div'); val.className='text-sm text-gray-900'; 
+      const label = document.createElement('div'); label.className='text-xs font-bold text-gray-700 uppercase tracking-wide mb-1'; label.textContent=f.replace(/_/g,' ');
+      const val = document.createElement('div'); val.className='text-sm text-gray-900 font-medium'; 
       
       // Format date if it's Start_Date
       if(f === 'Start_Date' && value){