lbry-desktop/ui/scss/component/_search.scss

.search__header {
  width: 100%;
  margin-bottom: var(--spacing-l);

  .placeholder {
    background-color: var(--color-placeholder-background);
  }
}

.search__options {
  margin-top: var(--spacing-s);
  display: none;

  fieldset:not(:first-child) {
    margin-top: var(--spacing-m);
  }

  table {
    line-height: 1.5;
    table-layout: fixed;
  }

  td {
    vertical-align: middle;
  }

  td:nth-of-type(1) {
    width: 25%;

    &:not(:first-of-type) {
      width: 20%;
    }
  }

  .claim-type-filter {
    display: inline-block;
  }

  .close-button {
    visibility: hidden;
  }

  .close-button--visible {
    visibility: visible;
  }

  .filter-values {
    display: flex;
    align-items: flex-start;

    .button-toggle {
      margin-right: 0;
    }

    select {
      @media (min-width: $breakpoint-small) {
        min-width: 200px;
      }
    }

    .icon--help {
      margin-top: 4px;
    }

    .button--close {
      position: unset;
      align-self: center;
      margin-left: var(--spacing-s);
    }
  }

  .media-types {
    margin-top: var(--spacing-m);
    display: flex;
    flex-direction: column;

    label {
      display: flex;
      align-items: center;
    }

    @media (min-width: $breakpoint-small) {
      flex-direction: row;
    }
  }

  .radio,
  .checkbox {
    display: inline-block;
    margin-top: 0;

    &:not(:first-of-type) {
      margin-top: var(--spacing-s);
    }

    @media (min-width: $breakpoint-small) {
      &:not(:first-of-type) {
        margin-left: var(--spacing-m);
        margin-top: 0;
      }
    }
  }
}

.search__options--expanded {
  display: block;
}

.search__legend {
  font-weight: var(--font-weight-bold);
  font-size: var(--font-small);
  padding: var(--spacing-xxs);
}

.search__top-link {
  margin-top: var(--spacing-s);
  font-weight: var(--font-weight-body);
  margin-top: var(--spacing-xs);
}

.search__top-links {
  margin-bottom: 0;
  margin-top: var(--spacing-xs);

  @media (min-width: $breakpoint-small) {
    margin-top: 0;
  }
}

.recommended-content__toggles {
  button {
    padding: 0 var(--spacing-xs);
    height: 2rem;
    max-width: 15rem;
  }
}

.search__channel {
  margin-bottom: var(--spacing-l);

  fieldset-section {
    margin-top: 0;
  }
}

.search__channel--popup {
  position: relative;
  display: inline-block;
  width: 100%;
}

.search__channel--popup-results {
  position: absolute;
  z-index: 99;
  top: 100%;
  left: 0;
  right: 0;
  background: #21252980;
  color: white;

  .claim-preview__title {
    color: #eff1f4;
  }

  .button--uri-indicator,
  .media__subtitle {
    color: #d8dde1;
  }

  .icon--help {
    vertical-align: middle;
  }
}