@use "../../assets/scss/mixins/_font-size.scss";

.bimdata-search-bar {
  display: flex;
  align-items: center;
  transition: all 0.2s ease;
  font-size: font-size.calculateEm(14px);
  .bimdata-search-icon {
    padding: 0 var(--spacing-unit);
    display: flex;
    cursor: pointer;
  }
  input {
    width: 100%;
    height: 100%;
    color: var(--color-granite);
    background-color: transparent;
    border: none;
    box-sizing: border-box;
    font-family: var(--primary-font);
    font-size: font-size.calculateEm(12px);
    &:focus {
      outline: none;
    }
  }
  &.focus {
    background-color: var(--color-white);
    box-shadow: var(--box-shadow);
    transition: all 0.2s ease;
  }
  &.disabled {
    color: var(--color-silver);
    input {
      color: var(--color-silver);
    }
  }

  &__radius {
    border-radius: 3px;
  }
  &__square {
    border-radius: 0;
  }
  &__primary {
    background-color: var(--color-silver-light);
  }
  &__secondary {
    background-color: var(--color-white);
  }
}