.button{--bg-color:transparent;--text-color:var(--color-text-primary);--border-color:var(--color-surface-button);text-align:center;min-height:var(--size-control-min-height);background-color:var(--bg-color);border:1px solid var(--border-color);color:var(--text-color);font-weight:500;line-height:1.25;font-family:var(--font-family-primary), sans-serif;cursor:pointer;border-radius:99em;justify-content:center;align-items:center;padding-block:.625rem;padding-inline:1.5rem;display:inline-flex}.button[data-has-icon=true]{column-gap:.5rem}.button[data-has-icon=true][data-icon-position=start]:not([data-variant=inline]){padding-inline-start:1.25rem}.button[data-has-icon=true][data-icon-position=end]:not([data-variant=inline]){padding-inline-end:1.25rem}.button:hover:not([disabled],[aria-disabled]){text-underline-offset:2px;text-decoration:underline}.button:active:not([disabled]){opacity:.8}.button[disabled],.button[aria-disabled]{opacity:.6;cursor:not-allowed}.button[data-variant=primary]{--bg-color:var(--color-surface-button);--text-color:var(--color-text-button);--border-color:0}.button[data-variant=ghost]{--bg-color:transparent;--text-color:var(--color-text-primary);--border-color:transparent}.button[data-variant=ghost]:hover:not([disabled]){--border-color:var(--color-surface-button);text-decoration:none}.button[data-variant=inline]{font-family:var(--font-family-primary), sans-serif;border:0;border-radius:.375rem;padding:0}.button[data-width=full]{width:100%}.button__icon{flex-shrink:0;font-size:1.25em}