/* =========================================================================
   button.css — przyciski (primary, secondary, ghost, pill).
   ========================================================================= */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: var(--radius-pill);
  font-weight: 600;
  font-size: var(--fs-sm);
  min-height: 40px;
  transition: all var(--duration-micro) var(--ease-standard);
  border: 1px solid transparent;
  white-space: nowrap;
}
.btn--primary {
  background: var(--accent-primary);
  color: var(--text-primary);
  box-shadow: var(--shadow-pop);
}
.btn--primary:hover { background: var(--accent-hover); }

.btn--secondary {
  background: rgba(255,255,255,0.04);
  border-color: var(--bg-border);
  color: var(--text-primary);
}
.btn--secondary:hover { border-color: var(--accent-primary); background: rgba(168,85,247,0.08); }

.btn--ghost {
  color: var(--text-tertiary);
}
.btn--ghost:hover { color: var(--text-primary); }

.btn--full { width: 100%; }
/* btn--full pozwala na zawijanie, gdy tekst jest dluzszy niz container
   (np. CTA w sidebar panel). Inne btn (poza --full) nadal nowrap. */
.btn--full {
  white-space: normal;
  word-break: break-word;
  line-height: var(--lh-tight, 1.3);
  text-align: center;
}
.btn--lg { padding: 14px 22px; font-size: var(--fs-base); min-height: 52px; }
.btn[disabled] { opacity: 0.4; cursor: not-allowed; }

/* Chip — maly label klikalny */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--radius-pill);
  font-size: var(--fs-xs);
  color: var(--text-tertiary);
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
}
.chip--purple { color: var(--accent-soft); background: rgba(168,85,247,0.1); border-color: rgba(168,85,247,0.28); }
.chip--cyan   { color: var(--accent-cyan);  background: rgba(56,189,248,0.1); border-color: rgba(56,189,248,0.28); }
.chip--green  { color: var(--accent-green); background: rgba(52,211,153,0.1); border-color: rgba(52,211,153,0.28); }