/* ============================================================
   汇食科技 · 官网多语言切换器  i18n.css
   与 site.css / 各页内联样式解耦：不依赖任何页面变量，
   用 currentColor + 半透明灰底，自动适配浅色/深色导航。
   ============================================================ */

.hs-lang{
  position:relative;
  display:flex;
  align-items:center;
  flex:none;
  margin-left:4px;
  z-index:1001;
}
.nav:not(.dark) .hs-lang{color:var(--text, currentColor)}
.nav.dark .hs-lang{color:var(--text-inv, currentColor)}

.hs-lang-btn{
  display:inline-flex;
  align-items:center;
  gap:5px;
  height:26px;
  padding:0 9px;
  border:0;
  border-radius:100px;
  background:rgba(127,127,127,.12);
  color:inherit;
  font:inherit;
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.02em;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
  opacity:.85;
  transition:background .2s var(--ease, ease), opacity .2s var(--ease, ease);
}
.hs-lang-btn:hover,
.hs-lang.open .hs-lang-btn{opacity:1;background:rgba(127,127,127,.2)}

.hs-lang-globe{
  width:11px;
  height:11px;
  border:1.3px solid currentColor;
  border-radius:50%;
  position:relative;
  display:block;
  opacity:.8;
  flex:none;
}
.hs-lang-globe::before,
.hs-lang-globe::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
.hs-lang-globe::before{width:100%;height:1.2px;background:currentColor}
.hs-lang-globe::after{width:5px;height:100%;border:1.1px solid currentColor;border-radius:50%;background:transparent}

.hs-caret{
  width:6px;
  height:6px;
  border-right:1.4px solid currentColor;
  border-bottom:1.4px solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);
  display:inline-block;
  opacity:.65;
  transition:transform .2s var(--ease, ease);
}
.hs-lang.open .hs-caret{transform:rotate(-135deg) translate(-1px,-1px)}

.hs-lang-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:178px;
  margin:0;
  padding:6px;
  list-style:none;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:14px;
  box-shadow:0 12px 34px rgba(0,0,0,.18);
  display:none;
  z-index:1002;
}
.hs-lang.open .hs-lang-menu{display:block}
.hs-lang-menu li{margin:0;padding:0}

.hs-lang-menu a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:8px 10px;
  border-radius:9px;
  color:#1d1d1f;
  text-decoration:none;
  font-size:12.5px;
  font-weight:500;
  line-height:1.25;
  white-space:nowrap;
  transition:background .15s ease;
}
.hs-lang-menu a:hover{background:#f2f2f4}
.hs-lang-menu a.on{background:#edf5f1;font-weight:600}
.hs-lang-menu a.on::after{content:"✓";font-size:11px;opacity:.7}

@media(max-width:480px){
  .hs-lang-menu{right:-6px}
  .hs-lang-btn{padding:0 7px}
}

/* ============================================================
   多语言长文案适配
   英文/越南语/泰语的数字与标签比中文长很多，移动端统计卡
   （.stats/.stat）在 2 列布局下会撑破视口，这里做收缩与换行兜底。
   仅对非中文页面生效，中文版视觉保持不变。
   ============================================================ */
html:not([lang="zh-CN"]) .stats > .stat{min-width:0}

html:not([lang="zh-CN"]) .stat .num{overflow-wrap:anywhere;line-height:1.12}

@media(max-width:720px){
  html:not([lang="zh-CN"]) .stat .num{font-size:clamp(22px,7.2vw,40px)}
  html:not([lang="zh-CN"]) .stat{padding:26px 14px}
}

/* 通用兜底：非中文的超长单词/URL 不撑破容器 */
html:not([lang="zh-CN"]) .wrap{overflow-wrap:break-word}
html:not([lang="zh-CN"]) .grid > *,
html:not([lang="zh-CN"]) .tgrid > *,
html:not([lang="zh-CN"]) .card{min-width:0}

/* 规格小卡：部分页面用内联 repeat(3,1fr)，多语言长文案在手机端会溢出 */
.specs > .spec{min-width:0}
.spec .v,.spec .k{overflow-wrap:anywhere}
@media(max-width:720px){.specs{grid-template-columns:repeat(2,1fr)!important}}

/* 非中文：表格在窄屏用固定布局 + 单元格换行，避免长译文撑破 */
@media(max-width:720px){
  html:not([lang="zh-CN"]) .tbl{table-layout:fixed}
  html:not([lang="zh-CN"]) .tbl th,
  html:not([lang="zh-CN"]) .tbl td{padding:12px 10px;font-size:13px;overflow-wrap:anywhere}
}

/* 老挝语字体回退：Lao 字符在部分系统默认字体里缺失，显式挂一串 Lao 字体 */
html[lang="lo"] body{
  font-family:"Lao Sangam MN","Phetsarath OT","Noto Sans Lao","DokChampa",
    "Leelawadee UI",-apple-system,BlinkMacSystemFont,"SF Pro Display",
    "PingFang SC","Microsoft YaHei",sans-serif;
}