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

/**
 * @summary Provides 1rem base padding and borders
 *
 * @selector .slds-box
 * @modifier
 */
.slds-box {
  @include box($borders: around);
}

/**
  * @summary Changes padding to .25rem
  *
  * @selector .slds-box_xx-small
  * @restrict .slds-box
  * @modifier
  */
.slds-box_xx-small,
.slds-box--xx-small {
  padding: $spacing-xx-small;
}

/**
  * @summary Changes padding to .5rem
  *
  * @selector .slds-box_x-small
  * @restrict .slds-box
  * @modifier
  */
.slds-box_x-small,
.slds-box--x-small {
  padding: $spacing-x-small;
}

/**
  * @summary Changes padding to .75rem
  *
  * @selector .slds-box_small
  * @restrict .slds-box
  * @modifier
  */
.slds-box_small,
.slds-box--small {
  padding: $spacing-small;
}

// Deprecate for slds-border--around
.slds-box_border,
.slds-box--border {
  @include box($padding: 0, $borders: around);
}

/**
 * @summary Handles interactions if the box is applied to an actionable element
 *
 * @selector .slds-box_link
 * @restrict .slds-box
 * @modifier
 * @notes Requires a block display property, e.g. block, inline-block, flex
 */
.slds-box_link {

  &,
  &:active,
  &:focus,
  &:hover {
    color: inherit;
    text-decoration: inherit;
  }

  &:hover,
  &:focus {
    cursor: pointer;
    outline: 0;
    border: $border-width-thin solid var(--slds-g-color-border-brand-2, #{$color-border-selection-hover});
    box-shadow: 0 0 0 1px var(--slds-g-color-border-brand-2, #{$color-border-selection-hover}) inset;
  }

  &:focus {
    box-shadow: var(--_slds-g-shadow-outset-focus, #{$shadow-button-focus});
    border: $border-width-thin solid var(--slds-g-color-border-base-1, #e5e5e5);
  }
}