/* Scoped to the language control; never restyle the theme's navigation. */
details.hyperion-language-switcher[data-hyperion-switcher] {
  --hyperion-switcher-bg: #fff;
  --hyperion-switcher-text: #20272d;
  --hyperion-switcher-accent: #245d52;
  position: relative;
  display: inline-block;
  width: max-content;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--hyperion-switcher-text);
  font: 500 14px/1.4 system-ui, sans-serif;
  text-align: start;
  vertical-align: middle;
  isolation: isolate;
}
details.hyperion-language-switcher[data-hyperion-switcher],
details.hyperion-language-switcher[data-hyperion-switcher] * { box-sizing: border-box; }
details.hyperion-language-switcher[data-hyperion-switcher][open] { z-index: 99998; }
details.hyperion-language-switcher[data-hyperion-switcher] > summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 88px;
  min-height: 44px;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid #d9dfe0;
  border-radius: 24px;
  background: var(--hyperion-switcher-bg);
  color: var(--hyperion-switcher-text);
  font: inherit;
  line-height: 1.4;
  list-style: none;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 3px 16px #122a2514;
}
details.hyperion-language-switcher[data-hyperion-switcher] > summary::-webkit-details-marker { display: none; }
details.hyperion-language-switcher[data-hyperion-switcher] > summary::marker { content: ''; }
details.hyperion-language-switcher[data-hyperion-switcher] > summary::before,
details.hyperion-language-switcher[data-hyperion-switcher] > summary::after { content: none; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-switcher-globe { display: block; flex: 0 0 18px; width: 18px; height: 18px; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-switcher-chevron { font-size: 12px; color: #657472; }
details.hyperion-language-switcher[data-hyperion-switcher][open] .hyperion-switcher-chevron { transform: rotate(180deg); }
details.hyperion-language-switcher[data-hyperion-switcher] > .hyperion-switcher-options {
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 8px);
  bottom: auto;
  width: 230px;
  max-width: calc(100vw - 32px);
  max-height: min(320px, 60vh);
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: 0;
  padding: 6px;
  border: 1px solid #d9dfe0;
  border-radius: 14px;
  background: var(--hyperion-switcher-bg);
  box-shadow: 0 8px 32px #122a2526;
  list-style: none;
}
details.hyperion-language-switcher[data-hyperion-switcher]:not([open]) > .hyperion-switcher-options { display: none; }
details.hyperion-language-switcher[data-hyperion-switcher].hyperion-switcher-above > .hyperion-switcher-options { top: auto; bottom: calc(100% + 8px); }
details.hyperion-language-switcher[data-hyperion-switcher].hyperion-switcher-align-start > .hyperion-switcher-options { inset-inline-end: auto; inset-inline-start: 0; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language { display: block; float: none; margin: 0; padding: 0; border: 0; list-style: none; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language::before,
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language::after { content: none; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language > a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 44px;
  margin: 0;
  padding: 10px;
  border: 0;
  border-radius: 8px;
  color: var(--hyperion-switcher-text);
  background: transparent;
  font: inherit;
  line-height: 1.4;
  text-decoration: none;
  white-space: normal;
}
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-switcher-code { min-width: 26px; font-size: 12px; font-weight: 700; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-switcher-name { overflow-wrap: anywhere; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-switcher-preview { display: block; font-size: 11px; color: #657472; }
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language > a:hover,
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language > a[aria-current="page"] { background: #edf4f1; color: var(--hyperion-switcher-accent); }
details.hyperion-language-switcher[data-hyperion-switcher] > summary:focus-visible,
details.hyperion-language-switcher[data-hyperion-switcher] .hyperion-language > a:focus-visible { outline: 2px solid var(--hyperion-switcher-accent); outline-offset: 2px; }
@media print { details.hyperion-language-switcher[data-hyperion-switcher] { display: none; } }
