/* Shared header artwork on every page; brand, controls and geometry unchanged. */
.site-header{
  background-color:#052348;
  background-image:linear-gradient(90deg,rgba(2,13,32,.52),rgba(2,17,38,.12) 40%,rgba(2,13,32,.5)),url("assets/header/home-weather-background-v1.webp");
  background-size:cover;
  background-position:center 65%;
  background-repeat:no-repeat;
}
.main-nav{background:rgba(2,16,32,.55)}
.brand-copy,
.header-time{text-shadow:0 1px 4px #020c1a}

/* Local SVG images: independent of the operating system's emoji font. */
#language-switcher.wg-language-images{position:relative;gap:0;flex:0 0 auto;isolation:isolate}
#language-switcher .wg-language-options{
  display:none;position:absolute;top:calc(100% + 9px);right:0;z-index:10;
  grid-template-columns:repeat(3,40px);gap:6px;padding:9px;
  border:1px solid #267ca0;border-radius:10px;background:#061d34;
  box-shadow:0 8px 24px rgba(0,0,0,.4);
}
#language-switcher.wg-language-images.is-open .wg-language-options{display:grid}
#language-switcher.wg-language-images button{
  display:flex;align-items:center;justify-content:center;
  width:28px;height:23px;padding:2px;flex:0 0 auto;
  opacity:1;transition:border-color .15s,background-color .15s;
}
#language-switcher.wg-language-images img{display:block;width:24px;height:18px;object-fit:contain;border-radius:1px}
#language-switcher.wg-language-images button:focus-visible{outline:2px solid #fff;outline-offset:3px}
#language-switcher.wg-language-images button[aria-pressed="true"]{border-color:#62e2e7;background:#164963;box-shadow:0 0 0 1px #62e2e7}
#language-switcher.wg-language-images .wg-language-english{display:flex;width:32px;height:32px;border-radius:6px 0 0 6px}
#language-switcher.wg-language-images .wg-language-toggle{display:flex;width:24px;height:32px;border-radius:0 6px 6px 0;color:#b9efff}
#language-switcher .wg-language-toggle span{font-size:12px;line-height:1}
#language-switcher .wg-language-options button{width:40px;height:36px}

/* Direct English flag and separate language arrow; no extra header height. */
@media(max-width:760px){
  .header-side:has(.wg-language-images){padding-right:46px;gap:6px}
  .header-top:has(.wg-language-images) .brand{min-width:0;gap:8px}
  .header-top:has(.wg-language-images) .brand-copy{min-width:0}
  .header-top:has(.wg-language-images) .brand-copy strong{font-size:clamp(.84rem,3.4vw,1.08rem)}
  .site-header{
    background-image:linear-gradient(90deg,rgba(2,13,32,.58),rgba(2,17,38,.25) 45%,rgba(2,13,32,.5)),url("assets/header/home-weather-background-mobile-v1.webp");
    background-position:center 63%;
  }
}
@media(max-width:480px){
  .header-top:has(.wg-language-images):has(.site-admin-actions:not(.hidden)) .brand-copy{display:none}
}
@media(prefers-reduced-motion:reduce){
  #language-switcher.wg-language-images button{transition:none;transform:none}
}