/**
 * @prop --group-link-color: Default link color
 * @prop --group-link-color-hover: Link color on hover
 * @prop --group-link-color-active: Link color on pressed
 * @prop --group-link-font-weight: Default link font weight
 * @prop --group-link-radius: Default link border radius
 * @prop --group-link-text-decoration: Link text decoration
 * @prop --group-link-text-underline-offset: Link decoration underline-offset 0.25rem
 * @prop --group-link-text-decoration-thickness: Link decoration thickness 2px
 * @prop --group-link-inverted-color: Link color on dark background
 * @prop --group-link-inverted-color-hover: Link color on dark background when hovering
 * @prop --group-link-inverted-color-active: Link color on dark background when pressing
 * @prop --group-link-inverted-light-font-weight: Link font weight on dark background
 * @prop --group-link-inverted-light-text-decoration: Link text-decoration on dark background
 */

:root
  --group-link-color: var(--group-light-text-on-light)
  --group-link-color-hover: var(--group-light-text-on-light-hover)
  --group-link-color-active: var(--group-light-text-on-light-pressed)
  --group-link-font-weight: var(--group-font-weight-bold)
  --group-link-radius: var(--group-radius-normal)
  --group-link-background: transparent
  --group-link-border-color: transparent
  --group-link-text-decoration: underline
  --group-link-text-underline-offset: 0.25rem
  --group-link-text-decoration-thickness: var(--group-scale-3-border-width-small)
  //
  // inverted
  --group-link-inverted-color: var(--group-light-text-on-dark)
  --group-link-inverted-color-hover: var(--group-light-text-on-dark-hover)
  --group-link-inverted-color-active: var(--group-light-text-on-dark-pressed)
  //
  // inverted light
  --group-link-inverted-light-font-weight: var(--group-font-weight-regular)
  --group-link-inverted-light-text-decoration: none