/* ------------------------------------------------*/
/* Locale Switcher - Logic Grid Studio             */
/* Shared top-bar action styles for all locales    */
/* ------------------------------------------------*/
:root {
  --lgs-header-action-height: 4.6rem;
  --lgs-header-action-radius: 2.3rem;
  --lgs-header-action-padding: 1rem;
  --lgs-header-action-gap: 0.55rem;
  --lgs-header-action-font-size: 1.2rem;
  --lgs-header-action-icon-size: 1.45rem;
  --lgs-header-action-border-width: 0.15rem;
}

@media only screen and (min-width: 768px) {
  :root {
    --lgs-header-action-height: 5.6rem;
    --lgs-header-action-radius: 2.8rem;
    --lgs-header-action-padding: 1.5rem;
    --lgs-header-action-gap: 0.75rem;
    --lgs-header-action-font-size: 1.25rem;
    --lgs-header-action-icon-size: 1.6rem;
  }
}

.mxd-header {
  align-items: center;
}

.mxd-header__controls {
  align-items: center;
  gap: 0.8rem;
}

.mxd-header__controls > * {
  flex-shrink: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-header__controls {
    gap: 1rem;
  }
}

.lgs-locale-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-right: 0;
  z-index: 100;
}

.lgs-locale-switcher__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--lgs-header-action-height);
  gap: var(--lgs-header-action-gap);
  padding: 0 var(--lgs-header-action-padding);
  border: var(--lgs-header-action-border-width) solid var(--st-bright, #161616);
  border-radius: var(--lgs-header-action-radius);
  background: transparent;
  color: var(--t-bright, #161616);
  font: normal var(--fw-medium, 600) var(--lgs-header-action-font-size)/1 var(--_font-default, "Funnel Sans", sans-serif);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    transform var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    border-color var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    background-color var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    box-shadow var(--_animspeed-medium, 0.3s) var(--_animbezier, ease);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  -webkit-tap-highlight-color: transparent;
}

.lgs-locale-switcher__toggle:hover,
.lgs-locale-switcher__toggle[aria-expanded="true"] {
  border-color: var(--accent, #9f8be7);
  background: rgba(var(--accent-rgb, 159, 139, 231), 0.08);
  box-shadow: 0 1rem 2.4rem rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

.lgs-locale-switcher__toggle:focus-visible,
.mxd-nav__hamburger:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 0.4rem rgba(var(--accent-rgb, 159, 139, 231), 0.16);
}

.lgs-locale-switcher__icon {
  width: var(--lgs-header-action-icon-size);
  height: var(--lgs-header-action-icon-size);
  flex-shrink: 0;
}

.lgs-locale-switcher__label {
  display: inline-flex;
  align-items: center;
  font-weight: var(--fw-medium, 600);
}

.lgs-locale-switcher__dropdown {
  position: absolute;
  top: calc(100% + 0.8rem);
  right: 0;
  min-width: 17rem;
  padding: 0.6rem;
  background: rgba(var(--base-rgb, 250, 247, 246), 0.98);
  border: var(--lgs-header-action-border-width) solid var(--st-bright, #161616);
  border-radius: 2rem;
  box-shadow: 0 1.6rem 3.6rem rgba(0, 0, 0, 0.14);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-0.6rem);
  transition:
    opacity var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    visibility var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    transform var(--_animspeed-medium, 0.3s) var(--_animbezier, ease);
  pointer-events: none;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.lgs-locale-switcher__dropdown--open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.lgs-locale-switcher__item {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.95rem 1.1rem;
  border-radius: 1.2rem;
  font: normal var(--fw-regular, 400) 1.4rem/1.2 var(--_font-default, "Funnel Sans", sans-serif);
  color: var(--t-medium, #303030);
  text-decoration: none;
  transition:
    transform var(--_animspeed-fast, 0.1s) ease,
    background-color var(--_animspeed-fast, 0.1s) ease,
    color var(--_animspeed-fast, 0.1s) ease;
}

.lgs-locale-switcher__item:hover {
  background: rgba(var(--accent-rgb, 159, 139, 231), 0.08);
  color: var(--t-bright, #161616);
  transform: translateX(0.2rem);
}

.lgs-locale-switcher__item--active {
  background: rgba(var(--accent-rgb, 159, 139, 231), 0.12);
  color: var(--t-bright, #161616);
  font-weight: var(--fw-medium, 600);
  pointer-events: none;
}

.mxd-nav__contain {
  min-height: var(--lgs-header-action-height);
}

.mxd-nav__hamburger {
  width: var(--lgs-header-action-height);
  height: var(--lgs-header-action-height);
  border: var(--lgs-header-action-border-width) solid var(--st-bright, #161616);
  border-radius: 50%;
  transition:
    transform var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    border-color var(--_animspeed-medium, 0.3s) var(--_animbezier, ease),
    box-shadow var(--_animspeed-medium, 0.3s) var(--_animbezier, ease);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.mxd-nav__hamburger:hover,
.mxd-nav__hamburger.nav-open {
  border-color: var(--accent, #9f8be7);
  box-shadow: 0 1rem 2.4rem rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

@media only screen and (max-width: 767px) {
  .mxd-header__controls {
    gap: 0.6rem;
  }

  .lgs-locale-switcher__toggle {
    padding: 0 0.9rem;
    letter-spacing: 0.08em;
  }

  .lgs-locale-switcher__dropdown {
    min-width: 15rem;
  }
}