@import '../../common/style/gp-match/palette.scss';
@import '../../common/style/gp-match/layout.scss';

.press__publish-score {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  padding-bottom: 0;
}

.press__rank-list {
  flex: 1;
  margin: .2rem 0;
  padding: 0 .2rem;
  overflow-y: auto;
}

.press__rank-item {
  position: relative;
  margin-bottom: .24rem;
  box-shadow: 0 0 .2rem 0 rgba(196, 193, 205, .80);
}

.press__rank-item-act {
  box-shadow: 0 .04rem .08rem 0 rgba(0, 0, 0, .25);

  .press__rank-item-detail {
    box-shadow: none;
    background: linear-gradient(90deg, #5400d6 15.83%, #6000fa 95.19%);

    &::before {
      display: none;
    }

    &::after {
      display: none;
    }

    .icon-guide {
      color: #f2f3ff;
      transform: rotate(90deg);
    }

    .press__rank-prefix {
      color: #f2f3ff;
    }

    .press__rank-team {
      .press__team-name {
        color: #f2f3ff;
      }
    }

    .press__rank-score {
      color: #f2f3ff;
    }
  }
}

.press__rank-item-detail {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 1rem;
  padding: 0 .24rem;
  background: linear-gradient(101deg, rgba(238, 239, 241, .50) 15.46%, rgba(252, 252, 252, .50) 86.92%);

  &::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3.66rem;
    height: 100%;
    background: url(https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/schedule-manage/rank-item-bg.png) no-repeat;
    background-size: 100%;
    z-index: 2;
  }

  &::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 7.06rem;
    height: .96rem;
    border: .02rem solid rgba(252, 252, 252, .60);
    z-index: 1;
  }

  .icon-guide {
    position: relative;
    margin-left: 0;
    color: rgba(33, 33, 36, 1);
    z-index: 3;
  }

  .press__rank-prefix {
    position: relative;
    display: flex;
    align-items: center;
    width: 1.36rem;
    flex-shrink: 0;
    margin-left: .16rem;
    font-size: .24rem;
    color: rgba(33, 33, 36, 1);
    z-index: 3;

    .press__rank-num {
      margin: 0 .08rem;
      font-size: .28rem;
      font-family: 'AgencyFB-Bold';
    }

    .press__rank-num--rank1 {
      margin: -.08rem .04rem 0;
      font-size: 0;
      background: url('https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/rule-table--1.png') center center no-repeat;
      background-size: 100%;
      width: .4rem;
      height: .44rem;
    }

    .press__rank-num--rank2 {
      margin: -.08rem .04rem 0;
      font-size: 0;
      background: url('https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/rule-table--2.png') center center no-repeat;
      background-size: 100%;
      width: .4rem;
      height: .44rem;
    }

    .press__rank-num--rank3 {
      margin: -.08rem .04rem 0;
      font-size: 0;
      background: url('https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/rule-table--3.png') center center no-repeat;
      background-size: 100%;
      width: .4rem;
      height: .44rem;
    }
  }

  .press__rank-team {
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    z-index: 3;

    img {
      width: .44rem;
      height: .44rem;
      object-fit: cover;
    }

    .press__team-name {
      margin-left: .04rem;
      width: 2.24rem;
      color: #212124;
      font-size: .28rem;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      word-break: break-all;

      &--flex-1 {
        flex: 1;
        width: unset;
      }
    }
  }

  .press__rank-score {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: .54rem;
    flex: 1;
    font-size: .24rem;
    color: #212124;
    z-index: 3;

    span {
      margin-right: .08rem;
      font-size: .28rem;
      font-family: 'AgencyFB-Bold';
    }
  }

  .press__btn-watch {
    position: relative;
    flex-shrink: 0;
    margin-left: .08rem;
    font-size: .24rem;
    color: #ed7b2f;
    z-index: 3;
  }
}

.press__history-detail {
  background: #fff;

  .press__history-detail-head {
    display: flex;
    align-items: center;
    width: 100%;
    height: .62rem;
    background: url(https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/schedule-manage/history-detail-bg.png) no-repeat;
    background-size: 100%;

    .press__history-detail-text {
      text-align: center;
      flex: 1;
      font-size: .2rem;
      color: #fff;

      &:first-child {
        text-align: left;
        padding-left: .58rem;
      }
    }
  }

  .press__history-detail-list {
    display: flex;
    align-items: center;
    height: .8rem;
    background: rgba(255, 255, 255, .01);
    box-shadow: 0 -.02rem 0 0 #dddfe1 inset;

    &:last-child {
      box-shadow: none;
    }

    .press__history-detail-text {
      flex: 1;
      text-align: left;
      padding-left: .58rem;
      font-size: .24rem;
      color: #212124;
    }

    .press__history-detail-num {
      text-align: center;
      flex: 1;
      font-size: .28rem;
      font-family: 'AgencyFB-Bold';
    }
  }
}

.press__button-part {
  position: relative;
  width: 100%;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: auto;
  min-height: .72rem;
  padding: .34rem 0;
  background: #fff;
  justify-content: center;
  z-index: 3;
  box-sizing: content-box;
  padding-bottom: calc(.34rem + env(safe-area-inset-bottom));

  .press__button--disable-l {
    width: 3.96rem;
    height: .72rem;
    line-height: .72rem;
    font-size: .4rem;
    display: block;
    font-size: .4rem;
    font-family: 'PEACE';
    color: #fff;
    text-align: center;
    background: url(https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/bg-btn-l-disable.png) no-repeat;
    background-size: 100% 100%;
  }

  .press__select-box {
    position: relative;
    display: flex;
    align-items: center;
    height: .46rem;
    padding: 0 .2rem 0 .12rem;
    font-size: .24rem;
    color: #212124;
    z-index: 1;

    &::after {
      position: absolute;
      left: 0;
      top: 0;
      content: '';
      width: 200%;
      height: 200%;
      border-style: solid;
      border-width: 1px;
      border-color: rgba(0, 0, 0, .70);
      ;
      transform: scale(.5);
      transform-origin: 0 0;
      pointer-events: none;
    }

    .icon-triangle {
      transform: scale(.9);
      margin-top: .02rem;
      margin-left: .24rem;
      font-size: .04rem;
      color: rgba($color: #212124, $alpha: .75);
    }
  }

  .press__button--primary-l {
    text-align: center;
    font-family: 'PEACE';
    width: 3.96rem;
    height: .72rem;
    line-height: .72rem;
    font-size: .4rem;
    color: #212124;
    background: url(https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/bg-btn-l.png) no-repeat;
    background-size: 100%;
  }

  .press__button--primary-l {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;

    .press__status-tips {
      font-family: normal;
      top: -.52rem;
      min-width: 1.88rem;
      z-index: 9;

      &::before {
        left: 51%;
      }
    }
  }

  .press__publish-time {
    margin-left: .08rem;
    font-size: .24rem;
    color: #212124;
  }

  .press__button--disable-l {}
}

.press__automatic-publish {
  background: #fff;
  padding: .34rem .2rem;
  text-align: center;
  font-size: .28rem;
  color: #212124;
  font-family: 'PEACE';
}

.press__automatic-part {
  justify-content: center;
}

// 按钮
.press__button--primary-s,
.press__button--primary-l {
  text-align: center;
  font-family: 'PEACE';
  width: 3.96rem;
  height: .72rem;
  line-height: .72rem;
  font-size: .4rem;
  color: #212124;
  background: url(https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/bg-btn-l.png) no-repeat;
  background-size: 100% 100%;
}

.press__button--disable-s,
.press__button--disable-l {
  width: 3.96rem;
  height: .72rem;
  line-height: .72rem;
  font-size: .4rem;
  display: block;
  font-size: .4rem;
  font-family: 'PEACE';
  color: $color-white;
  text-align: center;
  background: url(https://image-1251917893.file.myqcloud.com/tip-project/pubg/pubg-match/bg-btn-l-disable.png) no-repeat;
  background-size: 100% 100%;
}

.empty-container {
  flex: 1;
}

.press__button--disable-s,
.press__button--primary-s {
  width: 3.2rem;
}

.press__button-mr {
  margin-right: .16rem;
}

.press__button-mr-s {
  margin-right: .32rem;
}

.press__button-mr-l {
  margin-right: 1.16rem;
}

//二级tab
.press__sub-tab {
  display: flex;
  margin: .2rem .2rem 0;
  background: #edecef;
  border-radius: .04rem;

  .press__sub-tab-item {
    flex: 1;
    height: .6rem;
    line-height: .6rem;
    text-align: center;
    font-size: .24rem;
    color: rgba(33, 33, 36, .55);
    border: .02rem solid rgba(84, 84, 87, .06);
    border-right: 0;

    &:first-child {
      border-radius: .04rem 0 0 .04rem;
    }

    &:last-child {
      border-right: .02rem solid rgba(84, 84, 87, .06);
      border-radius: 0 .04rem .04rem 0;
    }

    &.press__sub-tab-item--active {
      color: #5300c3;
      background: rgba($color: #5d28f7, $alpha: .16);
      border: .02rem solid #cac8ed;

      &+.confirm-start-tab-item {
        border-left: 0;
      }
    }
  }
}

.press__button--primary-s {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;

  .press__button-tip {
    width: 2.84rem;
    height: .46rem;
    line-height: .35rem;
    color: #fff;
    font-size: .18rem;
    padding: 0 .08rem;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
    background: url(https://image-1251917893.file.myqcloud.com/gp-match-h5/img/selfmatch/gp-match-common-tip.png) no-repeat;
    background-size: 100%;
    position: absolute;
    top: -.5rem;
    left: 50%;
    transform: translateX(-50%);
    // animation: updown 1.3s infinite;
    font-family: '';
    font-family: auto;
  }
}

.press__count-down {
  display: inline-block;
}