/*
 * Copyright (c) 2026, Salesforce, Inc.,
 * All rights reserved.
 * For full license text, see the LICENSE.txt file
 */

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

.slds-icon_container {
  padding-block-start: var(--slds-s-icon-spacing);
  padding-block-end: var(--slds-s-icon-spacing);
  padding-inline-start: var(--slds-s-icon-spacing);
  padding-inline-end: var(--slds-s-icon-spacing);
  border-radius: var(--slds-c-icon-radius-border, var(--slds-s-icon-radius-border));
  border-width: var(--slds-s-icon-sizing-border, 0);
  border-style: solid;
  border-color: var(--slds-s-icon-color-border, transparent);
  background-color: var(--slds-c-icon-color-background, var(--slds-s-icon-color-background));
  display: inline-block;
  line-height: 1; /* Fixes alignment issues on core */
}

/**
 * Circle container for icons
 */
.slds-icon_container_circle {
  --slds-c-icon-radius-border: var(--slds-g-radius-border-circle);

  padding: var(--slds-g-spacing-2);
}

/**
 * Horizontally flip icons
 */
[dir='rtl'] .slds-icon_flip {
  transform: scaleX(-1);
}

.slds-icon {
  display: inline-flex;
  height: var(--_slds-c-icon-sizing, var(--slds-s-icon-sizing, var(--slds-g-sizing-9)));
  width: var(--_slds-c-icon-sizing, var(--slds-s-icon-sizing, var(--slds-g-sizing-9)));
  fill: var(--slds-c-icon-color-foreground, var(--slds-g-color-neutral-base-100));
}

/**
 * Sizing variants
 *
 * Note: width & height must be used instead of reassigning --_slds-c-icon-sizing
 * because LBC use lightning-primitive-icon which does not use .slds-icon
 */
.slds-icon_xxx-small {
  width: var(--slds-g-sizing-3);
  height: var(--slds-g-sizing-3);
}

.slds-icon_xx-small {
  width: calc(var(--slds-g-sizing-1) + var(--slds-g-sizing-4));
  height: calc(var(--slds-g-sizing-1) + var(--slds-g-sizing-4));
}

.slds-icon_x-small {
  width: var(--slds-g-sizing-5);
  height: var(--slds-g-sizing-5);
}

.slds-icon_small {
  width: var(--slds-g-sizing-7);
  height: var(--slds-g-sizing-7);
}

/**
 * "Medium" is the default size, no class is generated. This is pulled from
 * mixed-mode, leaving it here for future folks looking for this class and
 * size combination.
 *
 * Note: 'size' attribute is used in mixed-mode because LBC icon is broken
 * down into two components, lightning-icon and lightning-primitive-icon,
 * and the sizing classes weren't available to primitive icon which can be
 * used on its own.

 [size="medium"] .slds-icon {
  --_slds-c-icon-sizing: var(--slds-g-sizing-9);
} */

.slds-icon_large {
  --_slds-c-icon-sizing: var(--slds-g-sizing-10);
}

.slds-icon-text-warning {
  --slds-c-icon-color-foreground: var(--slds-g-color-warning-1);
}

.slds-icon-text-success {
  --slds-c-icon-color-foreground: var(--slds-g-color-success-1);
}

.slds-icon-text-error {
  --slds-c-icon-color-foreground: var(--slds-g-color-error-1);
}

.slds-icon-text-light {
  --slds-c-icon-color-foreground: var(--slds-g-color-neutral-base-70);
}

.slds-icon_container[icon-name^='action'] {
  --slds-c-icon-radius-border: var(--slds-g-radius-border-circle);

  padding-block: var(--slds-g-sizing-3);
  padding-inline: var(--slds-g-sizing-3);
}

.slds-icon_container[icon-name^='action'],
.slds-icon_container[class^='action'],
.slds-icon_container[icon-name^='standard'],
.slds-icon_container[class^='standard'],
.slds-icon_container[icon-name^='custom'],
.slds-icon_container[class^='custom'] {
  /* Default color of an icon in a container. */
  --slds-c-icon-color-foreground: #fff;
}

/**
 * Default Color
 */

.slds-icon-text-default {
  --slds-c-icon-color-foreground: var(
    --slds-c-icon-color-foreground-default,
    var(--slds-s-icon-color-foreground)
  );
}

.slds-icon-text-default.slds-is-disabled {
  fill: var(--slds-g-color-disabled-1);
}

/**
 * Current color
 */
.slds-current-color .slds-icon {
  --slds-c-icon-color-foreground: currentColor;
}

/**
 * For the initial alpha version, we're hardcoding in the various unique icon styles.
 *
 * Next version, we want to dynamically generate these from legacy SLDS with the
 * following design pattern:
 *
 * [type="action"][icon-name="approval"] {
 *   --sds-c-icon-color-background: var(--slds-c-icon-color-background, #111);
 * }
 */

.slds-icon_disabled {
  background-color: currentcolor;
}

.slds-input__icon {
  --_slds-c-icon-sizing: calc(var(--slds-g-sizing-1) + var(--slds-g-sizing-4));

  position: absolute;
  top: 50%;
  margin-block-start: -0.4375rem;
  line-height: var(--slds-g-font-lineheight-1);
  border: 0;
  z-index: 2;
  fill: var(--slds-c-icon-color-foreground);
}