.component-button>button{border:1px solid var(--primary);background-color:var(--primary);padding:8px 16px;min-height:36px;color:var(--primary-foreground);font-size:14px;font-weight:500;line-height:20px;white-space:nowrap;border-radius:var(--radius-sm);display:inline-flex;gap:8px;justify-content:center;align-items:center;opacity:1;transition:background-color .15s,border-color .15s,color .15s,opacity .15s,transform .05s;cursor:pointer}.component-button>button.secondary{color:var(--foreground);border:1px solid var(--input);background-color:rgba(0,0,0,0)}.component-button>button.secondary:hover{color:var(--foreground);background-color:var(--muted);border-color:var(--input)}.component-button>button.ghost{background-color:var(--muted);border:1px solid rgba(0,0,0,0);color:var(--foreground)}.component-button>button.ghost:hover{background-color:var(--gray-200);border-color:rgba(0,0,0,0)}.component-button>button.full{width:100%}.component-button>button.hidden{opacity:0;visibility:hidden}.component-button>button.no-display{display:none}.component-button>button.disabled,.component-button>button.disabled:hover{cursor:not-allowed;background-color:var(--primary);border-color:var(--primary);color:var(--primary-foreground);opacity:.5;transform:none}.component-button>button.loading{background-color:var(--primary-active);border-color:var(--primary-active);cursor:wait}.component-button>button:hover{background-color:var(--primary-hover);border-color:var(--primary-hover)}.component-button>button:active:not(.disabled){transform:translateY(1px)}.component-button>button:focus-visible{outline:none;border-color:var(--ring);box-shadow:0 0 0 3px rgba(93,163,249,.35)}.component-button>button .component-loading-spinner{width:20px;height:20px}