igniteui-theming
Version:
A set of Sass variables, mixins, and functions for generating palettes, typography, and elevations used by Ignite UI components.
1 lines • 198 kB
CSS
@utility light-avatar{--background: var(--ig-avatar-background, var(--ig-gray-400));--color: var(--ig-avatar-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color: var(--ig-avatar-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--border-radius: var(--ig-avatar-border-radius, 0.25rem);--size: var(--ig-avatar-size, max(var(--is-large, 1) * max(5.5rem, -1 * 5.5rem), var(--is-medium, 1) * max(4rem, -1 * 4rem), var(--is-small, 1) * max(2.5rem, -1 * 2.5rem)));--default-size: var(--ig-avatar-default-size, 1);--ig-theme: bootstrap}@utility dark-avatar{--background: var(--ig-avatar-background, var(--ig-gray-200));--color: var(--ig-avatar-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color: var(--ig-avatar-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--border-radius: var(--ig-avatar-border-radius, 0.25rem);--size: var(--ig-avatar-size, max(var(--is-large, 1) * max(5.5rem, -1 * 5.5rem), var(--is-medium, 1) * max(4rem, -1 * 4rem), var(--is-small, 1) * max(2.5rem, -1 * 2.5rem)));--default-size: var(--ig-avatar-default-size, 1);--ig-theme: bootstrap}@utility light-badge{--elevation: var(--ig-badge-elevation, var(--ig-elevation-1));--icon-color: var(--ig-badge-icon-color, hsla(from color(from var(--background-color) var(--y-contrast)) h 0 l/1));--text-color: var(--ig-badge-text-color, hsla(from color(from var(--background-color) var(--y-contrast)) h 0 l/1));--border-color: var(--ig-badge-border-color, var(--ig-gray-50));--background-color: var(--ig-badge-background-color, var(--ig-primary-500));--border-radius: var(--ig-badge-border-radius, 0.25rem);--shadow: var(--ig-badge-shadow, var(--ig-elevation-1));--ig-theme: bootstrap}@utility dark-badge{--elevation: var(--ig-badge-elevation, var(--ig-elevation-1));--icon-color: var(--ig-badge-icon-color, hsla(from color(from var(--background-color) var(--y-contrast)) h 0 l/1));--text-color: var(--ig-badge-text-color, hsla(from color(from var(--background-color) var(--y-contrast)) h 0 l/1));--border-color: var(--ig-badge-border-color, var(--ig-gray-50-contrast));--background-color: var(--ig-badge-background-color, var(--ig-primary-500));--border-radius: var(--ig-badge-border-radius, 0.25rem);--shadow: var(--ig-badge-shadow, var(--ig-elevation-1));--ig-theme: bootstrap}@utility light-bottom-nav{--elevation: var(--ig-bottom-nav-elevation, var(--ig-elevation-8));--background: var(--ig-bottom-nav-background, var(--ig-gray-50));--icon-color: var(--ig-bottom-nav-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-selected-color: var(--ig-bottom-nav-icon-selected-color, var(--ig-primary-500));--label-color: var(--ig-bottom-nav-label-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--label-selected-color: var(--ig-bottom-nav-label-selected-color, var(--ig-primary-500));--icon-disabled-color: var(--ig-bottom-nav-icon-disabled-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--label-disabled-color: var(--ig-bottom-nav-label-disabled-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--border-color: var(--ig-bottom-nav-border-color, transparent);--shadow: var(--ig-bottom-nav-shadow, var(--ig-elevation-8));--ig-theme: bootstrap}@utility dark-bottom-nav{--elevation: var(--ig-bottom-nav-elevation, var(--ig-elevation-8));--background: var(--ig-bottom-nav-background, var(--ig-gray-50));--icon-color: var(--ig-bottom-nav-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-selected-color: var(--ig-bottom-nav-icon-selected-color, var(--ig-primary-500));--label-color: var(--ig-bottom-nav-label-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--label-selected-color: var(--ig-bottom-nav-label-selected-color, var(--ig-primary-500));--icon-disabled-color: var(--ig-bottom-nav-icon-disabled-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--label-disabled-color: var(--ig-bottom-nav-label-disabled-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--border-color: var(--ig-bottom-nav-border-color, transparent);--shadow: var(--ig-bottom-nav-shadow, var(--ig-elevation-8));--ig-theme: bootstrap}@utility light-button-group{--elevation: var(--ig-button-group-elevation, var(--ig-elevation-0));--idle-shadow-color: var(--ig-button-group-idle-shadow-color, hsla(from var(--item-background) h s l/0.5));--selected-shadow-color: var(--ig-button-group-selected-shadow-color, var(--idle-shadow-color));--item-text-color: var(--ig-button-group-item-text-color, hsla(from color(from var(--item-background) var(--y-contrast)) h 0 l/1));--item-background: var(--ig-button-group-item-background, var(--ig-primary-500));--item-border-color: var(--ig-button-group-item-border-color, hsl(from var(--item-background) h s calc(l * 0.8)));--item-hover-background: var(--ig-button-group-item-hover-background, hsl(from var(--item-background) h s calc(l * 0.9)));--item-hover-text-color: var(--ig-button-group-item-hover-text-color, hsla(from color(from var(--item-hover-background) var(--y-contrast)) h 0 l/1));--item-focused-text-color: var(--ig-button-group-item-focused-text-color, hsla(from color(from var(--item-focused-background) var(--y-contrast)) h 0 l/1));--item-focused-border-color: var(--ig-button-group-item-focused-border-color, var(--item-border-color));--disabled-background-color: var(--ig-button-group-disabled-background-color, var(--item-background));--disabled-selected-background: var(--ig-button-group-disabled-selected-background, hsla(from var(--item-selected-background) h s l/0.3));--border-radius: var(--ig-button-group-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--default-size: var(--ig-button-group-default-size, 2);--item-icon-color: var(--ig-button-group-item-icon-color, var(--item-text-color));--item-hover-border-color: var(--ig-button-group-item-hover-border-color, var(--item-border-color));--item-hover-icon-color: var(--ig-button-group-item-hover-icon-color, var(--item-hover-text-color));--item-focused-background: var(--ig-button-group-item-focused-background, var(--item-hover-background));--item-focused-hover-background: var(--ig-button-group-item-focused-hover-background, hsl(from var(--item-focused-background) h s calc(l * 0.9)));--item-selected-background: var(--ig-button-group-item-selected-background, hsl(from var(--item-background) h s calc(l * 0.7)));--item-selected-text-color: var(--ig-button-group-item-selected-text-color, hsla(from color(from var(--item-selected-background) var(--y-contrast)) h 0 l/1));--item-selected-icon-color: var(--ig-button-group-item-selected-icon-color, var(--item-selected-text-color));--item-selected-border-color: var(--ig-button-group-item-selected-border-color, var(--item-border-color));--item-selected-hover-background: var(--ig-button-group-item-selected-hover-background, hsl(from var(--item-selected-background) h s calc(l * 1.1)));--item-selected-hover-text-color: var(--ig-button-group-item-selected-hover-text-color, hsla(from color(from var(--item-selected-hover-background) var(--y-contrast)) h 0 l/1));--item-selected-hover-icon-color: var(--ig-button-group-item-selected-hover-icon-color, var(--item-selected-hover-text-color));--item-selected-hover-border-color: var(--ig-button-group-item-selected-hover-border-color, var(--item-border-color));--item-selected-focus-background: var(--ig-button-group-item-selected-focus-background, var(--item-selected-background));--item-selected-focus-hover-background: var(--ig-button-group-item-selected-focus-hover-background, var(--item-selected-hover-background));--disabled-text-color: var(--ig-button-group-disabled-text-color, hsla(from hsla(from color(from var(--disabled-background-color) var(--y-contrast)) h 0 l/1) h s l/0.4));--item-disabled-border: var(--ig-button-group-item-disabled-border, var(--item-border-color));--disabled-selected-text-color: var(--ig-button-group-disabled-selected-text-color, var(--disabled-text-color));--disabled-selected-icon-color: var(--ig-button-group-disabled-selected-icon-color, var(--ig-primary-200));--disabled-selected-border-color: var(--ig-button-group-disabled-selected-border-color, var(--item-border-color));--border: var(--ig-button-group-border, 1px solid var(--ig-primary-700));--shadow: var(--ig-button-group-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility dark-button-group{--elevation: var(--ig-button-group-elevation, var(--ig-elevation-0));--idle-shadow-color: var(--ig-button-group-idle-shadow-color, hsla(from var(--item-background) h s l/0.5));--selected-shadow-color: var(--ig-button-group-selected-shadow-color, var(--idle-shadow-color));--item-text-color: var(--ig-button-group-item-text-color, hsla(from color(from var(--item-background) var(--y-contrast)) h 0 l/1));--item-background: var(--ig-button-group-item-background, var(--ig-primary-500));--item-border-color: var(--ig-button-group-item-border-color, hsl(from var(--item-background) h s calc(l * 0.8)));--item-hover-background: var(--ig-button-group-item-hover-background, hsl(from var(--item-background) h s calc(l * 0.9)));--item-hover-text-color: var(--ig-button-group-item-hover-text-color, hsla(from color(from var(--item-hover-background) var(--y-contrast)) h 0 l/1));--item-focused-text-color: var(--ig-button-group-item-focused-text-color, hsla(from color(from var(--item-focused-background) var(--y-contrast)) h 0 l/1));--item-focused-border-color: var(--ig-button-group-item-focused-border-color, var(--item-border-color));--disabled-background-color: var(--ig-button-group-disabled-background-color, var(--item-background));--disabled-selected-background: var(--ig-button-group-disabled-selected-background, hsla(from var(--item-selected-background) h s l/0.3));--border-radius: var(--ig-button-group-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--default-size: var(--ig-button-group-default-size, 2);--item-icon-color: var(--ig-button-group-item-icon-color, var(--item-text-color));--item-hover-border-color: var(--ig-button-group-item-hover-border-color, var(--item-border-color));--item-hover-icon-color: var(--ig-button-group-item-hover-icon-color, var(--item-hover-text-color));--item-focused-background: var(--ig-button-group-item-focused-background, var(--item-hover-background));--item-focused-hover-background: var(--ig-button-group-item-focused-hover-background, hsl(from var(--item-focused-background) h s calc(l * 0.9)));--item-selected-background: var(--ig-button-group-item-selected-background, hsl(from var(--item-background) h s calc(l * 0.7)));--item-selected-text-color: var(--ig-button-group-item-selected-text-color, hsla(from color(from var(--item-selected-background) var(--y-contrast)) h 0 l/1));--item-selected-icon-color: var(--ig-button-group-item-selected-icon-color, var(--item-selected-text-color));--item-selected-border-color: var(--ig-button-group-item-selected-border-color, var(--item-border-color));--item-selected-hover-background: var(--ig-button-group-item-selected-hover-background, hsl(from var(--item-selected-background) h s calc(l * 1.1)));--item-selected-hover-text-color: var(--ig-button-group-item-selected-hover-text-color, hsla(from color(from var(--item-selected-hover-background) var(--y-contrast)) h 0 l/1));--item-selected-hover-icon-color: var(--ig-button-group-item-selected-hover-icon-color, var(--item-selected-hover-text-color));--item-selected-hover-border-color: var(--ig-button-group-item-selected-hover-border-color, var(--item-border-color));--item-selected-focus-background: var(--ig-button-group-item-selected-focus-background, var(--item-selected-background));--item-selected-focus-hover-background: var(--ig-button-group-item-selected-focus-hover-background, var(--item-selected-hover-background));--disabled-text-color: var(--ig-button-group-disabled-text-color, hsla(from hsla(from color(from var(--disabled-background-color) var(--y-contrast)) h 0 l/1) h s l/0.4));--item-disabled-border: var(--ig-button-group-item-disabled-border, var(--item-border-color));--disabled-selected-text-color: var(--ig-button-group-disabled-selected-text-color, var(--disabled-text-color));--disabled-selected-icon-color: var(--ig-button-group-disabled-selected-icon-color, var(--ig-primary-200));--disabled-selected-border-color: var(--ig-button-group-disabled-selected-border-color, var(--item-border-color));--border: var(--ig-button-group-border, 1px solid var(--ig-primary-700));--shadow: var(--ig-button-group-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-flat-button{--shadow-color: var(--ig-flat-button-shadow-color, hsla(from var(--focus-visible-foreground) h s l/0.5));--border-color: var(--ig-flat-button-border-color, transparent);--hover-border-color: var(--ig-flat-button-hover-border-color, transparent);--focus-border-color: var(--ig-flat-button-focus-border-color, transparent);--focus-visible-border-color: var(--ig-flat-button-focus-visible-border-color, transparent);--active-border-color: var(--ig-flat-button-active-border-color, transparent);--disabled-border-color: var(--ig-flat-button-disabled-border-color, transparent);--disabled-background: var(--ig-flat-button-disabled-background, transparent);--disabled-foreground: var(--ig-flat-button-disabled-foreground, hsl(from var(--foreground) h s l/0.5));--disabled-icon-color: var(--ig-flat-button-disabled-icon-color, var(--disabled-foreground));--size: var(--ig-flat-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-flat-button-default-size, 2);--resting-elevation: var(--ig-flat-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-flat-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-flat-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-flat-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-flat-button-background, transparent);--focus-foreground: var(--ig-flat-button-focus-foreground, hsl(from var(--foreground) h s calc(l * 0.7)));--border-radius: var(--ig-flat-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--foreground: var(--ig-flat-button-foreground, var(--ig-primary-500));--icon-color: var(--ig-flat-button-icon-color, var(--ig-primary-500));--hover-background: var(--ig-flat-button-hover-background, transparent);--hover-foreground: var(--ig-flat-button-hover-foreground, hsl(from var(--foreground) h s calc(l * 0.9)));--icon-color-hover: var(--ig-flat-button-icon-color-hover, var(--hover-foreground));--focus-background: var(--ig-flat-button-focus-background, transparent);--focus-hover-background: var(--ig-flat-button-focus-hover-background, transparent);--focus-hover-foreground: var(--ig-flat-button-focus-hover-foreground, hsl(from var(--foreground) h s calc(l * 0.9)));--focus-visible-background: var(--ig-flat-button-focus-visible-background, transparent);--focus-visible-foreground: var(--ig-flat-button-focus-visible-foreground, var(--foreground));--active-background: var(--ig-flat-button-active-background, transparent);--active-foreground: var(--ig-flat-button-active-foreground, hsl(from var(--foreground) h s calc(l * 0.7)));--resting-shadow: var(--ig-flat-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-flat-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-flat-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-flat-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-flat-button{--shadow-color: var(--ig-flat-button-shadow-color, hsla(from var(--focus-visible-foreground) h s l/0.5));--border-color: var(--ig-flat-button-border-color, transparent);--hover-border-color: var(--ig-flat-button-hover-border-color, transparent);--focus-border-color: var(--ig-flat-button-focus-border-color, transparent);--focus-visible-border-color: var(--ig-flat-button-focus-visible-border-color, transparent);--active-border-color: var(--ig-flat-button-active-border-color, transparent);--disabled-border-color: var(--ig-flat-button-disabled-border-color, transparent);--disabled-background: var(--ig-flat-button-disabled-background, transparent);--disabled-foreground: var(--ig-flat-button-disabled-foreground, hsl(from var(--foreground) h s l/0.5));--disabled-icon-color: var(--ig-flat-button-disabled-icon-color, var(--disabled-foreground));--size: var(--ig-flat-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-flat-button-default-size, 2);--resting-elevation: var(--ig-flat-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-flat-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-flat-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-flat-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-flat-button-background, transparent);--focus-foreground: var(--ig-flat-button-focus-foreground, hsl(from var(--foreground) h s calc(l * 0.7)));--border-radius: var(--ig-flat-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--foreground: var(--ig-flat-button-foreground, var(--ig-primary-500));--icon-color: var(--ig-flat-button-icon-color, var(--ig-primary-500));--hover-background: var(--ig-flat-button-hover-background, transparent);--hover-foreground: var(--ig-flat-button-hover-foreground, hsl(from var(--foreground) h s calc(l * 0.9)));--icon-color-hover: var(--ig-flat-button-icon-color-hover, var(--hover-foreground));--focus-background: var(--ig-flat-button-focus-background, transparent);--focus-hover-background: var(--ig-flat-button-focus-hover-background, transparent);--focus-hover-foreground: var(--ig-flat-button-focus-hover-foreground, hsl(from var(--foreground) h s calc(l * 0.9)));--focus-visible-background: var(--ig-flat-button-focus-visible-background, transparent);--focus-visible-foreground: var(--ig-flat-button-focus-visible-foreground, var(--foreground));--active-background: var(--ig-flat-button-active-background, transparent);--active-foreground: var(--ig-flat-button-active-foreground, hsl(from var(--foreground) h s calc(l * 0.7)));--resting-shadow: var(--ig-flat-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-flat-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-flat-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-flat-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-contained-button{--shadow-color: var(--ig-contained-button-shadow-color, hsla(from var(--focus-visible-background) h s l/0.5));--border-color: var(--ig-contained-button-border-color, transparent);--hover-border-color: var(--ig-contained-button-hover-border-color, transparent);--focus-border-color: var(--ig-contained-button-focus-border-color, transparent);--focus-visible-border-color: var(--ig-contained-button-focus-visible-border-color, transparent);--active-border-color: var(--ig-contained-button-active-border-color, transparent);--disabled-border-color: var(--ig-contained-button-disabled-border-color, transparent);--disabled-background: var(--ig-contained-button-disabled-background, hsla(from var(--background) h s l/0.5));--disabled-foreground: var(--ig-contained-button-disabled-foreground, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--disabled-icon-color: var(--ig-contained-button-disabled-icon-color, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--size: var(--ig-contained-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-contained-button-default-size, 2);--resting-elevation: var(--ig-contained-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-contained-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-contained-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-contained-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-contained-button-background, var(--ig-primary-500));--active-background: var(--ig-contained-button-active-background, hsl(from var(--background) h s calc(l * 0.9)));--border-radius: var(--ig-contained-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--foreground: var(--ig-contained-button-foreground, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color: var(--ig-contained-button-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color-hover: var(--ig-contained-button-icon-color-hover, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--hover-background: var(--ig-contained-button-hover-background, hsl(from var(--background) h s calc(l * 1.05)));--hover-foreground: var(--ig-contained-button-hover-foreground, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--focus-background: var(--ig-contained-button-focus-background, hsl(from var(--background) h s calc(l * 1.1)));--focus-hover-background: var(--ig-contained-button-focus-hover-background, var(--hover-background));--focus-hover-foreground: var(--ig-contained-button-focus-hover-foreground, hsla(from color(from var(--focus-hover-background) var(--y-contrast)) h 0 l/1));--focus-foreground: var(--ig-contained-button-focus-foreground, hsla(from color(from var(--focus-background) var(--y-contrast)) h 0 l/1));--focus-visible-background: var(--ig-contained-button-focus-visible-background, var(--focus-background));--focus-visible-foreground: var(--ig-contained-button-focus-visible-foreground, hsla(from color(from var(--focus-visible-background) var(--y-contrast)) h 0 l/1));--active-foreground: var(--ig-contained-button-active-foreground, hsla(from color(from var(--active-background) var(--y-contrast)) h 0 l/1));--resting-shadow: var(--ig-contained-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-contained-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-contained-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-contained-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-contained-button{--shadow-color: var(--ig-contained-button-shadow-color, hsla(from var(--focus-visible-background) h s l/0.5));--border-color: var(--ig-contained-button-border-color, transparent);--hover-border-color: var(--ig-contained-button-hover-border-color, transparent);--focus-border-color: var(--ig-contained-button-focus-border-color, transparent);--focus-visible-border-color: var(--ig-contained-button-focus-visible-border-color, transparent);--active-border-color: var(--ig-contained-button-active-border-color, transparent);--disabled-border-color: var(--ig-contained-button-disabled-border-color, transparent);--disabled-background: var(--ig-contained-button-disabled-background, hsla(from var(--background) h s l/0.5));--disabled-foreground: var(--ig-contained-button-disabled-foreground, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--disabled-icon-color: var(--ig-contained-button-disabled-icon-color, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--size: var(--ig-contained-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-contained-button-default-size, 2);--resting-elevation: var(--ig-contained-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-contained-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-contained-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-contained-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-contained-button-background, var(--ig-primary-500));--active-background: var(--ig-contained-button-active-background, hsl(from var(--background) h s calc(l * 0.9)));--border-radius: var(--ig-contained-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--foreground: var(--ig-contained-button-foreground, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color: var(--ig-contained-button-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color-hover: var(--ig-contained-button-icon-color-hover, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--hover-background: var(--ig-contained-button-hover-background, hsl(from var(--background) h s calc(l * 1.05)));--hover-foreground: var(--ig-contained-button-hover-foreground, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--focus-background: var(--ig-contained-button-focus-background, hsl(from var(--background) h s calc(l * 1.1)));--focus-hover-background: var(--ig-contained-button-focus-hover-background, var(--hover-background));--focus-hover-foreground: var(--ig-contained-button-focus-hover-foreground, hsla(from color(from var(--focus-hover-background) var(--y-contrast)) h 0 l/1));--focus-foreground: var(--ig-contained-button-focus-foreground, hsla(from color(from var(--focus-background) var(--y-contrast)) h 0 l/1));--focus-visible-background: var(--ig-contained-button-focus-visible-background, var(--focus-background));--focus-visible-foreground: var(--ig-contained-button-focus-visible-foreground, hsla(from color(from var(--focus-visible-background) var(--y-contrast)) h 0 l/1));--active-foreground: var(--ig-contained-button-active-foreground, hsla(from color(from var(--active-background) var(--y-contrast)) h 0 l/1));--resting-shadow: var(--ig-contained-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-contained-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-contained-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-contained-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-outlined-button{--shadow-color: var(--ig-outlined-button-shadow-color, hsla(from var(--focus-visible-background) h s l/0.5));--border-color: var(--ig-outlined-button-border-color, var(--foreground));--hover-border-color: var(--ig-outlined-button-hover-border-color, var(--hover-background));--focus-border-color: var(--ig-outlined-button-focus-border-color, var(--focus-background));--focus-visible-border-color: var(--ig-outlined-button-focus-visible-border-color, var(--focus-visible-background));--active-border-color: var(--ig-outlined-button-active-border-color, var(--active-background));--disabled-border-color: var(--ig-outlined-button-disabled-border-color, var(--disabled-foreground));--disabled-background: var(--ig-outlined-button-disabled-background, transparent);--disabled-foreground: var(--ig-outlined-button-disabled-foreground, hsl(from var(--foreground) h s l/0.5));--disabled-icon-color: var(--ig-outlined-button-disabled-icon-color, var(--disabled-foreground));--size: var(--ig-outlined-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-outlined-button-default-size, 2);--resting-elevation: var(--ig-outlined-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-outlined-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-outlined-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-outlined-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-outlined-button-background, transparent);--focus-foreground: var(--ig-outlined-button-focus-foreground, hsla(from color(from var(--focus-background) var(--y-contrast)) h 0 l/1));--border-radius: var(--ig-outlined-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--foreground: var(--ig-outlined-button-foreground, var(--ig-primary-500));--icon-color: var(--ig-outlined-button-icon-color, var(--ig-primary-500));--hover-background: var(--ig-outlined-button-hover-background, var(--foreground));--hover-foreground: var(--ig-outlined-button-hover-foreground, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--icon-color-hover: var(--ig-outlined-button-icon-color-hover, var(--hover-foreground));--focus-background: var(--ig-outlined-button-focus-background, hsl(from var(--foreground) h s calc(l * 0.8)));--focus-hover-background: var(--ig-outlined-button-focus-hover-background, hsl(from var(--hover-background) h s calc(l * 0.9)));--focus-hover-foreground: var(--ig-outlined-button-focus-hover-foreground, hsla(from color(from var(--focus-hover-background) var(--y-contrast)) h 0 l/1));--focus-visible-background: var(--ig-outlined-button-focus-visible-background, var(--hover-background));--focus-visible-foreground: var(--ig-outlined-button-focus-visible-foreground, hsla(from color(from var(--focus-visible-background) var(--y-contrast)) h 0 l/1));--active-background: var(--ig-outlined-button-active-background, hsl(from var(--foreground) h s calc(l * 0.8)));--active-foreground: var(--ig-outlined-button-active-foreground, hsla(from color(from var(--active-background) var(--y-contrast)) h 0 l/1));--resting-shadow: var(--ig-outlined-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-outlined-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-outlined-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-outlined-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-outlined-button{--shadow-color: var(--ig-outlined-button-shadow-color, hsla(from var(--focus-visible-background) h s l/0.5));--border-color: var(--ig-outlined-button-border-color, var(--foreground));--hover-border-color: var(--ig-outlined-button-hover-border-color, var(--hover-background));--focus-border-color: var(--ig-outlined-button-focus-border-color, var(--focus-background));--focus-visible-border-color: var(--ig-outlined-button-focus-visible-border-color, var(--focus-visible-background));--active-border-color: var(--ig-outlined-button-active-border-color, var(--active-background));--disabled-border-color: var(--ig-outlined-button-disabled-border-color, var(--disabled-foreground));--disabled-background: var(--ig-outlined-button-disabled-background, transparent);--disabled-foreground: var(--ig-outlined-button-disabled-foreground, hsl(from var(--foreground) h s l/0.5));--disabled-icon-color: var(--ig-outlined-button-disabled-icon-color, var(--disabled-foreground));--size: var(--ig-outlined-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-outlined-button-default-size, 2);--resting-elevation: var(--ig-outlined-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-outlined-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-outlined-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-outlined-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-outlined-button-background, transparent);--focus-foreground: var(--ig-outlined-button-focus-foreground, hsla(from color(from var(--focus-background) var(--y-contrast)) h 0 l/1));--border-radius: var(--ig-outlined-button-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.2) * 1.25rem), 1.25rem));--foreground: var(--ig-outlined-button-foreground, var(--ig-primary-500));--icon-color: var(--ig-outlined-button-icon-color, var(--ig-primary-500));--hover-background: var(--ig-outlined-button-hover-background, var(--foreground));--hover-foreground: var(--ig-outlined-button-hover-foreground, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--icon-color-hover: var(--ig-outlined-button-icon-color-hover, var(--hover-foreground));--focus-background: var(--ig-outlined-button-focus-background, hsl(from var(--foreground) h s calc(l * 0.8)));--focus-hover-background: var(--ig-outlined-button-focus-hover-background, hsl(from var(--hover-background) h s calc(l * 0.9)));--focus-hover-foreground: var(--ig-outlined-button-focus-hover-foreground, hsla(from color(from var(--focus-hover-background) var(--y-contrast)) h 0 l/1));--focus-visible-background: var(--ig-outlined-button-focus-visible-background, var(--hover-background));--focus-visible-foreground: var(--ig-outlined-button-focus-visible-foreground, hsla(from color(from var(--focus-visible-background) var(--y-contrast)) h 0 l/1));--active-background: var(--ig-outlined-button-active-background, hsl(from var(--foreground) h s calc(l * 0.8)));--active-foreground: var(--ig-outlined-button-active-foreground, hsla(from color(from var(--active-background) var(--y-contrast)) h 0 l/1));--resting-shadow: var(--ig-outlined-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-outlined-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-outlined-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-outlined-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-fab-button{--shadow-color: var(--ig-fab-button-shadow-color, hsla(from var(--focus-visible-background) h s l/0.5));--border-color: var(--ig-fab-button-border-color, transparent);--hover-border-color: var(--ig-fab-button-hover-border-color, transparent);--focus-border-color: var(--ig-fab-button-focus-border-color, transparent);--focus-visible-border-color: var(--ig-fab-button-focus-visible-border-color, transparent);--active-border-color: var(--ig-fab-button-active-border-color, transparent);--disabled-border-color: var(--ig-fab-button-disabled-border-color, transparent);--disabled-background: var(--ig-fab-button-disabled-background, hsla(from var(--background) h s l/0.5));--disabled-foreground: var(--ig-fab-button-disabled-foreground, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--disabled-icon-color: var(--ig-fab-button-disabled-icon-color, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--size: var(--ig-fab-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-fab-button-default-size, 2);--resting-elevation: var(--ig-fab-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-fab-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-fab-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-fab-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-fab-button-background, var(--ig-primary-500));--active-background: var(--ig-fab-button-active-background, hsl(from var(--background) h s calc(l * 0.9)));--border-radius: var(--ig-fab-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 0.5357142857) * 1.75rem), 1.75rem));--foreground: var(--ig-fab-button-foreground, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color: var(--ig-fab-button-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color-hover: var(--ig-fab-button-icon-color-hover, var(--icon-color));--hover-background: var(--ig-fab-button-hover-background, hsl(from var(--background) h s calc(l * 1.05)));--hover-foreground: var(--ig-fab-button-hover-foreground, var(--foreground));--focus-background: var(--ig-fab-button-focus-background, hsl(from var(--background) h s calc(l * 1.1)));--focus-hover-background: var(--ig-fab-button-focus-hover-background, var(--hover-background));--focus-hover-foreground: var(--ig-fab-button-focus-hover-foreground, var(--foreground));--focus-foreground: var(--ig-fab-button-focus-foreground, var(--foreground));--focus-visible-background: var(--ig-fab-button-focus-visible-background, var(--focus-background));--focus-visible-foreground: var(--ig-fab-button-focus-visible-foreground, hsla(from color(from var(--focus-visible-background) var(--y-contrast)) h 0 l/1));--active-foreground: var(--ig-fab-button-active-foreground, hsla(from color(from var(--active-background) var(--y-contrast)) h 0 l/1));--resting-shadow: var(--ig-fab-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-fab-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-fab-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-fab-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-fab-button{--shadow-color: var(--ig-fab-button-shadow-color, hsla(from var(--focus-visible-background) h s l/0.5));--border-color: var(--ig-fab-button-border-color, transparent);--hover-border-color: var(--ig-fab-button-hover-border-color, transparent);--focus-border-color: var(--ig-fab-button-focus-border-color, transparent);--focus-visible-border-color: var(--ig-fab-button-focus-visible-border-color, transparent);--active-border-color: var(--ig-fab-button-active-border-color, transparent);--disabled-border-color: var(--ig-fab-button-disabled-border-color, transparent);--disabled-background: var(--ig-fab-button-disabled-background, hsla(from var(--background) h s l/0.5));--disabled-foreground: var(--ig-fab-button-disabled-foreground, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--disabled-icon-color: var(--ig-fab-button-disabled-icon-color, hsla(from hsla(from color(from var(--disabled-background) var(--y-contrast)) h 0 l/1) h s l/0.5));--size: var(--ig-fab-button-size, max(var(--is-large, 1) * max(3rem, -1 * 3rem), var(--is-medium, 1) * max(2.375rem, -1 * 2.375rem), var(--is-small, 1) * max(2rem, -1 * 2rem)));--default-size: var(--ig-fab-button-default-size, 2);--resting-elevation: var(--ig-fab-button-resting-elevation, var(--ig-elevation-0));--hover-elevation: var(--ig-fab-button-hover-elevation, var(--ig-elevation-0));--focus-elevation: var(--ig-fab-button-focus-elevation, var(--ig-elevation-0));--active-elevation: var(--ig-fab-button-active-elevation, var(--ig-elevation-0));--background: var(--ig-fab-button-background, var(--ig-primary-500));--active-background: var(--ig-fab-button-active-background, hsl(from var(--background) h s calc(l * 0.9)));--border-radius: var(--ig-fab-button-border-radius, clamp(0.75rem, calc(var(--ig-radius-factor, 0.5357142857) * 1.75rem), 1.75rem));--foreground: var(--ig-fab-button-foreground, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color: var(--ig-fab-button-icon-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--icon-color-hover: var(--ig-fab-button-icon-color-hover, var(--icon-color));--hover-background: var(--ig-fab-button-hover-background, hsl(from var(--background) h s calc(l * 1.05)));--hover-foreground: var(--ig-fab-button-hover-foreground, var(--foreground));--focus-background: var(--ig-fab-button-focus-background, hsl(from var(--background) h s calc(l * 1.1)));--focus-hover-background: var(--ig-fab-button-focus-hover-background, var(--hover-background));--focus-hover-foreground: var(--ig-fab-button-focus-hover-foreground, var(--foreground));--focus-foreground: var(--ig-fab-button-focus-foreground, var(--foreground));--focus-visible-background: var(--ig-fab-button-focus-visible-background, var(--focus-background));--focus-visible-foreground: var(--ig-fab-button-focus-visible-foreground, hsla(from color(from var(--focus-visible-background) var(--y-contrast)) h 0 l/1));--active-foreground: var(--ig-fab-button-active-foreground, hsla(from color(from var(--active-background) var(--y-contrast)) h 0 l/1));--resting-shadow: var(--ig-fab-button-resting-shadow, var(--ig-elevation-0));--hover-shadow: var(--ig-fab-button-hover-shadow, var(--ig-elevation-0));--focus-shadow: var(--ig-fab-button-focus-shadow, var(--ig-elevation-0));--active-shadow: var(--ig-fab-button-active-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-card{--resting-elevation: var(--ig-card-resting-elevation, var(--ig-elevation-4));--hover-elevation: var(--ig-card-hover-elevation, var(--ig-elevation-6));--background: var(--ig-card-background, var(--ig-surface-500));--header-text-color: var(--ig-card-header-text-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--subtitle-text-color: var(--ig-card-subtitle-text-color, hsl(from hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1) h s calc(l * 0.85)));--content-text-color: var(--ig-card-content-text-color, hsl(from hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1) h s calc(l * 0.85)));--actions-text-color: var(--ig-card-actions-text-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--outline-color: var(--ig-card-outline-color, var(--ig-gray-400));--border-radius: var(--ig-card-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1666666667) * 1.5rem), 1.5rem));--default-size: var(--ig-card-default-size, 2);--resting-shadow: var(--ig-card-resting-shadow, var(--ig-elevation-4));--hover-shadow: var(--ig-card-hover-shadow, var(--ig-elevation-6));--ig-theme: bootstrap}@utility dark-card{--resting-elevation: var(--ig-card-resting-elevation, var(--ig-elevation-4));--hover-elevation: var(--ig-card-hover-elevation, var(--ig-elevation-6));--background: var(--ig-card-background, var(--ig-surface-500));--header-text-color: var(--ig-card-header-text-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--subtitle-text-color: var(--ig-card-subtitle-text-color, hsl(from hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1) h s calc(l * 0.85)));--content-text-color: var(--ig-card-content-text-color, hsl(from hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1) h s calc(l * 0.85)));--actions-text-color: var(--ig-card-actions-text-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--outline-color: var(--ig-card-outline-color, var(--ig-gray-400));--border-radius: var(--ig-card-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.1666666667) * 1.5rem), 1.5rem));--default-size: var(--ig-card-default-size, 2);--resting-shadow: var(--ig-card-resting-shadow, var(--ig-elevation-4));--hover-shadow: var(--ig-card-hover-shadow, var(--ig-elevation-6));--ig-theme: bootstrap}@utility light-chip{--ghost-elevation: var(--ig-chip-ghost-elevation, var(--ig-elevation-0));--remove-icon-color: var(--ig-chip-remove-icon-color, 'currentColor');--focus-outline-color: var(--ig-chip-focus-outline-color, hsla(from var(--focus-background) h s l/0.4));--focus-selected-outline-color: var(--ig-chip-focus-selected-outline-color, hsla(from var(--focus-selected-background) h s l/0.4));--remove-icon-color-focus: var(--ig-chip-remove-icon-color-focus, 'currentColor');--background: var(--ig-chip-background, var(--ig-gray-200));--border-color: var(--ig-chip-border-color, var(--background));--ghost-background: var(--ig-chip-ghost-background, var(--ig-gray-400));--hover-text-color: var(--ig-chip-hover-text-color, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--hover-background: var(--ig-chip-hover-background, hsl(from var(--background) h s calc(l * 0.9)));--hover-border-color: var(--ig-chip-hover-border-color, var(--border-color));--focus-text-color: var(--ig-chip-focus-text-color, hsla(from color(from var(--focus-background) var(--y-contrast)) h 0 l/1));--focus-border-color: var(--ig-chip-focus-border-color, var(--border-color));--selected-text-color: var(--ig-chip-selected-text-color, hsla(from color(from var(--selected-background) var(--y-contrast)) h 0 l/1));--selected-background: var(--ig-chip-selected-background, var(--background));--selected-border-color: var(--ig-chip-selected-border-color, var(--selected-background));--hover-selected-text-color: var(--ig-chip-hover-selected-text-color, hsla(from color(from var(--hover-selected-background) var(--y-contrast)) h 0 l/1));--hover-selected-background: var(--ig-chip-hover-selected-background, hsl(from var(--selected-background) h s calc(l * 0.9)));--hover-selected-border-color: var(--ig-chip-hover-selected-border-color, var(--hover-selected-background));--focus-selected-border-color: var(--ig-chip-focus-selected-border-color, var(--focus-selected-background));--border-radius: var(--ig-chip-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.25) * 1rem), 1rem));--disabled-text-color: var(--ig-chip-disabled-text-color, var(--ig-gray-500));--disabled-background: var(--ig-chip-disabled-background, var(--ig-gray-200));--disabled-border-color: var(--ig-chip-disabled-border-color, var(--ig-gray-200));--size: var(--ig-chip-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.5rem, -1 * 1.5rem), var(--is-small, 1) * max(1.25rem, -1 * 1.25rem)));--default-size: var(--ig-chip-default-size, 2);--text-color: var(--ig-chip-text-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--focus-background: var(--ig-chip-focus-background, hsl(from var(--background) h s calc(l * 0.8)));--focus-selected-background: var(--ig-chip-focus-selected-background, hsl(from var(--selected-background) h s calc(l * 0.8)));--focus-selected-text-color: var(--ig-chip-focus-selected-text-color, hsla(from color(from var(--focus-selected-background) var(--y-contrast)) h 0 l/1));--ghost-shadow: var(--ig-chip-ghost-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility dark-chip{--ghost-elevation: var(--ig-chip-ghost-elevation, var(--ig-elevation-0));--remove-icon-color: var(--ig-chip-remove-icon-color, 'currentColor');--focus-outline-color: var(--ig-chip-focus-outline-color, hsla(from var(--focus-background) h s l/0.4));--focus-selected-outline-color: var(--ig-chip-focus-selected-outline-color, hsla(from var(--focus-selected-background) h s l/0.4));--remove-icon-color-focus: var(--ig-chip-remove-icon-color-focus, 'currentColor');--background: var(--ig-chip-background, var(--ig-gray-200));--border-color: var(--ig-chip-border-color, var(--background));--ghost-background: var(--ig-chip-ghost-background, var(--ig-gray-400));--hover-text-color: var(--ig-chip-hover-text-color, hsla(from color(from var(--hover-background) var(--y-contrast)) h 0 l/1));--hover-background: var(--ig-chip-hover-background, hsl(from var(--background) h s calc(l * 0.9)));--hover-border-color: var(--ig-chip-hover-border-color, var(--border-color));--focus-text-color: var(--ig-chip-focus-text-color, hsla(from color(from var(--focus-background) var(--y-contrast)) h 0 l/1));--focus-border-color: var(--ig-chip-focus-border-color, var(--border-color));--selected-text-color: var(--ig-chip-selected-text-color, hsla(from color(from var(--selected-background) var(--y-contrast)) h 0 l/1));--selected-background: var(--ig-chip-selected-background, var(--background));--selected-border-color: var(--ig-chip-selected-border-color, var(--selected-background));--hover-selected-text-color: var(--ig-chip-hover-selected-text-color, hsla(from color(from var(--hover-selected-background) var(--y-contrast)) h 0 l/1));--hover-selected-background: var(--ig-chip-hover-selected-background, hsl(from var(--selected-background) h s calc(l * 0.9)));--hover-selected-border-color: var(--ig-chip-hover-selected-border-color, var(--hover-selected-background));--focus-selected-border-color: var(--ig-chip-focus-selected-border-color, var(--focus-selected-background));--border-radius: var(--ig-chip-border-radius, clamp(0rem, calc(var(--ig-radius-factor, 0.25) * 1rem), 1rem));--disabled-text-color: var(--ig-chip-disabled-text-color, var(--ig-gray-500));--disabled-background: var(--ig-chip-disabled-background, var(--ig-gray-200));--disabled-border-color: var(--ig-chip-disabled-border-color, var(--ig-gray-200));--size: var(--ig-chip-size, max(var(--is-large, 1) * max(2rem, -1 * 2rem), var(--is-medium, 1) * max(1.5rem, -1 * 1.5rem), var(--is-small, 1) * max(1.25rem, -1 * 1.25rem)));--default-size: var(--ig-chip-default-size, 2);--text-color: var(--ig-chip-text-color, hsla(from color(from var(--background) var(--y-contrast)) h 0 l/1));--focus-background: var(--ig-chip-focus-background, hsl(from var(--background) h s calc(l * 0.8)));--focus-selected-background: var(--ig-chip-focus-selected-background, hsl(from var(--selected-background) h s calc(l * 0.8)));--focus-selected-text-color: var(--ig-chip-focus-selected-text-color, hsla(from color(from var(--focus-selected-background) var(--y-contrast)) h 0 l/1));--ghost-shadow: var(--ig-chip-ghost-shadow, var(--ig-elevation-0));--ig-theme: bootstrap}@utility light-carousel{--button-elevation: var(--ig-carousel-button-elevation, var(--ig-elevation-0));--slide-background: var(--ig-carousel-slide-background, var(--ig-gray-900-contrast));--button-background: var(--ig-carousel-button-background, var(--ig-gray-50));--button-hover-background: var(--ig-carousel-button-hover-background, var(--button-background));--button-arrow-color: var(--ig-carousel-button-arrow-color, hsla(from hsla(from color(from var(--button-background) var(--y-contrast)) h 0 l/1) h s l/0.85));--button-hover-arrow-color: var(--ig-carousel-button-hover-arrow-color, hsla(from color(from var(--button-hover-background) var(--y-contrast)) h 0 l/1));--bu