.icon-button{--button-border-width: 1px;--button-border-color: transparent;--button-border-color-hover: transparent;--button-border: var(--button-border-width) solid var(--button-border-color);--button-background: transparent;--button-background-hover: transparent;--button-color: inherit;--button-color-hover: inherit;--button-border-radius: var(--border-radius);--button-width: auto;--button-height: auto;--button-min-height: auto;--button-gap: var(--spacing-xxs);--button-padding-y: var(--spacing-xs);--button-padding-x: var(--spacing-xs);--button-font-weight: var(--font-weight-regular);--button-font-family: inherit;--button-font-size: inherit;--button-outline: none;--button-outline-offset: 2px;--button-transition: var(--button-transition-motion, none);display:inline-flex;width:var(--button-width);height:var(--button-height);min-height:var(--button-min-height);flex-shrink:0;align-items:center;justify-content:center;padding:var(--button-padding-y) var(--button-padding-x);border:var(--button-border);border-radius:var(--button-border-radius);background-color:var(--button-background);color:var(--button-color);font-family:var(--button-font-family);font-size:var(--button-font-size);font-weight:var(--button-font-weight);gap:var(--button-gap);outline:var(--button-outline);outline-offset:var(--button-outline-offset);transition:var(--button-transition);white-space:nowrap;text-decoration:none}@media (prefers-reduced-motion: no-preference){.icon-button{--button-transition-motion: color .2s ease, background .2s ease, border .2s ease, border-radius .2s ease}}.icon-button:where(:not([disabled])):where(:focus-visible){--button-transition: none;--button-outline: 2px solid var(--color-focus)}.icon-button:where(:not([disabled])):where(:hover,:focus-visible){color:var(--button-color-hover);background-color:var(--button-background-hover);border-color:var(--button-border-color-hover)}.icon-button:where([disabled]){cursor:not-allowed}.icon-button{--button-width: 3.375rem;--button-height: 3.375rem;--button-font-size: 1.5rem;--button-border-radius: var(--border-radius-full);--button-padding-y: 0;--button-padding-x: 0}.icon-button--small{--button-width: 1.875rem;--button-height: 1.875rem;--button-font-size: 1rem}.icon-button--primary{--button-color: var(--theme-button-primary-color, var(--color-white));--button-color-hover: var(--theme-button-primary-color-hover, var(--color-white));--button-background: var(--theme-button-primary-background, var(--color-primary));--button-background-hover: var(--theme-button-primary-background-hover, var(--color-primary));--button-border-color: var(--theme-button-primary-border, transparent);--button-border-color-hover: var(--theme-button-primary-border-hover, transparent)}.icon-button--secondary{--button-color: var(--theme-button-secondary-color, var(--color-black));--button-color-hover: var(--theme-button-secondary-color-hover, var(--color-black));--button-background: var(--theme-button-secondary-background, var(--color-secondary));--button-background-hover: var(--theme-button-secondary-background-hover, var(--color-secondary));--button-border-color: var(--theme-button-secondary-border, transparent);--button-border-color-hover: var(--theme-button-secondary-border-hover, transparent)}.icon-button--subtle{--button-color: var(--theme-button-subtle-color);--button-color-hover: var(--theme-button-subtle-color-hover);--button-background: var(--theme-button-subtle-background);--button-background-hover: var(--theme-button-subtle-background-hover);--button-border-color: var(--theme-button-subtle-border, transparent);--button-border-color-hover: var(--theme-button-subtle-border-hover, transparent)}.icon-button>span{display:inline-flex}