@import '../../variables';

.#{$prefix}-ui-playbacktimelabel {
  @extend %ui-label;

  // PlaybackTimeLabel writes its border-box offsetWidth back as min-width. Keep min-width
  // border-box too, or padding is added again and the measurement grows on every update.
  box-sizing: border-box;
  font-weight: $font-weight-medium;
  text-transform: uppercase;

  &.#{$prefix}-ui-playbacktimelabel-live {
    @include focusable;

    cursor: pointer;
    padding: calc($icon-size * 0.25);

    &::before {
      color: $color-secondary;
      content: '●';
      padding-right: 0.2em;
    }

    &.#{$prefix}-ui-playbacktimelabel-live-edge {
      &::before {
        color: $color-red;
      }
    }
  }
}