#serviceList {
  gap: .5rem;
}

.service-item {
  padding: .5rem .6rem;
}

.service-item.is-dragging {
  opacity: 1;
  border-color: rgba(47, 61, 52, .45);
  box-shadow: 0 6px 18px rgba(47, 61, 52, .16);
  background: #fffaf1;
}

.service-handle {
  border: 0;
  background: transparent;
  color: var(--bm-sage, #7D877E);
  cursor: grab;
  padding: 0 .45rem 0 .1rem;
  line-height: 1;
}

.service-handle:active {
  cursor: grabbing;
}

.service-link {
  min-width: 0;
  color: inherit;
  border-radius: .35rem;
  padding: .15rem .25rem;
}

.service-link:hover {
  color: inherit;
}

.service-thumb {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  object-fit: cover;
  border-radius: .55rem;
  border: 1px solid #e5e7eb;
}

.service-thumb--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  border-style: dashed;
  border-color: #d1d5db;
  background: #f8fafc;
  color: #94a3b8;
}

.service-badges {
  flex: 0 0 auto;
}

.min-w-0 {
  min-width: 0;
}

@media (max-width: 575.98px) {
  .service-link {
    align-items: flex-start !important;
    flex-direction: column;
    gap: .55rem;
  }

  .service-badges {
    flex-wrap: wrap;
  }
}