@use "sass:map";

@use "../../di";
@use "../../variables/units";
@use "link.variables" as link-variables;

@mixin hideIcons() {
  --_dso-di-background-image: none;
  --_dso-link-icon-padding-inline-start: 0;
  --_dso-link-icon-padding-inline-end: 0;
}

@mixin pseudo() {
  &:hover,
  &:focus-visible {
    color: var(--link-hover-color);
    text-decoration: underline;
  }

  &:active {
    text-decoration: none;
  }
}

@mixin root($is-html-a-element: true) {
  overflow-wrap: anywhere;
  background-color: transparent;
  color: var(--link-color);
  text-decoration: underline;
  text-underline-offset: link-variables.$link-underline-offset;

  @include pseudo();

  .sr-only + dso-icon {
    margin-inline-start: 0;
  }

  @if ($is-html-a-element) {
    &:visited {
      color: var(--link-visited-color);
    }
  } @else {
    cursor: pointer;
  }
}

@mixin clean {
  text-decoration: none;

  &:hover,
  &:focus-visible {
    text-decoration: none;
  }

  &:active {
    text-decoration: underline;
  }
}

@mixin reverse {
  text-decoration: none;

  &:hover,
  &:focus-visible,
  &:active {
    text-decoration: underline;
  }
}

@mixin linkIcons() {
  @each $mode, $value in link-variables.$linkIcons {
    &#{map.get($value, "selector")} {
      @include _mode-base($value);
    }
  }
}

@mixin _mode-base($link-map) {
  $icon-placement: map.get($link-map, "icon-placement");

  @if $icon-placement != "after" and $icon-placement != "before" {
    @error 'Use mixin argument "before" or "after".';
  }

  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;

  @if $icon-placement == "before" {
    padding-inline-start: var(--_dso-link-icon-padding-inline-start, 1.5em);
    background-position: bottom -3px left 0;
  }

  @if $icon-placement == "after" {
    padding-inline-end: var(--_dso-link-icon-padding-inline-end, 1.5em);
    background-position: bottom -3px right 0;
  }

  $icon: map.get($link-map, "icon");

  @if map.has-key($link-map, "icon-color") {
    $icon: $icon + "-" + map.get($link-map, "icon-color");
  }

  $icon-hover: map.get($link-map, "icon");

  @if map.has-key($link-map, "icon-hover-color") {
    $icon-hover: $icon-hover + "-" + map.get($link-map, "icon-hover-color");
  }

  $icon: map.get($link-map, "icon");

  @if map.has-key($link-map, "icon-color") {
    $icon: $icon + "-" + map.get($link-map, "icon-color");
  }

  $icon-hover: map.get($link-map, "icon");

  @if map.has-key($link-map, "icon-hover-color") {
    $icon-hover: $icon-hover + "-" + map.get($link-map, "icon-hover-color");
  }

  @include di.variant($icon);

  @if ($icon != $icon-hover) {
    &:hover,
    &:focus-visible {
      @include di.variant($icon-hover);
    }
  }
}

@mixin mode-download() {
  @include _mode-base(map.get(link-variables.$linkIcons, "download"));
}

@mixin mode-extern() {
  @include _mode-base(map.get(link-variables.$linkIcons, "extern"));
}

@mixin mode-phone() {
  @include _mode-base(map.get(link-variables.$linkIcons, "phone"));
}

@mixin mode-email() {
  @include _mode-base(map.get(link-variables.$linkIcons, "mail"));
}
