.search-module {
  @apply w-full absolute  
	bg-white
	left-0 
	px-16
	py-6
  z-10
  bottom-0
	transform translate-y-full;

  @apply block;
  /* transition: all 0.5s;
  transition-timing-function: cubic-bezier(0, 0.51, 0.23, 0.99); */

  &[mobile-closed] {
    @apply hidden;
  }

  &[mobile-closing] {
    /* animation: translate-out 400ms forwards cubic-bezier(0, 0.51, 0.23, 0.99),
      fade-out 800ms forwards ease-in; */
    animation: translate-out 800ms forwards ease-in, fade-out 600ms forwards ease-in;
  }
  &[mobile-opened] {
    animation: translate-in 700ms forwards cubic-bezier(0, 0.51, 0.23, 0.99),
      fade-in 600ms forwards ease-out;
  }

  &__wrapper-container {
    @apply max-w-screen-xl mx-auto;
  }
  &__search-form {
    @apply flex flex-wrap;

    &__title {
      @apply block font-bold text-lg w-full;
    }
    &__separator {
      @apply mt-2 mb-8 bg-gray-dark border-none opacity-50 w-full;
      height: 1px;
    }
    &__input {
      box-sizing: border-box;
      @apply block max-w-full flex-grow py-3 border border-black rounded-tl-3xl rounded-bl-3xl px-4;
    }
    button[type='submit'] {
      @apply bg-secondary text-white w-1/6 flex justify-center items-center gap-3 rounded-tr-3xl rounded-br-3xl px-4 py-3;
      max-width: 300px;
      .search_icon {
        @apply invert;
      }
    }
  }
  &__suggestions {
    @apply flex flex-wrap gap-x-3 pt-4;
    &__navlist {
      @apply flex flex-wrap gap-x-3;

      .suggestion-item {
        @apply font-bold underline underline-offset-4;
      }
    }
  }
}