Standardize CSS with BEM and Remove Inline Styles from MUI Components

[saadanzari]

Description

To improve consistency, readability, and maintainability of the codebase, adopt the BEM (Block, Element, Modifier) methodology for CSS styling. Additionally, remove all inline styles from Material-UI (MUI) components and migrate them to external stylesheets or JSS following the BEM strategy.

Acceptance Criteria

• Identify and document the current styling strategy and occurrences of inline styles in MUI components.
• Refactor all CSS to follow the BEM methodology.
• Remove all inline styles from MUI components and replace them with external stylesheets or JSS implementations.
• Ensure all components maintain their current visual appearance after the changes.
• Provide guidelines/documentation for using the BEM methodology moving forward.
• Verify the application’s responsiveness and accessibility after refactoring.