/* language switcher -- added by i18n_build.py
   Values copied from the page's own `.navdrop summary,.qrdrop summary` and
   `.navdrop ul,.qrdrop .pop` so the chip is the same pill as "Scan" sitting
   beside it, not a second dropdown style invented alongside the first.
   The panel's offset is logical (inset-inline-end), so it hangs from the
   right edge in LTR and the left in RTL with no special case. */
.langdrop{position:relative}
.langdrop summary{list-style:none;cursor:pointer;display:inline-flex;
  align-items:center;gap:8px;font-size:.86rem;font-weight:500;
  color:rgba(255,255,255,.86);border:1px solid rgba(255,255,255,.20);
  border-radius:999px;padding:8px 14px}
.langdrop summary::-webkit-details-marker{display:none}
.langdrop summary:hover,.langdrop summary:focus-visible{
  color:#fff;border-color:rgba(74,211,172,.45)}
.langdrop svg{width:17px;height:17px;flex:none}
.langdrop ul{position:absolute;inset-inline-end:0;top:calc(100% + 10px);
  background:#08202c;border:1px solid rgba(255,255,255,.14);border-radius:14px;
  box-shadow:0 22px 48px rgba(0,0,0,.5);padding:10px;z-index:60;
  margin:0;list-style:none;display:grid;
  grid-template-columns:repeat(2,minmax(8.5rem,1fr));gap:2px}
.langdrop:not([open]) ul{display:none}
.langdrop ul a,.langdrop ul span{display:block;padding:9px 12px;
  border-radius:9px;text-decoration:none;font-size:.84rem;line-height:1.35;
  color:rgba(255,255,255,.88);white-space:nowrap}
.langdrop ul a:hover,.langdrop ul a:focus-visible{
  background:rgba(74,211,172,.14);color:#fff}
.langdrop ul [aria-current]{color:var(--teal,#4AD3AC);font-weight:600}
@media (max-width:560px){
  /* "Scan" is hidden at this width by the page's own rule; the globe stays,
     because choosing a language matters more on a phone than scanning a code
     with the phone you are already holding. Label drops, icon remains --
     the same trick `.navdrop summary span{display:none}` already uses. */
  .langdrop summary span{display:none}
  .langdrop summary{padding:8px 11px}
}
@media (max-width:430px){
  /* An absolutely positioned grid shrinks to its content, so a single column
     collapsed the panel to 100px and broke "Bahasa Indonesia" over three
     lines. Floor the width, cap the height, let it scroll. */
  .langdrop ul{grid-template-columns:1fr;min-width:12.5rem;
    max-height:60vh;overflow:auto}
}
