.t_select_icon {
  width: 100%;

  .el-button {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--el-text-color-regular);

    .el-icon {
      color: var(--el-color-primary);
    }
  }

  .t_select_icon_dialog {
    .el-dialog__body {
      padding: 25px 20px 20px;

      .el-input {
        margin-bottom: 10px;
      }

      .icon-list {
        display: grid;
        grid-template-columns: repeat(auto-fill, 115px);
        justify-content: space-evenly;
        max-height: 60vh;

        .icon-item {
          display: flex;
          flex-direction: column;
          align-items: center;
          width: 42px;
          padding: 20px 30px;
          cursor: pointer;
          transition: all 0.2s;

          svg {
            width: 30px;
            height: 30px;
          }

          &:hover {
            transform: scale(1.3);
          }

          &.icon-active {
            color: var(--el-color-primary);
          }

          span {
            margin-top: 5px;
            line-height: 20px;
            text-align: center;
          }
        }
      }
    }
  }
}