/* NotenHaus — header search (desktop center + mobile icon expand, §41) */

.header-search {
  display: none;
  flex: 1 1 auto;
  align-items: stretch;
  max-width: 36rem;
  margin-inline: auto;
  min-width: 0;
}

.header-search__field {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: stretch;
}

.header-search__glyph {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  z-index: 1;
  width: 1.1rem;
  height: 1.1rem;
  color: var(--jwp-color-dark-grey, #5a5a5a);
  transform: translateY(-50%);
  pointer-events: none;
}

.header-search__input,
.header-search__input[type="search"] {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  min-height: 2.5rem;
  padding: 0.45rem 0.75rem 0.45rem 2.75rem;
  border: 1px solid transparent;
  border-radius: 2px 0 0 2px;
  background: var(--jwp-color-neutral-0);
  color: var(--color-text-body);
  font: inherit;
  font-size: 1rem;
  line-height: 1.25;
  -webkit-appearance: none;
  appearance: none;
}

.header-search__input::-webkit-search-decoration,
.header-search__input::-webkit-search-cancel-button,
.header-search__input::-webkit-search-results-button,
.header-search__input::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
}

.header-search__input:focus {
  outline: none;
  box-shadow: inset 0 0 0 2px var(--color-focus);
}

.header-search:focus-within .header-search__glyph {
  color: var(--jwp-color-maroon, #630a22);
}

.header-search__btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  min-width: 2.75rem;
  min-height: 2.5rem;
  padding: 0;
  border: 0;
  border-radius: 0 2px 2px 0;
  background: var(--color-btn-search);
  color: var(--jwp-color-neutral-5);
  cursor: pointer;
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}

.header-search__btn:hover,
.header-search__btn:focus-visible {
  background: var(--color-btn-search-hover);
  outline: none;
}

.header-search__icon {
  display: block;
}

.header-search-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 2px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.header-search-toggle[aria-expanded="true"] {
  background: rgba(255, 255, 255, 0.12);
  border-color: var(--color-accent-gold, #c9a227);
}

.header-search-toggle__icon {
  display: block;
}

@media (max-width: 767px) {
  .site-header__utility .site-header__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 0.5rem;
    row-gap: 0.55rem;
  }

  .site-logo {
    grid-column: 1;
    grid-row: 1;
  }

  .site-header__tools {
    grid-column: 2;
    grid-row: 1;
    margin-inline-start: 0;
  }

  .header-search {
    display: none;
    grid-column: 1 / -1;
    grid-row: 2;
    max-width: none;
    margin: 0;
    width: 100%;
  }

  .site-header.is-search-open .header-search {
    display: flex;
  }

  .header-search__input,
  .header-search__input[type="search"] {
    min-height: 2.75rem;
    font-size: 1rem;
  }

  .header-search__btn {
    min-height: 2.75rem;
  }
}

@media (min-width: 768px) {
  .header-search {
    display: flex;
  }

  .header-search-toggle {
    display: none;
  }
}

@supports (-webkit-touch-callout: none) {
  .header-search__input,
  .header-search__input[type="search"] {
    font-size: 16px;
  }
}