اريد تغيير هذا التصميم الى شكل اكثر اناقة
 void _showSavedNumbersSelection() async {
    final hasPermission = await _requestPermissions();
    if (!hasPermission) return;

    final contacts = await FlutterContacts.getContacts(
      withProperties: true,
      withThumbnail: true,
    );
    List<String> selectedNumbers = List.from(_savedNumbers);

    TextEditingController searchController = TextEditingController();
    String searchQuery = '';

    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      builder: (context) {
        return StatefulBuilder(
          builder: (context, setModal) {
            final filteredContacts =
                searchQuery.isEmpty
                    ? contacts
                    : contacts.where((contact) {
                      final contactNameLower =
                          contact.displayName.toLowerCase();
                      final queryLower = searchQuery.toLowerCase();

                      final phonesMatch = contact.phones.any(
                        (phone) =>
                            phone.number.toLowerCase().contains(queryLower),
                      );

                      return contactNameLower.contains(queryLower) ||
                          phonesMatch;
                    }).toList();

            return Container(
              height: MediaQuery.of(context).size.height * 0.85,
              padding: EdgeInsets.only(
                bottom: MediaQuery.of(context).viewInsets.bottom,
              ),
              child: Column(
                children: [
                  Padding(
                    padding: const EdgeInsets.symmetric(
                      horizontal: 16,
                      vertical: 12,
                    ),
                    child: Row(
                      children: [
                        Expanded(
                          child: TextField(
                            controller: searchController,
                            decoration: InputDecoration(
                              prefixIcon: const Icon(Icons.search),
                              hintText: 'ابحث في جهات الاتصال أو الأرقام',
                              isDense: true,
                            ),
                            onChanged: (value) {
                              setModal(() {
                                searchQuery = value.trim();
                              });
                            },
                          ),
                        ),
                        const SizedBox(width: 8),
                        IconButton(
                          icon: const Icon(Icons.close_rounded),
                          onPressed: () => Navigator.pop(context),
                          tooltip: 'إغلاق',
                        ),
                      ],
                    ),
                  ),
                  const Divider(height: 1),
                  Expanded(
                    child:
                        filteredContacts.isEmpty
                            ? Center(
                              child: Text(
                                'لا توجد جهات اتصال تطابق البحث',
                                style: Theme.of(
                                  context,
                                ).textTheme.bodyMedium?.copyWith(
                                  fontFamily: tajawalFont,
                                  color:
                                      Theme.of(
                                        context,
                                      ).colorScheme.onSurfaceVariant,
                                ),
                              ),
                            )
                            : ListView.builder(
                              keyboardDismissBehavior:
                                  ScrollViewKeyboardDismissBehavior.onDrag,
                              physics: const BouncingScrollPhysics(),
                              itemCount: filteredContacts.length,
                              itemBuilder: (context, index) {
                                final contact = filteredContacts[index];
                                final phones = contact.phones;

                                return Card(
                                  margin: const EdgeInsets.symmetric(
                                    horizontal: 12,
                                    vertical: 6,
                                  ),
                                  child: Padding(
                                    padding: const EdgeInsets.symmetric(
                                      vertical: 8,
                                      horizontal: 12,
                                    ),
                                    child: Column(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      children: [
                                        ListTile(
                                          contentPadding: EdgeInsets.zero,
                                          leading: CircleAvatar(
                                            radius: 24,
                                            backgroundImage:
                                                (contact.thumbnail != null &&
                                                        contact
                                                            .thumbnail!
                                                            .isNotEmpty)
                                                    ? MemoryImage(
                                                      contact.thumbnail!,
                                                    )
                                                    : null,
                                            child:
                                                (contact.thumbnail == null ||
                                                        contact
                                                            .thumbnail!
                                                            .isEmpty)
                                                    ? Text(
                                                      contact.initials(),
                                                      style: const TextStyle(
                                                        fontFamily: tajawalFont,
                                                        fontWeight:
                                                            FontWeight.bold,
                                                        color: Colors.white,
                                                        fontSize: 18,
                                                      ),
                                                    )
                                                    : null,
                                            backgroundColor:
                                                Theme.of(
                                                  context,
                                                ).colorScheme.primary,
                                          ),
                                          title: Text(
                                            contact.displayName,
                                            style: const TextStyle(
                                              fontFamily: tajawalFont,
                                              fontSize: 16,
                                              fontWeight: FontWeight.w600,
                                            ),
                                            maxLines: 1,
                                            overflow: TextOverflow.ellipsis,
                                          ),
                                        ),
                                        const SizedBox(height: 4),
                                        Column(
                                          children:
                                              phones.map((phone) {
                                                final normalized = phone.number
                                                    .replaceAll(
                                                      RegExp(r'[^\d+]'),
                                                      '',
                                                    );
                                                final isSelected =
                                                    selectedNumbers.any((num) {
                                                      final n = num.replaceAll(
                                                        RegExp(r'[^\d+]'),
                                                        '',
                                                      );
                                                      return n == normalized;
                                                    });

                                                return CheckboxListTile(
                                                  contentPadding:
                                                      EdgeInsets.zero,
                                                  value: isSelected,
                                                  title: Text(
                                                    phone.number,
                                                    style: const TextStyle(
                                                      fontFamily: tajawalFont,
                                                      fontSize: 14,
                                                      fontWeight:
                                                          FontWeight.w500,
                                                    ),
                                                  ),
                                                  controlAffinity:
                                                      ListTileControlAffinity
                                                          .leading,
                                                  onChanged: (val) {
                                                    setModal(() {
                                                      if (val == true) {
                                                        if (!selectedNumbers.any(
                                                          (num) {
                                                            final n =
                                                                num.replaceAll(
                                                                  RegExp(
                                                                    r'[^\d+]',
                                                                  ),
                                                                  '',
                                                                );
                                                            return n ==
                                                                normalized;
                                                          },
                                                        )) {
                                                          selectedNumbers.add(
                                                            phone.number,
                                                          );
                                                        }
                                                      } else {
                                                        selectedNumbers
                                                            .removeWhere((num) {
                                                              final n =
                                                                  num.replaceAll(
                                                                    RegExp(
                                                                      r'[^\d+]',
                                                                    ),
                                                                    '',
                                                                  );
                                                              return n ==
                                                                  normalized;
                                                            });
                                                      }
                                                    });
                                                  },
                                                );
                                              }).toList(),
                                        ),
                                      ],
                                    ),
                                  ),
                                );
                              },
                            ),
                  ),
                  Padding(
                    padding: const EdgeInsets.all(16),
                    child: Row(
                      children: [
                        Expanded(
                          child: OutlinedButton(
                            onPressed: () => Navigator.pop(context),
                            child: const Text(
                              'إلغاء',
                              style: TextStyle(fontFamily: tajawalFont),
                            ),
                          ),
                        ),
                        const SizedBox(width: 12),
                        Expanded(
                          child: FilledButton(
                            onPressed: () async {
                              _savedNumbers = List.from(selectedNumbers);
                              await _saveSavedNumbers();
                              Navigator.pop(context);
                              _showSnackBar('تم حفظ الأرقام المختارة');
                              if (mounted) setState(() {});
                            },
                            child: const Text(
                              'حفظ',
                              style: TextStyle(fontFamily: tajawalFont),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            );
          },
        );
      },
    );
  }