阿拉伯语站切 RTL 后导航和价格全错位怎么修

现象#

在 html 上加 dir=rtl 后，阿拉伯语站导航跑到右侧但下拉面板飞出屏幕，价格与数字顺序颠倒，购物车数量徽标压在文字上。

原因#

• 主题样式大量使用 margin-left、padding-left 等物理属性，不随方向翻转
• dir 只加在 body 上，html 仍是 ltr，表单控件与滚动条方向不一致
• 价格、SKU 等拉丁字符与阿拉伯文混排时没有做方向隔离
• ar.json 缺失或未发布，界面文字回退英文却已经套用了 RTL 布局

处理步骤#

1. 把方向写在根节点：<html dir="{{ settings.text_direction }}">
2. 把 margin-left 换成 margin-inline-start，left 换成 inset-inline-start
3. 价格容器加 direction: ltr; unicode-bidi: isolate，避免符号与数字换位
4. 确认 locales/ar.json 存在，并在 Settings > Languages 发布、分配到市场
5. 只针对 header、cart、表格三块补 RTL 覆盖样式，别整站重写

验收标准#

切阿拉伯语后 logo 在右、下拉面板完整可见、价格数字顺序正确，页面没有横向滚动条。