@import "../../styles/mixins.module";
@import "../../styles/parents.module";

.calc-select-scoped {
  width: 100%;
  height: auto;
  :global {
    .calc-select {
      position: relative;
      width: 100%;
      height: auto;
      user-select: none;
      margin-bottom: 22px;
      .calc-select-icon-dropdown {
        position: absolute;
        right: 12px;
        top: calc(100% - 26px);
        color: #c0c4cc;
        cursor: pointer;
        transition: transform 0.18s linear;
        &.active {
          transform: rotate(180deg);
        }
      }
      .zent-select {
        width: 100%;
        height: 100%;
        margin-right: unset;
        .zent-select-text {
          height: 100%;
          //   display: flex;
          //   flex-direction: row;
          //   justify-content: flex-start;
          //   align-items: center;
          @include flex-row(flex-start, center);

          font-size: 14px;
          color: #333333;
          font-weight: 400;

          border-radius: 4px;
          border: 1px solid #d9d9d9;
          background: #ffffff;
          transition: all 0.18s linear;

          padding: 4px 30px 4px 11px;
          &:hover {
            border: 1px solid #40a9ff;
          }
          &::after {
            display: none;
          }
        }
      }
      .error-tip-wrap {
        position: absolute;
        left: 0px;
        top: 100%;
        width: 100%;
        height: auto;
        word-break: break-word;
        // display: flex;
        // flex-direction: row;
        // justify-content: flex-start;
        // align-items: flex-start;
        @include flex-row(flex-start, flex-start);
        .tip-text {
          color: #f56c6c;
          font-size: 12px;
          line-height: 1;
          padding-top: 4px;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          word-break: break-word;
        }
      }
    }
  }
}

:global {
  .calc-select-popup {
    .zent-select-popup {
      margin-top: 6px;
      padding: 6px 0;
      .zent-select-option {
        font-size: 14px;
        padding: 0 20px;
        position: relative;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        color: #606266;
        height: 34px;
        line-height: 34px;
        cursor: pointer;
        background: #ffffff;
        transition: all 0.18s linear;
        &.current {
          background-color: #f5f7fa;
        }
        &.active {
          color: #409eff;
          font-weight: 700;
        }
      }
    }
  }
}