@import '../../../core/src/style/variables';

.bom-search {
  position: relative;
  display: inline-grid;
  width: calc(50% - 5px);
  font-size: small;

  &.disabled {
    input,
    .BomIcon--mag-glass,
    .BomIcon--cross {
      pointer-events: none;
      opacity: 0.5;
    }
  }

  input {
    width: 100%;
    color: $black;
    padding: 4px;
    height: 26px;
  }

  &-title {
    font-size: $font-size-s;
    text-transform: capitalize;
    font-weight: bold;
    padding: 0 0 5px;
    display: inline-block;
    white-space: nowrap;
  }

  .search-btn {
    color: $middarkgrey;
    position: absolute;
    top: 20px;
    right: 1px;
    padding:0;
    background: none;
    border: none;
    cursor: pointer;
    wpt-icon {
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }

  @media (max-width: $phablet-breakpoint) {
    margin-bottom: 3em;
  }
}