.link {
    cursor: pointer;
    display: inline-flex;
    max-width: 100%;
    color: var(--interactive-text);
    font-weight: var(--font-weight-link);
    /* text-transform: var(--text-settings-link-case); */
    letter-spacing: var(--letter-spacing-2m);
    line-height: var(--size-m);
    text-decoration: none;
    transition: color .2s ease, box-shadow .2s ease;
    vertical-align: top;
    z-index: 1;
    border-radius: var(--border-radius-xs);
    outline: 0
}

.link:hover, .link.link-overview--hover {
    color: var(--hover-primary)
}

.link:active, .link.link-overview--pressed {
    color: var(--hover-primary)
}

.link.link--capitalize {
    text-transform: capitalize
}

.link.link--ignore-case {
    text-transform: none
}

[data-whatinput=keyboard] .link:focus {
    transition: color .2s ease, outline .2s ease;
    border-radius: var(--accessibility-border-radius);
    outline: var(--accessibility-border) solid var(--accessibility-focus-color);
    outline-offset: var(--accessibility-space-border)
}

.link.link--large {
    font-size: var(--heading-03-font-size);
    font-weight: var(--font-weight);
    letter-spacing: var(--letter-spacing-s);
    line-height: var(--heading-03-line-height)
}

.link .link__icon {
    vertical-align: top;
    line-height: inherit;
    float: left;
    height: calc(var(--size-2m) - 4 * var(--button-border-width));
    display: inherit
}

.link .link__icon::before {
    line-height: inherit;
    margin: 0 var(--size-2xs) 0 0;
    font-size: var(--size-m);
    width: var(--size-m);
    height: var(--size-m);
    display: inline-block;
    font-weight: initial
}

.link.link--icon-right {
    text-align: right
}

.link.link--icon-right .link__icon {
    float: right
}

.link.link--icon-right .link__icon::before {
    margin: 0 0 0 var(--size-2xs)
}

.link .link__text {
    display: flex;
    flex-direction: column;
    word-break: break-word;
    word-wrap: break-word;
    overflow-wrap: break-word
}

.link--center {
    text-align: center;
    display: inline-block
}

.link--center .link__icon {
    vertical-align: top;
    display: inline-block;
    float: none
}

.link--center .link__text {
    display: inline
}

.link--text {
    vertical-align: baseline;
    font-weight: var(--font-weight-bold);
    text-transform: none;
    letter-spacing: normal;
    border-radius: var(--border-radius-s);
    color: var(--interactive-text)
}

[data-whatinput=keyboard] .link--text:focus {
    padding: 0
}

.link.link--negative {
    color: var(--negative-01)
}

.link.link--negative:hover, .link.link--negative.link-overview-negative--hover {
    color: var(--negative-01)
}

.link.link--negative:active, .link.link--negative.link-overview-negative--pressed {
    color: var(--negative-01)
}

.link.link--negative:disabled, .link.link--negative[aria-disabled] {
    color: var(--negative-dimmed)
}

.link.link--black {
    color: var(--grey-1)
}

.link.link--black:hover, .link.link--black.link-overview-black--hover {
    color: var(--grey-4)
}

.link.link--black:active, .link.link--black.link-overview-black--pressed {
    color: var(--grey-2)
}

.link.link--black:disabled, .link.link--black[aria-disabled] {
    color: var(--grey-5)
}

.link:disabled, .link[aria-disabled] {
    cursor: not-allowed;
    color: var(--disabled-04);
    position: relative
}

.link:disabled:focus, .link[aria-disabled]:focus {
    outline: none;
    box-shadow: none
}
