## Problem
The mat-icon-button in the actions flow-type section had a shrinking
hover background. The hover effect was not displaying properly and
appeared constrained.
## Root Cause
The margin rules were being applied to all `span` elements, including
the Material button's internal elements (like `.mat-mdc-button-label`),
which interfered with the button's hover background positioning.
## Solution
- Changed the span selector from `span` to `> span` to target only
direct children
- Added specific margin reset for the button (`margin-right: 0`)
- Added margin reset for the icon inside the button
- This allows the Material button to use its default hover behavior
## Testing
- [x] No visual regressions in text spacing or layout
- [x] Button hover background now displays as a proper circle
- [x] Other buttons on the page remain unaffected
- [x] Matches the behavior of working buttons in trigger sections
## Type of Change
- [x] Bug fix (non-breaking change which fixes an UI issue)
Before :
<img width="427" height="411" alt="Screenshot 2025-07-15 at 6 08 35 PM"
src="https://github.com/user-attachments/assets/f728e1fa-6711-4e8b-ba24-2a84329f50d7"
/>
After fix :
<img width="406" height="404" alt="Screenshot 2025-07-15 at 6 09 36 PM"
src="https://github.com/user-attachments/assets/27d7b08d-684d-4094-8334-844a4e459025"
/>
Fixes hover background issue in actions flow-type section.
---------
Co-authored-by: Saurabh Thapliyal <[email protected]>
Co-authored-by: Marco A. <[email protected]>
