@import "../../styles/typography";
@import "~monday-ui-style/dist/mixins";

.link {
  display: flex;
  align-items: center;
  color: var(--link-color);
  @include vibe-text(text2, normal);
  @include smoothing-text;
  text-decoration: none;
  writing-mode: horizontal-tb;
  @include focus-style();
}

.link:hover .text {
  text-decoration: underline;
  color: inherit;
}

.link.inlineText {
  display: inline-flex;
  align-items: unset;
}

.link.inheritFontSize {
  font-size: inherit;
  line-height: inherit;
}

.iconStart {
  line-height: 24px;
  margin-right: var(--spacing-small);
}

.iconEnd {
  line-height: 24px;
  margin-left: var(--spacing-small);
}

@supports (margin-inline-start: initial) {
  .iconStart {
    line-height: 24px;
    margin-right: 0;
    margin-inline-end: var(--spacing-xs);
  }
  .iconEnd {
    line-height: 24px;
    margin-left: 0;
    margin-inline-start: var(--spacing-xs);
  }
}