/*
 * desc: 赛事即将开始组件样式
 * author: alltasxiao
 * email: alltasxiao@tencent.com
 */
@import '../../common/style/general/variables.scss';
@import '../../common/style/general/mixins/flex.scss';
@import './_var.scss';

.#{$prefix}-schedule-not-start {
  position: relative;
  width: $sns-card-width;
  height: $sns-card-height;
  background: $sns-card-bg;
  border: 1px solid #eae7e2;
  border-radius: $sns-card-radius;
  box-shadow: $sns-card-shadow;
  overflow: hidden;

  &__status-bar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: $sns-status-bar-height;
    background: $sns-status-bar-bg;
  }

  &__content {
    @include flex(column, center, center);
    height: 100%;
    padding: $sns-card-padding;
    text-align: center;
  }

  &__title {
    margin-bottom: $sns-title-margin-bottom;
    color: $sns-title-color;
    font-size: $sns-title-font-size;
    font-weight: 500;
    line-height: 1.5;
  }

  &__countdown {
    @include flex(row, center, center);
    margin-bottom: $sns-countdown-margin-bottom;
    gap: .16rem;

    &-item {
      @include flex(row, center, center);
      width: $sns-countdown-item-width;
      height: $sns-countdown-item-height;
      background: $sns-countdown-bg;
      // border-radius: $sns-countdown-radius;
      color: $sns-countdown-color;
      font-size: $sns-countdown-font-size;
      font-weight: 600;
    }

    &-separator {
      color: $sns-countdown-separator-color;
      font-size: $sns-countdown-separator-font-size;
      font-weight: 500;
    }
  }

  &__waitstart-button {
    margin: 0 $sns-waitstart-margin;
    width: $sns-waitstart-width;
    height: $sns-waitstart-height;
    @include flex(row, center, center);
    background-color: $sns-waitstart-bg;
    color: $sns-waitstart-color;
    font-size: $sns-waitstart-font-size;
    letter-spacing: .01rem;
    font-weight: 400;
  }
}