/* Scoped custom properties to avoid bleeding into the global theme. */
.c-lang {
  --brand: var(--header-accent);
  --text: var(--header-text);
  --muted: var(--header-secondary-text);
  --border: var(--header-border);
  --bg: transparent;
}

.c-lang {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--header-border);
  border-radius: 999px;
  padding: 3px;
  overflow: visible;
  background: var(--bg);
  z-index: 1000;
  margin-left: auto;
}

.c-lang__btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-family: var(--font-label);
  font-weight: 700;
  color: var(--text);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 999px;
  line-height: 1;
  min-height: 38px;
  min-width: 54px;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease, transform .16s ease;
  z-index: 1;
}

.c-lang__btn--md { padding: 0.75rem 1.05rem; font-size: var(--type-sm); }
.c-lang__btn--sm { padding: 0.62rem 0.9rem; font-size: var(--type-sm); }

.c-lang__btn + .c-lang__btn {
  margin-left: -0.35rem;
}

.c-lang__btn:hover {
  color: var(--header-text);
  background: color-mix(in srgb, var(--header-selected-surface) 24%, transparent);
  border-color: color-mix(in srgb, var(--header-border) 70%, var(--header-text));
  z-index: 2;
}

.c-lang__btn:focus-visible {
  outline: 2px solid var(--header-accent);
  outline-offset: 3px;
  z-index: 4;
}

.c-lang__btn.is-active {
  color: var(--header-text);
  background: color-mix(in srgb, var(--header-selected-surface) 88%, var(--header-text));
  border-color: color-mix(in srgb, var(--header-selected-surface) 76%, var(--header-text));
  box-shadow: 0 8px 18px color-mix(in srgb, var(--header-bg) 50%, transparent);
  transform: translateY(-1px);
  z-index: 3;
}

.c-lang__btn.is-active:hover {
  background: color-mix(in srgb, var(--header-selected-surface) 78%, var(--header-text));
  border-color: color-mix(in srgb, var(--header-selected-surface) 60%, var(--header-text));
}

.c-lang__label { letter-spacing: 0; }
