/* Green Events NYC: language indicator (EN | ES flags). Shared snippet, Oct 2026.
   Markup: <div class="ge-lang" role="group" aria-label="Language / Idioma"> segments </div>
   Light theme by default (reuses styles.css vars); add .ge-lang--dark on dark headers/footers. */
.ge-lang{position:relative;display:inline-flex;align-items:stretch;flex:none;
  border:1px solid var(--line,#cdd7cf);border-radius:999px;background:var(--surface,#fff);
  color:var(--text-soft,#355243);font-family:inherit;font-size:.8rem;font-weight:700;
  letter-spacing:.03em;line-height:1;white-space:nowrap;vertical-align:middle;text-transform:none}
.ge-lang > a,.ge-lang > span,.ge-lang > button,.ge-lang > details > summary{
  display:inline-flex;align-items:center;gap:.32rem;min-height:32px;padding:.38rem .68rem;
  color:inherit;text-decoration:none;background:none;border:0;font:inherit;cursor:pointer;list-style:none}
.ge-lang > details > summary::-webkit-details-marker{display:none}
.ge-lang > * + *{border-left:1px solid var(--line,#cdd7cf)}
.ge-lang > :first-child{border-radius:999px 0 0 999px}
.ge-lang > :last-child,.ge-lang > :last-child > summary{border-radius:0 999px 999px 0}
.ge-lang > a:hover,.ge-lang > button:hover,.ge-lang > details > summary:hover{background:rgba(42,95,56,.08);color:var(--brand-strong,#12402c)}
.ge-lang .is-current,.ge-lang .is-current:hover{background:var(--brand-strong,#12402c);color:#fff;cursor:default}
.ge-lang .is-soon{cursor:help;opacity:.72;font-weight:600}
.ge-lang .is-soon small{font-size:.75rem;font-weight:600;letter-spacing:0}
.ge-lang__flag{font-size:1.05rem;line-height:1;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif}
.ge-lang a:focus-visible,.ge-lang button:focus-visible,.ge-lang summary:focus-visible{outline:2px solid var(--brand,#1e5a3f);outline-offset:2px}
/* "more languages" popover (in-place i18n pages) */
.ge-lang__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:120;display:grid;gap:2px;min-width:150px;padding:.35rem;
  background:var(--surface,#fff);border:1px solid var(--line,#cdd7cf);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.ge-lang__menu button{display:flex;justify-content:space-between;gap:.8rem;width:100%;padding:.5rem .6rem;border:0;border-radius:6px;
  background:none;color:var(--text-soft,#355243);font:inherit;font-size:.82rem;text-align:left;cursor:pointer}
.ge-lang__menu button:hover{background:rgba(42,95,56,.08)}
.ge-lang__menu button.is-current{background:var(--brand-strong,#12402c);color:#fff}
.ge-lang__menu button span{opacity:.7;font-weight:600}
/* dark theme */
.ge-lang--dark{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.24);color:#ece7da}
.ge-lang--dark > * + *{border-left-color:rgba(255,255,255,.24)}
.ge-lang--dark > a:hover,.ge-lang--dark > button:hover,.ge-lang--dark > details > summary:hover{background:rgba(94,255,94,.12);color:#5eff5e}
.ge-lang--dark .is-current,.ge-lang--dark .is-current:hover{background:#5eff5e;color:#0a0a0a}
.ge-lang--dark .ge-lang__menu{background:#0f1f18;border-color:rgba(255,255,255,.2)}
.ge-lang--dark .ge-lang__menu button{color:#ece7da}
.ge-lang--dark .ge-lang__menu button:hover{background:rgba(94,255,94,.12)}
.ge-lang--dark .ge-lang__menu button.is-current{background:#5eff5e;color:#0a0a0a}
/* header placement: sits between logo and nav; pinned top-right on narrow screens (opt-in .ge-lang--pin) */
.ge-lang--header{margin-left:auto;margin-right:.6rem;align-self:center}
@media (max-width:640px){
  .nav:has(> .ge-lang--pin){position:relative}
  .ge-lang--pin{position:absolute;top:.62rem;right:0;margin:0}
}
@media (max-width:980px){ .ge-lang--flow{margin:.15rem .3rem} }
/* very narrow phones (360-400px): compact segments so the pinned pill clears the logo */
@media (max-width:400px){
  .ge-lang > a,.ge-lang > span,.ge-lang > button,.ge-lang > details > summary{padding:.38rem .46rem;gap:.24rem}
}
/* footer row */
.ge-lang-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.55rem .85rem;
  margin-top:1.1rem;padding-top:1rem;border-top:1px dashed var(--line,#cdd7cf);font-size:.86rem;color:inherit;text-align:center}
.ge-lang-foot__label{font-weight:700}
.ge-lang-foot__more a{text-decoration:underline;text-underline-offset:2px;color:inherit}
.ge-lang-foot--dark{border-top-color:rgba(255,255,255,.18)}
/* let custom headers wrap instead of overflowing once the pill is added */
:is(.nav,body > nav):has(> .ge-lang--flow){flex-wrap:wrap;row-gap:.45rem}
/* footer extra-language links rendered as buttons (in-place pages) */
.ge-lang-foot__more button{background:none;border:0;padding:.25rem .2rem;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.ge-lang-foot__more button.is-current{font-weight:800;text-decoration:none}
.ge-lang-standalone{padding:1.4rem 1rem 2rem;border-top:1px solid rgba(255,255,255,.1)}
.ge-lang-standalone .ge-lang-foot{margin-top:0;border-top:0;padding-top:0}
/* keep the footer language row clear of the fixed ElevenLabs "Ask me" bubble on phones */
@media (max-width:640px){ body:has(elevenlabs-convai) .ge-lang-foot{padding-bottom:4.25rem} }