/* ============================================================
   疯牛网站 · 多语言样式（语言切换器 + 各语言字体/排版适配）
   ------------------------------------------------------------
   1) 语言切换器（header 右上角下拉 + 移动端侧边栏平铺两种形态）
   2) 字体栈：原主题的 Poppins/Prompt 并未实际加载，各语言统一改用系统字体栈，
      保证 英/俄/阿/日/韩 都有正确字形，不再靠浏览器兜底
   3) 排版：阿拉伯语取消字距、日韩放宽行高与断行规则
   4) 阿拉伯语镜像规则在 static/css/rtl.css（生成物），手写补充在 rtl-fixes.css
   ============================================================ */

/* ---------- 1. 语言切换器 ---------- */

.lang-switch {
   position: relative;
   display: inline-flex;
   align-items: center;
   font-size: 14px;
   line-height: 1;
   vertical-align: middle;
}

.lang-switch__toggle {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 7px 12px;
   border: 1px solid rgba(28, 28, 28, .15);
   border-radius: 999px;
   background: transparent;
   color: inherit;
   font: inherit;
   font-weight: 500;
   line-height: 1;
   cursor: pointer;
   transition: border-color .18s, color .18s, background-color .18s;
}

.lang-switch__toggle:hover,
.lang-switch .lang-switch__toggle:focus-visible {
   border-color: var(--clr-theme-1, #3887FE);
   color: var(--clr-theme-1, #3887FE);
   outline: none;
}

.lang-switch__toggle > .fa-globe {
   font-size: 13px;
   opacity: .9;
}

.lang-switch__caret {
   font-size: 11px;
   opacity: .65;
   transition: transform .2s ease;
}

.lang-switch.is-open .lang-switch__caret {
   transform: rotate(180deg);
}

.lang-switch__list {
   position: absolute;
   top: calc(100% + 8px);
   right: 0;
   z-index: 1200;
   min-width: 176px;
   margin: 0;
   padding: 6px;
   list-style: none;
   background: #fff;
   border-radius: 10px;
   box-shadow: 0 14px 36px rgba(0, 0, 0, .16);
   opacity: 0;
   visibility: hidden;
   transform: translateY(-6px);
   transition: opacity .18s ease, transform .18s ease, visibility .18s;
}

.lang-switch.is-open .lang-switch__list {
   opacity: 1;
   visibility: visible;
   transform: none;
}

.lang-switch__item {
   display: flex;
   align-items: center;
   gap: 9px;
   padding: 8px 10px;
   border-radius: 7px;
   color: var(--clr-common-heading, #1c1c1c);
   text-decoration: none;
   white-space: nowrap;
   transition: background-color .15s, color .15s;
}

.lang-switch__item:hover,
.lang-switch__item:focus-visible {
   background: #f3f6ff;
   color: var(--clr-theme-1, #3887FE);
   outline: none;
}

.lang-switch__item.is-active {
   background: #eef3ff;
   color: var(--clr-theme-1, #3887FE);
   font-weight: 600;
}

.lang-switch__code {
   display: inline-flex;
   justify-content: center;
   min-width: 26px;
   font-size: 12px;
   letter-spacing: .02em;
   opacity: .7;
}

.lang-switch__item.is-active .lang-switch__code {
   opacity: 1;
}

/* 移动端侧边栏内：不用下拉，平铺成标签，点一下就换语言 */
.lang-switch--block {
   display: block;
   width: 100%;
}

.lang-switch--block .lang-switch__toggle {
   display: none;
}

.lang-switch--block .lang-switch__list,
.lang-switch--block.is-open .lang-switch__list {
   position: static;
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
   min-width: 0;
   padding: 0;
   background: transparent;
   box-shadow: none;
   opacity: 1;
   visibility: visible;
   transform: none;
}

.lang-switch--block .lang-switch__item {
   padding: 7px 14px;
   border: 1px solid rgba(28, 28, 28, .14);
   border-radius: 999px;
}

.lang-switch--block .lang-switch__code {
   display: none;
}

/* 头部右侧容器：保证切换器与汉堡按钮同排不换行 */
.header__right {
   gap: 10px;
   flex-wrap: nowrap;
}

/* 中等宽度（导航栏仍然显示）与窄屏下，只留图标，避免挤压菜单 */
@media (min-width: 992px) and (max-width: 1279px) {
   .header__right .lang-switch__current {
      display: none;
   }
   .header__right .lang-switch__toggle {
      padding: 7px 10px;
   }
}

@media (max-width: 479px) {
   .header__right .lang-switch__current {
      display: none;
   }
   .header__right .lang-switch__toggle {
      padding: 7px 10px;
   }
}

/* ---------- 2. 各语言字体栈 ---------- */

html[lang="en"] {
   --bd-ff-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
   --bd-ff-heading: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

html[lang="ru"] {
   --bd-ff-body: system-ui, -apple-system, "Segoe UI", Roboto, "PT Sans", Arial, sans-serif;
   --bd-ff-heading: "Segoe UI", Roboto, "PT Sans", Arial, sans-serif;
}

html[lang="ar"] {
   --bd-ff-body: system-ui, -apple-system, "Segoe UI", "Noto Sans Arabic", "Noto Naskh Arabic", Tahoma, "Geeza Pro", sans-serif;
   --bd-ff-heading: "Segoe UI", "Noto Sans Arabic", "Noto Kufi Arabic", Tahoma, sans-serif;
}

html[lang="ja"] {
   --bd-ff-body: system-ui, -apple-system, "Yu Gothic UI", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;
   --bd-ff-heading: "Yu Gothic UI", "Yu Gothic", "Hiragino Kaku Gothic ProN", "Noto Sans JP", Meiryo, sans-serif;
}

html[lang="ko"] {
   --bd-ff-body: system-ui, -apple-system, "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR", Dotum, sans-serif;
   --bd-ff-heading: "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR", Dotum, sans-serif;
}

/* 主题里有个别组件写死了 font-family: Poppins（未加载），按语言改回变量 */
html[lang="en"] p,
html[lang="ru"] p,
html[lang="ar"] p,
html[lang="ja"] p,
html[lang="ko"] p {
   font-family: var(--bd-ff-body);
}

/* ---------- 3. 排版适配 ---------- */

/* 阿拉伯语：绝不能用字距（会造成字母断开），行高放宽 */
html[dir="rtl"] body,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] p,
html[dir="rtl"] a,
html[dir="rtl"] span,
html[dir="rtl"] li,
html[dir="rtl"] button {
   letter-spacing: normal !important;
}

html[dir="rtl"] body {
   line-height: 1.9;
}

html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3 {
   line-height: 1.55;
}

/* 日文：行高与禁则处理 */
html[lang="ja"] body {
   line-height: 1.85;
}

html[lang="ja"] h1,
html[lang="ja"] h2,
html[lang="ja"] h3 {
   line-height: 1.5;
}

html[lang="ja"] p,
html[lang="ja"] li {
   line-break: strict;
   overflow-wrap: break-word;
}

/* 韩文：按词断行 */
html[lang="ko"] body {
   line-height: 1.85;
}

html[lang="ko"] h1,
html[lang="ko"] h2,
html[lang="ko"] h3 {
   line-height: 1.5;
}

html[lang="ko"] p,
html[lang="ko"] li {
   word-break: keep-all;
   overflow-wrap: break-word;
}

/* 俄语：长单词不撑破卡片 */
html[lang="ru"] h1,
html[lang="ru"] h2,
html[lang="ru"] h3,
html[lang="ru"] p,
html[lang="ru"] li,
html[lang="ru"] a {
   overflow-wrap: break-word;
   hyphens: auto;
}

/* ============================================================
   外文站受众专属区块（留学生 / 维修同行 / 设备工艺 / 支付到店）
   ------------------------------------------------------------
   只出现在非中文页面（构建时注入 i18n/blocks/audience.<lang>.json 的文案）。
   全部使用逻辑属性（margin-inline / padding-inline / text-align:start），
   因此阿拉伯语 RTL 会自动镜像，不需要额外的 rtl.css 规则。
   ============================================================ */

.i18n-aud {
   padding-block: 64px;
   background: linear-gradient(180deg, #f7faff 0%, #ffffff 100%);
}

.i18n-aud__head {
   max-width: 820px;
   margin-block-end: 34px;
}

.i18n-aud__eyebrow {
   display: inline-block;
   margin-block-end: 10px;
   padding: 5px 12px;
   border-radius: 999px;
   background: #e8f0ff;
   color: #1a56db;
   font-size: 12px;
   font-weight: 600;
   letter-spacing: .04em;
}

html[dir="rtl"] .i18n-aud__eyebrow {
   letter-spacing: normal;
}

.i18n-aud__title {
   margin-block-end: 12px;
   font-size: 30px;
   line-height: 1.35;
   color: var(--clr-common-heading, #1c1c1c);
}

.i18n-aud__intro {
   margin: 0;
   font-size: 16px;
   line-height: 1.75;
   color: var(--clr-common-body-text, #4b4b4b);
}

.i18n-aud__grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
   gap: 20px;
}

.i18n-aud__card {
   padding: 22px 22px 20px;
   border: 1px solid #e6ecf5;
   border-radius: 12px;
   background: #fff;
   box-shadow: 0 6px 20px rgba(20, 40, 90, .05);
}

.i18n-aud__card-title {
   margin-block-end: 12px;
   font-size: 18px;
   line-height: 1.45;
   color: var(--clr-common-heading, #1c1c1c);
}

.i18n-aud__list {
   margin: 0;
   padding: 0;
   list-style: none;
}

.i18n-aud__list > li {
   position: relative;
   margin-block-end: 9px;
   padding-inline-start: 18px;
   font-size: 14.5px;
   line-height: 1.7;
   color: var(--clr-common-body-text, #4b4b4b);
}

.i18n-aud__list > li::before {
   content: "";
   position: absolute;
   inset-inline-start: 0;
   inset-block-start: 9px;
   width: 7px;
   height: 7px;
   border-radius: 50%;
   background: var(--clr-theme-1, #3887FE);
}

.i18n-aud__list > li:last-child {
   margin-block-end: 0;
}

.i18n-aud__note {
   margin-block-start: 12px;
   margin-block-end: 0;
   padding-block-start: 11px;
   border-block-start: 1px dashed #e0e8f3;
   font-size: 13.5px;
   line-height: 1.7;
   color: #6b7a90;
}

.i18n-aud__cta {
   margin-block: 26px 0;
   font-size: 15px;
   font-weight: 600;
   color: #1a56db;
}

html[dir="rtl"] .i18n-aud__list > li,
html[lang="ja"] .i18n-aud__list > li,
html[lang="ko"] .i18n-aud__list > li {
   line-height: 1.85;
}

@media (max-width: 767px) {
   .i18n-aud {
      padding-block: 40px;
   }
   .i18n-aud__title {
      font-size: 23px;
   }
   .i18n-aud__intro {
      font-size: 15px;
   }
}
html[lang="en"] h1, html[lang="en"] h2,
html[lang="ru"] h1, html[lang="ru"] h2,
html[lang="ar"] h1, html[lang="ar"] h2,
html[lang="ja"] h1, html[lang="ja"] h2,
html[lang="ko"] h1, html[lang="ko"] h2 {
   overflow-wrap: break-word;
}