.button{--_btn-min-height:var(--btn-min-height,2.5714285714rem);--_btn-icon-size:var(--btn-icon-size,1.715em);--_btn-left-icon-size:var(--btn-left-icon-size,var(--_btn-icon-size));--_btn-right-icon-size:var(--btn-right-icon-size,var(--_btn-icon-size));--_btn-icon-color:var(--btn-icon-color,currentColor);--_btn-left-icon-color:var(--btn-left-icon-color,var(--_btn-icon-color));--_btn-right-icon-color:var(--btn-right-icon-color,var(--_btn-icon-color));--_btn-confirm-color:var(--btn-confirm-color,var(--clr-dark-accent));align-items:center;-webkit-appearance:none;appearance:none;background-color:unset;border:none;border:var(--border-width) solid transparent;border-radius:var(--border-radius);color:inherit;cursor:pointer;display:inline-flex;font:inherit;gap:var(--spacing-sm);justify-content:center;min-height:var(--_btn-min-height);padding:var(--spacing-sm) var(--spacing);transition-duration:var(--transition-duration);transition-property:opacity,background-color,color,border-color,box-shadow}.button:disabled,.button[aria-disabled=true]{box-shadow:none;cursor:not-allowed;opacity:.5}.button__icon{flex-shrink:0}.button__icon--left{color:var(--_btn-left-icon-color);font-size:var(--_btn-left-icon-size)}.button__icon--right{color:var(--_btn-right-icon-color);font-size:var(--_btn-right-icon-size)}.button[aria-busy=true] .button__icon{animation:spin .5s linear infinite}.button:has(>.button__badge){position:relative}.button__badge{bottom:calc(100% - var(--spacing));left:calc(100% - var(--spacing)*1.5);position:absolute}.button--confirming{animation:calc(var(--transition-duration)*2) shake}.button--variant-link{border:none;display:inline;min-height:auto;padding:0;text-decoration:underline}.button--variant-link .button__icon--left{margin-inline-end:var(--spacing-sm)}.button--variant-link .button__icon--right{margin-inline-start:var(--spacing-sm)}.button--confirming.button--variant-link{color:var(--_btn-confirm-color)}.button--variant-primary{background-color:var(--clr-primary);color:var(--clr-bg)}.button--variant-primary:not(:disabled):hover{background-color:var(--clr-dark-primary);box-shadow:var(--shadow)}.button--confirming.button--variant-primary,.button--confirming.button--variant-primary:not(:disabled):hover{background-color:var(--_btn-confirm-color)}.button--variant-primary-border{background-color:transparent;border-color:var(--clr-primary);color:var(--clr-primary)}.button--variant-primary-border:not(:disabled):hover{box-shadow:var(--shadow)}.button--confirming.button--variant-primary-border{border-color:var(--_btn-confirm-color);color:var(--_btn-confirm-color)}.button--variant-secondary{background-color:var(--clr-line);color:var(--clr-txt)}.button--variant-secondary:not(:disabled):hover{box-shadow:var(--shadow)}.button--confirming.button--variant-secondary{background-color:var(--_btn-confirm-color);color:var(--clr-bg)}.button--variant-secondary-border{background-color:transparent;border-color:var(--clr-line);color:var(--clr-txt)}.button--variant-secondary-border:not(:disabled):hover{box-shadow:var(--shadow)}.button--confirming.button--variant-secondary-border{border-color:var(--_btn-confirm-color);color:var(--_btn-confirm-color)}.button--variant-accent{background-color:var(--clr-accent);color:var(--clr-bg)}.button--variant-accent:not(:disabled):hover{background-color:var(--clr-dark-accent);box-shadow:var(--shadow)}.button--confirming.button--variant-accent{background-color:var(--_btn-confirm-color)}.button--variant-accent-border{background-color:transparent;border-color:var(--clr-accent);color:var(--clr-accent)}.button--variant-accent-border:not(:disabled):hover{border-color:var(--clr-dark-accent);box-shadow:var(--shadow);color:var(--clr-dark-accent)}.button--confirming.button--variant-accent-border{border-color:var(--_btn-confirm-color);color:var(--_btn-confirm-color)}.button--variant-neutral{background-color:var(--clr-bg);color:var(--clr-txt)}.button--variant-neutral:not(:disabled):hover{background-color:var(--clr-light-gray);box-shadow:var(--shadow)}.button--confirming.button--variant-neutral{background-color:var(--_btn-confirm-color);color:var(--clr-bg)}.button--variant-light{background-color:var(--clr-light-blue);color:var(--clr-txt)}.button--variant-light:not(:disabled):hover{background-color:var(--clr-light-gray);box-shadow:var(--shadow)}.button--confirming.button--variant-light{background-color:var(--_btn-confirm-color);color:var(--clr-bg)}.button--variant-inverted{background-color:var(--clr-fg);color:var(--clr-bg)}.button--variant-inverted:not(:disabled):hover{background-color:var(--clr-primary);box-shadow:var(--shadow)}.button--confirming.button--variant-inverted{background-color:var(--_btn-confirm-color);color:var(--clr-bg)}.button--variant-ghost{background-color:transparent}.button--variant-ghost:not(:disabled):hover{background-color:rgb(var(--rgb-white)/30%);box-shadow:var(--shadow)}.button--confirming.button--variant-ghost{background-color:var(--_btn-confirm-color);color:var(--clr-bg)}.button--size-small:not(.button--variant-link){--_btn-min-height:1.7142857143rem;padding-block:calc(var(--spacing-sm)/2)}.button--size-large:not(.button--variant-link){--_btn-min-height:3.4285714286rem}.button--shape-pill{border-radius:9999px}.button--shape-circle{aspect-ratio:1;border-radius:50%;min-width:var(--_btn-min-height);padding:var(--spacing-sm)}.button--orientation-vertical{flex-direction:column}
