@import '../../../base/style.less';
@popupPrefix: iot-mini-card-text;

.flex(@justify, @align, @direction: row) {
  display: flex;
  justify-content: @justify;
  align-items: @align;
  flex-direction: @direction;
}

.font(@fontW, @fontSize, @fontCol, @fontFa: PingFangSC-Regular) {
  font-weight: @fontW;
  font-size: @fontSize;
  font-family: @fontFa;
  color: @fontCol;
}

.@{popupPrefix} {
  display: flex;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  font-size: .16rem;



      .card-items {
        flex: 1;
        height: auto;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: .16rem;
        padding: .05rem ;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        .card-title {
          // max-width: .8rem;

          // overflow: hidden;
          // white-space: nowrap;
          // text-overflow: ellipsis;
          .font(400,.12rem,var(--mini-gird-title-color),PingFangSC-Regular);
        }

        .card-state-text {
          // background: red;
          max-width: 1.2rem;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          text-align: center;
          .font(400,.16rem,var(--mini-gird-text-color),PingFangSC-Regular);
          margin-left: .05rem;
          line-height: .26rem;
        }
        // .card-doubel-state-text {
        //   max-width: .9rem;
        // }
        // .card-double-title {
        //   max-width: .6rem;
        // }
      }

      .card-items:last-child {
        .card-line {
          width: 0;
        }
      }
  .show-bord {
    border-bottom: 1px solid #E5E5E5;
  }

}

@keyframes slide {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}