BMP Web App

Replace all current background images with a custom gradient across the application, strictly following the Figma designs. The gradient should be applied to all popups, modals, and sections where background images are currently used. Ensure consistency with the Figma design system and maintain responsiveness.

Objective

Replace background images with the custom gradient exactly as per Figma
Apply gradient in all popups, modals, and relevant UI sections
Maintain responsive behavior and design consistency

Scope

Identify all UI components using background images
Replace each with the gradient as shown in Figma
Ensure visual consistency and proper contrast for text/elements
Maintain exact styling, positioning, and sizing as per Figma

Out of Scope

Backend changes or API updates
Redesign of layout or structural changes
Animations or other visual effects not related to gradient

Acceptance Criteria

All previous background images replaced with the Figma gradient
Gradient applied correctly in all popups and relevant UI sections
Text and UI elements remain legible and visually clear
Fully responsive across all screen sizes
Matches Figma design pixel-to-pixel
Tested in all major browsers