.button{background-color:var(--button-background-color,transparent);border:none;border-radius:var(--button-border-radius,var(--border-radius));color:var(--button-text-color,currentColor);display:flex;font-size:var(--button-font-size);gap:var(--button-gap,calc(var(--space-s)/2));margin:0;padding:var(--button-padding,0);position:relative;transition:var(--button-transition,transform .2s ease-in-out)}.button.icon-only{padding:.5rem}.button:hover{background-color:var(--button-background-color--hover,var(--button-background-color));background-position:100% 100%}.button[disabled]{background-color:var(--button-background-color--disabled,var(--button-background-color));color:inherit;cursor:not-allowed}.button[disabled] .button__icon,.button[disabled] .button__text{opacity:.5}.button:focus{outline:none}.button__icon{font-size:1.5em}.button__icon.button--icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.button__spinner svg{animation:button-spin .8s linear infinite;height:1em;width:1em}@keyframes button-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.button:not(.button--icon) .button__icon{margin:-.125em auto -.25em calc(var(--space-s)*-1)}.button:not(.button--icon) .button__icon.icon-only{margin:0}.button__text{display:block;text-align:center;transition:transform .2s ease-in-out;white-space:nowrap;width:100%}.button--clicking{background-color:red;transform:scale(.99,.95)}.button--clicking .button__text{transform:scale(1.1)}.button--small{--button-font-size:.85em;--button-padding:var(--space-s) var(--space)}.button--medium{--button-font-size:1em;--button-padding:var(--space) var(--space-l)}.button--large{--button-font-size:1.2em;--button-padding:var(--space-l) var(--space-l)}.button--icon{--button-font-size:1em;--button-padding:0;height:1.5em;line-height:1.5em;text-align:center;width:1.5em}.button--primary{--button-text-color:var(--color-primary-text);--button-background-color:var(--color-primary);--button-background-color--disabled:hsla(var(--color-h,var(--color-primary-h)),var(--color-s,var(--color-primary-s)),var(--color-l,var(--color-primary-l)),.5);--button-background-color--hover:hsla(var(--color-h,var(--color-primary-h)),var(--color-s,var(--color-primary-s)),var(--color-l,var(--color-primary-l)),.9)}.button--secondary{--button-text-color:var(--color-secondary-text);--button-background-color:var(--color-secondary);--button-background-color--disabled:hsla(var(--color-h,var(--color-secondary-h)),var(--color-s,var(--color-secondary-s)),var(--color-l,var(--color-secondary-l)),.5);--button-background-color--hover:hsla(var(--color-h,var(--color-secondary-h)),var(--color-s,var(--color-secondary-s)),var(--color-l,var(--color-secondary-l)),.9)}.button--tertiary{--button-text-color:var(--color-tertiary-text);--button-background-color:var(--color-tertiary);--button-background-color--hover:hsla(var(--color-h,var(--color-tertiary-h)),var(--color-s,var(--color-tertiary-s)),var(--color-l,var(--color-tertiary-l)),.9);--button-background-color--disabled:hsla(var(--color-h,var(--color-tertiary-h)),var(--color-s,var(--color-tertiary-s)),var(--color-l,var(--color-tertiary-l)),.5)}.button--minimal{--button-padding:var(--space-s);--button-text-color:var(--color-foreground);--button-background-color:transparent;--button-background-color--disabled:transparent;--button-background-color--hover:transparent;--button-gap:var(--space-s)}.button--minimal .button__icon{align-items:center;background-color:var(--color-tertiary);border-radius:50%;color:var(--color-tertiary-text);display:block;display:flex;font-size:1.5em;height:1.4em;justify-content:center;line-height:1em;margin:0!important;min-width:1.4em;padding:0;width:1.4em}.button--minimal:hover .button__icon{transform:scale(1.1)}.button--minimal .button__text{line-height:2em}
