🐛 Bug: Low Contrast on Arrows in "Go Back" and "Up Next" Buttons in Dark mode and responsiveness issue

[Karan-Palan]

Describe the bug

1. The arrows in the "Go Back" and "Up Next" buttons have insufficient contrast in the Dark mode, making them difficult to read against the button background. This affects usability and does not meet WCAG guidelines for accessibility.
2. Inconsistent vertical stacking and alignment of text and arrows in 'Go Back' and 'Up Next' buttons across all screen sizes.

Steps To Reproduce

1. Navigate to any page with "Go Back" and "Up Next" buttons
2. Observe the color contrast of the arrows in the navigation buttons.
3. Compare the arrow color with the background to verify readability issues.
4. Halve the tab, check the text alignment in arrow buttons

Expected Behavior

1. The arrow color should contrast clearly with the button background to ensure readability. It should meet WCAG contrast standards and be visible under normal viewing conditions.
2. Ensure consistent vertical stacking and alignment of text and arrows in 'Go Back' and 'Up Next' buttons across all screen sizes.

Screenshots

1. The color of the arrows
   

2. Responsiveness of text when the tab is full vs when the tab is halved
   Full tab:
   
   Half tab:
   

Device Information [optional]

- OS:Ubuntu 24
- Browser:Firefox
- version:LTS

Are you working on this issue?

Yes

Do you think this work might require an [Architectural Decision Record (ADR)]? (significant or noteworthy)

No

[palakm-26]

hey @Karan-Palan ,i wound like to contribute on this issue.

[Karan-Palan]

Hello @palakm-26, I'm just a contributor here. Seems you are new, please check Contributing and Triage process.
I have mentioned in the issue that I'd work on it and have made the relevant changes locally, however I wouldn't mind you taking this up, and since this is a small change,it'd would help you get started. Wait for the maintainers to accept the issue if valid, and they'll assign you this after reading this comment