/* Oytel component: button */

.oytel-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 24px;
  border: 0;
  border-radius: 999px;
  background: var(--oytel-surface);
  color: var(--oytel-text);
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background 150ms ease;
}

.oytel-button--primary {
  background: var(--oytel-primary);
  color: #fff;
}

.oytel-button--primary:hover {
  background: var(--oytel-primary-hover);
}

.oytel-button:disabled {
  background: var(--oytel-canvas);
  color: var(--oytel-muted);
  cursor: not-allowed;
}