/*!
 * HuoCMS RTL 基础镜像样式
 * 当站点语言属于 config('system.rtl_lang')（如 ar/fa/he/ur）时，
 * 由前台渲染层（hcInjectLangDir）自动在 </head> 前挂载本文件。
 * 目标：让面向 LTR 设计的主题在 RTL 语言下获得“够用”的从右到左排版基线；
 * 主题可在自己的 [dir="rtl"] 样式中做像素级精修覆盖本文件。
 */

/* ---------- 1. 全局方向与文字对齐 ---------- */
html[dir="rtl"],
html[dir="rtl"] body {
    direction: rtl;
    text-align: right;
    /* 阿拉伯语/波斯语友好字体栈：尽量覆盖 Windows/Mac/iOS/Android/Linux 自带阿语字体，最后回退无衬线。
       如需保证缺字字体客户端的一致显示，可在主题内自行 @font-face 引入自托管 web 字体（如 Noto Naskh Arabic）。 */
    font-family: "Noto Naskh Arabic", "Noto Sans Arabic", "Segoe UI", Tahoma,
        "Geeza Pro", "Damascus", "Dubai", "Traditional Arabic", "Simplified Arabic",
        "Arabic Typesetting", "Amiri", "Arial Unicode MS", sans-serif;
}

html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] button {
    text-align: right;
    direction: rtl;
}

/* 电话/邮箱/数字/URL 等输入保持 LTR，避免阿拉伯语环境下光标与数字方向错乱 */
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[type="url"] {
    direction: ltr;
    text-align: left;
}

/* 强制保持 LTR 的内容（电话、邮箱、URL、代码、纯数字） */
html[dir="rtl"] [dir="ltr"],
html[dir="rtl"] .ltr,
html[dir="rtl"] .keep-ltr,
html[dir="rtl"] code,
html[dir="rtl"] pre,
html[dir="rtl"] .text-ltr,
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] a[href^="mailto:"] {
    direction: ltr;
    unicode-bidi: embed;
    text-align: left;
}

/* ---------- 2. 浮动镜像（覆盖常见栅格/工具类） ---------- */
html[dir="rtl"] .fl,
html[dir="rtl"] .pull-left,
html[dir="rtl"] .float-left,
html[dir="rtl"] .layui-layout-left,
html[dir="rtl"] [class*="left"]:not([class*="right"]).float {
    float: right !important;
}

html[dir="rtl"] .fr,
html[dir="rtl"] .pull-right,
html[dir="rtl"] .float-right,
html[dir="rtl"] .layui-layout-right {
    float: left !important;
}

/* ---------- 3. 列表与导航 ---------- */
html[dir="rtl"] ul,
html[dir="rtl"] ol,
html[dir="rtl"] dl,
html[dir="rtl"] menu {
    padding-right: 0;
}

html[dir="rtl"] li {
    text-align: right;
}

/* 横向菜单：把基于 float:left 的菜单项翻向右侧 */
html[dir="rtl"] .nav > li,
html[dir="rtl"] .navList .nav > li,
html[dir="rtl"] .menu > li,
html[dir="rtl"] ul.nav li {
    float: right;
}

/* ---------- 4. 通用方向工具类（与 Bootstrap/常见命名兼容） ---------- */
html[dir="rtl"] .text-left   { text-align: right !important; }
html[dir="rtl"] .text-right  { text-align: left  !important; }
html[dir="rtl"] .ml-auto,
html[dir="rtl"] .me-auto     { margin-right: auto !important; margin-left: 0 !important; }
html[dir="rtl"] .mr-auto,
html[dir="rtl"] .ms-auto     { margin-left: auto !important; margin-right: 0 !important; }

/* ---------- 5. 表格 ---------- */
html[dir="rtl"] table { direction: rtl; }
html[dir="rtl"] th,
html[dir="rtl"] td { text-align: right; }

/* ---------- 6. 表单与图标常见间距镜像 ---------- */
html[dir="rtl"] .input-group > .input-group-prepend { order: 2; }
html[dir="rtl"] .input-group > .input-group-append  { order: 0; }

/* ---------- 7. Swiper / 轮播 ---------- */
/* Swiper 需配合 JS 传入 dir:'rtl'，此处仅保证容器方向正确 */
html[dir="rtl"] .swiper,
html[dir="rtl"] .swiper-container {
    direction: rtl;
}
html[dir="rtl"] .swiper-button-prev { right: 10px; left: auto; }
html[dir="rtl"] .swiper-button-next { left: 10px; right: auto; }

/* ---------- 8. 面包屑分隔符方向 ---------- */
html[dir="rtl"] .breadcrumb { direction: rtl; }
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    transform: scaleX(-1);
    display: inline-block;
}

/* ---------- 9. 图片懒加载占位不受影响（保持原位） ---------- */
html[dir="rtl"] img { /* 图片自身不翻转，仅排版方向变化 */ }

/* ---------- 10. 滚动条与定位辅助 ---------- */
html[dir="rtl"] .fixed-right { right: auto; left: 0; }
html[dir="rtl"] .fixed-left  { left: auto; right: 0; }