@import '@styles/theme.scss';
@import "@styles/custom.scss";

$height: 66px;

.input-container {
  display         : flex;
  flex-direction  : column;
  background-color: $white;
  padding         : 14px 32px 20px 30px;

  .comp-input-item {
    display    : flex;
    align-items: center;
    position   : relative;
    width      : 100%
  }

  .opacity {
    opacity: .5
  }

  .comp-input-item__input {
    height       : $height;
    color        : $black;
    font-size    : $font-size-lg;
    flex         : 1;
    padding-right: 70px;
    text-align   : right;

    .at-input {
      padding: 10px !important;
    }

    // &--placeholder {
    //   color  : $black;
    //   opacity: .3;
    // }
  }

  .comp-input-item__clear {
    position       : absolute;
    top            : 0;
    right          : 0;
    z-index        : 2;
    width          : 42px;
    height         : $height;
    display        : flex;
    flex-direction : row;
    justify-content: center;
    align-items    : center;

    &-img {
      width : 30px;
      height: 30px;
    }
  }
}