@use '../mixins/mixins.scss' as *;

@include b(read-more) {
  position: relative;
  width: 100%;
  overflow: hidden;

  transition: height 0.3s ease;

  /* 操作区域 start */
  @include e(operation-area) {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: auto;

    @include when(expand) {
      height: 40%;
    }
  }
  @include e(operation-content) {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    &.expand {
      align-items: flex-end;
      padding-bottom: 10rpx;
      background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.1) 0%,
        #fff 70%,
        #fff 100%
      );
    }

    &.fold {
      background-color: transparent;
    }
  }
  /* 操作区域 end */
}