// placement = top
.el-popper.is-blossomt {
  @extend .is-blossomb;
}

.el-popper.is-blossomt .el-popper__arrow::before {
  @include themeBg(linear-gradient(0deg, #9fa5e4, #87abcf), linear-gradient(90deg, #899911, #a38c51));
  right: 0;
}

// placement = bottom
.el-popper.is-blossomb {
  @include themeBg(linear-gradient(90deg, #ad8cf2, #7fbeff), linear-gradient(90deg, #899911, #b98b17));
  @include themeText(2px 4px 5px rgba(107, 104, 104, 1), 2px 4px 5px rgb(62, 62, 62));
  @include themeShadow(2px 3px 7px 2px rgba(49, 49, 49, 0.3), 2px 3px 7px 2px rgb(0, 0, 0));
  color: #fff;
  font-weight: bold;
  padding: 6px 12px;
}

.el-popper.is-blossomb .el-popper__arrow::before {
  @include themeBg(linear-gradient(90deg, #9fa5e4, #87abcf), linear-gradient(90deg, #899911, #a38c51));
  right: 0;
}

// placement = right

.el-popper.is-blossomr {
  @extend .is-blossomb;
}

.el-popper.is-blossomr .el-popper__arrow::before {
  @include themeBg(linear-gradient(0deg, #ad8cf2, #ad8cf2), linear-gradient(90deg, #899911, #899911));
  right: 0;
}

.el-popper.is-light {
  @include themeShadow(1px 3px 10px #dedede, 1px 3px 10px #000000);
  color: var(--bl-text-doctree-color);
}

.el-popper.el-picker__popper {
  // 日期范围选择
  .el-date-picker {
    width: 260px;
    .el-date-picker__header {
      margin: 3px 12px;

      .el-date-picker__header-label {
        font-size: 14px;
      }
    }

    .el-picker-panel__content {
      width: 230px;
      margin: 3px 15px;

      th {
        padding: 0;
      }

      td {
        .cell {
          width: 44px;
          border-radius: 4px;
        }
      }

      .el-year-table {
        td {
          width: auto;
          padding: 7px 0;
        }
      }

      .el-month-table {
        td {
          width: auto;
          padding: 1px 0;
        }
      }

      .el-date-table {
        td {
          width: auto;
          padding: 2px 0;
        }
      }

      .current {
        .el-date-table-cell__text {
          border-radius: 4px;
        }
      }
    }
  }

  // 日期范围选择
  .el-date-range-picker {
    width: 560px;
    .el-date-range-picker__content {
      padding: 5px;
      .start-date,
      .end-date {
        .el-date-table-cell__text {
          border-radius: 4px;
        }
      }
    }
  }
}

.el-popper.el-select__popper {
  .el-select-dropdown {
    .el-select-dropdown__list {
      padding: 3px 0;
      .el-select-dropdown__item {
        height: 25px;
        line-height: 25px;
      }
    }
  }
}

.el-popper.is-small {
  padding: 0 8px;
  box-shadow: 1px 1px 3px #f4f4f4;
  transition: none;

  .el-popper__arrow {
    display: none;
  }
}
