/* ============================================================
   唯璐 · 国际设计规范层 + 三语言切换器 UI (velu-intl.css)
   注入到所有站点, 在不破坏各站现有样式的前提下:
   1) 建立统一设计 token (8pt 网格 / 类型尺度 / 圆角 / 阴影 / 间距)
   2) 焦点可见 (WCAG 2.4.7) + 对比度增强 (AA)
   3) 统一字体栈 & 行高 & 触控目标 ≥44px
   4) 悬浮式三语言切换器
   青草绿品牌主色, 语义色保留。
   ============================================================ */

/* ---------- 1) 设计 token ---------- */
:root{
  --vl-brand:#3ba55d; --vl-brand-2:#5fbf7a; --vl-brand-soft:#8ad6a0;
  --vl-brand-deep:#1f6b3a; --vl-brand-ink:#0f3d24;
  /* 8pt 网格间距尺度 */
  --vl-sp-1:4px; --vl-sp-2:8px; --vl-sp-3:12px; --vl-sp-4:16px;
  --vl-sp-5:24px; --vl-sp-6:32px; --vl-sp-7:48px; --vl-sp-8:64px;
  /* 类型尺度 (1.25 倍率) */
  --vl-fs-xs:12px; --vl-fs-sm:14px; --vl-fs-base:16px; --vl-fs-md:20px;
  --vl-fs-lg:25px; --vl-fs-xl:31px; --vl-fs-2xl:39px; --vl-fs-3xl:49px;
  --vl-lh:1.6;
  /* 圆角 / 阴影 */
  --vl-r-sm:8px; --vl-r-md:12px; --vl-r-lg:16px;
  --vl-shadow-1:0 1px 2px rgba(16,40,28,.05),0 8px 20px -10px rgba(16,40,28,.14);
  --vl-shadow-2:0 10px 30px -12px rgba(16,40,28,.24);
  /* 字体栈 */
  --vl-font:"Inter","PingFang SC","Hiragino Sans","Microsoft YaHei","Noto Sans CJK SC",system-ui,-apple-system,"Segoe UI",sans-serif;
  --vl-touch:44px;
}

/* 统一正文可读性(仅提升, 不覆盖各站已定的字号体系) */
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

/* ---------- 2) 焦点可见 & 对比度 (WCAG AA) ---------- */
a,button,input,select,textarea,[tabindex]{
  outline:2px solid transparent; outline-offset:2px;
}
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--vl-brand-2,#5fbf7a);
  outline-offset:2px;
  border-radius:4px;
}
/* 正文对比度增强(浅底) */
body[data-velu-intl="1"] a{ color:inherit; }

/* 触控目标: 小按钮补足到 44px 命中区 */
button,a.btn,.btn,input[type=submit]{ min-height:var(--vl-touch); }

/* ---------- 3) 三语言切换器 UI (腾讯式: 头部内嵌水平分段 / 回退悬浮胶囊) ---------- */
#vl-i18n-switcher{
  font-family:var(--vl-font);
  display:inline-flex; align-items:center; gap:2px;
}
/* A) 内嵌于 header 动作区(.hd-act): 极简水平分段, 当前语言高亮 */
#vl-i18n-switcher.vl-i18n-inheader{
  background:rgba(59,165,93,.08);
  border:1px solid rgba(59,165,93,.24);
  border-radius:999px; padding:3px;
}
#vl-i18n-switcher.vl-i18n-inheader button{
  appearance:none; border:none; background:none; cursor:pointer;
  display:inline-flex; align-items:center;
  padding:7px 15px; min-height:34px; border-radius:999px;
  font-size:13px; font-weight:600; line-height:1;
  color:var(--vl-brand-deep,#1f6b3a);
  transition:background .15s,color .15s;
}
#vl-i18n-switcher.vl-i18n-inheader button:hover{background:rgba(59,165,93,.14)}
#vl-i18n-switcher.vl-i18n-inheader button.on{
  background:linear-gradient(140deg,#8ad6a0,#3ba55d); color:#fff;
  box-shadow:0 3px 10px -3px rgba(31,107,58,.55);
}
/* B) 无 header 时回退: 右上角悬浮胶囊(同样水平分段) */
#vl-i18n-switcher.vl-i18n-float{
  position:fixed; top:76px; right:16px; z-index:2147483000;
  background:#fff; border:1px solid rgba(59,165,93,.3);
  border-radius:999px; padding:4px; box-shadow:var(--vl-shadow-1);
}
#vl-i18n-switcher.vl-i18n-float button{
  appearance:none; border:none; background:none; cursor:pointer;
  display:inline-flex; align-items:center;
  padding:8px 15px; min-height:36px; border-radius:999px;
  font-size:13px; font-weight:600; color:var(--vl-brand-deep,#1f6b3a);
  transition:background .15s,color .15s;
}
#vl-i18n-switcher.vl-i18n-float button:hover{background:rgba(59,165,93,.12)}
#vl-i18n-switcher.vl-i18n-float button.on{
  background:linear-gradient(140deg,#8ad6a0,#3ba55d); color:#fff;
  box-shadow:0 3px 10px -3px rgba(31,107,58,.55);
}
/* 窄屏: 内嵌段随 header 折叠, 改作右下角悬浮胶囊, 保证移动端可切 */
@media (max-width:820px){
  #vl-i18n-switcher.vl-i18n-inheader{
    position:fixed; top:auto; right:14px; bottom:14px; z-index:2147483000;
    background:#fff; border:1px solid rgba(59,165,93,.3);
    box-shadow:var(--vl-shadow-2); padding:4px;
  }
  #vl-i18n-switcher.vl-i18n-inheader button{padding:9px 12px}
}

/* ---------- 4) 打印友好 ---------- */
@media print{ #vl-i18n-switcher{ display:none; } }