diff --git a/src/feature-module/projects/projecttracker.jsx b/src/feature-module/projects/projecttracker.jsx
index 1a75e99..009a139 100644
--- a/src/feature-module/projects/projecttracker.jsx
+++ b/src/feature-module/projects/projecttracker.jsx
@@ -710,7 +710,7 @@ const ProjectTracker = () => {
             </Spin>
           </div>
 
-          {/* Custom Pagination */}
+          {/* Custom Pagination - Compact Size */}
           <div
             key={`pagination-${themeKey}`}
             className={`custom-pagination-container ${isDarkMode ? '' : 'light-mode'}`}
@@ -721,43 +721,32 @@ const ProjectTracker = () => {
               border: isDarkMode
                 ? '1px solid rgba(52, 152, 219, 0.3)'
                 : '1px solid rgba(0, 0, 0, 0.1)',
-              borderRadius: '12px',
+              borderRadius: '8px',
               boxShadow: isDarkMode
-                ? '0 8px 32px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(52, 152, 219, 0.1)'
-                : '0 2px 12px rgba(0, 0, 0, 0.08)',
-              backdropFilter: isDarkMode ? 'blur(10px)' : 'none',
-              transition: 'all 0.3s ease',
+                ? '0 4px 16px rgba(0, 0, 0, 0.2), 0 1px 4px rgba(52, 152, 219, 0.1)'
+                : '0 1px 6px rgba(0, 0, 0, 0.06)',
+              backdropFilter: isDarkMode ? 'blur(8px)' : 'none',
+              transition: 'all 0.2s ease',
               position: 'relative',
               overflow: 'hidden',
-              padding: '16px 24px',
-              margin: '16px 0'
-            }}
-            onMouseEnter={(e) => {
-              e.currentTarget.style.transform = 'translateY(-2px)';
-              e.currentTarget.style.boxShadow = isDarkMode
-                ? '0 12px 40px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(52, 152, 219, 0.2)'
-                : '0 4px 20px rgba(0, 0, 0, 0.12)';
-            }}
-            onMouseLeave={(e) => {
-              e.currentTarget.style.transform = 'translateY(0)';
-              e.currentTarget.style.boxShadow = isDarkMode
-                ? '0 8px 32px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(52, 152, 219, 0.1)'
-                : '0 2px 12px rgba(0, 0, 0, 0.08)';
+              padding: '8px 16px',
+              margin: '8px 0',
+              fontSize: '13px'
             }}
           >
-            {/* Pagination Info */}
+            {/* Pagination Info - Compact */}
             <div
               style={{
                 display: 'flex',
                 justifyContent: 'space-between',
                 alignItems: 'center',
-                marginBottom: '16px',
+                marginBottom: '8px',
                 flexWrap: 'wrap',
-                gap: '12px'
+                gap: '8px'
               }}
             >
-              <div style={{display: 'flex', alignItems: 'center', gap: '12px'}}>
-                <span style={{color: isDarkMode ? '#bdc3c7' : '#2c3e50', fontSize: '14px', fontWeight: '500'}}>Row Per Page</span>
+              <div style={{display: 'flex', alignItems: 'center', gap: '6px'}}>
+                <span style={{color: isDarkMode ? '#bdc3c7' : '#2c3e50', fontSize: '12px', fontWeight: '500'}}>Row Per Page</span>
                 <select
                   value={pageSize}
                   onChange={(e) => {
@@ -772,13 +761,13 @@ const ProjectTracker = () => {
                     border: isDarkMode
                       ? '1px solid rgba(52, 152, 219, 0.3)'
                       : '1px solid #dee2e6',
-                    borderRadius: '6px',
+                    borderRadius: '4px',
                     color: isDarkMode ? '#ffffff' : '#495057',
-                    padding: '4px 8px',
-                    fontSize: '14px',
+                    padding: '2px 6px',
+                    fontSize: '12px',
                     cursor: loading ? 'not-allowed' : 'pointer',
                     opacity: loading ? 0.7 : 1,
-                    boxShadow: isDarkMode ? 'none' : '0 1px 3px rgba(0, 0, 0, 0.1)'
+                    boxShadow: isDarkMode ? 'none' : '0 1px 2px rgba(0, 0, 0, 0.05)'
                   }}
                 >
                   <option value={10} style={{background: isDarkMode ? '#2c3e50' : '#ffffff', color: isDarkMode ? '#ffffff' : '#495057'}}>10</option>
@@ -786,37 +775,37 @@ const ProjectTracker = () => {
                   <option value={50} style={{background: isDarkMode ? '#2c3e50' : '#ffffff', color: isDarkMode ? '#ffffff' : '#495057'}}>50</option>
                   <option value={100} style={{background: isDarkMode ? '#2c3e50' : '#ffffff', color: isDarkMode ? '#ffffff' : '#495057'}}>100</option>
                 </select>
-                <span style={{color: isDarkMode ? '#bdc3c7' : '#2c3e50', fontSize: '14px', fontWeight: '500'}}>Entries</span>
+                <span style={{color: isDarkMode ? '#bdc3c7' : '#2c3e50', fontSize: '12px', fontWeight: '500'}}>Entries</span>
               </div>
 
-              <div style={{display: 'flex', alignItems: 'center', gap: '12px'}}>
+              <div style={{display: 'flex', alignItems: 'center', gap: '6px'}}>
                 <div
                   style={{
                     background: isDarkMode
                       ? 'linear-gradient(45deg, #3498db, #2ecc71)'
                       : 'linear-gradient(45deg, #007bff, #28a745)',
                     borderRadius: '50%',
-                    width: '24px',
-                    height: '24px',
+                    width: '16px',
+                    height: '16px',
                     display: 'flex',
                     alignItems: 'center',
                     justifyContent: 'center',
-                    fontSize: '12px',
+                    fontSize: '8px',
                     boxShadow: isDarkMode
-                      ? '0 2px 8px rgba(52, 152, 219, 0.3)'
-                      : '0 2px 8px rgba(0, 123, 255, 0.2)',
-                    transition: 'all 0.3s ease'
+                      ? '0 1px 4px rgba(52, 152, 219, 0.3)'
+                      : '0 1px 4px rgba(0, 123, 255, 0.2)',
+                    transition: 'all 0.2s ease'
                   }}
                 >
                   📊
                 </div>
-                <span style={{color: isDarkMode ? '#bdc3c7' : '#2c3e50', fontSize: '14px', fontWeight: '500'}}>
+                <span style={{color: isDarkMode ? '#bdc3c7' : '#2c3e50', fontSize: '12px', fontWeight: '500'}}>
                   Showing <strong style={{color: isDarkMode ? '#3498db' : '#007bff'}}>{startRecord}</strong> to <strong style={{color: isDarkMode ? '#3498db' : '#007bff'}}>{endRecord}</strong> of <strong style={{color: isDarkMode ? '#e74c3c' : '#dc3545'}}>{totalCount}</strong> entries
                 </span>
               </div>
             </div>
 
-            {/* Pagination Buttons */}
+            {/* Pagination Buttons - Compact */}
             <div
               style={{
                 position: 'relative',
@@ -824,7 +813,7 @@ const ProjectTracker = () => {
                 display: 'flex',
                 justifyContent: 'center',
                 alignItems: 'center',
-                gap: '8px'
+                gap: '4px'
               }}
             >
               {/* Numbered Pagination Buttons */}
@@ -844,23 +833,23 @@ const ProjectTracker = () => {
                         ? (isDarkMode ? 'linear-gradient(45deg, #f39c12, #e67e22)' : 'linear-gradient(135deg, #007bff, #0056b3)')
                         : (isDarkMode ? 'linear-gradient(45deg, #34495e, #2c3e50)' : 'linear-gradient(135deg, #ffffff, #f8f9fa)'),
                       border: isActive
-                        ? (isDarkMode ? '2px solid #f39c12' : '2px solid #007bff')
+                        ? (isDarkMode ? '1px solid #f39c12' : '1px solid #007bff')
                         : (isDarkMode ? '1px solid rgba(52, 152, 219, 0.3)' : '1px solid #dee2e6'),
                       borderRadius: '50%',
-                      width: '32px',
-                      height: '32px',
+                      width: '24px',
+                      height: '24px',
                       color: isActive
                         ? '#ffffff'
                         : (isDarkMode ? '#ffffff' : '#495057'),
-                      fontSize: '14px',
-                      fontWeight: '700',
+                      fontSize: '11px',
+                      fontWeight: '600',
                       cursor: loading ? 'not-allowed' : 'pointer',
-                      transition: 'all 0.3s ease',
+                      transition: 'all 0.2s ease',
                       boxShadow: loading
                         ? 'none'
                         : isActive
-                        ? (isDarkMode ? '0 4px 12px rgba(243, 156, 18, 0.4)' : '0 3px 8px rgba(0, 123, 255, 0.3)')
-                        : (isDarkMode ? '0 2px 8px rgba(52, 73, 94, 0.3)' : '0 1px 3px rgba(0, 0, 0, 0.1)'),
+                        ? (isDarkMode ? '0 2px 6px rgba(243, 156, 18, 0.3)' : '0 2px 4px rgba(0, 123, 255, 0.2)')
+                        : (isDarkMode ? '0 1px 4px rgba(52, 73, 94, 0.2)' : '0 1px 2px rgba(0, 0, 0, 0.08)'),
                       display: 'flex',
                       alignItems: 'center',
                       justifyContent: 'center',
@@ -871,10 +860,10 @@ const ProjectTracker = () => {
                         e.target.style.background = isDarkMode
                           ? 'linear-gradient(45deg, #3498db, #2980b9)'
                           : 'linear-gradient(135deg, #e9ecef, #f8f9fa)';
-                        e.target.style.transform = isDarkMode ? 'scale(1.1)' : 'translateY(-1px) scale(1.05)';
+                        e.target.style.transform = isDarkMode ? 'scale(1.05)' : 'translateY(-1px) scale(1.02)';
                         e.target.style.boxShadow = isDarkMode
-                          ? '0 4px 12px rgba(52, 152, 219, 0.4)'
-                          : '0 3px 8px rgba(0, 0, 0, 0.15)';
+                          ? '0 2px 6px rgba(52, 152, 219, 0.3)'
+                          : '0 2px 4px rgba(0, 0, 0, 0.12)';
                         e.target.style.borderColor = isDarkMode ? '#3498db' : '#adb5bd';
                       }
                     }}
@@ -885,8 +874,8 @@ const ProjectTracker = () => {
                           : 'linear-gradient(135deg, #ffffff, #f8f9fa)';
                         e.target.style.transform = 'scale(1)';
                         e.target.style.boxShadow = isDarkMode
-                          ? '0 2px 8px rgba(52, 73, 94, 0.3)'
-                          : '0 1px 3px rgba(0, 0, 0, 0.1)';
+                          ? '0 1px 4px rgba(52, 73, 94, 0.2)'
+                          : '0 1px 2px rgba(0, 0, 0, 0.08)';
                         e.target.style.borderColor = isDarkMode ? 'rgba(52, 152, 219, 0.3)' : '#dee2e6';
                       }
                     }}