@import "./lib.less";
@import "./variables/components/link.less";

._veui-link {
  cursor: pointer;
  color: @veui-link-font-color-normal;
  text-decoration: @veui-link-text-decoration;
  outline: none;
  .veui-transition(color);

  &:hover {
    color: @veui-link-font-color-normal-hover;
    text-decoration: @veui-link-text-decoration-hover;
  }

  &[data-focus-visible-added] {
    color: @veui-link-font-color-normal-focus;
    text-decoration: @veui-link-text-decoration-focus;
    .padding(@veui-link-padding-focus);
    .veui-focus-ring(@veui-link-border-color-focus, @veui-link-shadow-focus);
    border-radius: @veui-link-border-radius-focus;
  }

  &:active {
    color: @veui-link-font-color-normal-active;
    text-decoration: @veui-link-text-decoration-active;
  }

  &.@{veui-prefix}-disabled {
    text-decoration: @veui-link-text-decoration;

    &,
    &:hover {
      color: @veui-link-font-color-normal-disabled;
    }
  }

  &[ui~="s"] {
    font-size: @veui-link-font-size-s;
  }
  &[ui~="m"] {
    font-size: @veui-link-font-size-m;
  }

  &[ui~="strong"] {
    color: @veui-link-font-color-strong;

    &:hover {
      color: @veui-link-font-color-strong-hover;
    }

    &[data-focus-visible-added] {
      color: @veui-link-font-color-strong-focus;
    }

    &:active {
      color: @veui-link-font-color-strong-active;
    }

    &.@{veui-prefix}-disabled {
      color: @veui-link-font-color-strong-disabled;
    }
  }
}