/**
 * @file
 * Stylesheet for search.
 */
#block-search-exposed-block .form--inline,
.block--searchpage .form--inline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8em;
  padding: 0.5em 1em 0.5em 2em;
  background-color: var(--light);
  color: var(--hpd-dark);
  border-radius: 5em;
  border: 2px solid var(--bright-primary);
}

#block-search-exposed-block .form--inline.clearfix::after,
.block--searchpage .form--inline.clearfix::after {
  display: none;
}

.views-exposed-form .form-item-search-api-fulltext {
  margin: 0;
  float: none;
  box-sizing: border-box;
}

.views-exposed-form .form-actions {
  margin: 0;
}

#block-search-exposed-block input[id*="search-api-fulltext"],
.block--searchpage input[id*="search-api-fulltext"] {
  border: none;
  background-color: var(--light);
  color: var(--hpd-dark);
  padding: calc(var(--page-padding) - 4px) 0;
}

#block-search-exposed-block input[id*="search-api-fulltext"]:focus,
.block--searchpage input[id*="search-api-fulltext"]:focus {
  outline: none;
}

#block-search-exposed-block input[id*="search-api-fulltext"] {
  width: 40vw;
}

.block--searchpage input[id*="search-api-fulltext"] {
  width: 100%;
}

.block--searchpage form {
  background-color: var(--light);
  padding: calc(3 * var(--page-padding)) calc(2 * var(--page-padding));
  margin: auto;
}

.block--searchpage .form-item-search-api-fulltext {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex: auto;
  gap: 0.8em;
}

.block--searchpage .label--search {
  color: var(--hpd-dark);
}

.search-box__button {
  color: transparent;
  background-color: transparent;
  border: none;
}

.search-box__button::before {
  color: var(--bright-primary);
  background-color: transparent;
  padding: 0.5em;
  font-size: 1.4em;
}

.label--search {
  display: none;
}

@media screen and (min-width: 1024px) {

  #block-hpd2026-site-branding {
    position: relative;
    z-index: 10;
  }

  .region-header {
    position: relative;
  }

  /* .region-header-top {
    z-index: 5;
  } */

  #block-search-exposed-block {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: -1;
    height: 100%;
    padding: 2em 0;
    /* padding: 0 calc(4 * var(--page-padding) + var(--logo-l-width)); */
    transform: translateY(-100%);
    background-color: transparent;
    opacity: 0;
  }

  #block-search-exposed-block.search--expanded {
    transform: translateY(100%);
    transition: opacity 0.3s ease;
    opacity: 1;
    z-index: 10;
  }

  #block-search-exposed-block form {
    margin: auto;
  }

  .label--search {
    color: white;
    display: block;
    width: 1.5em;
    padding: 0.5em 0;
    text-align: center;
    order: 5;
    font-size: 1.4em;
  }
}