.post-grid {
  &__toolbar {
    /* @apply flex flex-col md:grid  md:grid-cols-2 gap-4 md:items-center justify-between pb-12; */
    @apply pb-12 grid grid-cols-2  gap-4 gap-y-8 items-end;
    .post-count {
      @apply flex items-end gap-2;

      &__count {
        @apply font-normal uppercase fjalla;
        line-height: 0.8;
      }

      &__text {
        @apply text-lg nunito;
      }
    }

    .search-bar {
      @apply md:justify-self-end text-primary relative;

      &:after {
        @apply absolute  top-1/2 -translate-y-1/2;
        content: '';
        right: 10px;
        display: flex;
        width: 30px;
        height: 30px;
        background-image: url('../resources/img/icons/carhop-rechercher-green-circle.svg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: contain;
      }
      input {
        @apply w-full md:w-auto !py-4 px-4 border border-primary rounded-full text-base;
        padding-right: 33px;
        line-height: 1.5;
        height: auto;
        width: 500px;
        max-width: 100%;
        &::placeholder {
          @apply !text-base font-normal text-carhop-green-700;
        }
      }
    }

    select {
      @apply w-full md:w-auto border border-carhop-green-700 text-carhop-green-700 rounded-full !py-4 px-4 max-w-full text-base;
      line-height: 1.5;
      height: auto;

      appearance: none; /* Disable the default arrow */
      -webkit-appearance: none; /* For WebKit-based browsers */
      -moz-appearance: none; /* For Firefox */

      background-color: #fff;
      background-image: url('../resources/img/elements/select-drop-button.svg');

      background-repeat: no-repeat;
      background-position: right 10px center;
      background-size: 30px;
      cursor: pointer;
    }

    select[name='sort_by'] {
      @apply pr-12 w-fit  justify-self-end;
    }
  }
  .search-by {
    &__label {
      @apply text-primary font-semibold nunito;
    }
    .search-by__buttons {
      @apply flex items-center  border border-primary border-solid w-fit;

      button {
        @apply block  font-normal nunito text-primary py-2 px-4;
        &[aria-selected='true'] {
          @apply bg-primary text-white;
          &:hover {
            @apply bg-primary text-white;
          }
        }
        &:hover {
          @apply bg-carhop-green-50;
        }
      }
      &[data-filter='thematique'] {
      }
    }
  }
  &__toolbar-actions {
    @apply flex flex-wrap items-center gap-4 justify-self-end;

    select[name='etiquettes'] {
      /* @apply bg-blue-300; */
    }

    select[name='auteurs'] {
      /* @apply bg-red-300; */
    }
  }

  &__list {
    @apply grid grid-cols-1 lg:grid-cols-2  gap-8;
  }
}

body:has(.search-by button[data-filter='thematique'][aria-selected='true']) {
  .post-grid__toolbar-actions {
    select[name='auteurs'],
    .search-bar {
      @apply hidden;
    }
  }
}

body:has(.search-by button[data-filter='auteur'][aria-selected='true']) {
  .post-grid__toolbar-actions {
    select[name='etiquettes'],
    .search-bar {
      @apply hidden;
    }
  }
}

body:has(.search-by button[data-filter='occurence'][aria-selected='true']) {
  .post-grid__toolbar-actions {
    select[name='etiquettes'],
    select[name='auteurs'] {
      @apply hidden;
    }
  }
}