/* components.css — shared UI primitives */

.btn {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.75rem 1.5rem; border-radius: var(--radius);
  font-size: 0.875rem; font-weight: 500; cursor: pointer;
  white-space: nowrap; border: none;
  transition: background .2s, color .2s, border-color .2s;
}
.btn--solid   { background: var(--fg); color: var(--bg); border: 1px solid var(--fg); }
.btn--solid:hover { background: rgba(242,242,242,.85); }
.btn--outline { background: transparent; color: var(--fg); border: 1px solid var(--border); }
.btn--outline:hover { background: var(--accent); }
.btn--sm { padding: 0.5rem 1rem; font-size: .8rem; }
.btn--full { width: 100%; justify-content: center; }