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

.ds-image-caption {
  margin-top: ds-spacing($ds-s-050);
  @include ds-typography($ds-typography-functional-body-sm) {
    color: $ds-color-text-primary;
  }

  @at-root .ds-force-px#{&} {
    @include ds-typography($ds-typography-functional-body-sm, true);
  }

  > .ds-article-image__credits {
    color: $ds-color-text-primary-subtle;

    &.ds-article-image__credits--nowrap {
      white-space: nowrap;
    }

    &.ds-article-image__credits--nowrap-bigscreen {
      @include ds-mq-smallest-breakpoint(tablet) {
        white-space: nowrap;
      }
    }
  }
}