@import "../../../styles/modules/importAll";

.DeriveCategoryMappings {
  .DeriveCategoryMeta {
    font-size: 0.8em;
    color: $midLightGrey;

    .DeriveCategoryMapping__text {
      padding: 0.5rem 0 !important;

      span {
        display: inline-block;
        margin-right: 1rem;
      }

      .DeriveCategoryMapping__sort-btn {
        margin-right: 3px;
        padding: 5px;
        border: 1px solid $midLightGrey;
        width: 24px;
        height: 24px;
        border-radius: 4px;
        color: $midLightGrey;
        margin-top: -1px;

        &--selected {
          color: $anchorLinkLight;
          border-color: $anchorLinkLight;
        }
      }
    }

    .DeriveCategoryMappings__search-input {
      margin-left: 0.8rem;
    }

    &:nth-child(2) {
      .DeriveCategoryMapping__text {
        position: relative;
        top: 2px;
      }
    }
  }

  .DeriveCategoryMappings__search-input { 
    border-radius: 16px;
    border: none;
    background: $lightGrey;
    padding: 2px 0.5rem;
    font-style: italic;
  }
}