.search-control {
  cursor: pointer;
  margin-left: 1rem;
  font-size: 1.6rem;
  line-height: 1.3;
}

/*
 * The toggle became a <button> so it can take keyboard focus (2.1.1) and
 * legally carry aria-expanded (4.1.2). Strip the UA button chrome so it looks
 * exactly as the old <i> did. font-size/line-height/margin/cursor are left to
 * .search-control above — deliberately not reset here, and no `font: inherit`,
 * which would clobber the 1.6rem the icon is sized by.
 */
button.search-control {
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /*
   * 2.5.8 Target Size (Minimum). The glyph's own box measures 19.2x19.2, and
   * promoting the toggle from <i> to <button> is what makes that a problem:
   * axe never treated the <i> as a target, but a button always is. Floor the
   * box at 24px so the fix for 2.1.1 does not hand back a target-size failure.
   * The glyph still renders at the 1.6rem set on .search-control; only the hit
   * area grows, and justify-content keeps it centred within it.
   */
  min-width: 24px;
  min-height: 24px;
}

.search-block-form,
.search-block-form form {
  display: flex;
  align-items: center;
  justify-content: end;
  flex-grow: 1;
}

.region-header-left .search-block-form form .search-control {
  position: absolute;
  left: 0;
}

.region-header-left .search-block-form form #edit-keys {
  margin-left: 40px;
  z-index: 99;
}

@media screen and (min-width: 1024px) {
  .search-control {
    margin: 0 0 0 10px;
  }
  .region-header-left .search-control {
    margin: 0;
  }

  .search-block-form,
  .search-block-form form {
    height: 40px;
  }
}

@media screen and (max-width: 1024px) {
  .region-header-left .search-block-form {
    position: relative;
  }

  .region-header-left .search-block-form form {
    min-height: 40px;
  }

  .region-header-left:has(.search-block-form) {
    padding: 0;
    height: fit-content;
    display: flex;
    align-items: center;
  }

  .region-header-left .search-block-form form .search-control {
    margin: 0;
    font-size: 1.2rem;
  }
}