:root{--button-background:var(--brand-lighter);--button-background-hover:var(--brand-light);--button-background-secondary-hover:var(--brand-lightest);--button-border:var(--brand-darker);--button-border-hover:var(--brand-darkest);--button-text:var(--color-foreground);--button-text-secondary:var(--brand-dark);--button-text-secondary-hover:var(--color-foreground);--button-border-secondary:var(--brand-lighter);--button-border-secondary-hover:var(--brand-primary)}.dark{--button-background:var(--brand-dark);--button-background-hover:var(--brand-dark);--button-border:var(--brand-primary);--button-border-hover:var(--brand-lighter);--button-background-secondary-hover:var(--brand-dark);--button-border-secondary:var(--brand-light);--button-border-secondary-hover:var(--brand-primary);--button-text-secondary:var(--brand-lightest)}.button{border:1px solid var(--button-border);border-radius:var(--radius-lg);color:var(--button-text);cursor:pointer;padding:var(--spacing-1)var(--spacing-4);transition:all .2s ease-in-out}.button.active{color:var(--brand-foreground)}.button--primary{background-color:var(--button-background)}.button--primary:hover,.button--primary:focus,.button--primary:active{background-color:var(--button-background-hover);border-color:var(--button-border-hover)}.button--outline{border-color:var(--button-border-secondary);background-color:#0000}.button--ghost{color:var(--muted-foreground);background-color:#0000;border-color:#0000}.button--outline:hover,.button--outline:focus,.button--outline:active{background-color:var(--button-background-secondary-hover);border-color:var(--button-border-secondary-hover);color:var(--button-text-secondary)}.button--ghost:hover,.button--ghost:focus,.button--ghost:active{background-color:var(--button-background-secondary-hover);color:var(--button-text-secondary-hover)}