/* ---- Selector de idioma (ES | EN) ----
   Cápsula con dos opciones; la actual va rellena. «EN» abre la página
   traducida por Google: ver js/language-switch.js. */
.language-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-pill);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1;
}
.language-switch__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 36px;            /* con el marco, la cápsula llega a los 44 px táctiles */
  padding: 0 8px;
  border-radius: var(--radius-pill);
  color: var(--color-text-body);
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
.language-switch__item:hover {
  background: var(--color-surface-tint);
  text-decoration: none;
}
/* Idioma actual: verde de texto sobre blanco (5,2:1, pasa AA). */
.language-switch__item[aria-current="true"],
.language-switch__item[aria-current="true"]:hover {
  background: var(--color-brand-green-text);
  color: #fff;
}

/* En un teléfono estrecho la cabecera ya lleva el logo, la cuenta, la
   cotización y el menú: la cápsula se aprieta para que nada se desborde. */
@media (max-width: 400px) {
  .language-switch__item { min-width: 30px; padding: 0 5px; }
}
@media (max-width: 350px) {
  .language-switch__item { min-width: 28px; padding: 0 4px; }
}