// search elements
.search {
  .input-group {
    position: relative;
    border-radius: 4rem;
    overflow: hidden;
    padding: 0;
    margin: 0;
    .appear {
      right: 0;
      position: absolute;
      height: 100%;
      padding: 0.3rem 1rem;
    }
  }
  .input-group * {
    margin: 0;
  }
  .button {
    border-color: $primary-color;
  }
  .appear {
    display:none;
  }
  input {
    &:active {
      border-color: $primary-color;
      background-color: $input-background-focus;
    }
    &:focus,&:focus-within{
      border-color: $primary-color;
      background-color: $input-background;
    }
    &:not(:placeholder-shown) {
      border:none;
      background-color: $input-background-focus;
      position: relative;
      padding-right: $global-padding * 9;
      + .appear {
        display: block;
        background-color: scale-color($input-background-focus, $lightness: -20%);
        z-index: 2;
        &:hover {
          color: $white;
          background-color: $primary-color;
        }

      }
    }
  }
  .hollow {
    border-color: $primary-color;
    color: $primary-color;
    &:after {
    }
    &:placeholder {
      color: scale-color($primary-color, $lightness: -20%);
    }
    &:hover {
      background-color: scale-color($primary-color, $lightness: 95%);
    }
    &:active {
      background-color: scale-color($primary-color, $lightness: 85%);
    }
  }
}
//search block size in content
article,.omekas-entry-content {
  .search{
    @include xy-grid();
    .input-group {
      @include breakpoint(small){
        @include xy-cell (12);
        margin-left: auto;
        margin-right: auto;
      }
      @include breakpoint(medium){
        @include xy-cell (6);
        margin-left: auto;
        margin-right: auto;
      }
      @include breakpoint(large){
        @include xy-cell (4);
        margin-left: auto;
        margin-right: auto;
      }
    }
  }
}
// wordpress
.search-form {
  display: flex;
  justify-content: center;
  align-content: center;
  .search-field {
    margin-bottom: 0;
  }
  label {
    width: 40vw;
    max-width: 30rem;
  }
  input[type="search"] {
    padding-left: $global-padding;
    padding-right: $global-padding;
    border: $input-border;
    background-color: $input-background-focus;
    border-radius: $global-radius-archive;
  }
  input[type="submit"]{
    @extend button;
    width:0px;
    min-width: unset !important;
    height:0px;
    background-color: $input-background-focus;
    border-radius: $global-radius-archive;
  }
  &:active,&:focus,&:focus-within{
    label {
      width: calc(40vw + 10rem);
      margin-right: -10rem;
    }
    input[type="submit"] { 
      width:auto;
      min-width: 10rem !important;
      height:auto;
      background-color: scale-color($input-background-focus, $lightness: -20%);
    }
    input[type="search"] {
      padding-right: 11rem;
      border-color: $primary-color;
      background-color: $input-background-focus;
      &:not(:placeholder-shown) {
        border:none;
        background-color: $input-background-focus;
        color: $primary-color;
        //position: relative;
        //padding-right: $global-padding * 9;
        //+ .appear {
        //  display: block;
        //  background-color: scale-color($input-background-focus, $lightness: -20%);
        //  z-index: 2;
        //  &:hover {
        //    color: $white;
        //    background-color: $primary-color;
        //   }
        //}
      }
    }
  }
}
// contact form 7
//

[type='text'], [type='password'], [type='date'], [type='datetime'], [type='datetime-local'], [type='month'], [type='week'], [type='email'], [type='number'], [type='search'], [type='tel'], [type='time'], [type='url'], [type='color'],
textarea {
border: none;
}