@charset "utf-8";
// Copyright 2019, Oath Inc.
// Licensed under the terms of the MIT license. See LICENSE file in project root for terms.

@import '../maps/color-maps.scss';
@import '../utilities/global-variables.scss';

$links-text-color: map-get($denali-brand-colors,"300") !default;
$links-hover-text-color: map-get($denali-brand-colors,"400") !default;
$links-disabled-text-color: rgba(map-get($denali-grey-colors,"800"), 0.2) !default;
$links-secondary-text-color: map-get($denali-grey-colors,"700") !default;
$links-secondary-hover-text-color: map-get($denali-grey-colors,"800") !default;
$links-inverse-text-color: map-get($denali-grey-colors,"100") !default;
$links-inverse-hover-text-color: rgba(map-get($denali-grey-colors,"100"), .4) !default;
$links-small-text-size: 1.2rem !default;

@mixin links-default {
  a,
  .link {
    // Standard
    color: $links-text-color;
    text-decoration: none;
    font-size: inherit;
    cursor: pointer;

    // Hover
    &:hover,
    &.is-active {
      color: $links-hover-text-color;
    }

    // Disabled
    &[disabled],
    &.is-disabled {
      color: $links-disabled-text-color;
      cursor: not-allowed;
    }

    // Inverse
    &.is-inverse {
      color: $links-inverse-text-color;
      &:hover {
        color: $links-inverse-hover-text-color;
      }
    }

    // Size
    &.is-small {
      font-size: $links-small-text-size;
    }

    // Secondary Links
    &.is-secondary {
      color: $links-secondary-text-color;
      &:hover {
        color: $links-secondary-hover-text-color !important;
      }
    }

    // Sub-action
    &.is-sub,
    .is-sub {
      opacity: .5;
      &:hover {
        opacity: 1;
      }
    }

    // Icons
    &.has-icon-front {
      .d-icon {
        margin-right: 4px;
        font-size: 1.4rem !important;
        vertical-align: sub;
      }
    }
    &.has-icon-back {
      .d-icon {
        margin-left: 2px;
        font-size: 1.2rem !important;
        vertical-align: middle;
      }
      &.is-small .d-icon {
        vertical-align: text-top;
      }
    }
    &:hover > .d-icon.is-sub {
      color: $links-hover-text-color;
      opacity: 1;
    }
    &.is-secondary:hover > .d-icon.is-sub {
      color: $links-secondary-hover-text-color;
      opacity: 1;
    }
  }
}

@mixin links-theme {
  a,
  .link {
    color: $links-text-color;

    &:hover,
    &.is-active {
      color: $links-hover-text-color;
    }

    &[disabled],
    &.is-disabled {
      color: $links-disabled-text-color;
    }

    &.is-inverse {
      color: $links-inverse-text-color;

      &:hover {
        color: $links-inverse-hover-text-color;
      }
    }

    &.is-small {
      font-size: $links-small-text-size;
    }

    &.is-secondary {
      color: $links-secondary-text-color;

      &:hover {
        color: $links-secondary-hover-text-color !important;
      }
    }

    &:hover>.d-icon.is-sub {
      color: $links-hover-text-color;
    }

    &.is-secondary:hover>.d-icon.is-sub {
      color: $links-secondary-hover-text-color;
    }
  }
}