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

@layer theme {
  .slds-pill {
    /* Surface */
    --slds-c-pill-color-background: var(--slds-g-color-surface-container-1);
    --slds-c-pill-color-background-hover: var(--slds-s-pill-color-background-hover);
    --slds-c-pill-color-border: var(--slds-g-color-border-2);
    --slds-c-pill-color-border-focus: var(--slds-g-color-border-2);
    --slds-c-pill-sizing-border: var(--slds-g-sizing-border-1);
    --slds-c-pill-radius-border: var(--slds-g-radius-border-pill);
    --slds-c-pill-shadow-focus: var(--slds-g-shadow-inset-focus-1);

    /* Typography */
    --slds-c-pill-font-size: var(--slds-g-font-scale-neg-1);
    --slds-c-pill-font-line-height: var(--slds-g-font-line-height-2);
    --slds-c-pill-font-weight: var(--slds-g-font-weight-3);

    /* Spacing — axis tier. */
    --slds-c-pill-spacing-block: var(--slds-g-spacing-1);
    --slds-c-pill-spacing-inline: var(--slds-g-spacing-2);
    --slds-c-pill-margin-inline-start-adjacent: var(--slds-g-spacing-1);

    /* Action element padding inherits the pill's defaults for non-link
       pills; the `_link` modifier overrides with a compound that
       reserves trailing space for the absolutely-positioned remove
       icon. */
    --slds-c-pill-action-spacing-block: var(--slds-c-pill-spacing-block);
    --slds-c-pill-action-spacing-inline: var(--slds-c-pill-spacing-inline);

    /* Label focus ring */
    --slds-c-pill-label-radius-border: var(--slds-g-radius-border-1);
    --slds-c-pill-label-shadow-focus: var(--slds-g-shadow-outline-focus-1);

    /* Icon slot */
    --slds-c-pill-icon-size: var(--slds-g-sizing-5);
    --slds-c-pill-icon-font-size: var(--slds-g-font-scale-neg-2);
    --slds-c-pill-icon-spacing-inline: var(--slds-g-spacing-1);

    /* Remove slot */
    --slds-c-pill-remove-size: var(--slds-g-sizing-5);
    --slds-c-pill-remove-icon-size: var(--slds-g-sizing-4);
    --slds-c-pill-remove-icon-font-size: var(--slds-g-sizing-3);
    --slds-c-pill-remove-icon-line-height: var(--slds-g-font-line-height-1);
    --slds-c-pill-remove-spacing: var(--slds-g-spacing-1);
    --slds-c-pill-remove-color-foreground: var(--slds-g-color-accent-2);
  }

  /* Link variant only: the remove icon is absolutely-positioned, so the
     action element's trailing inline padding reserves space for it. The
     leading-with-icon hook covers the case where a leading icon also
     sits absolutely. */
  .slds-pill.slds-pill_link {
    --slds-c-pill-action-spacing-inline-start: var(--slds-g-spacing-2);
    --slds-c-pill-action-spacing-inline-end: var(--slds-g-spacing-5);
    --slds-c-pill-action-spacing-inline-start-with-icon: calc(
      var(--slds-g-spacing-2) + var(--slds-g-sizing-5) + var(--slds-g-spacing-2)
    );
  }

  /* Bare modifier: reassign canonical hooks under the Rule-5 compound. */
  .slds-pill.slds-pill_bare {
    --slds-c-pill-color-background: transparent;
    --slds-c-pill-sizing-border: 0;
  }

  /* Error state: reassign canonical hooks to global error tokens. */
  .slds-pill.slds-has-error {
    --slds-c-pill-color-foreground: var(--slds-g-color-error-1);
    --slds-c-pill-color-border: var(--slds-g-color-border-error-1);
    --slds-c-pill-font-weight: var(--slds-g-font-weight-4);
  }

  .slds-pill.slds-pill_container {
    --slds-c-pill-container-color-background: var(--slds-g-color-surface-1);
    --slds-c-pill-container-color-border: var(--slds-s-input-color-border);
    --slds-c-pill-container-sizing-border: var(--slds-g-sizing-border-1);
    --slds-c-pill-container-radius-border: var(--slds-g-radius-border-4);
    --slds-c-pill-container-spacing-block: var(--slds-g-spacing-1);
    --slds-c-pill-container-spacing-inline: var(--slds-g-spacing-1);
  }
}
