@use "../../foundations/helpers/forward.helpers.scss" as *;

.ds-video-caption {
  @include ds-typography($ds-typography-functional-body-sm) {
    color: $ds-color-text-primary;
  }

  .ds-video-caption__duration {
    margin-right: ds-spacing($ds-s-025);
    @include ds-typography($ds-typography-functional-body-sm, $fontWeight: $ds-fontweight-bold);
  }

  @at-root .ds-force-px#{&} {
    @include ds-typography($ds-typography-functional-body-sm, true);
    .ds-video-caption__duration {
      @include ds-typography($ds-typography-functional-body-sm, $forcePx: true, $fontWeight: $ds-fontweight-bold);
    }
  }
}
