.component\:button{--background-color: var(--figma-web-color-white-500);--background-color-active: var(--figma-web-color-grey-500);--color: var(--figma-web-color-black-500);--height: 46px;--border-radius: 4px;--border-color: var(--background-color);--font-size: 16px;background-color:var(--background-color);color:var(--color);display:inline-flex;align-items:center;justify-content:center;gap:0 8px;height:var(--height);min-width:var(--height);padding:0 1.25em;border-radius:var(--border-radius);border:1px solid var(--border-color);white-space:nowrap;font-size:var(--font-size);font-weight:500;cursor:pointer;vertical-align:bottom}.component\:button:is(:hover,:active,:focus){background-color:var(--background-color-active)}.component\:button[data-theme=default]{--border-color: var(--figma-web-color-grey-500)}.component\:button[data-theme=primary]{--background-color: var(--figma-web-color-purple-800);--background-color-active: var(--figma-web-color-purple-900);--color: var(--figma-web-color-white-500)}.component\:button[data-variant=round]{--border-radius: var(--height)}.component\:button[data-size=sm]{--height: 32px;--font-size: 14px}@supports (selector(:has(*))){.component\:button:has(>img:first-child){padding-left:.75em}.component\:button:has(>img:last-child){padding-right:.75em}}