feat: update app configuration and enhance UI components

components/RangePickerModal.tsx

@@ -1,10 +1,10 @@
 import React, { useState } from 'react';
-import { Alert, Modal, Text, TouchableOpacity, View } from 'react-native';
-import DateTimePicker, { DateType, useDefaultStyles } from 'react-native-ui-datepicker';
+import { Modal, Text, TouchableOpacity, View } from 'react-native';
+import { DateType } from 'react-native-ui-datepicker';
 import { Check, X } from 'lucide-react-native';
+import { AppDatePicker } from './AppDatePicker';
 
 export const RangePickerModal = ({ visible, onClose, onApply }: any) => {
-    const defaultStyles = useDefaultStyles('light');
     const [range, setRange] = useState<{
         startDate: DateType;
         endDate: DateType;
@@ -32,17 +32,12 @@ export const RangePickerModal = ({ visible, onClose, onApply }: any) => {
                         </TouchableOpacity>
                     </View>
 
-                    <DateTimePicker
+                    <AppDatePicker
                         mode="range"
                         startDate={range.startDate}
                         endDate={range.endDate}
                         onChange={(params) => setRange(params)}
                         timeZone='Europe/Rome'
-                        locale='it'
-                        styles={{
-                            ...defaultStyles,
-                            selected: { backgroundColor: '#099499' }
-                        }}
                     />
 
                     <TouchableOpacity