@import '../colors';
@import '../mixins';

.tix-countdown.v4 {
  @include font-base;
  display: flex;
  align-items: center;
  padding: 0;
  font-weight: $font-weight-bold;
  margin: 0px;

  &.mobile {
    @include font-size-b3;

    .time {
      width: 20px;
      height: 20px;
    }
  }

  &.desktop {
    @include font-size-b1-desktop;

    .time {
      width: 36px;
      height: 36px;
    }
  }

  li {
    list-style: none;
    margin-right: 4px;
    color: $color-R400;

    &:last-child {
      margin-right: 0;
    }
  }

  .time {
    background-color: $color-R400;
    color: $color-N0;
    border-radius: 4px;
    @include flex-center;
  }
}