Add expo-asset dependency and update layout for safe area insets

- Included expo-asset in app.json and package.json for asset management.
- Refactored layout components in HomeScreen, TabIndex, Programs, and ServicesScreen to utilize safe area insets for better UI on different devices.
- Updated StatusBar style in RootLayoutNav for improved visibility.

app/(tabs)/programs.tsx

@@ -1,7 +1,8 @@
 import { useState } from 'react';
-import { StyleSheet, SafeAreaView, Text, View, TouchableOpacity, ScrollView } from 'react-native';
+import { StyleSheet, Text, View, TouchableOpacity, ScrollView } from 'react-native';
 import Colors from '@/constants/Colors';
 import { FontAwesome, FontAwesome5 } from '@expo/vector-icons';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 type Activity = {
   time: string;
@@ -18,6 +19,7 @@ type Activities = {
 export default function Programs() {
   const colorScheme = 'dark';
   const [activeDay, setActiveDay] = useState('Day 1');
+  const insets = useSafeAreaInsets();
 
   const activities: Activities = {
     'Day 1': [
@@ -54,7 +56,7 @@ export default function Programs() {
   };
 
   return (
-    <SafeAreaView style={[styles.container, { backgroundColor: Colors[colorScheme].background }]}>
+    <View style={[styles.container, { backgroundColor: Colors[colorScheme].background, paddingTop: insets.top }]}>
       <View style={styles.header}>
         <Text style={[styles.title, { color: Colors[colorScheme].text }]}>Umrah Pilgrimage</Text>
       </View>
@@ -95,7 +97,7 @@ export default function Programs() {
           </View>
         ))}
       </ScrollView>
-    </SafeAreaView>
+    </View>
   );
 }