/* Wintzenheim municipal V2.0 alpha 1.4 — search placement and header resilience */

/* Desktop search lives in the slim utility bar so the six main menu labels keep
   their natural spacing. */
.municipal-search-desktop{
  display:inline-flex;
  align-items:center;
  margin-left:.2rem;
}
.site-utility .municipal-search-button{
  min-height:30px;
  padding:.28rem .58rem;
  border:1px solid rgba(255,255,255,.24);
  border-radius:8px;
  color:#fff;
  background:rgba(255,255,255,.08);
  box-shadow:none;
  font-size:.8rem;
  line-height:1;
}
.site-utility .municipal-search-button:hover,
.site-utility .municipal-search-button:focus-visible{
  color:#fff;
  background:rgba(255,255,255,.17);
  outline:2px solid rgba(255,255,255,.72);
  outline-offset:2px;
}
.site-utility .municipal-search-button > span:first-child{
  font-size:1rem;
  line-height:1;
}

/* The compact control is only used when the navigation switches to its mobile
   panel. */
.municipal-search-mobile{display:none;flex:0 0 auto}

/* Defensive sizing: a translated label or browser zoom must not make the
   desktop menu overlap itself before the mobile breakpoint is reached. */
@media (min-width:82.001rem){
  .site-header--v15 .site-header__inner{gap:1rem}
  .main-nav--v15 .main-nav__list{gap:.12rem}
  .main-nav--v15 .main-nav__line>a{padding-left:.58rem;padding-right:.58rem}
  .main-nav--v15 .submenu-toggle{width:29px;margin-right:.18rem}
}

@media (max-width:82rem){
  .municipal-search-desktop{display:none}
  .municipal-search-mobile{display:inline-flex;margin-left:.2rem}
  .municipal-search-mobile .municipal-search-button{
    display:grid;
    place-items:center;
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px;
    padding:0;
    border-radius:13px;
    background:#f3f7f5;
    box-shadow:none;
  }
  .municipal-search-mobile .municipal-search-button span:last-child{display:none}
  .municipal-search-mobile .municipal-search-button span:first-child{font-size:1.2rem}
}

@media (max-width:48rem){
  .municipal-search-mobile .municipal-search-button{
    width:42px;
    min-width:42px;
    height:42px;
    min-height:42px;
  }
}
