/* Site-wide language switcher (Elementor header + shortcode) */

.tk-lang-switcher-wrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
}

.elementor-location-header .tk-lang-switcher-wrap {
  min-height: 2rem;
}

.tk-lang-switcher {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.15rem;
  border-radius: var(--tk-radius-sm);
  border: 1px solid var(--tk-border);
  background: color-mix(in srgb, var(--tk-surface-elevated) 88%, transparent);
}

.tk-lang-switcher__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  padding: 0.28rem 0.45rem;
  border-radius: calc(var(--tk-radius-sm) - 2px);
  font-family: var(--tk-font-body);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--tk-text);
  line-height: 1;
  transition: color 0.15s ease, background-color 0.15s ease;
}

.tk-lang-switcher__btn:not(.is-active) {
  color: color-mix(in srgb, var(--tk-text) 72%, var(--tk-muted));
}

.tk-lang-switcher__btn:hover,
.tk-lang-switcher__btn:focus-visible {
  color: var(--tk-text);
  text-decoration: none;
}

.tk-lang-switcher__btn.is-active {
  color: var(--tk-bg);
  background: var(--tk-accent);
}

/* Elementor / theme link colors must not override switcher tokens */
.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn {
  text-decoration: none;
}

.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active),
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active),
.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):visited,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):visited {
  color: color-mix(in srgb, var(--tk-text) 72%, var(--tk-muted));
}

.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):hover,
.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):focus,
.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):focus-visible,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):hover,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):focus,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn:not(.is-active):focus-visible {
  color: var(--tk-text);
  text-decoration: none;
}

.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn.is-active,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn.is-active,
.elementor-location-header .tk-lang-switcher a.tk-lang-switcher__btn.is-active:hover,
.elementor .elementor-widget-shortcode .tk-lang-switcher a.tk-lang-switcher__btn.is-active:hover {
  color: var(--tk-bg);
  background: var(--tk-accent);
}

@media (max-width: 640px) {
  .tk-lang-switcher {
    transform: scale(0.95);
    transform-origin: center right;
  }
}