refactor: integrate image carousel directly into main image area

[navaneeth0041]

Description

This PR refactors the image carousel functionality by integrating it directly into the main image area instead of displaying a separate carousel on thumbnail clicks. Users can now navigate through monument images directly in the main display area while maintaining thumbnail navigation capabilities. This simplifies the user flow and improves the overall experience when viewing monument photos.

Fixes #336

Type of change

• New feature (non-breaking change which adds functionality)
• Refactor (does not change functionality, e.g. code style improvements, linting)

How Has This Been Tested?

I've tested the refactored carousel on multiple devices with different screen sizes to ensure responsive behavior:

• Tested navigation through images using both the main area swipe and thumbnail clicks
• Verified that the selected thumbnail is properly highlighted when navigating through the main carousel
• Confirmed smooth transitions between images

WhatsApp.Video.2025-04-06.at.16.51.46.mp4

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules
• I have checked my code and corrected any misspellings

Maintainer Checklist

• closes Refactor Image Carousel to Improve Monument Photo Navigation #336
• Tag the PR with the appropriate labels

[navaneeth0041]

@AyaNady17 @mdmohsin7 Can u review this PR