/*
 * Hr tag / line
 *
 */

@use '../../../style/elements/ui-spacing.scss';
@import './hr-mixins.scss';

.dnb-hr {
  @include hrStyle();

  &--dashed::after {
    background-image: linear-gradient(
      to right,
      var(--hr-color, grey) 50%,
      transparent 0%
    );
    background-size: 0.5rem 0.0625rem;
    background-repeat: repeat-x;
    background-color: transparent;
  }

  &--breakout::after {
    left: -100vw;
    box-shadow: 100vw 0 0 0 var(--hr-color, grey);
    border-radius: 0;
  }

  --thickness: calc(var(--hr-thickness, 0.0625rem) + var(--modifier, 0px));

  // @deprecated
  &--light {
    --hr-thickness: 0.5px;
  }
  // @deprecated
  &--medium {
    --hr-thickness: 1.5px;
  }

  .dnb-spacing & {
    @include ui-spacing.defaultSpacing();
  }
}