[data-cl-button]{--button-height: 40px;--button-padding: 0 20px;--button-border-radius: var(--br2);--button-font-size: var(--fs2);--button-font-weight: 500;--button-background: var(--color-primary);--button-color: white;--button-border: 1px solid var(--color-primary);--button-focus-box-shadow: var(--color-primary-ll) 0 0 0 4px;--button-active-opacity: .8;--button-hover-background-color: var(--button-background);--button-hover-opacity: .9;box-sizing:border-box;display:flex;flex:none;justify-content:center;align-items:center;margin:0;cursor:pointer;appearance:none;text-decoration:none;font-family:inherit;font-size:var(--button-font-size);font-weight:var(--button-font-weight);line-height:1;height:var(--button-height);padding:var(--button-padding);background:var(--button-background);color:var(--button-color);border:var(--button-border);border-radius:var(--button-border-radius)}[data-cl-button]:disabled{opacity:.5;cursor:not-allowed}[data-cl-button]:focus{box-shadow:var(--button-focus-box-shadow)}[data-cl-button]:not(:disabled):active{opacity:var(--button-active-opacity)}@media (hover: hover){[data-cl-button]:not(:disabled):hover{background-color:var(--button-hover-background-color);opacity:var(--button-hover-opacity)}}[data-cl-button-variant=transparent]{--button-background: transparent;--button-color: var(--color-foreground-text);--button-border: 1px solid transparent;--button-focus-box-shadow: var(--button-transparent-focus-box-shadow-color) 0 0 0 4px;--button-active-opacity: .8;--button-hover-background-color: var( --button-transparent-hover-background-color );--button-hover-opacity: .9}[data-cl-button-variant=neutral]{--button-background: var(--button-neutral-background);--button-color: var(--color-foreground-text);--button-border: 1px solid var(--button-neutral-border-color);--button-focus-box-shadow: var(--button-neutral-focus-box-shadow-color) 0 0 0 4px;--button-active-opacity: .7;--button-hover-background-color: var(--button-background);--button-hover-opacity: .8}[data-cl-button-variant=danger]{--button-background: var(--color-danger-600);--button-color: white;--button-border: 1px solid var(--color-danger-600);--button-focus-box-shadow: var(--color-danger-100) 0 0 0 4px;--button-active-opacity: .8;--button-hover-background-color: var(--button-background);--button-hover-opacity: .9}[data-cl-button-size=sm]{--button-height: 36px;--button-padding: 0 14px}[data-cl-button-size=xs]{--button-height: 30px;--button-padding: 0 14px;--button-font-size: var(--fs1)}[data-cl-button-size=xxs]{--button-height: 26px;--button-padding: 0 11px;--button-border-radius: var(--br1);--button-font-size: var(--fs1)}[data-cl-button-content]{display:grid;grid-auto-flow:column;align-items:center;gap:var(--sp2)}[data-cl-button-content-icon-position=start]{padding-inline-end:calc(var(--button-font-size) / 2)}[data-cl-button-content-icon-position=end]{padding-inline-start:calc(var(--button-font-size) / 2)}[data-cl-button-content-gap=sm]{gap:var(--sp1)}[data-cl-button-activity-indicator]{height:30px;width:30px}[data-cl-button-activity-indicator]>svg{animation-name:button_activity_indicator_animation_circular_progress;animation-duration:.75s;animation-timing-function:linear;animation-iteration-count:infinite}[data-cl-button-activity-indicator]>svg>circle{stroke:currentColor}@keyframes button_activity_indicator_animation_circular_progress{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}