[data-fs-discount-badge] {
  // --------------------------------------------------------
  // Design Tokens for Discount Badge
  // --------------------------------------------------------

  // Low
  --fs-discount-badge-low-bkg-color       : var(--fs-badge-success-bkg-color);
  --fs-discount-badge-low-text-color      : var(--fs-badge-success-text-color);
  --fs-discount-badge-low-border-color    : var(--fs-badge-success-border-color);

  // Medium
  --fs-discount-badge-medium-bkg-color    : var(--fs-badge-warning-bkg-color);
  --fs-discount-badge-medium-text-color   : var(--fs-badge-warning-text-color);
  --fs-discount-badge-medium-border-color : var(--fs-badge-warning-border-color);

  // High
  --fs-discount-badge-high-bkg-color      : var(--fs-badge-danger-bkg-color);
  --fs-discount-badge-high-text-color     : var(--fs-badge-danger-text-color);
  --fs-discount-badge-high-border-color   : var(--fs-badge-danger-border-color);

  // --------------------------------------------------------
  // Variants Styles
  // --------------------------------------------------------

  &[data-fs-discount-badge-variant="low"] {
    color: var(--fs-discount-badge-low-text-color);

    [data-fs-badge-wrapper] {
      background-color: var(--fs-discount-badge-low-bkg-color);
      border-color: var(--fs-discount-badge-low-border-color);
    }
  }

  &[data-fs-discount-badge-variant="medium"] {
    color: var(--fs-discount-badge-medium-text-color);

    [data-fs-badge-wrapper] {
      background-color: var(--fs-discount-badge-medium-bkg-color);
      border-color: var(--fs-discount-badge-medium-border-color);
    }
  }

  &[data-fs-discount-badge-variant="high"] {
    color: var(--fs-discount-badge-high-text-color);

    [data-fs-badge-wrapper] {
      background-color: var(--fs-discount-badge-high-bkg-color);
      border-color: var(--fs-discount-badge-high-border-color);
    }
  }
}