/* ============================================================
   All Yours Hub — published locale UI
   English / 简体中文 / 日本語 / Français / Español
   URL 与页面语言一一对应
   ============================================================ */

/* 每个公开 URL 只输出一种正文语言；这里仅负责切换器本身。 */

/* ---------- 语言切换器 ---------- */
.ayh-lang-switch { position: relative; z-index: 10050; margin-left: 16px; font-size: 12px; }
.ayh-lang-btn {
  display: inline-flex; align-items: center; gap: 5px;
  min-height: 38px; padding: 5px 11px; border-radius: 999px; cursor: pointer;
  color: var(--text-300, #a1a1aa); background: transparent;
  border: 1px solid color-mix(in srgb, currentColor 22%, transparent);
  font: inherit; letter-spacing: .02em; line-height: 1.4;
  transition: color .15s, border-color .15s, background .15s;
}
.ayh-lang-btn:hover { color: var(--brand-400, #4d9fff); border-color: color-mix(in srgb, currentColor 45%, transparent); }
.ayh-lang-btn:focus-visible { outline: 2px solid var(--brand-400, #4d9fff); outline-offset: 3px; }
.ayh-lang-btn svg { width: 13px; height: 13px; }
.ayh-lang-total {
  display: inline-grid; place-items: center; min-width: 18px; height: 18px;
  border-radius: 999px; padding: 0 5px; font-size: 9px; font-weight: 700;
  color: var(--brand-300, #8bc4ff);
  background: color-mix(in srgb, var(--brand-500, #1684ff) 16%, transparent);
}
.ayh-lang-btn .ayh-lang-caret { transition: transform .2s; }
.ayh-lang-switch.ayh-open .ayh-lang-caret { transform: rotate(180deg); }
.ayh-lang-menu {
  position: absolute; top: calc(100% + 9px); right: 0; z-index: 10060;
  min-width: 178px; padding: 7px; border-radius: 14px;
  background: color-mix(in srgb, var(--background-900, #0b0d12) 92%, transparent);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border: 1px solid color-mix(in srgb, var(--text-50, #fff) 10%, transparent);
  box-shadow: 0 12px 40px rgba(0,0,0,.45);
  opacity: 0; transform: translateY(-6px) scale(.98); pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.ayh-lang-switch.ayh-open .ayh-lang-menu { opacity: 1; transform: none; pointer-events: auto; }
.ayh-lang-item {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; min-height: 38px; padding: 8px 11px; border: 0; border-radius: 9px; cursor: pointer;
  background: transparent; color: var(--text-300, #a1a1aa);
  font: inherit; text-align: left; transition: background .12s, color .12s;
}
.ayh-lang-item:hover { background: color-mix(in srgb, var(--text-50, #fff) 7%, transparent); color: var(--text-50, #fff); }
.ayh-lang-item:focus-visible { outline: 2px solid var(--brand-400, #4d9fff); outline-offset: -2px; }
.ayh-lang-item.ayh-active { color: var(--brand-400, #4d9fff); font-weight: 600; }
.ayh-lang-item .ayh-lang-native { font-size: 12px; }
.ayh-lang-item .ayh-lang-code { font-size: 10px; opacity: .55; letter-spacing: .06em; }

/* 无导航挂载点时的浮动切换器 */
.ayh-lang-floating { position: fixed; right: 18px; bottom: 18px; z-index: 9990; margin: 0; }
.ayh-lang-floating .ayh-lang-btn {
  background: color-mix(in srgb, var(--background-900, #0b0d12) 88%, transparent);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 6px 24px rgba(0,0,0,.35);
}
.ayh-lang-floating .ayh-lang-menu { top: auto; bottom: calc(100% + 8px); }