@layer components{:root{--btn-radius:var(--radius-sm);--btn-font-weight:500;--btn-font-size:inherit;--btn-px:.75rem;--btn-py:.5rem;--btn-underline-offset:auto}:where(.btn){cursor:pointer;outline-offset:2px;text-align:left;color:var(--btn-text);align-items:center;gap:var(--gap-default);font-size:var(--btn-font-size);background-color:var(--btn-bg);border-radius:var(--btn-radius);border:1px solid var(--btn-border);font-weight:var(--btn-font-weight);padding:var(--btn-py) var(--btn-px);transition:var(--transition-default);text-underline-offset:var(--btn-underline-offset);outline:2px solid #0000;display:inline-flex}:where(.btn)>svg{flex-shrink:0}@media (hover:hover){:where(.btn):hover:not(:disabled){background-color:var(--btn-hover-bg);border-color:var(--btn-hover-border)}}:where(.btn):disabled{opacity:var(--disabled-opacity);cursor:not-allowed}:where(.btn):focus-visible{outline:2px solid var(--focus-ring);outline-offset:var(--focus-ring-offset)}:where(.btn--primary){--btn-text:var(--color-white);--btn-bg:var(--color-brand);--btn-border:var(--color-brand);--btn-hover-bg:var(--color-brand-hover);--btn-hover-border:var(--color-brand-hover)}:where(.btn--outline){--btn-text:var(--color-body);--btn-bg:var(--color-white);--btn-border:var(--color-gray-200);--btn-hover-bg:var(--color-gray-100);--btn-hover-border:var(--color-gray-200)}:where(.btn--ghost){--btn-text:var(--color-brand);--btn-bg:transparent;--btn-border:transparent;--btn-hover-bg:var(--color-gray-100);--btn-hover-border:var(--color-gray-100)}:where(.btn--destructive){--btn-text:var(--color-white);--btn-bg:var(--color-error-500);--btn-border:var(--color-error-500);--btn-hover-bg:var(--color-error-400);--btn-hover-border:var(--color-error-400)}:where(.btn--secondary){--btn-text:var(--color-body);--btn-bg:var(--color-gray-100);--btn-border:var(--color-gray-100);--btn-hover-bg:var(--color-gray-200);--btn-hover-border:var(--color-gray-200)}:where(.btn--link){--btn-text:var(--color-brand);--btn-bg:transparent;--btn-border:transparent;--btn-hover-bg:transparent;--btn-hover-border:transparent;--btn-underline-offset:4px}:where(.btn--sm){--btn-font-size:var(--text-xs);--btn-px:.5rem;--btn-py:.25rem}:where(.btn--lg){--btn-font-size:var(--text-lg);--btn-px:1rem;--btn-py:.75rem}:where(.btn--icon){padding:var(--btn-py)}}
