.ui-bm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.55rem;
  border: 1px solid rgba(var(--black-color-rgb), 0.08);
  background: var(--white-color);
  color: var(--color-gray-500);
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 1px 2px rgba(var(--black-color-rgb), 0.03);
}

.ui-bm-btn--sm {
  width: 30px;
  height: 30px;
  border-radius: 0.5rem;
}

.ui-bm-btn--md {
  width: 34px;
  height: 34px;
}

.ui-bm-btn--lg {
  width: 38px;
  height: 38px;
  border-radius: 0.625rem;
}

.ui-bm-btn:hover {
  border-color: rgba(var(--primary-color-rgb), 0.4);
  color: var(--color-brand-green-ink-1b);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px -6px rgba(var(--primary-color-rgb), 0.3);
}

.ui-bm-btn--saved {
  background: linear-gradient(
    135deg,
    var(--primary-color),
    var(--primary-color-hover)
  );
  border-color: transparent;
  color: var(--black-color);
  box-shadow:
    0 4px 10px -4px rgba(var(--primary-color-rgb), 0.5),
    0 1px 0 rgba(var(--white-color-rgb), 0.35) inset;
}

.ui-bm-btn--saved:hover {
  color: var(--black-color);
  background: linear-gradient(
    135deg,
    var(--color-brand-green-56e066),
    var(--color-brand-green-45ce55)
  );
  transform: translateY(-1px);
  box-shadow: 0 8px 16px -5px rgba(var(--primary-color-rgb), 0.55);
}

.ui-bm-btn--saved svg {
  fill: currentColor;
}

.ui-bm-btn--remove:hover {
  background: linear-gradient(
    135deg,
    var(--danger-color-lighter),
    var(--danger-color-light)
  );
  color: var(--white-color);
  border-color: transparent;
  box-shadow: 0 8px 16px -5px rgba(var(--danger-color-light-rgb), 0.5);
}

.ui-card-removing,
.ui-card-removing.sj-card,
.ui-card-removing.sc-saved-row,
.ui-card-removing.sc-saved-card {
  pointer-events: none;
}

.ui-card-removing::before,
.ui-card-removing::after {
  opacity: 0 !important;
}