// Lightning Design System 2.264.0-beta.1
// Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
// Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license

@include deprecate('4.0.0', 'Use .slds-dropdown-trigger--hover instead') {

  .slds-dropdown-trigger {

    .slds-dropdown {
      visibility: hidden;
      opacity: 0;
      transition: opacity $duration-quickly linear, visibility $duration-quickly linear;
    }

    &:hover,
    &:focus {
      outline: 0;

      .slds-dropdown {
        visibility: visible;
        opacity: 1;
        transition: opacity $duration-quickly linear, visibility $duration-quickly linear;
      }
    }
  }
}

@include deprecate('4.0.0', 'Please use slds-nubbin-{position} instead') {

  .slds-dropdown_nubbin-top,
  .slds-dropdown--nubbin-top {
    @include nubbin(top, 'before', $color: var(--slds-g-color-neutral-base-100, #{$color-background-alt}));
    @include nubbin(top, $color: var(--slds-g-color-neutral-base-100, #{$color-background-alt}));
    margin-top: ($nubbin-size-default * 0.5);

    &:before {
      background: var(--slds-g-color-neutral-base-100, #{$color-background-alt});
    }

    &:after {
      background: var(--slds-g-color-neutral-base-100, #{$color-background-alt});
      box-shadow: -1px -1px 0 0 rgba(0, 0, 0, 0.16);
      z-index: -1;
    }

    &.slds-dropdown_left,
    &.slds-dropdown--left {
      left: ($spacing-medium * -1);

      &:before,
      &:after {
        left: $spacing-large;
        margin-left: 0;
      }
    }

    &.slds-dropdown_right,
    &.slds-dropdown--right {
      right: ($spacing-medium * -1);

      &:before,
      &:after {
        left: auto;
        right: $spacing-large;
        margin-left: 0;
      }
    }
  }
}

@include deprecate('4.0.0', 'Icon should be used in the html to create space') {

  .slds-dropdown__item {

    .slds-has-icon {
      position: relative;

      .slds-icon {
        @include square($square-icon-medium-content);
        position: absolute;
        top: 50%;
        margin-top: (($square-icon-medium-content * 0.5) * -1);
        fill: var(--slds-g-color-neutral-base-50, #{$color-text-icon-default});
      }

      .slds-icon_left,
      .slds-icon--left {
        left: $spacing-small;
      }

      .slds-icon_right,
      .slds-icon--right {
        right: $spacing-small;
      }
    }

    .slds-has-icon_left > a,
    .slds-has-icon--left > a,
    .slds-has-icon_left > span,
    .slds-has-icon--left > span {
      padding-left: $spacing-x-large;
    }

    .slds-has-icon_right > a,
    .slds-has-icon--right > a,
    .slds-has-icon_right > span,
    .slds-has-icon--right > span {
      padding-right: $spacing-x-large;
    }

    .slds-has-icon_left-right > a,
    .slds-has-icon--left-right > a,
    .slds-has-icon_left-right > span,
    .slds-has-icon--left-right > span {
      padding: {
        left: $spacing-x-large;
        right: $spacing-x-large;
      }
    }
  }
}
