==== What is the problem?
After voting on a wish written in an RTL language, the green success message you see has the close button on the right. This overlaps the content of the success message.
If your content language direction matches the language of the wish, this bug does not happen.
==== Steps to reproduce problem
# Login to https://meta.wikimedia.beta.wmcloud.org
# Go to https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/W20
# Click "Support wish", "Edit comment" or "Remove support" and submit
==== Environment
**Browser:** Firefox 140
**Wiki(s):** https://meta.wikimedia.beta.wmcloud.org CommunityRequests – (20369cc) 03:05, 16 October 2025.
==== Screenshots
{F66754120}
## **Derived Requirements**
The voting success message must correctly mirror its layout in RTL languages.
When a user votes on a wish written in an RTL language, the green success message must display the close button **on the left**, ensuring it does not overlap the text content.
The layout must respect the content language direction, regardless of the UI language direction.
## **Test Result - Beta|Prod**
**Status:** ✅ PASS / ❌ FAIL / ❓ NEED MORE INFO
**Environment:** meta.wikimedia.beta.wmcloud.org
**OS:** macOS Tahoe 26.1
**Browser:** Chrome 142
**Device:** MBA
**Emulated Device:** NA
**Test Artifact(s):**
====Test Steps
**Preconditions**
* User is logged into `https://meta.wikimedia.beta.wmcloud.org`.
* The wish being tested is written in an RTL language (e.g., Hebrew, Arabic).
* UI is in a language that *does not* match the wish language direction to trigger the scenario (e.g., UI in English, wish in Hebrew).
* Using Minerva skin unless specified otherwise.
**Test Case 1: Verify Close Button Position in RTL Success Message**
1. Navigate to `https://meta.wikimedia.beta.wmcloud.org/wiki/Community_Wishlist/W20`.
2. Select a wish written in an RTL language.
3. Click **Support wish**, **Edit comment**, or **Remove support**, then submit.
4. Observe the green voting success message.
5. Review the layout of the close button.
6. 🟩❓❌⬜ **AC1:** Confirm the close button appears on the **left** side in RTL contexts.
7. 🟩❓❌⬜ **AC2:** Confirm the close button does **not overlap** any of the success message text.
8. 🟩❓❌⬜ **AC3:** Confirm spacing and padding match RTL expectations.
**Test Case 2: Verify Correct Behavior When UI Direction Matches Wish Language Direction**
1. Change your content language to match the wish language direction (e.g., switch UI language to Hebrew).
2. Navigate again to the RTL wish page.
3. Trigger a voting action (Support, Edit comment, or Remove support).
4. Observe the green success message.
5. 🟩❓❌⬜ **AC4:** Confirm that in this matching-direction scenario, the close button appears in the correct mirrored position for the language.
6. 🟩❓❌⬜ **AC5:** Confirm no overlapping or layout distortion occurs.
**Test Case 3: Verify Log Output and No UI Errors**
1. Perform multiple voting actions on RTL wishes.
2. Open browser console.
3. Check for UI warnings or errors related to message rendering.
4. 🟩❓❌⬜ **AC6:** Confirm no console errors are generated during message rendering.
5. 🟩❓❌⬜ **AC7:** Confirm the interface remains stable and accessible after repeated success messages.